npm - @dropi/ui - Versions diffs - 0.1.51 → 0.1.52 - Mend

@dropi/ui 0.1.51 → 0.1.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (289) hide show

package/dist/dropi-ui/dropi-phone-input.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, d as createEvent, a as getElement, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, a as getElement, h } from './index-CPacpXAJ.js';
 const dropiPhoneInputCss = () => `:host{display:block;width:100%;position:relative;font-family:'Inter', sans-serif}*,*::before,*::after{box-sizing:border-box}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:var(--dropi-z-index-overlay, 11000)}.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)}`;
@@ -114,7 +114,7 @@ const DropiPhoneInput = class {
     get el() { return getElement(this); }
     internals;
     /** Name for native form submission */
-    name = '';
+    name;
     /** Initial country dial code (e.g. "57") — matches Angular 'CodArea' setter */
     codArea = '57';
     /** Phone number value — matches Angular 'ngModelPhone' */
@@ -195,10 +195,10 @@ const DropiPhoneInput = class {
     render() {
         const country = this.selectedCountry;
         const isInvalid = this.isValidPhone === false;
-        return (h("div", { key: '1634a703f734cd5db7b5d7acf83f403ea07962a3', class: "phone-wrap" }, h("div", { key: 'a9ed4a17b4a01893fc22d051241dcd494fa2e66d', class: "phone-input-container" }, h("div", { key: '6a50121fbb8939eac54035a314c340137aae63d5', class: "custom-select" }, h("button", { key: '0157b468dab13e23f83b9528ec235bc61be91733', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
+        return (h("div", { key: '4a650e9005c832934ed977a70a270dafd6a9a635', class: "phone-wrap" }, h("div", { key: '631df432da08d6607a0e46f89d5a873a358f320b', class: "phone-input-container" }, h("div", { key: '093450cd35c658d9fe86bda88a5247ac01dda365', class: "custom-select" }, h("button", { key: '00804b184cac3f3aeb6d496d33def264c6a2d885', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
                 if (!this.disabledInput)
                     this.open = !this.open;
-            } }, h("span", { key: 'b174ec714c415964d09f4661f58a1a62e8c80653', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, h("img", { key: 'f4c62db877a54bd395b756926918b8ff16511a2a', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), h("dropi-icon", { key: '809f64bed4cccd911110c9e8e52752554b0d8a86', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), h("ul", { key: 'b4dea28807780b086ba15161cee3e417efb2f2a1', 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: '4e1113fedf25b9c91d2aff815d6c862a7d47d072', 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) }))));
+            } }, h("span", { key: 'be3ce1443f212ee3bff661d422eb4b8ac3927eb9', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, h("img", { key: '041bd152aa918f316fe2cc26c7e50bde2771e7b4', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), h("dropi-icon", { key: '58eb0636821d8ba4d5d2a0f223eff7e7d7894f43', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), h("ul", { key: 'bc6a693524878f8e04ef53279a74ac761913ae8c', 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: '7f0983c6a8e6562ea47cdad3c56fd0505312f9d8', 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 formAssociated() { return true; }
     static get watchers() { return {

package/dist/dropi-ui/dropi-phone-input.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropi-phone-input.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-phone-input/dropi-phone-input.css?tag=dropi-phone-input&encapsulation=shadow","src/components/dropi-phone-input/dropi-phone-input.tsx"],"sourcesContent":[":host { display: block; width: 100%; position: relative; font-family: 'Inter', sans-serif; }\n, ::before, ::after { box-sizing: border-box; }\n\n/ Ocultar spin buttons en inputs numéricos /\ninput::-webkit-inner-spin-button,\ninput::-webkit-outer-spin-button {\n -webkit-appearance: none;\n appearance: none;\n margin: 0;\n}\ninput[type='number'] {\n -moz-appearance: textfield;\n appearance: textfield;\n}\n\n.phone-wrap {\n width: 100%;\n}\n\n.phone-label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 4px;\n}\n\n.phone-input-container {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.custom-select {\n position: relative;\n width: 50%;\n}\n\n.form-control {\n flex: 1;\n width: 100%;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: 5px;\n font-size: 14px;\n font-family: inherit;\n transition: border-color 0.3s ease-in-out;\n height: 40px;\n padding: 0 12px;\n outline: none;\n color: var(--Gray-Gray-700, #32394d);\n background-color: var(--Neutral-White, #ffffff);\n}\n\n.form-control::placeholder {\n color: var(--Gray-Gray-500, #69738c);\n}\n\n.form-control:focus::placeholder {\n color: var(--Gray-Gray-500, #69738c);\n}\n\n.form-control:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n outline: none;\n}\n\n.form-control:disabled {\n border: 1px solid var(--Gray-Gray-200, #c3c9d9) !important;\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n outline: none;\n}\n\n.form-control.is-invalid {\n background: #fffbfb;\n border-color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.select-button {\n width: 100%;\n height: 40px;\n padding: 0.47rem 0.75rem;\n padding-right: 7px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-500, #69738c);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n cursor: pointer;\n}\n\n.select-button img {\n width: 20px;\n height: 20px;\n}\n\n.select-button:focus {\n border-color: var(--Info-Info-500, #50a5f1) !important;\n outline: none;\n}\n\n.select-button:disabled {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n cursor: unset;\n}\n\n.select-button.select-completed {\n border-color: var(--Gray-Gray-400, #858ea6);\n color: var(--Gray-Gray-600, #475066);\n background: var(--Neutral-White, #ffffff);\n}\n\n.select-button.select-invalid {\n border-color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.select-dropdown {\n position: absolute;\n width: 100%;\n overflow: hidden;\n list-style: none;\n padding: 0;\n margin: 4px 0 0 0;\n border: 1px solid transparent;\n border-radius: var(--Border-2, 8px);\n overflow-y: scroll;\n z-index: var(--dropi-z-index-overlay, 11000);\n}\n\n/ Scrollbar /\n.select-dropdown::-webkit-scrollbar {\n width: 6px;\n}\n.select-dropdown::-webkit-scrollbar-thumb {\n background-color: var(--Gray-Gray-300, #d1d6e1);\n border-radius: 4px;\n}\n\n.expanded-select {\n max-height: 250px;\n background: var(--Neutral-White, #ffffff);\n box-shadow: var(--Shadow-medium, 0 4px 16px rgba(0, 0, 0, 0.08));\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n transition: max-height 0.2s ease-in;\n}\n\n.collapsed-select {\n max-height: 0;\n background: transparent;\n box-shadow: none;\n border: 1px solid transparent;\n transition: max-height 0.2s ease-out, background 0.6s ease-out, box-shadow 0.6s ease-out;\n}\n\n.select-dropdown li {\n margin: 0;\n padding: 0;\n}\n\n.option {\n width: 100%;\n height: 45px;\n border-radius: var(--Border-2, 8px);\n padding-top: var(--Size-3, 12px);\n padding-right: var(--Size-4, 16px);\n padding-bottom: var(--Size-3, 12px);\n padding-left: var(--Size-4, 16px);\n border: none;\n background: transparent;\n text-align: left;\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.option img {\n width: 20px;\n height: 20px;\n}\n\n.option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.option:disabled {\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n cursor: unset;\n}\n\n.invalid-color {\n color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.phone-error {\n margin: 4px 0 0;\n font-size: var(--font-size-xs, 10px);\n color: var(--Error-Error-500, #f46a6b);\n}\n","import { Component, Prop, State, Event, EventEmitter, Watch, Element, Listen, AttachInternals, h } from '@stencil/core';\n\ninterface CountryCode {\n name: string;\n code: string;\n flag: string;\n maxLength: number;\n}\n\nconst COUNTRIES: CountryCode[] = [\n { code: '57', name: 'Colombia', flag: 'CO', maxLength: 10 },\n { code: '52', name: 'Mexico', flag: 'MX', maxLength: 10 },\n { code: '507', name: 'Panama', flag: 'PA', maxLength: 8 },\n { code: '56', name: 'Chile', flag: 'CL', maxLength: 9 },\n { code: '593', name: 'Ecuador', flag: 'EC', maxLength: 10 },\n { code: '51', name: 'Peru', flag: 'PE', maxLength: 9 },\n { code: '34', name: 'España', flag: 'ES', maxLength: 9 },\n { code: '595', name: 'Paraguay', flag: 'PY', maxLength: 9 },\n { code: '58', name: 'Venezuela', flag: 'VE', maxLength: 11 },\n { code: '54', name: 'Argentina', flag: 'AR', maxLength: 10 },\n { code: '55', name: 'Brasil', flag: 'BR', maxLength: 11 },\n { code: '1', name: 'United States', flag: 'US', maxLength: 10 },\n { code: '502', name: 'Guatemala', flag: 'GT', maxLength: 8 },\n { code: '598', name: 'Uruguay', flag: 'UY', maxLength: 9 },\n { code: '501', name: 'Belize', flag: 'BZ', maxLength: 7 },\n { code: '81', name: 'Japan', flag: 'JP', maxLength: 10 },\n { code: '1', name: 'Canada', flag: 'CA', maxLength: 9 },\n { code: '1473', name: 'Grenada', flag: 'GD', maxLength: 10 },\n { code: '509', name: 'Haiti', flag: 'HT', maxLength: 10 },\n { code: '1809', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1829', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1849', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1869', name: 'Saint Kitts And Nevis', flag: 'KN', maxLength: 10 },\n { code: '1784', name: 'Saint Vincent And The Grenadines', flag: 'VC', maxLength: 10 },\n { code: '1758', name: 'Saint Lucia', flag: 'LC', maxLength: 10 },\n { code: '597', name: 'Suriname', flag: 'SR', maxLength: 10 },\n { code: '1868', name: 'Trinidad and Tobago', flag: 'TT', maxLength: 10 },\n { code: '505', name: 'Nicaragua', flag: 'NI', maxLength: 8 },\n { code: '506', name: 'Costa Rica', flag: 'CR', maxLength: 8 },\n { code: '591', name: 'Bolivia', flag: 'BO', maxLength: 8 },\n { code: '7', name: 'Russia', flag: 'RU', maxLength: 11 },\n { code: '20', name: 'Egypt', flag: 'EG', maxLength: 9 },\n { code: '27', name: 'South Africa', flag: 'ZA', maxLength: 10 },\n { code: '30', name: 'Greece', flag: 'GR', maxLength: 10 },\n { code: '31', name: 'Netherlands', flag: 'NL', maxLength: 9 },\n { code: '32', name: 'Belgium', flag: 'BE', maxLength: 8 },\n { code: '33', name: 'France', flag: 'FR', maxLength: 9 },\n { code: '36', name: 'Hungary', flag: 'HU', maxLength: 9 },\n { code: '40', name: 'Romania', flag: 'RO', maxLength: 9 },\n { code: '39', name: 'Italy', flag: 'IT', maxLength: 10 },\n { code: '41', name: 'Switzerland', flag: 'CH', maxLength: 9 },\n { code: '44', name: 'United Kingdom', flag: 'GB', maxLength: 11 },\n { code: '45', name: 'Denmark', flag: 'DK', maxLength: 8 },\n { code: '46', name: 'Sweden', flag: 'SE', maxLength: 8 },\n { code: '47', name: 'Norway', flag: 'NO', maxLength: 8 },\n { code: '48', name: 'Poland', flag: 'PL', maxLength: 9 },\n { code: '49', name: 'Germany', flag: 'DE', maxLength: 11 },\n { code: '53', name: 'Malta', flag: 'MT', maxLength: 8 },\n { code: '60', name: 'Malaysia', flag: 'MY', maxLength: 9 },\n { code: '61', name: 'Australia', flag: 'AU', maxLength: 9 },\n { code: '62', name: 'Indonesia', flag: 'ID', maxLength: 12 },\n { code: '63', name: 'Philippines', flag: 'PH', maxLength: 10 },\n { code: '64', name: 'New Zealand', flag: 'NZ', maxLength: 12 },\n { code: '65', name: 'Singapore', flag: 'SG', maxLength: 8 },\n { code: '66', name: 'Thailand', flag: 'TH', maxLength: 9 },\n { code: '82', name: 'South Korea', flag: 'KR', maxLength: 9 },\n { code: '84', name: 'Vietnam', flag: 'VN', maxLength: 11 },\n { code: '86', name: 'China', flag: 'CN', maxLength: 11 },\n { code: '90', name: 'Turkey', flag: 'TR', maxLength: 10 },\n { code: '91', name: 'India', flag: 'IN', maxLength: 10 },\n { code: '92', name: 'Pakistan', flag: 'PK', maxLength: 9 },\n { code: '93', name: 'Afghanistan', flag: 'AF', maxLength: 10 },\n { code: '94', name: 'Sri Lanka', flag: 'LK', maxLength: 9 },\n { code: '95', name: 'Myanmar', flag: 'MM', maxLength: 9 },\n { code: '98', name: 'Iran', flag: 'IR', maxLength: 10 },\n { code: '211', name: 'South Sudan', flag: 'SS', maxLength: 10 },\n { code: '212', name: 'Morocco', flag: 'MA', maxLength: 9 },\n { code: '213', name: 'Algeria', flag: 'DZ', maxLength: 9 },\n { code: '216', name: 'Tunisia', flag: 'TN', maxLength: 8 },\n { code: '218', name: 'Libya', flag: 'LY', maxLength: 9 },\n { code: '220', name: 'Gambia', flag: 'GM', maxLength: 8 },\n { code: '221', name: 'Senegal', flag: 'SN', maxLength: 9 },\n { code: '222', name: 'Mauritania', flag: 'MR', maxLength: 9 },\n { code: '223', name: 'Mali', flag: 'ML', maxLength: 8 },\n { code: '224', name: 'Guinea', flag: 'GN', maxLength: 9 },\n { code: '225', name: 'Ivory Coast', flag: 'CI', maxLength: 10 },\n { code: '226', name: 'Burkina Faso', flag: 'BF', maxLength: 10 },\n { code: '227', name: 'Niger', flag: 'NE', maxLength: 8 },\n { code: '228', name: 'Togo', flag: 'TG', maxLength: 8 },\n { code: '229', name: 'Benin', flag: 'BJ', maxLength: 8 },\n { code: '230', name: 'Mauritius', flag: 'MU', maxLength: 10 },\n { code: '231', name: 'Liberia', flag: 'LR', maxLength: 8 },\n { code: '232', name: 'Sierra Leone', flag: 'SL', maxLength: 11 },\n { code: '233', name: 'Ghana', flag: 'GH', maxLength: 9 },\n { code: '234', name: 'Nigeria', flag: 'NG', maxLength: 11 },\n { code: '235', name: 'Chad', flag: 'TD', maxLength: 8 },\n { code: '236', name: 'Central African Republic', flag: 'CF', maxLength: 21 },\n { code: '237', name: 'Cameroon', flag: 'CM', maxLength: 10 },\n { code: '238', name: 'Cape Verde', flag: 'CV', maxLength: 9 },\n { code: '239', name: 'São Tomé and Príncipe', flag: 'ST', maxLength: 14 },\n { code: '240', name: 'Equatorial Guinea', flag: 'GQ', maxLength: 17 },\n { code: '241', name: 'Gabon', flag: 'GA', maxLength: 9 },\n];\n\n/\n @component dropi-phone-input\n * Phone number input with country code selector.\n * Syncs perfectly with dropi-core_front natively\n /\n@Component({\n tag: 'dropi-phone-input',\n styleUrl: 'dropi-phone-input.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiPhoneInput {\n @Element() el: HTMLElement;\n @AttachInternals() internals: ElementInternals;\n\n /* Name for native form submission /\n @Prop({ reflect: true }) name: string = '';\n\n\n /* Initial country dial code (e.g. \"57\") — matches Angular 'CodArea' setter /\n @Prop({ mutable: true }) codArea: string = '57';\n /* Phone number value — matches Angular 'ngModelPhone' /\n @Prop({ mutable: true }) ngModelPhone: string = '';\n /* Input placeholder — matches Angular 'phoneNumberPlaceholder' /\n @Prop() phoneNumberPlaceholder: string \| null = null;\n /* Disabled state — matches Angular 'disabledInput' /\n @Prop() disabledInput: boolean = false;\n /* Validation state — matches Angular 'isValidPhone' /\n @Prop() isValidPhone: boolean = undefined;\n /* Validate on init — matches Angular 'validateOnInit' /\n @Prop() validateOnInit: boolean = true;\n /\n Pre-selected country object (matches Angular `selectedOption: Country`).\n * Pass `{ dialCode, flag, name, iso2 }`. When set, overrides `codArea`.\n /\n @Prop({ mutable: true }) selectedOption: any = null;\n /\n Country select configuration object (matches Angular `selectProperties: SelectProperties`).\n * Fields: `label`, `placeholder`, `options` (array of Country objects).\n * When provided, overrides the internal country list.\n /\n @Prop() selectProperties: any = null;\n\n @State() private open: boolean = false;\n\n /* Emitted when country dial code changes — matches Angular 'ngModelChangeCod' /\n @Event() dropiCodChange: EventEmitter<string>;\n /* Emitted when phone number changes — matches Angular 'ngModelChangePhone' /\n @Event() dropiPhoneChange: EventEmitter<string>;\n /* Emitted on field verification — matches Angular 'verifiedField' /\n @Event() dropiVerify: EventEmitter<void>;\n /* Emitted when country selection changes — matches Angular 'onChangeSelect' */\n @Event() dropiChangeSelect: EventEmitter<any>;\n\n @Watch('codArea')\n codAreaChanged() {\n this.ngModelPhone = '';\n this.updateFormValue();\n }\n\n @Watch('ngModelPhone')\n ngModelPhoneChanged() {\n this.updateFormValue();\n }\n\n\n @Watch('selectedOption')\n selectedOptionChanged(val: any) {\n if (!val) return;\n // Support Angular Country shape: { dialCode, iso2 } or { code }\n const code = val.dialCode ?? val.code ?? this.codArea;\n this.codArea = String(code).replace('+', '');\n }\n\n componentWillLoad() {\n if (this.selectedOption) this.selectedOptionChanged(this.selectedOption);\n this.updateFormValue();\n }\n\n private updateFormValue() {\n const fullValue = this.ngModelPhone ? `+${this.codArea}${this.ngModelPhone}` : '';\n this.internals.setFormValue(fullValue);\n }\n\n\n private get selectedCountry(): CountryCode {\n const cleanCodArea = (this.codArea ?? '57').replace('+', '');\n return COUNTRIES.find(c => c.code === cleanCodArea) ?? COUNTRIES[0];\n }\n\n private selectCountry(c: CountryCode) {\n this.codArea = c.code;\n this.open = false;\n this.dropiCodChange.emit(c.code);\n this.dropiChangeSelect.emit(c);\n }\n\n private handleInput(e: InputEvent) {\n const raw = (e.target as HTMLInputElement).value.replace(/\\D/g, '');\n this.ngModelPhone = raw.slice(0, this.selectedCountry.maxLength);\n (e.target as HTMLInputElement).value = this.ngModelPhone;\n this.dropiPhoneChange.emit(this.ngModelPhone);\n }\n\n @Listen('click', { target: 'window' })\n handleWindowClick(ev: Event) {\n const path = ev.composedPath();\n if (!path.includes(this.el)) {\n this.open = false;\n }\n }\n\n render() {\n const country = this.selectedCountry;\n const isInvalid = this.isValidPhone === false;\n\n return (\n <div class=\"phone-wrap\">\n <div class=\"phone-input-container\">\n\n <div class=\"custom-select\">\n <button\n type=\"button\"\n class={{ 'select-button': true, 'select-invalid': isInvalid }}\n disabled={this.disabledInput}\n onClick={() => { if (!this.disabledInput) this.open = !this.open; }}\n >\n <span style={{ display: 'flex', gap: '0.5rem', alignItems: 'center' }}>\n <img src={`https://flagsapi.com/${country.flag}/flat/24.png`} alt=\"flag\" />\n {country.code}\n </span>\n <dropi-icon name={this.open ? 'Dropdown-up' : 'Dropdown-down'} iconWidth=\"14px\" iconHeight=\"14px\" color=\"Gray-Gray-500\" />\n </button>\n\n <ul class={{ 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open }}>\n {COUNTRIES.map(option => (\n <li>\n <button\n type=\"button\"\n class=\"option\"\n onMouseDown={(e) => { e.preventDefault(); this.selectCountry(option); }}\n >\n <img src={`https://flagsapi.com/${option.flag}/flat/24.png`} alt={option.flag} />\n {option.code}\n </button>\n </li>\n ))}\n </ul>\n </div>\n\n <input\n id=\"phone-input\"\n type=\"tel\"\n inputmode=\"numeric\"\n class={{ 'form-control': true, 'is-invalid': isInvalid }}\n placeholder={this.phoneNumberPlaceholder}\n value={this.ngModelPhone}\n disabled={this.disabledInput}\n maxLength={country.maxLength}\n onInput={(e) => this.handleInput(e as InputEvent)}\n />\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropi-phone-input.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-phone-input/dropi-phone-input.css?tag=dropi-phone-input&encapsulation=shadow","src/components/dropi-phone-input/dropi-phone-input.tsx"],"sourcesContent":[":host { display: block; width: 100%; position: relative; font-family: 'Inter', sans-serif; }\n, ::before, ::after { box-sizing: border-box; }\n\n/ Ocultar spin buttons en inputs numéricos /\ninput::-webkit-inner-spin-button,\ninput::-webkit-outer-spin-button {\n -webkit-appearance: none;\n appearance: none;\n margin: 0;\n}\ninput[type='number'] {\n -moz-appearance: textfield;\n appearance: textfield;\n}\n\n.phone-wrap {\n width: 100%;\n}\n\n.phone-label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 4px;\n}\n\n.phone-input-container {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.custom-select {\n position: relative;\n width: 50%;\n}\n\n.form-control {\n flex: 1;\n width: 100%;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: 5px;\n font-size: 14px;\n font-family: inherit;\n transition: border-color 0.3s ease-in-out;\n height: 40px;\n padding: 0 12px;\n outline: none;\n color: var(--Gray-Gray-700, #32394d);\n background-color: var(--Neutral-White, #ffffff);\n}\n\n.form-control::placeholder {\n color: var(--Gray-Gray-500, #69738c);\n}\n\n.form-control:focus::placeholder {\n color: var(--Gray-Gray-500, #69738c);\n}\n\n.form-control:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n outline: none;\n}\n\n.form-control:disabled {\n border: 1px solid var(--Gray-Gray-200, #c3c9d9) !important;\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n outline: none;\n}\n\n.form-control.is-invalid {\n background: #fffbfb;\n border-color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.select-button {\n width: 100%;\n height: 40px;\n padding: 0.47rem 0.75rem;\n padding-right: 7px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-500, #69738c);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n cursor: pointer;\n}\n\n.select-button img {\n width: 20px;\n height: 20px;\n}\n\n.select-button:focus {\n border-color: var(--Info-Info-500, #50a5f1) !important;\n outline: none;\n}\n\n.select-button:disabled {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n cursor: unset;\n}\n\n.select-button.select-completed {\n border-color: var(--Gray-Gray-400, #858ea6);\n color: var(--Gray-Gray-600, #475066);\n background: var(--Neutral-White, #ffffff);\n}\n\n.select-button.select-invalid {\n border-color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.select-dropdown {\n position: absolute;\n width: 100%;\n overflow: hidden;\n list-style: none;\n padding: 0;\n margin: 4px 0 0 0;\n border: 1px solid transparent;\n border-radius: var(--Border-2, 8px);\n overflow-y: scroll;\n z-index: var(--dropi-z-index-overlay, 11000);\n}\n\n/ Scrollbar /\n.select-dropdown::-webkit-scrollbar {\n width: 6px;\n}\n.select-dropdown::-webkit-scrollbar-thumb {\n background-color: var(--Gray-Gray-300, #d1d6e1);\n border-radius: 4px;\n}\n\n.expanded-select {\n max-height: 250px;\n background: var(--Neutral-White, #ffffff);\n box-shadow: var(--Shadow-medium, 0 4px 16px rgba(0, 0, 0, 0.08));\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n transition: max-height 0.2s ease-in;\n}\n\n.collapsed-select {\n max-height: 0;\n background: transparent;\n box-shadow: none;\n border: 1px solid transparent;\n transition: max-height 0.2s ease-out, background 0.6s ease-out, box-shadow 0.6s ease-out;\n}\n\n.select-dropdown li {\n margin: 0;\n padding: 0;\n}\n\n.option {\n width: 100%;\n height: 45px;\n border-radius: var(--Border-2, 8px);\n padding-top: var(--Size-3, 12px);\n padding-right: var(--Size-4, 16px);\n padding-bottom: var(--Size-3, 12px);\n padding-left: var(--Size-4, 16px);\n border: none;\n background: transparent;\n text-align: left;\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.option img {\n width: 20px;\n height: 20px;\n}\n\n.option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.option:disabled {\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n cursor: unset;\n}\n\n.invalid-color {\n color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.phone-error {\n margin: 4px 0 0;\n font-size: var(--font-size-xs, 10px);\n color: var(--Error-Error-500, #f46a6b);\n}\n","import { Component, Prop, State, Event, EventEmitter, Watch, Element, Listen, AttachInternals, h } from '@stencil/core';\n\ninterface CountryCode {\n name: string;\n code: string;\n flag: string;\n maxLength: number;\n}\n\nconst COUNTRIES: CountryCode[] = [\n { code: '57', name: 'Colombia', flag: 'CO', maxLength: 10 },\n { code: '52', name: 'Mexico', flag: 'MX', maxLength: 10 },\n { code: '507', name: 'Panama', flag: 'PA', maxLength: 8 },\n { code: '56', name: 'Chile', flag: 'CL', maxLength: 9 },\n { code: '593', name: 'Ecuador', flag: 'EC', maxLength: 10 },\n { code: '51', name: 'Peru', flag: 'PE', maxLength: 9 },\n { code: '34', name: 'España', flag: 'ES', maxLength: 9 },\n { code: '595', name: 'Paraguay', flag: 'PY', maxLength: 9 },\n { code: '58', name: 'Venezuela', flag: 'VE', maxLength: 11 },\n { code: '54', name: 'Argentina', flag: 'AR', maxLength: 10 },\n { code: '55', name: 'Brasil', flag: 'BR', maxLength: 11 },\n { code: '1', name: 'United States', flag: 'US', maxLength: 10 },\n { code: '502', name: 'Guatemala', flag: 'GT', maxLength: 8 },\n { code: '598', name: 'Uruguay', flag: 'UY', maxLength: 9 },\n { code: '501', name: 'Belize', flag: 'BZ', maxLength: 7 },\n { code: '81', name: 'Japan', flag: 'JP', maxLength: 10 },\n { code: '1', name: 'Canada', flag: 'CA', maxLength: 9 },\n { code: '1473', name: 'Grenada', flag: 'GD', maxLength: 10 },\n { code: '509', name: 'Haiti', flag: 'HT', maxLength: 10 },\n { code: '1809', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1829', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1849', name: 'Dominican Republic', flag: 'DO', maxLength: 10 },\n { code: '1869', name: 'Saint Kitts And Nevis', flag: 'KN', maxLength: 10 },\n { code: '1784', name: 'Saint Vincent And The Grenadines', flag: 'VC', maxLength: 10 },\n { code: '1758', name: 'Saint Lucia', flag: 'LC', maxLength: 10 },\n { code: '597', name: 'Suriname', flag: 'SR', maxLength: 10 },\n { code: '1868', name: 'Trinidad and Tobago', flag: 'TT', maxLength: 10 },\n { code: '505', name: 'Nicaragua', flag: 'NI', maxLength: 8 },\n { code: '506', name: 'Costa Rica', flag: 'CR', maxLength: 8 },\n { code: '591', name: 'Bolivia', flag: 'BO', maxLength: 8 },\n { code: '7', name: 'Russia', flag: 'RU', maxLength: 11 },\n { code: '20', name: 'Egypt', flag: 'EG', maxLength: 9 },\n { code: '27', name: 'South Africa', flag: 'ZA', maxLength: 10 },\n { code: '30', name: 'Greece', flag: 'GR', maxLength: 10 },\n { code: '31', name: 'Netherlands', flag: 'NL', maxLength: 9 },\n { code: '32', name: 'Belgium', flag: 'BE', maxLength: 8 },\n { code: '33', name: 'France', flag: 'FR', maxLength: 9 },\n { code: '36', name: 'Hungary', flag: 'HU', maxLength: 9 },\n { code: '40', name: 'Romania', flag: 'RO', maxLength: 9 },\n { code: '39', name: 'Italy', flag: 'IT', maxLength: 10 },\n { code: '41', name: 'Switzerland', flag: 'CH', maxLength: 9 },\n { code: '44', name: 'United Kingdom', flag: 'GB', maxLength: 11 },\n { code: '45', name: 'Denmark', flag: 'DK', maxLength: 8 },\n { code: '46', name: 'Sweden', flag: 'SE', maxLength: 8 },\n { code: '47', name: 'Norway', flag: 'NO', maxLength: 8 },\n { code: '48', name: 'Poland', flag: 'PL', maxLength: 9 },\n { code: '49', name: 'Germany', flag: 'DE', maxLength: 11 },\n { code: '53', name: 'Malta', flag: 'MT', maxLength: 8 },\n { code: '60', name: 'Malaysia', flag: 'MY', maxLength: 9 },\n { code: '61', name: 'Australia', flag: 'AU', maxLength: 9 },\n { code: '62', name: 'Indonesia', flag: 'ID', maxLength: 12 },\n { code: '63', name: 'Philippines', flag: 'PH', maxLength: 10 },\n { code: '64', name: 'New Zealand', flag: 'NZ', maxLength: 12 },\n { code: '65', name: 'Singapore', flag: 'SG', maxLength: 8 },\n { code: '66', name: 'Thailand', flag: 'TH', maxLength: 9 },\n { code: '82', name: 'South Korea', flag: 'KR', maxLength: 9 },\n { code: '84', name: 'Vietnam', flag: 'VN', maxLength: 11 },\n { code: '86', name: 'China', flag: 'CN', maxLength: 11 },\n { code: '90', name: 'Turkey', flag: 'TR', maxLength: 10 },\n { code: '91', name: 'India', flag: 'IN', maxLength: 10 },\n { code: '92', name: 'Pakistan', flag: 'PK', maxLength: 9 },\n { code: '93', name: 'Afghanistan', flag: 'AF', maxLength: 10 },\n { code: '94', name: 'Sri Lanka', flag: 'LK', maxLength: 9 },\n { code: '95', name: 'Myanmar', flag: 'MM', maxLength: 9 },\n { code: '98', name: 'Iran', flag: 'IR', maxLength: 10 },\n { code: '211', name: 'South Sudan', flag: 'SS', maxLength: 10 },\n { code: '212', name: 'Morocco', flag: 'MA', maxLength: 9 },\n { code: '213', name: 'Algeria', flag: 'DZ', maxLength: 9 },\n { code: '216', name: 'Tunisia', flag: 'TN', maxLength: 8 },\n { code: '218', name: 'Libya', flag: 'LY', maxLength: 9 },\n { code: '220', name: 'Gambia', flag: 'GM', maxLength: 8 },\n { code: '221', name: 'Senegal', flag: 'SN', maxLength: 9 },\n { code: '222', name: 'Mauritania', flag: 'MR', maxLength: 9 },\n { code: '223', name: 'Mali', flag: 'ML', maxLength: 8 },\n { code: '224', name: 'Guinea', flag: 'GN', maxLength: 9 },\n { code: '225', name: 'Ivory Coast', flag: 'CI', maxLength: 10 },\n { code: '226', name: 'Burkina Faso', flag: 'BF', maxLength: 10 },\n { code: '227', name: 'Niger', flag: 'NE', maxLength: 8 },\n { code: '228', name: 'Togo', flag: 'TG', maxLength: 8 },\n { code: '229', name: 'Benin', flag: 'BJ', maxLength: 8 },\n { code: '230', name: 'Mauritius', flag: 'MU', maxLength: 10 },\n { code: '231', name: 'Liberia', flag: 'LR', maxLength: 8 },\n { code: '232', name: 'Sierra Leone', flag: 'SL', maxLength: 11 },\n { code: '233', name: 'Ghana', flag: 'GH', maxLength: 9 },\n { code: '234', name: 'Nigeria', flag: 'NG', maxLength: 11 },\n { code: '235', name: 'Chad', flag: 'TD', maxLength: 8 },\n { code: '236', name: 'Central African Republic', flag: 'CF', maxLength: 21 },\n { code: '237', name: 'Cameroon', flag: 'CM', maxLength: 10 },\n { code: '238', name: 'Cape Verde', flag: 'CV', maxLength: 9 },\n { code: '239', name: 'São Tomé and Príncipe', flag: 'ST', maxLength: 14 },\n { code: '240', name: 'Equatorial Guinea', flag: 'GQ', maxLength: 17 },\n { code: '241', name: 'Gabon', flag: 'GA', maxLength: 9 },\n];\n\n/\n @component dropi-phone-input\n * Phone number input with country code selector.\n * Syncs perfectly with dropi-core_front natively\n /\n@Component({\n tag: 'dropi-phone-input',\n styleUrl: 'dropi-phone-input.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiPhoneInput {\n @Element() el: HTMLElement;\n @AttachInternals() internals: ElementInternals;\n\n /* Name for native form submission /\n @Prop({ reflect: true }) name!: string;\n\n\n /* Initial country dial code (e.g. \"57\") — matches Angular 'CodArea' setter /\n @Prop({ mutable: true }) codArea: string = '57';\n /* Phone number value — matches Angular 'ngModelPhone' /\n @Prop({ mutable: true }) ngModelPhone: string = '';\n /* Input placeholder — matches Angular 'phoneNumberPlaceholder' /\n @Prop() phoneNumberPlaceholder: string \| null = null;\n /* Disabled state — matches Angular 'disabledInput' /\n @Prop() disabledInput: boolean = false;\n /* Validation state — matches Angular 'isValidPhone' /\n @Prop() isValidPhone: boolean = undefined;\n /* Validate on init — matches Angular 'validateOnInit' /\n @Prop() validateOnInit: boolean = true;\n /\n Pre-selected country object (matches Angular `selectedOption: Country`).\n * Pass `{ dialCode, flag, name, iso2 }`. When set, overrides `codArea`.\n /\n @Prop({ mutable: true }) selectedOption: any = null;\n /\n Country select configuration object (matches Angular `selectProperties: SelectProperties`).\n * Fields: `label`, `placeholder`, `options` (array of Country objects).\n * When provided, overrides the internal country list.\n /\n @Prop() selectProperties: any = null;\n\n @State() private open: boolean = false;\n\n /* Emitted when country dial code changes — matches Angular 'ngModelChangeCod' /\n @Event() dropiCodChange: EventEmitter<string>;\n /* Emitted when phone number changes — matches Angular 'ngModelChangePhone' /\n @Event() dropiPhoneChange: EventEmitter<string>;\n /* Emitted on field verification — matches Angular 'verifiedField' /\n @Event() dropiVerify: EventEmitter<void>;\n /* Emitted when country selection changes — matches Angular 'onChangeSelect' */\n @Event() dropiChangeSelect: EventEmitter<any>;\n\n @Watch('codArea')\n codAreaChanged() {\n this.ngModelPhone = '';\n this.updateFormValue();\n }\n\n @Watch('ngModelPhone')\n ngModelPhoneChanged() {\n this.updateFormValue();\n }\n\n\n @Watch('selectedOption')\n selectedOptionChanged(val: any) {\n if (!val) return;\n // Support Angular Country shape: { dialCode, iso2 } or { code }\n const code = val.dialCode ?? val.code ?? this.codArea;\n this.codArea = String(code).replace('+', '');\n }\n\n componentWillLoad() {\n if (this.selectedOption) this.selectedOptionChanged(this.selectedOption);\n this.updateFormValue();\n }\n\n private updateFormValue() {\n const fullValue = this.ngModelPhone ? `+${this.codArea}${this.ngModelPhone}` : '';\n this.internals.setFormValue(fullValue);\n }\n\n\n private get selectedCountry(): CountryCode {\n const cleanCodArea = (this.codArea ?? '57').replace('+', '');\n return COUNTRIES.find(c => c.code === cleanCodArea) ?? COUNTRIES[0];\n }\n\n private selectCountry(c: CountryCode) {\n this.codArea = c.code;\n this.open = false;\n this.dropiCodChange.emit(c.code);\n this.dropiChangeSelect.emit(c);\n }\n\n private handleInput(e: InputEvent) {\n const raw = (e.target as HTMLInputElement).value.replace(/\\D/g, '');\n this.ngModelPhone = raw.slice(0, this.selectedCountry.maxLength);\n (e.target as HTMLInputElement).value = this.ngModelPhone;\n this.dropiPhoneChange.emit(this.ngModelPhone);\n }\n\n @Listen('click', { target: 'window' })\n handleWindowClick(ev: Event) {\n const path = ev.composedPath();\n if (!path.includes(this.el)) {\n this.open = false;\n }\n }\n\n render() {\n const country = this.selectedCountry;\n const isInvalid = this.isValidPhone === false;\n\n return (\n <div class=\"phone-wrap\">\n <div class=\"phone-input-container\">\n\n <div class=\"custom-select\">\n <button\n type=\"button\"\n class={{ 'select-button': true, 'select-invalid': isInvalid }}\n disabled={this.disabledInput}\n onClick={() => { if (!this.disabledInput) this.open = !this.open; }}\n >\n <span style={{ display: 'flex', gap: '0.5rem', alignItems: 'center' }}>\n <img src={`https://flagsapi.com/${country.flag}/flat/24.png`} alt=\"flag\" />\n {country.code}\n </span>\n <dropi-icon name={this.open ? 'Dropdown-up' : 'Dropdown-down'} iconWidth=\"14px\" iconHeight=\"14px\" color=\"Gray-Gray-500\" />\n </button>\n\n <ul class={{ 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open }}>\n {COUNTRIES.map(option => (\n <li>\n <button\n type=\"button\"\n class=\"option\"\n onMouseDown={(e) => { e.preventDefault(); this.selectCountry(option); }}\n >\n <img src={`https://flagsapi.com/${option.flag}/flat/24.png`} alt={option.flag} />\n {option.code}\n </button>\n </li>\n ))}\n </ul>\n </div>\n\n <input\n id=\"phone-input\"\n type=\"tel\"\n inputmode=\"numeric\"\n class={{ 'form-control': true, 'is-invalid': isInvalid }}\n placeholder={this.phoneNumberPlaceholder}\n value={this.ngModelPhone}\n disabled={this.disabledInput}\n maxLength={country.maxLength}\n onInput={(e) => this.handleInput(e as InputEvent)}\n />\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/dropi-ui/dropi-progress-bar.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, h } from './index-CPacpXAJ.js';
 const dropiProgressBarCss = () => `:host{display:block;width:100%}.progress-container{width:100%;display:flex;flex-direction:column;gap:4px}.progress-header{display:flex;justify-content:flex-end}.progress-value{font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-600, #475066);font-weight:500}.progress-track{width:100%;border-radius:999px;overflow:hidden;position:relative}.progress-fill{height:100%;border-radius:999px;transition:width 0.3s ease-in-out, background-color 0.3s ease-in-out}`;
@@ -23,7 +23,7 @@ const DropiProgressBar = class {
             width: `${Math.min(100, Math.max(0, this.value))}%`,
             backgroundColor: this.color || `var(--${this.getSeverityVariable()}, #50A5F1)`,
         };
-        return (h("div", { key: 'f68b88240ebc188f1f0378424b8d1617c2e7440e', class: "progress-container" }, this.showValue && (h("div", { key: 'f8116e4eb824031d4bd1ac9d694e2bd3bca1ed6d', class: "progress-header" }, h("span", { key: '892813f8e0a028ce286c00edd0489d489dd271c4', class: "progress-value" }, this.value, "%"))), h("div", { key: '2e740487a59df1ec7def96565a9ee64d53b773b8', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, h("div", { key: '4f6fd1c436563cacac31e385d84c4a21945f6e10', class: "progress-fill", style: fillStyle }))));
+        return (h("div", { key: '3ee4e18ca3beb77287998fcb8bc1d2f0221376cc', class: "progress-container" }, this.showValue && (h("div", { key: '6b034366142b04ba11c5d7565b61aa2305c2c2b6', class: "progress-header" }, h("span", { key: '6e8b7394b463934702228c5dec02a3f5116b87aa', class: "progress-value" }, this.value, "%"))), h("div", { key: 'ecfe4703272ae8d7d53f2baeeb210d22437d42ed', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, h("div", { key: 'e3312f134f691d5e828a130940b100ff244bc6a9', class: "progress-fill", style: fillStyle }))));
     }
     getSeverityVariable() {
         switch (this.severity) {

package/dist/dropi-ui/dropi-radio-button.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, d as createEvent, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, h } from './index-CPacpXAJ.js';
 const dropiRadioButtonCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}`;
@@ -18,9 +18,9 @@ const DropiRadioButton = class {
     /** Label text displayed next to the radio */
     label = '';
     /** Input name (for grouping radio buttons) */
-    name = 'name';
+    name;
     /** Input id */
-    id = 'radioButton';
+    inputId;
     /** Whether this radio is selected */
     checked = false;
     /**
@@ -45,7 +45,7 @@ const DropiRadioButton = class {
         this.dropiChange.emit(e);
     }
     render() {
-        return (h("div", { key: 'e4b54d9bda299b9150ebf9791925e0e7c3b9fb38', class: "dropi-radio-button" }, h("label", { key: '0a4c6443668477a2cb6b2d5a3d8bc1744a0fcffd', htmlFor: this.id }, h("input", { key: '6ba6b5af4bc061664dee0b6554c769613080dbb8', id: this.id, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
+        return (h("div", { key: '52b37c673be108d7375ac9e8fdc2681528028f24', class: "dropi-radio-button" }, h("label", { key: '0fdd72139f33d395ab219ea90c3742e5a8537f71', htmlFor: this.inputId }, h("input", { key: '6779d419a98c4ffeb0f44cdf91c34be9bc806c3d', id: this.inputId, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/dropi-ui/dropi-radio-button.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropi-radio-button.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,MAAM,CAAC,s9BAAs9B,CAAC;;MCY7+B,gBAAgB,GAAA,MAAA;;;;;;;;;;;;AACR,IAAA,SAAS;;IAGpB,KAAK,GAAW,EAAE;;~~IAED~~,IAAI~~,GAAW,MAAM~~;;~~IAGtC~~,~~EAAE~~,~~GAAW,aAAa~~;;~~IAEM~~,OAAO,GAAY,KAAK;AAEhE;;;AAGG;IACK,YAAY,GAAY,KAAK;;AAG5B,IAAA,WAAW;AAGpB,IAAA,cAAc,CAAC,GAAY,EAAA;AACzB,QAAA,IAAI,GAAG;AAAE,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;AAI/B,IAAA,cAAc,CAAC,GAAY,EAAA;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;;IAGhD,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC;;AAIjD,IAAA,YAAY,CAAC,CAAQ,EAAA;QAC3B,IAAI,CAAC,OAAO,GAAI,CAAC,CAAC,MAA2B,CAAC,OAAO;AACrD,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;;IAG1B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC7B,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,IAAI,CAAC,~~EAAE~~,EAAA,~~EACrB~~,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,IAAI,CAAC,~~EAAE~~,~~EACX~~,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAA,CACrC,EACD,IAAI,CAAC,KAAK,CACL,CACJ;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dropi-radio-button/dropi-radio-button.css?tag=dropi-radio-button&encapsulation=shadow","src/components/dropi-radio-button/dropi-radio-button.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.dropi-radio-button {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 20px;\n}\n\nlabel {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 12px);\n font-weight: var(--font-weight-regular, 400);\n line-height: 1.5;\n}\n\ninput[type='radio'] {\n appearance: none;\n -webkit-appearance: none;\n width: 20px;\n height: 20px;\n min-width: 20px;\n border: 2px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: 50%;\n background-color: transparent;\n position: relative;\n cursor: pointer;\n outline: none;\n flex-shrink: 0;\n align-self: center;\n vertical-align: middle;\n margin: 0;\n}\n\ninput[type='radio']::before {\n content: '';\n position: absolute;\n top: 3px;\n left: 3px;\n width: 10px;\n height: 10px;\n background-color: var(--Primary-Primary-400, #f7b46f);\n border-radius: 50%;\n display: none;\n}\n\ninput[type='radio']:checked {\n border: 2px solid var(--Primary-Primary-500, #f49a3d);\n}\n\ninput[type='radio']:checked::before {\n display: block;\n}\n","import { Component, Prop, Event, EventEmitter, Watch, AttachInternals, h } from '@stencil/core';\n\n/\n @component dropi-radio-button\n * Styled radio button with label.\n /\n@Component({\n tag: 'dropi-radio-button',\n styleUrl: 'dropi-radio-button.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiRadioButton {\n @AttachInternals() internals: ElementInternals;\n\n /* Label text displayed next to the radio /\n @Prop() label: string = '';\n /* Input name (for grouping radio buttons) /\n @Prop({ reflect: true }) name: string ~~= 'name'~~;\n\n /* Input id /\n @Prop() ~~id:~~ string ~~= 'radioButton'~~;\n /* Whether this radio is selected /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /\n Set to true to programmatically reset this radio to unchecked.\n * Useful when the parent needs to clear a group.\n /\n @Prop() resetTrigger: boolean = false;\n\n /* Emitted when the radio is selected */\n @Event() dropiChange: EventEmitter<any>;\n\n @Watch('resetTrigger')\n onResetTrigger(val: boolean) {\n if (val) this.checked = false;\n }\n\n @Watch('checked')\n checkedChanged(val: boolean) {\n this.internals.setFormValue(val ? 'on' : null);\n }\n\n componentWillLoad() {\n this.internals.setFormValue(this.checked ? 'on' : null);\n }\n\n\n private handleChange(e: Event) {\n this.checked = (e.target as HTMLInputElement).checked;\n this.dropiChange.emit(e);\n }\n\n render() {\n return (\n <div class=\"dropi-radio-button\">\n <label htmlFor={this.id}>\n <input\n id={this.id}\n type=\"radio\"\n name={this.name}\n checked={this.checked}\n onChange={(e) => this.handleChange(e)}\n />\n {this.label}\n </label>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropi-radio-button.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,MAAM,CAAC,s9BAAs9B,CAAC;;MCY7+B,gBAAgB,GAAA,MAAA;;;;;;;;;;;;AACR,IAAA,SAAS;;IAGpB,KAAK,GAAW,EAAE;;AAED,IAAA,IAAI;;AAGrB,IAAA,OAAO;;IAEyB,OAAO,GAAY,KAAK;AAEhE;;;AAGG;IACK,YAAY,GAAY,KAAK;;AAG5B,IAAA,WAAW;AAGpB,IAAA,cAAc,CAAC,GAAY,EAAA;AACzB,QAAA,IAAI,GAAG;AAAE,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;AAI/B,IAAA,cAAc,CAAC,GAAY,EAAA;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;;IAGhD,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC;;AAIjD,IAAA,YAAY,CAAC,CAAQ,EAAA;QAC3B,IAAI,CAAC,OAAO,GAAI,CAAC,CAAC,MAA2B,CAAC,OAAO;AACrD,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;;IAG1B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC7B,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,IAAI,CAAC,OAAO,EAAA,EAC1B,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAA,CACrC,EACD,IAAI,CAAC,KAAK,CACL,CACJ;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dropi-radio-button/dropi-radio-button.css?tag=dropi-radio-button&encapsulation=shadow","src/components/dropi-radio-button/dropi-radio-button.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.dropi-radio-button {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 20px;\n}\n\nlabel {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 12px);\n font-weight: var(--font-weight-regular, 400);\n line-height: 1.5;\n}\n\ninput[type='radio'] {\n appearance: none;\n -webkit-appearance: none;\n width: 20px;\n height: 20px;\n min-width: 20px;\n border: 2px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: 50%;\n background-color: transparent;\n position: relative;\n cursor: pointer;\n outline: none;\n flex-shrink: 0;\n align-self: center;\n vertical-align: middle;\n margin: 0;\n}\n\ninput[type='radio']::before {\n content: '';\n position: absolute;\n top: 3px;\n left: 3px;\n width: 10px;\n height: 10px;\n background-color: var(--Primary-Primary-400, #f7b46f);\n border-radius: 50%;\n display: none;\n}\n\ninput[type='radio']:checked {\n border: 2px solid var(--Primary-Primary-500, #f49a3d);\n}\n\ninput[type='radio']:checked::before {\n display: block;\n}\n","import { Component, Prop, Event, EventEmitter, Watch, AttachInternals, h } from '@stencil/core';\n\n/\n @component dropi-radio-button\n * Styled radio button with label.\n /\n@Component({\n tag: 'dropi-radio-button',\n styleUrl: 'dropi-radio-button.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiRadioButton {\n @AttachInternals() internals: ElementInternals;\n\n /* Label text displayed next to the radio /\n @Prop() label: string = '';\n /* Input name (for grouping radio buttons) /\n @Prop({ reflect: true }) name!: string;\n\n /* Input id /\n @Prop() inputId!: string;\n /* Whether this radio is selected /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /\n Set to true to programmatically reset this radio to unchecked.\n * Useful when the parent needs to clear a group.\n /\n @Prop() resetTrigger: boolean = false;\n\n /* Emitted when the radio is selected */\n @Event() dropiChange: EventEmitter<any>;\n\n @Watch('resetTrigger')\n onResetTrigger(val: boolean) {\n if (val) this.checked = false;\n }\n\n @Watch('checked')\n checkedChanged(val: boolean) {\n this.internals.setFormValue(val ? 'on' : null);\n }\n\n componentWillLoad() {\n this.internals.setFormValue(this.checked ? 'on' : null);\n }\n\n\n private handleChange(e: Event) {\n this.checked = (e.target as HTMLInputElement).checked;\n this.dropiChange.emit(e);\n }\n\n render() {\n return (\n <div class=\"dropi-radio-button\">\n <label htmlFor={this.inputId}>\n <input\n id={this.inputId}\n type=\"radio\"\n name={this.name}\n checked={this.checked}\n onChange={(e) => this.handleChange(e)}\n />\n {this.label}\n </label>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/dropi-ui/dropi-radio-selection-list.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, d as createEvent, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, h } from './index-CPacpXAJ.js';
 const dropiRadioSelectionListCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.rsl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.rsl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.rsl__list{display:flex;flex-direction:column;gap:var(--Size-2, 8px)}.rsl__item{display:flex;align-items:flex-start;gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);cursor:pointer;transition:border-color 0.15s, background 0.15s}.rsl__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.rsl__item--selected{border-color:var(--Primary-Primary-500, #f49a3d);background:var(--Primary-Primary-50, #fff5eb)}.rsl__radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--Gray-Gray-300, #a3abbf);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;transition:border-color 0.15s}.rsl__radio--checked{border-color:var(--Primary-Primary-500, #f49a3d)}.rsl__radio-dot{width:8px;height:8px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.rsl__content{display:flex;flex-direction:column;gap:2px}.rsl__name{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d)}.rsl__desc{font-size:var(--font-size-xs, 10px);line-height:1.4;color:var(--Gray-Gray-500, #69738c)}`;

package/dist/dropi-ui/dropi-read-more.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, h } from './index-CPacpXAJ.js';
 const dropiReadMoreCss = () => `:host{display:block}.read-more__text{margin:0;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-800, #1f2433);line-height:1.5}.read-more__toggle{all:unset;display:inline;font-size:var(--font-size-s, 12px);font-family:inherit;font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-600);cursor:pointer}.read-more__toggle:hover{color:var(--Primary-Primary-600, #d4872e)}`;
@@ -30,7 +30,7 @@ const DropiReadMore = class {
     }
     render() {
         const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);
-        return (h("div", { key: '6accf9aa0a6f7377c7de6e8cbcb9e2a7ee99573a', class: "read-more" }, h("p", { key: '96e5493df8b065008f9bc45cea1ba768eabfc0a2', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (h("button", { key: '195d962715c5c618701c3e86df618289915e3a9b', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
+        return (h("div", { key: '748cfee9958aeb1262d07a164624ccd306ce7220', class: "read-more" }, h("p", { key: 'cd987705707a31abc770d5401f0eade8aef5f561', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (h("button", { key: '22c809321cfe4b11c7d77d5f55ad690c154f6d2a', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
     }
 };
 DropiReadMore.style = dropiReadMoreCss();

package/dist/dropi-ui/dropi-search.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, d as createEvent, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, h } from './index-CPacpXAJ.js';
 const dropiSearchCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.search-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.search-input-row{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:10px;pointer-events:none;z-index:1}.search-input{width:100%;height:40px;padding:0 36px 0 34px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);outline:none;transition:border-color 0.2s}.search-input:focus{border-color:var(--Info-Info-500, #50a5f1)}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{position:absolute;right:10px;display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer;z-index:1}.search-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:var(--dropdown-height, 240px);overflow-y:auto;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);z-index:100}.search-option{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.search-option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.search-option--selected{background:var(--Primary-Primary-50, #fff5eb)}.search-option__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-no-results{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6);text-align:center}`;
@@ -109,7 +109,7 @@ const DropiSearch = class {
         return (h("div", { key: '594b15b4b31044f4a02376dc773ea36da893d773', class: "search-wrap" }, this.label && h("label", { key: '297a989441ad892715b09421f9a53618851c1b52', class: "search-label" }, this.label), h("div", { key: '6bbaf4ea5c1bc6ff831626117fccde647e68ba19', class: `search-input-row search-input-row--${this.type}` }, this.showIcon && h("dropi-icon", { key: 'e94c3a3895a14e950a018023d5d7a281a230abae', class: "search-icon", name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), h("input", { key: '820bf2f4c9ecaf9907aceaaa08bd3fa309606e90', class: "search-input", type: this.typeInput, placeholder: this.placeholder, value: this.textInput, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), onKeyDown: (e) => this.handleKeyDown(e), onFocus: () => {
                 if (this.parsedOptions.length)
                     this.open = true;
-            }, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (h("button", { key: 'e2fd7c3d5fee45a83f030589f58d4fee9f3af69c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, h("dropi-icon", { key: 'a530b0adb83d76b205cd2b22792f14229950836e', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (h("div", { key: '8c062d43dccb41c84b2a599ed6d1a5e049a75b65', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (h("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (h("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && h("dropi-checkbox", { checked: this.isSelected(opt) }), h("span", { class: "search-option__label" }, opt[this.dataName])))))))));
+            }, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (h("button", { key: 'e2fd7c3d5fee45a83f030589f58d4fee9f3af69c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, h("dropi-icon", { key: 'a530b0adb83d76b205cd2b22792f14229950836e', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (h("div", { key: '8c062d43dccb41c84b2a599ed6d1a5e049a75b65', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (h("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (h("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && h("dropi-checkbox", { name: "_search-option", checked: this.isSelected(opt) }), h("span", { class: "search-option__label" }, opt[this.dataName])))))))));
     }
     static get watchers() { return {
         "dataToSearch": [{

package/dist/dropi-ui/dropi-search.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropi-search.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-search/dropi-search.css?tag=dropi-search&encapsulation=shadow","src/components/dropi-search/dropi-search.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n position: relative;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.search-label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 4px;\n}\n\n/ ── Input row ──────────────────────────────────────────── /\n.search-input-row {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.search-icon {\n position: absolute;\n left: 10px;\n pointer-events: none;\n z-index: 1;\n}\n\n.search-input {\n width: 100%;\n height: 40px;\n padding: 0 36px 0 34px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n outline: none;\n transition: border-color 0.2s;\n}\n\n.search-input:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n}\n\n.search-input::placeholder {\n color: var(--Gray-Gray-400, #858ea6);\n}\n\n.search-clear {\n position: absolute;\n right: 10px;\n display: flex;\n align-items: center;\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n z-index: 1;\n}\n\n/ ── Dropdown ───────────────────────────────────────────── /\n.search-dropdown {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n max-height: var(--dropdown-height, 240px);\n overflow-y: auto;\n background: var(--Neutral-White, #ffffff);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n z-index: 100;\n}\n\n.search-option {\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n padding: var(--Size-2, 8px) var(--Size-3, 12px);\n cursor: pointer;\n transition: background 0.15s;\n user-select: none;\n}\n\n.search-option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.search-option--selected {\n background: var(--Primary-Primary-50, #fff5eb);\n}\n\n.search-option__label {\n flex: 1;\n font-size: var(--font-size-s, 12px);\n color: var(--Gray-Gray-700, #32394d);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-no-results {\n padding: var(--Size-3, 12px);\n font-size: var(--font-size-s, 12px);\n color: var(--Gray-Gray-400, #858ea6);\n text-align: center;\n}\n","import { Component, Prop, State, Event, EventEmitter, Watch, h } from '@stencil/core';\n\nexport interface SearchOption {\n [key: string]: any;\n}\n\n/\n @component dropi-search\n * Text search input with optional dropdown results list.\n * Supports single and multi-select, keyboard navigation, and clear button.\n /\n@Component({\n tag: 'dropi-search',\n styleUrl: 'dropi-search.css',\n shadow: true,\n})\nexport class DropiSearch {\n /* Visual variant (matches Angular `type`) /\n @Prop() type: 'default' \| 'dropdown' \| 'dropdown-button' \| 'default-light' = 'default';\n /* Placeholder text /\n @Prop() placeholder: string = 'Search...';\n /* Controlled input value /\n @Prop({ mutable: true }) textInput: string = '';\n /* HTML input type: text \| number (matches Angular `typeInput`) /\n @Prop() typeInput: 'text' \| 'number' = 'text';\n /* Max character length /\n @Prop() maxLength: number;\n /* Show the search icon (matches Angular `showIcon`) /\n @Prop() showIcon: boolean = true;\n /* Show clear (×) button when input has text /\n @Prop() showClear: boolean = true;\n /* Data source to filter. Pass as array or JSON string /\n @Prop() dataToSearch: SearchOption[] \| string = [];\n /* Property name to display and search /\n @Prop() dataName: string = 'name';\n /* Dropdown open direction: down \| top (matches Angular `position`) /\n @Prop() position: 'down' \| 'top' = 'down';\n /* Allow multiple selection /\n @Prop() multipleSelectModel: boolean = true;\n /* Max height of dropdown (numeric value) /\n @Prop() heightOverlay: number = 230;\n /* Label shown above the input /\n @Prop() label: string = '';\n /* Controlled selected items array (matches Angular `model`) /\n @Prop({ mutable: true }) model: SearchOption[] \| string = [];\n\n @State() private open: boolean = false;\n @State() private selected: SearchOption[] = [];\n @State() private parsedOptions: SearchOption[] = [];\n\n /* Emitted on input change. e.detail = current text /\n @Event() dropiInput: EventEmitter<string>;\n /* Emitted on blur /\n @Event() dropiBlur: EventEmitter<void>;\n /* Emitted when Enter is pressed. e.detail = current text /\n @Event() dropiKeyEnter: EventEmitter<string>;\n /* Emitted on change event of the native input (matches Angular `onChange`) /\n @Event() dropiChange: EventEmitter<string>;\n /* Emitted when clear button clicked /\n @Event() dropiClear: EventEmitter<void>;\n /* Emitted when selection changes. e.detail = selected items */\n @Event() dropiModelChange: EventEmitter<SearchOption[]>;\n\n @Watch('dataToSearch')\n optionsChanged(val: SearchOption[] \| string) {\n this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val \|\| []);\n }\n\n componentWillLoad() {\n this.optionsChanged(this.dataToSearch);\n }\n\n private get filtered(): SearchOption[] {\n if (!this.textInput) return this.parsedOptions;\n const q = this.textInput.toLowerCase();\n return this.parsedOptions.filter(o => String(o[this.dataName] ?? '').toLowerCase().includes(q));\n }\n\n private handleInput(e: InputEvent) {\n this.textInput = (e.target as HTMLInputElement).value;\n this.open = this.parsedOptions.length > 0;\n this.dropiInput.emit(this.textInput);\n this.dropiChange.emit(this.textInput);\n }\n\n private handleKeyDown(e: KeyboardEvent) {\n if (e.key === 'Enter') this.dropiKeyEnter.emit(this.textInput);\n if (e.key === 'Escape') this.open = false;\n }\n\n private handleClear() {\n this.textInput = '';\n this.open = false;\n this.dropiClear.emit();\n this.dropiInput.emit('');\n }\n\n private isSelected(opt: SearchOption): boolean {\n return this.selected.some(s => s[this.dataName] === opt[this.dataName]);\n }\n\n private selectOption(opt: SearchOption) {\n if (this.multipleSelectModel) {\n if (this.isSelected(opt)) {\n this.selected = this.selected.filter(s => s[this.dataName] !== opt[this.dataName]);\n } else {\n this.selected = [...this.selected, opt];\n }\n } else {\n this.textInput = opt[this.dataName] ?? '';\n this.selected = [opt];\n this.open = false;\n }\n this.dropiModelChange.emit(this.selected);\n }\n\n render() {\n const showDropdown = this.open && this.parsedOptions.length > 0;\n\n return (\n <div class=\"search-wrap\">\n {this.label && <label class=\"search-label\">{this.label}</label>}\n\n <div class={`search-input-row search-input-row--${this.type}`}>\n {this.showIcon && <dropi-icon class=\"search-icon\" name=\"Search\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />}\n\n <input\n class=\"search-input\"\n type={this.typeInput}\n placeholder={this.placeholder}\n value={this.textInput}\n maxLength={this.maxLength}\n onInput={(e) => this.handleInput(e as InputEvent)}\n onKeyDown={(e) => this.handleKeyDown(e as KeyboardEvent)}\n onFocus={() => { if (this.parsedOptions.length) this.open = true; }}\n onBlur={() => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); }}\n />\n\n {this.showClear && this.textInput && (\n <button class=\"search-clear\" onClick={() => this.handleClear()} aria-label=\"Limpiar\">\n <dropi-icon name=\"Close-small\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />\n </button>\n )}\n </div>\n\n {showDropdown && (\n <div class={`search-dropdown search-dropdown--${this.position}`} style={{ '--dropdown-height': `${this.heightOverlay}px` } as any}>\n {this.filtered.length === 0 ? (\n <div class=\"search-no-results\">Sin resultados</div>\n ) : (\n this.filtered.map((opt, i) => (\n <div\n class={{ 'search-option': true, 'search-option--selected': this.isSelected(opt) }}\n key={i}\n onMouseDown={(e) => { e.preventDefault(); this.selectOption(opt); }}\n >\n {this.multipleSelectModel && <dropi-checkbox checked={this.isSelected(opt)} />}\n <span class=\"search-option__label\">{opt[this.dataName]}</span>\n </div>\n ))\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropi-search.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-search/dropi-search.css?tag=dropi-search&encapsulation=shadow","src/components/dropi-search/dropi-search.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n position: relative;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.search-label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 4px;\n}\n\n/ ── Input row ──────────────────────────────────────────── /\n.search-input-row {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.search-icon {\n position: absolute;\n left: 10px;\n pointer-events: none;\n z-index: 1;\n}\n\n.search-input {\n width: 100%;\n height: 40px;\n padding: 0 36px 0 34px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n outline: none;\n transition: border-color 0.2s;\n}\n\n.search-input:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n}\n\n.search-input::placeholder {\n color: var(--Gray-Gray-400, #858ea6);\n}\n\n.search-clear {\n position: absolute;\n right: 10px;\n display: flex;\n align-items: center;\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n z-index: 1;\n}\n\n/ ── Dropdown ───────────────────────────────────────────── /\n.search-dropdown {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n max-height: var(--dropdown-height, 240px);\n overflow-y: auto;\n background: var(--Neutral-White, #ffffff);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n z-index: 100;\n}\n\n.search-option {\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n padding: var(--Size-2, 8px) var(--Size-3, 12px);\n cursor: pointer;\n transition: background 0.15s;\n user-select: none;\n}\n\n.search-option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.search-option--selected {\n background: var(--Primary-Primary-50, #fff5eb);\n}\n\n.search-option__label {\n flex: 1;\n font-size: var(--font-size-s, 12px);\n color: var(--Gray-Gray-700, #32394d);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.search-no-results {\n padding: var(--Size-3, 12px);\n font-size: var(--font-size-s, 12px);\n color: var(--Gray-Gray-400, #858ea6);\n text-align: center;\n}\n","import { Component, Prop, State, Event, EventEmitter, Watch, h } from '@stencil/core';\n\nexport interface SearchOption {\n [key: string]: any;\n}\n\n/\n @component dropi-search\n * Text search input with optional dropdown results list.\n * Supports single and multi-select, keyboard navigation, and clear button.\n /\n@Component({\n tag: 'dropi-search',\n styleUrl: 'dropi-search.css',\n shadow: true,\n})\nexport class DropiSearch {\n /* Visual variant (matches Angular `type`) /\n @Prop() type: 'default' \| 'dropdown' \| 'dropdown-button' \| 'default-light' = 'default';\n /* Placeholder text /\n @Prop() placeholder: string = 'Search...';\n /* Controlled input value /\n @Prop({ mutable: true }) textInput: string = '';\n /* HTML input type: text \| number (matches Angular `typeInput`) /\n @Prop() typeInput: 'text' \| 'number' = 'text';\n /* Max character length /\n @Prop() maxLength: number;\n /* Show the search icon (matches Angular `showIcon`) /\n @Prop() showIcon: boolean = true;\n /* Show clear (×) button when input has text /\n @Prop() showClear: boolean = true;\n /* Data source to filter. Pass as array or JSON string /\n @Prop() dataToSearch: SearchOption[] \| string = [];\n /* Property name to display and search /\n @Prop() dataName: string = 'name';\n /* Dropdown open direction: down \| top (matches Angular `position`) /\n @Prop() position: 'down' \| 'top' = 'down';\n /* Allow multiple selection /\n @Prop() multipleSelectModel: boolean = true;\n /* Max height of dropdown (numeric value) /\n @Prop() heightOverlay: number = 230;\n /* Label shown above the input /\n @Prop() label: string = '';\n /* Controlled selected items array (matches Angular `model`) /\n @Prop({ mutable: true }) model: SearchOption[] \| string = [];\n\n @State() private open: boolean = false;\n @State() private selected: SearchOption[] = [];\n @State() private parsedOptions: SearchOption[] = [];\n\n /* Emitted on input change. e.detail = current text /\n @Event() dropiInput: EventEmitter<string>;\n /* Emitted on blur /\n @Event() dropiBlur: EventEmitter<void>;\n /* Emitted when Enter is pressed. e.detail = current text /\n @Event() dropiKeyEnter: EventEmitter<string>;\n /* Emitted on change event of the native input (matches Angular `onChange`) /\n @Event() dropiChange: EventEmitter<string>;\n /* Emitted when clear button clicked /\n @Event() dropiClear: EventEmitter<void>;\n /* Emitted when selection changes. e.detail = selected items */\n @Event() dropiModelChange: EventEmitter<SearchOption[]>;\n\n @Watch('dataToSearch')\n optionsChanged(val: SearchOption[] \| string) {\n this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val \|\| []);\n }\n\n componentWillLoad() {\n this.optionsChanged(this.dataToSearch);\n }\n\n private get filtered(): SearchOption[] {\n if (!this.textInput) return this.parsedOptions;\n const q = this.textInput.toLowerCase();\n return this.parsedOptions.filter(o => String(o[this.dataName] ?? '').toLowerCase().includes(q));\n }\n\n private handleInput(e: InputEvent) {\n this.textInput = (e.target as HTMLInputElement).value;\n this.open = this.parsedOptions.length > 0;\n this.dropiInput.emit(this.textInput);\n this.dropiChange.emit(this.textInput);\n }\n\n private handleKeyDown(e: KeyboardEvent) {\n if (e.key === 'Enter') this.dropiKeyEnter.emit(this.textInput);\n if (e.key === 'Escape') this.open = false;\n }\n\n private handleClear() {\n this.textInput = '';\n this.open = false;\n this.dropiClear.emit();\n this.dropiInput.emit('');\n }\n\n private isSelected(opt: SearchOption): boolean {\n return this.selected.some(s => s[this.dataName] === opt[this.dataName]);\n }\n\n private selectOption(opt: SearchOption) {\n if (this.multipleSelectModel) {\n if (this.isSelected(opt)) {\n this.selected = this.selected.filter(s => s[this.dataName] !== opt[this.dataName]);\n } else {\n this.selected = [...this.selected, opt];\n }\n } else {\n this.textInput = opt[this.dataName] ?? '';\n this.selected = [opt];\n this.open = false;\n }\n this.dropiModelChange.emit(this.selected);\n }\n\n render() {\n const showDropdown = this.open && this.parsedOptions.length > 0;\n\n return (\n <div class=\"search-wrap\">\n {this.label && <label class=\"search-label\">{this.label}</label>}\n\n <div class={`search-input-row search-input-row--${this.type}`}>\n {this.showIcon && <dropi-icon class=\"search-icon\" name=\"Search\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />}\n\n <input\n class=\"search-input\"\n type={this.typeInput}\n placeholder={this.placeholder}\n value={this.textInput}\n maxLength={this.maxLength}\n onInput={(e) => this.handleInput(e as InputEvent)}\n onKeyDown={(e) => this.handleKeyDown(e as KeyboardEvent)}\n onFocus={() => { if (this.parsedOptions.length) this.open = true; }}\n onBlur={() => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); }}\n />\n\n {this.showClear && this.textInput && (\n <button class=\"search-clear\" onClick={() => this.handleClear()} aria-label=\"Limpiar\">\n <dropi-icon name=\"Close-small\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />\n </button>\n )}\n </div>\n\n {showDropdown && (\n <div class={`search-dropdown search-dropdown--${this.position}`} style={{ '--dropdown-height': `${this.heightOverlay}px` } as any}>\n {this.filtered.length === 0 ? (\n <div class=\"search-no-results\">Sin resultados</div>\n ) : (\n this.filtered.map((opt, i) => (\n <div\n class={{ 'search-option': true, 'search-option--selected': this.isSelected(opt) }}\n key={i}\n onMouseDown={(e) => { e.preventDefault(); this.selectOption(opt); }}\n >\n {this.multipleSelectModel && <dropi-checkbox name=\"_search-option\" checked={this.isSelected(opt)} />}\n <span class=\"search-option__label\">{opt[this.dataName]}</span>\n </div>\n ))\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/dropi-ui/dropi-select.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, d as createEvent, a as getElement, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, a as getElement, h } from './index-CPacpXAJ.js';
 const dropiSelectCss = () => `:host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;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;transition:border-color 0.2s ease;gap:8px}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.select-button-error{border-color:var(--Error-Error-500, #f46a6b) !important}.no-border{border:none !important;color:var(--Gray-Gray-600, #475066);padding:var(--Size-4, 16px);background-color:transparent !important;gap:var(--Size-2, 8px)}.no-border:disabled{background-color:transparent !important}.button-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1;min-width:0}.elipsis{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-dropdown-overlay{position:fixed;max-height:250px;overflow-y:auto;list-style:none;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);margin:0;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);box-shadow:0px 8px 24px rgba(0, 0, 0, 0.12);z-index:var(--dropi-z-index-overlay, 11000);animation:dropdown-open 120ms ease-out}.select-dropdown-overlay.within-modal{position:absolute}@keyframes dropdown-open{from{opacity:0;transform:scaleY(0.95);transform-origin:top}to{opacity:1;transform:scaleY(1);transform-origin:top}}.option{box-sizing:border-box;width:100%;min-height:40px;border-radius:var(--Border-2, 8px);padding:var(--Size-3, 12px) 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:var(--Size-2, 8px);transition:background 0.15s ease}.option:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled,.disabled-option{opacity:0.5;cursor:not-allowed}.option.selected-option:not(.option-radio){background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-group-title{padding:var(--Size-3, 12px) var(--Size-4, 16px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Gray-Gray-500, #69738c);list-style:none}.option-group{padding-left:var(--Size-6, 32px)}.sticky-search{position:sticky;top:calc(-1 * var(--Size-4, 16px));background:var(--Neutral-White, #ffffff);z-index:10;margin:calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;padding:var(--Size-2, 8px) var(--Size-4, 16px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2);list-style:none}.search-wrapper{display:flex;align-items:center;gap:8px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);padding:6px 10px;background:var(--Neutral-White, #ffffff)}.search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.multi-checkbox{width:18px;height:18px;min-width:18px;border-radius:var(--Border-1, 4px);border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s, border-color 0.15s}.multi-checkbox.checked{background:var(--Primary-Primary-500, #f49a3d);border-color:var(--Primary-Primary-500, #f49a3d)}.option-radio{display:flex;align-items:center;gap:12px}.option-radio.selected-option{border-radius:var(--Border-2, 8px);background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-radio.selected-option .option-second-label{color:var(--Primary-Primary-500, #f49a3d)}.radio{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio.selected{border-color:var(--Primary-Primary-500, #f49a3d)}.circle{width:12px;height:12px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.labels-container{display:flex;justify-content:space-between;width:100%;min-width:0}.option-image{width:24px;height:24px;border-radius:60px;object-fit:cover;flex-shrink:0}.small-image{width:20px;height:20px}.option-image-fallback{width:24px;height:24px;border-radius:60px;background:var(--Primary-Primary-500, #f49a3d);color:white;font-size:13px;font-weight:var(--font-weight-bold);display:flex;justify-content:center;align-items:center;flex-shrink:0}.small-image.option-image-fallback{width:20px;height:20px}.option-second-label{color:var(--Gray-Gray-700, #32394d);font-weight:var(--font-weight-bold);white-space:nowrap}.flag-placeholder{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--Gray-Gray-500, #69738c);flex-shrink:0}.select-helper,.select-helper-error{display:flex;gap:var(--Size-1, 4px);align-items:center;margin-top:var(--Size-1, 4px)}.select-helper span{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.select-helper-error span{color:var(--Error-Error-500, #f46a6b);font-size:var(--font-size-xs, 10px)}.no-results{padding:var(--Size-3, 12px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 12px);list-style:none;text-align:center}`;
@@ -29,7 +29,7 @@ const DropiSelect = class {
     placeholder = 'Select';
     /** Array of SelectOption or SelectOptionGroup */
     options = [];
-    name = '';
+    name;
     disabled = false;
     hasError = false;
     errorText = '';
@@ -385,7 +385,7 @@ const DropiSelect = class {
         ]), !this.isGrouped && this.filteredOptions.map(opt => this.renderOption(opt)), this.filteredOptions.length === 0 && (h("li", { class: "no-results" }, "Sin resultados"))));
     }
     render() {
-        return (h("div", { key: 'f09113a288d45bb5519503bb78c41e236913c1eb', class: "custom-select" }, !this.dropdownType && this.label && (h("label", { key: 'c0b59763dc3529d7f9bb5597a2bea0d38070a07b', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && h("span", { key: '6c8a47bdfc216231ba72420298b3bc8deeeae435', class: "asterisk" }, " *"))), h("div", { key: '8ec45010af1252effe34bb69d3f40ea277459511', class: "dropdown-container" }, this.dropdownType && this.label && (h("div", { key: 'b3f7f9adacd57b091baac662fc7be6fcd847c3a4', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (h("div", { key: 'a4cce833b50b2bc62cb7142da420f81c0647e97e', class: "select-helper" }, h("span", { key: 'f69375abc2f66b5b1278895b8f313adabfa0f938' }, this.textHelper))), this.hasError && this.errorText && (h("div", { key: '6681bdbb705633d393adab09a889f3f1fb6fbe8a', class: "select-helper-error" }, h("dropi-icon", { key: '09521eeef2cf2a58cb74bea5bfae8a6d58d17682', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), h("span", { key: '807820bb0a474079627bf12c20f4a034896785cd' }, this.errorText))), this.renderDropdown()));
+        return (h("div", { key: '2ffb707c9b1ec87911291c4827e3cda0ccefcf03', class: "custom-select" }, !this.dropdownType && this.label && (h("label", { key: '0b6e64d4de57fef6ff81e81f41451da3dea7df6d', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && h("span", { key: '3edd33a38c8cc3a25935d4396b8d4a77e130be53', class: "asterisk" }, " *"))), h("div", { key: 'be30c67aa645ae4bdbdb13647308f3304fa7613e', class: "dropdown-container" }, this.dropdownType && this.label && (h("div", { key: 'a00fdc844f629744e621098a809578786c62d67a', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (h("div", { key: '831cf57d7ed507fe7ad8383ac3887a8455bf5552', class: "select-helper" }, h("span", { key: '1c631aaef6eda3249e21d0f743c7788b9af84b0c' }, this.textHelper))), this.hasError && this.errorText && (h("div", { key: '9fc5ece3a826027469a8f4ee6b3d530f45a2a81e', class: "select-helper-error" }, h("dropi-icon", { key: '5eb6a6da84bb42170c5cf002204dead37bcf756c', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), h("span", { key: '1e1dcdccdfe941c6a4e1926fcf976c177cb71617' }, this.errorText))), this.renderDropdown()));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {