@dropi/ui 0.1.21 → 0.1.23

package/dist/collection/components/dropi-phone-input/dropi-phone-input.css

@@ -1,209 +0,0 @@
-:host { display: block; width: 100%; position: relative; font-family: 'Inter', sans-serif; }
-*, *::before, *::after { box-sizing: border-box; }
-
-/* Ocultar spin buttons en inputs numéricos */
-input::-webkit-inner-spin-button,
-input::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  appearance: none;
-  margin: 0;
-}
-input[type='number'] {
-  -moz-appearance: textfield;
-  appearance: textfield;
-}
-
-.phone-wrap {
-  width: 100%;
-}
-
-.phone-label {
-  display: block;
-  font-size: var(--font-size-xs, 10px);
-  color: var(--Gray-Gray-600, #475066);
-  margin-bottom: 4px;
-}
-
-.phone-input-container {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.custom-select {
-  position: relative;
-  width: 50%;
-}
-
-.form-control {
-  flex: 1;
-  width: 100%;
-  border: 1px solid var(--Gray-Gray-200, #c3c9d9);
-  border-radius: 5px;
-  font-size: 14px;
-  font-family: inherit;
-  transition: border-color 0.3s ease-in-out;
-  height: 40px;
-  padding: 0 12px;
-  outline: none;
-  color: var(--Gray-Gray-700, #32394d);
-  background-color: var(--Neutral-White, #ffffff);
-}
-
-.form-control::placeholder {
-  color: var(--Gray-Gray-500, #69738c);
-}
-
-.form-control:focus::placeholder {
-  color: var(--Gray-Gray-500, #69738c);
-}
-
-.form-control:focus {
-  border-color: var(--Info-Info-500, #50a5f1);
-  outline: none;
-}
-
-.form-control:disabled {
-  border: 1px solid var(--Gray-Gray-200, #c3c9d9) !important;
-  color: var(--Gray-Gray-400, #858ea6);
-  background-color: var(--Gray-Gray-50, #f7f8fa);
-  outline: none;
-}
-
-.form-control.is-invalid {
-  background: #fffbfb;
-  border-color: var(--Error-Error-500, #f46a6b) !important;
-}
-
-.select-button {
-  width: 100%;
-  height: 40px;
-  padding: 0.47rem 0.75rem;
-  padding-right: 7px;
-  border: 1px solid var(--Gray-Gray-200, #c3c9d9);
-  border-radius: var(--Border-2, 8px);
-  background: var(--Neutral-White, #ffffff);
-  color: var(--Gray-Gray-500, #69738c);
-  font-size: var(--font-size-s, 12px);
-  font-family: inherit;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  text-align: left;
-  cursor: pointer;
-}
-
-.select-button img {
-  width: 20px;
-  height: 20px;
-}
-
-.select-button:focus {
-  border-color: var(--Info-Info-500, #50a5f1) !important;
-  outline: none;
-}
-
-.select-button:disabled {
-  border-color: var(--Gray-Gray-200, #c3c9d9);
-  color: var(--Gray-Gray-400, #858ea6);
-  background-color: var(--Gray-Gray-50, #f7f8fa);
-  cursor: unset;
-}
-
-.select-button.select-completed {
-  border-color: var(--Gray-Gray-400, #858ea6);
-  color: var(--Gray-Gray-600, #475066);
-  background: var(--Neutral-White, #ffffff);
-}
-
-.select-button.select-invalid {
-  border-color: var(--Error-Error-500, #f46a6b) !important;
-}
-
-.select-dropdown {
-  position: absolute;
-  width: 100%;
-  overflow: hidden;
-  list-style: none;
-  padding: 0;
-  margin: 4px 0 0 0;
-  border: 1px solid transparent;
-  border-radius: var(--Border-2, 8px);
-  overflow-y: scroll;
-  z-index: 100;
-}
-
-/* Scrollbar */
-.select-dropdown::-webkit-scrollbar {
-  width: 6px;
-}
-.select-dropdown::-webkit-scrollbar-thumb {
-  background-color: var(--Gray-Gray-300, #d1d6e1);
-  border-radius: 4px;
-}
-
-.expanded-select {
-  max-height: 250px;
-  background: var(--Neutral-White, #ffffff);
-  box-shadow: var(--Shadow-medium, 0 4px 16px rgba(0, 0, 0, 0.08));
-  border: 1px solid var(--Gray-Gray-200, #c3c9d9);
-  transition: max-height 0.2s ease-in;
-}
-
-.collapsed-select {
-  max-height: 0;
-  background: transparent;
-  box-shadow: none;
-  border: 1px solid transparent;
-  transition: max-height 0.2s ease-out, background 0.6s ease-out, box-shadow 0.6s ease-out;
-}
-
-.select-dropdown li {
-  margin: 0;
-  padding: 0;
-}
-
-.option {
-  width: 100%;
-  height: 45px;
-  border-radius: var(--Border-2, 8px);
-  padding-top: var(--Size-3, 12px);
-  padding-right: var(--Size-4, 16px);
-  padding-bottom: var(--Size-3, 12px);
-  padding-left: var(--Size-4, 16px);
-  border: none;
-  background: transparent;
-  text-align: left;
-  color: var(--Gray-Gray-600, #475066);
-  font-size: var(--font-size-s, 12px);
-  font-family: inherit;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.option img {
-  width: 20px;
-  height: 20px;
-}
-
-.option:hover {
-  background: var(--Gray-Gray-50, #f7f8fa);
-}
-
-.option:disabled {
-  color: var(--Gray-Gray-400, #858ea6);
-  background-color: var(--Gray-Gray-50, #f7f8fa);
-  cursor: unset;
-}
-
-.invalid-color {
-  color: var(--Error-Error-500, #f46a6b) !important;
-}
-
-.phone-error {
-  margin: 4px 0 0;
-  font-size: var(--font-size-xs, 10px);
-  color: var(--Error-Error-500, #f46a6b);
-}

package/dist/collection/components/dropi-phone-input/dropi-phone-input.js

@@ -1,442 +0,0 @@
-import { h } from "@stencil/core";
-const COUNTRIES = [
-    { code: '57', name: 'Colombia', flag: 'CO', maxLength: 10 },
-    { code: '52', name: 'Mexico', flag: 'MX', maxLength: 10 },
-    { code: '507', name: 'Panama', flag: 'PA', maxLength: 8 },
-    { code: '56', name: 'Chile', flag: 'CL', maxLength: 9 },
-    { code: '593', name: 'Ecuador', flag: 'EC', maxLength: 10 },
-    { code: '51', name: 'Peru', flag: 'PE', maxLength: 9 },
-    { code: '34', name: 'España', flag: 'ES', maxLength: 9 },
-    { code: '595', name: 'Paraguay', flag: 'PY', maxLength: 9 },
-    { code: '58', name: 'Venezuela', flag: 'VE', maxLength: 11 },
-    { code: '54', name: 'Argentina', flag: 'AR', maxLength: 10 },
-    { code: '55', name: 'Brasil', flag: 'BR', maxLength: 11 },
-    { code: '1', name: 'United States', flag: 'US', maxLength: 10 },
-    { code: '502', name: 'Guatemala', flag: 'GT', maxLength: 8 },
-    { code: '598', name: 'Uruguay', flag: 'UY', maxLength: 9 },
-    { code: '501', name: 'Belize', flag: 'BZ', maxLength: 7 },
-    { code: '81', name: 'Japan', flag: 'JP', maxLength: 10 },
-    { code: '1', name: 'Canada', flag: 'CA', maxLength: 9 },
-    { code: '1473', name: 'Grenada', flag: 'GD', maxLength: 10 },
-    { code: '509', name: 'Haiti', flag: 'HT', maxLength: 10 },
-    { code: '1809', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },
-    { code: '1829', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },
-    { code: '1849', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },
-    { code: '1869', name: 'Saint Kitts And Nevis', flag: 'KN', maxLength: 10 },
-    { code: '1784', name: 'Saint Vincent And The Grenadines', flag: 'VC', maxLength: 10 },
-    { code: '1758', name: 'Saint Lucia', flag: 'LC', maxLength: 10 },
-    { code: '597', name: 'Suriname', flag: 'SR', maxLength: 10 },
-    { code: '1868', name: 'Trinidad and Tobago', flag: 'TT', maxLength: 10 },
-    { code: '505', name: 'Nicaragua', flag: 'NI', maxLength: 8 },
-    { code: '506', name: 'Costa Rica', flag: 'CR', maxLength: 8 },
-    { code: '591', name: 'Bolivia', flag: 'BO', maxLength: 8 },
-    { code: '7', name: 'Russia', flag: 'RU', maxLength: 11 },
-    { code: '20', name: 'Egypt', flag: 'EG', maxLength: 9 },
-    { code: '27', name: 'South Africa', flag: 'ZA', maxLength: 10 },
-    { code: '30', name: 'Greece', flag: 'GR', maxLength: 10 },
-    { code: '31', name: 'Netherlands', flag: 'NL', maxLength: 9 },
-    { code: '32', name: 'Belgium', flag: 'BE', maxLength: 8 },
-    { code: '33', name: 'France', flag: 'FR', maxLength: 9 },
-    { code: '36', name: 'Hungary', flag: 'HU', maxLength: 9 },
-    { code: '40', name: 'Romania', flag: 'RO', maxLength: 9 },
-    { code: '39', name: 'Italy', flag: 'IT', maxLength: 10 },
-    { code: '41', name: 'Switzerland', flag: 'CH', maxLength: 9 },
-    { code: '44', name: 'United Kingdom', flag: 'GB', maxLength: 11 },
-    { code: '45', name: 'Denmark', flag: 'DK', maxLength: 8 },
-    { code: '46', name: 'Sweden', flag: 'SE', maxLength: 8 },
-    { code: '47', name: 'Norway', flag: 'NO', maxLength: 8 },
-    { code: '48', name: 'Poland', flag: 'PL', maxLength: 9 },
-    { code: '49', name: 'Germany', flag: 'DE', maxLength: 11 },
-    { code: '53', name: 'Malta', flag: 'MT', maxLength: 8 },
-    { code: '60', name: 'Malaysia', flag: 'MY', maxLength: 9 },
-    { code: '61', name: 'Australia', flag: 'AU', maxLength: 9 },
-    { code: '62', name: 'Indonesia', flag: 'ID', maxLength: 12 },
-    { code: '63', name: 'Philippines', flag: 'PH', maxLength: 10 },
-    { code: '64', name: 'New Zealand', flag: 'NZ', maxLength: 12 },
-    { code: '65', name: 'Singapore', flag: 'SG', maxLength: 8 },
-    { code: '66', name: 'Thailand', flag: 'TH', maxLength: 9 },
-    { code: '82', name: 'South Korea', flag: 'KR', maxLength: 9 },
-    { code: '84', name: 'Vietnam', flag: 'VN', maxLength: 11 },
-    { code: '86', name: 'China', flag: 'CN', maxLength: 11 },
-    { code: '90', name: 'Turkey', flag: 'TR', maxLength: 10 },
-    { code: '91', name: 'India', flag: 'IN', maxLength: 10 },
-    { code: '92', name: 'Pakistan', flag: 'PK', maxLength: 9 },
-    { code: '93', name: 'Afghanistan', flag: 'AF', maxLength: 10 },
-    { code: '94', name: 'Sri Lanka', flag: 'LK', maxLength: 9 },
-    { code: '95', name: 'Myanmar', flag: 'MM', maxLength: 9 },
-    { code: '98', name: 'Iran', flag: 'IR', maxLength: 10 },
-    { code: '211', name: 'South Sudan', flag: 'SS', maxLength: 10 },
-    { code: '212', name: 'Morocco', flag: 'MA', maxLength: 9 },
-    { code: '213', name: 'Algeria', flag: 'DZ', maxLength: 9 },
-    { code: '216', name: 'Tunisia', flag: 'TN', maxLength: 8 },
-    { code: '218', name: 'Libya', flag: 'LY', maxLength: 9 },
-    { code: '220', name: 'Gambia', flag: 'GM', maxLength: 8 },
-    { code: '221', name: 'Senegal', flag: 'SN', maxLength: 9 },
-    { code: '222', name: 'Mauritania', flag: 'MR', maxLength: 9 },
-    { code: '223', name: 'Mali', flag: 'ML', maxLength: 8 },
-    { code: '224', name: 'Guinea', flag: 'GN', maxLength: 9 },
-    { code: '225', name: 'Ivory Coast', flag: 'CI', maxLength: 10 },
-    { code: '226', name: 'Burkina Faso', flag: 'BF', maxLength: 10 },
-    { code: '227', name: 'Niger', flag: 'NE', maxLength: 8 },
-    { code: '228', name: 'Togo', flag: 'TG', maxLength: 8 },
-    { code: '229', name: 'Benin', flag: 'BJ', maxLength: 8 },
-    { code: '230', name: 'Mauritius', flag: 'MU', maxLength: 10 },
-    { code: '231', name: 'Liberia', flag: 'LR', maxLength: 8 },
-    { code: '232', name: 'Sierra Leone', flag: 'SL', maxLength: 11 },
-    { code: '233', name: 'Ghana', flag: 'GH', maxLength: 9 },
-    { code: '234', name: 'Nigeria', flag: 'NG', maxLength: 11 },
-    { code: '235', name: 'Chad', flag: 'TD', maxLength: 8 },
-    { code: '236', name: 'Central African Republic', flag: 'CF', maxLength: 21 },
-    { code: '237', name: 'Cameroon', flag: 'CM', maxLength: 10 },
-    { code: '238', name: 'Cape Verde', flag: 'CV', maxLength: 9 },
-    { code: '239', name: 'São Tomé and Príncipe', flag: 'ST', maxLength: 14 },
-    { code: '240', name: 'Equatorial Guinea', flag: 'GQ', maxLength: 17 },
-    { code: '241', name: 'Gabon', flag: 'GA', maxLength: 9 },
-];
-/**
- * @component dropi-phone-input
- * Phone number input with country code selector.
- * Syncs perfectly with dropi-core_front natively
- */
-export class DropiPhoneInput {
-    el;
-    /** Initial country dial code (e.g. "57") — matches Angular 'CodArea' setter */
-    codArea = '57';
-    /** Phone number value — matches Angular 'ngModelPhone' */
-    ngModelPhone = '';
-    /** Input placeholder — matches Angular 'phoneNumberPlaceholder' */
-    phoneNumberPlaceholder = null;
-    /** Disabled state — matches Angular 'disabledInput' */
-    disabledInput = false;
-    /** Validation state — matches Angular 'isValidPhone' */
-    isValidPhone = undefined;
-    /** Validate on init — matches Angular 'validateOnInit' */
-    validateOnInit = true;
-    /**
-     * Pre-selected country object (matches Angular `selectedOption: Country`).
-     * Pass `{ dialCode, flag, name, iso2 }`. When set, overrides `codArea`.
-     */
-    selectedOption = null;
-    /**
-     * Country select configuration object (matches Angular `selectProperties: SelectProperties`).
-     * Fields: `label`, `placeholder`, `options` (array of Country objects).
-     * When provided, overrides the internal country list.
-     */
-    selectProperties = null;
-    open = false;
-    /** Emitted when country dial code changes — matches Angular 'ngModelChangeCod' */
-    ngModelChangeCod;
-    /** Emitted when phone number changes — matches Angular 'ngModelChangePhone' */
-    ngModelChangePhone;
-    /** Emitted on field verification — matches Angular 'verifiedField' */
-    verifiedField;
-    /** Emitted when country selection changes — matches Angular 'onChangeSelect' */
-    onChangeSelect;
-    codAreaChanged() {
-        this.ngModelPhone = '';
-    }
-    selectedOptionChanged(val) {
-        if (!val)
-            return;
-        // Support Angular Country shape: { dialCode, iso2 } or { code }
-        const code = val.dialCode ?? val.code ?? this.codArea;
-        this.codArea = String(code).replace('+', '');
-    }
-    componentWillLoad() {
-        if (this.selectedOption)
-            this.selectedOptionChanged(this.selectedOption);
-    }
-    get selectedCountry() {
-        const cleanCodArea = this.codArea.replace('+', '');
-        return COUNTRIES.find(c => c.code === cleanCodArea) ?? COUNTRIES[0];
-    }
-    selectCountry(c) {
-        this.codArea = c.code;
-        this.open = false;
-        this.ngModelChangeCod.emit(c.code);
-        this.onChangeSelect.emit(c);
-    }
-    handleInput(e) {
-        const raw = e.target.value.replace(/\D/g, '');
-        this.ngModelPhone = raw.slice(0, this.selectedCountry.maxLength);
-        e.target.value = this.ngModelPhone;
-        this.ngModelChangePhone.emit(this.ngModelPhone);
-    }
-    handleWindowClick(ev) {
-        const path = ev.composedPath();
-        if (!path.includes(this.el)) {
-            this.open = false;
-        }
-    }
-    render() {
-        const country = this.selectedCountry;
-        const isInvalid = this.isValidPhone === false;
-        return (h("div", { key: '884ddc86a364c666e79c2e99501c607a5c332599', class: "phone-wrap" }, h("div", { key: 'e0b044ac41b640cddffe080c695b7fe2d4add574', class: "phone-input-container" }, h("div", { key: 'f9f8b6794fb73efff50e064550ce462e25bb4d51', class: "custom-select" }, h("button", { key: '564675d4b89d33cc7cba743f77b4d96f7f6afea3', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
-                if (!this.disabledInput)
-                    this.open = !this.open;
-            } }, h("span", { key: '884a8a6d688e9fae8bc62ace8ba1f870f3ebdedf', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, h("img", { key: '4c263356870f8d2aaaa84ffe5f1a1bff49f98e34', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), h("dropi-icon", { key: '589ff50ef5881a58586e9b08d9db3e0abcde5873', name: this.open ? 'Dropdown-up' : 'Dropdown-down', width: "14px", height: "14px", color: "Gray-Gray-500" })), h("ul", { key: 'fed2ed2efc5be49ebeb8fe8c36557914eff439c7', class: { 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open } }, COUNTRIES.map(option => (h("li", null, h("button", { type: "button", class: "option", onMouseDown: (e) => { e.preventDefault(); this.selectCountry(option); } }, h("img", { src: `https://flagsapi.com/${option.flag}/flat/24.png`, alt: option.flag }), option.code)))))), h("input", { key: 'dcefc1987643eab23dc5d9fbf211804fa90a9d82', id: "phone-input", type: "tel", inputmode: "numeric", class: { 'form-control': true, 'is-invalid': isInvalid }, placeholder: this.phoneNumberPlaceholder, value: this.ngModelPhone, disabled: this.disabledInput, maxLength: country.maxLength, onInput: (e) => this.handleInput(e) }))));
-    }
-    static get is() { return "dropi-phone-input"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["dropi-phone-input.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["dropi-phone-input.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "codArea": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Initial country dial code (e.g. \"57\") \u2014 matches Angular 'CodArea' setter"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "cod-area",
-                "defaultValue": "'57'"
-            },
-            "ngModelPhone": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Phone number value \u2014 matches Angular 'ngModelPhone'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "ng-model-phone",
-                "defaultValue": "''"
-            },
-            "phoneNumberPlaceholder": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Input placeholder \u2014 matches Angular 'phoneNumberPlaceholder'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "phone-number-placeholder",
-                "defaultValue": "null"
-            },
-            "disabledInput": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Disabled state \u2014 matches Angular 'disabledInput'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "disabled-input",
-                "defaultValue": "false"
-            },
-            "isValidPhone": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Validation state \u2014 matches Angular 'isValidPhone'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "is-valid-phone",
-                "defaultValue": "undefined"
-            },
-            "validateOnInit": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Validate on init \u2014 matches Angular 'validateOnInit'"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "validate-on-init",
-                "defaultValue": "true"
-            },
-            "selectedOption": {
-                "type": "any",
-                "mutable": true,
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Pre-selected country object (matches Angular `selectedOption: Country`).\nPass `{ dialCode, flag, name, iso2 }`. When set, overrides `codArea`."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected-option",
-                "defaultValue": "null"
-            },
-            "selectProperties": {
-                "type": "any",
-                "mutable": false,
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Country select configuration object (matches Angular `selectProperties: SelectProperties`).\nFields: `label`, `placeholder`, `options` (array of Country objects).\nWhen provided, overrides the internal country list."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "select-properties",
-                "defaultValue": "null"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "open": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "ngModelChangeCod",
-                "name": "ngModelChangeCod",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted when country dial code changes \u2014 matches Angular 'ngModelChangeCod'"
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }, {
-                "method": "ngModelChangePhone",
-                "name": "ngModelChangePhone",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted when phone number changes \u2014 matches Angular 'ngModelChangePhone'"
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }, {
-                "method": "verifiedField",
-                "name": "verifiedField",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted on field verification \u2014 matches Angular 'verifiedField'"
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "onChangeSelect",
-                "name": "onChangeSelect",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted when country selection changes \u2014 matches Angular 'onChangeSelect'"
-                },
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                }
-            }];
-    }
-    static get elementRef() { return "el"; }
-    static get watchers() {
-        return [{
-                "propName": "codArea",
-                "methodName": "codAreaChanged"
-            }, {
-                "propName": "selectedOption",
-                "methodName": "selectedOptionChanged"
-            }];
-    }
-    static get listeners() {
-        return [{
-                "name": "click",
-                "method": "handleWindowClick",
-                "target": "window",
-                "capture": false,
-                "passive": false
-            }];
-    }
-}