ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(lion-input-tel): polish/cleanup input-tel(-dropdown)

Browse source
This commit is contained in:
Thijs Louisse 2022-11-18 13:10:42 +01:00 committed by Thijs Louisse
parent 9d912f6618
commit fe02eaf84b
2 changed files with 14 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
packages/ui/components/input-tel-dropdown/src/LionInputTelDropdown.js
View file

@ -177,9 +177,7 @@ export class LionInputTelDropdown extends LionInputTel {
return { return {
template: templates.dropdown(this._templateDataDropdown), template: templates.dropdown(this._templateDataDropdown),
afterRender: () => { afterRender: this.__syncRegionWithDropdown,
this.__syncRegionWithDropdown();
},
}; };
}, },
}; };
@ -204,8 +202,6 @@ export class LionInputTelDropdown extends LionInputTel {
_onPhoneNumberUtilReady() { _onPhoneNumberUtilReady() {
super._onPhoneNumberUtilReady(); super._onPhoneNumberUtilReady();
this.__createRegionMeta(); this.__createRegionMeta();
// render dropdown (trigger render of prefix slot via SlotMixin)
this.requestUpdate();
} }
/** /**
@ -233,19 +229,27 @@ export class LionInputTelDropdown extends LionInputTel {
/** /**
* Contains everything needed for rendering region options: * Contains everything needed for rendering region options:
* region code, country code, display name according to locale, display name * region code, country code, display name according to locale, display name
* @private
* @type {RegionMeta[]} * @type {RegionMeta[]}
*/ */
this.__regionMetaList = []; this.__regionMetaList = [];
/** /**
* A filtered `this.__regionMetaList`, containing all regions provided in `preferredRegions` * A filtered `this.__regionMetaList`, containing all regions provided in `preferredRegions`
* @private
* @type {RegionMeta[]} * @type {RegionMeta[]}
*/ */
this.__regionMetaListPreferred = []; this.__regionMetaListPreferred = [];
/** @type {EventListener} */ /**
* @protected
* @type {EventListener}
*/
this._onDropdownValueChange = this._onDropdownValueChange.bind(this); this._onDropdownValueChange = this._onDropdownValueChange.bind(this);
/** @type {EventListener} */ /**
* @private
* @type {EventListener}
*/
this.__syncRegionWithDropdown = this.__syncRegionWithDropdown.bind(this); this.__syncRegionWithDropdown = this.__syncRegionWithDropdown.bind(this);
} }
@ -284,6 +288,9 @@ export class LionInputTelDropdown extends LionInputTel {
} }
} }
/**
* @protected
*/
_initModelValueBasedOnDropdown() { _initModelValueBasedOnDropdown() {
if (!this._initialModelValue && !this.dirty && this._phoneUtil) { if (!this._initialModelValue && !this.dirty && this._phoneUtil) {
const countryCode = this._phoneUtil.getCountryCodeForRegionCode(this.activeRegion); const countryCode = this._phoneUtil.getCountryCodeForRegionCode(this.activeRegion);

9
packages/ui/components/input-tel/src/LionInputTel.js
View file

@ -28,7 +28,6 @@ export class LionInputTel extends LocalizeMixin(LionInput) {
formatCountryCodeStyle: { type: String, attribute: 'format-country-code-style' }, formatCountryCodeStyle: { type: String, attribute: 'format-country-code-style' },
activeRegion: { type: String }, activeRegion: { type: String },
_phoneUtil: { type: Object, state: true }, _phoneUtil: { type: Object, state: true },
_needsLightDomRender: { type: Number, state: true },
}; };
static localizeNamespaces = [ static localizeNamespaces = [
@ -171,14 +170,6 @@ export class LionInputTel extends LocalizeMixin(LionInput) {
? /** @type {AwesomePhoneNumber} */ (PhoneUtilManager.PhoneUtil) ? /** @type {AwesomePhoneNumber} */ (PhoneUtilManager.PhoneUtil)
: null; : null;
/**
* Helper that triggers a light dom render aligned with update loop.
* TODO: combine with render fn of SlotMixin
* @protected
* @type {number}
*/
this._needsLightDomRender = 0;
if (!PhoneUtilManager.isLoaded) { if (!PhoneUtilManager.isLoaded) {
PhoneUtilManager.loadComplete.then(() => { PhoneUtilManager.loadComplete.then(() => {
this._onPhoneNumberUtilReady(); this._onPhoneNumberUtilReady();