@dropi/ui 0.1.21 → 0.1.23

package/dist/cjs/dropi-phone-input.cjs.entry.js

@@ -1,197 +0,0 @@
-'use strict';
-
-var index = require('./index-077kM98l.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:100}.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)}`;
-
-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 },
-];
-const DropiPhoneInput = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.ngModelChangeCod = index.createEvent(this, "ngModelChangeCod", 7);
-        this.ngModelChangePhone = index.createEvent(this, "ngModelChangePhone", 7);
-        this.verifiedField = index.createEvent(this, "verifiedField", 7);
-        this.onChangeSelect = index.createEvent(this, "onChangeSelect", 7);
-    }
-    get el() { return index.getElement(this); }
-    /** 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 (index.h("div", { key: '884ddc86a364c666e79c2e99501c607a5c332599', class: "phone-wrap" }, index.h("div", { key: 'e0b044ac41b640cddffe080c695b7fe2d4add574', class: "phone-input-container" }, index.h("div", { key: 'f9f8b6794fb73efff50e064550ce462e25bb4d51', class: "custom-select" }, index.h("button", { key: '564675d4b89d33cc7cba743f77b4d96f7f6afea3', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
-                if (!this.disabledInput)
-                    this.open = !this.open;
-            } }, index.h("span", { key: '884a8a6d688e9fae8bc62ace8ba1f870f3ebdedf', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, index.h("img", { key: '4c263356870f8d2aaaa84ffe5f1a1bff49f98e34', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), index.h("dropi-icon", { key: '589ff50ef5881a58586e9b08d9db3e0abcde5873', name: this.open ? 'Dropdown-up' : 'Dropdown-down', width: "14px", height: "14px", color: "Gray-Gray-500" })), index.h("ul", { key: 'fed2ed2efc5be49ebeb8fe8c36557914eff439c7', class: { 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open } }, COUNTRIES.map(option => (index.h("li", null, index.h("button", { type: "button", class: "option", onMouseDown: (e) => { e.preventDefault(); this.selectCountry(option); } }, index.h("img", { src: `https://flagsapi.com/${option.flag}/flat/24.png`, alt: option.flag }), option.code)))))), index.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 watchers() { return {
-        "codArea": [{
-                "codAreaChanged": 0
-            }],
-        "selectedOption": [{
-                "selectedOptionChanged": 0
-            }]
-    }; }
-};
-DropiPhoneInput.style = dropiPhoneInputCss();
-
-exports.dropi_phone_input = DropiPhoneInput;

package/dist/cjs/dropi-radio-button.cjs.entry.js

@@ -1,47 +0,0 @@
-'use strict';
-
-var index = require('./index-077kM98l.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}`;
-
-const DropiRadioButton = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.onChange = index.createEvent(this, "onChange", 7);
-    }
-    /** Label text displayed next to the radio */
-    label = '';
-    /** Input name (for grouping radio buttons) */
-    name = 'name';
-    /** Input id */
-    id = 'radioButton';
-    /** Whether this radio is selected */
-    checked = false;
-    /**
-     * Set to true to programmatically reset this radio to unchecked.
-     * Useful when the parent needs to clear a group.
-     */
-    resetTrigger = false;
-    /** Emitted when the radio is selected */
-    onChange;
-    onResetTrigger(val) {
-        if (val)
-            this.checked = false;
-    }
-    handleChange(e) {
-        this.checked = e.target.checked;
-        this.onChange.emit(e);
-    }
-    render() {
-        return (index.h("div", { key: '560f5edef6d0646d8797dfc3add17003ea847d0b', class: "dropi-radio-button" }, index.h("label", { key: 'aeb5159c64643485457ffe083bbeb78a97da8b50', htmlFor: this.id }, index.h("input", { key: '78ff657aee559c1230e2e16c01adfea0382e4979', id: this.id, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
-    }
-    static get formAssociated() { return true; }
-    static get watchers() { return {
-        "resetTrigger": [{
-                "onResetTrigger": 0
-            }]
-    }; }
-};
-DropiRadioButton.style = dropiRadioButtonCss();
-
-exports.dropi_radio_button = DropiRadioButton;

package/dist/cjs/dropi-radio-selection-list.cjs.entry.js

@@ -1,60 +0,0 @@
-'use strict';
-
-var index = require('./index-077kM98l.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)}`;
-
-const DropiRadioSelectionList = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.valueChange = index.createEvent(this, "valueChange", 7);
-        this.onSearch = index.createEvent(this, "onSearch", 7);
-    }
-    /** Options array or JSON string */
-    options = [];
-    /** Selected option id */
-    selectedOption = '';
-    /** Show search box */
-    showFilter = false;
-    /** Search placeholder */
-    filterPlaceholder = 'Search';
-    /** Show description even when option is not selected */
-    alwaysShowDescription = true;
-    /** Layout type */
-    typeLayout = 'default';
-    /** Delay before filtering (matches Angular `searchDelay`) */
-    searchDelay = 100;
-    filterText = '';
-    parsedOptions = [];
-    /** Emitted on selection change. e.detail = selected option id */
-    valueChange;
-    /** Emitted on search — matches Angular 'onSearch' */
-    onSearch;
-    optionsChanged(val) {
-        this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val || []);
-    }
-    componentWillLoad() { this.optionsChanged(this.options); }
-    get filtered() {
-        if (!this.filterText)
-            return this.parsedOptions;
-        const q = this.filterText.toLowerCase();
-        return this.parsedOptions.filter(o => o.name?.toLowerCase().includes(q));
-    }
-    render() {
-        return (index.h("div", { key: '25a4a4fcdb6915f6f09a33339adad159b49cba23', class: "rsl" }, this.showFilter && (index.h("div", { key: '5aa576318ea9f8b848728684aaef96f58e4fee7b', class: "rsl__search" }, index.h("dropi-icon", { key: '5c025e7a773ee5595e5beb86d337f5c0c9247c21', name: "Search", width: "16px", height: "16px", color: "Gray-Gray-400" }), index.h("input", { key: '794a9fdab94dc32b9af1ebb4bef9f5864ef0613c', class: "rsl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
-                this.filterText = e.target.value;
-                this.onSearch.emit({ searchValue: this.filterText, filteredOptions: this.filtered });
-            } }))), index.h("div", { key: 'bd450fdec58e77782d5617f6225870d4dbb38d9c', class: "rsl__list" }, this.filtered.map(opt => {
-            const isSelected = opt.id === this.selectedOption;
-            return (index.h("div", { class: { 'rsl__item': true, 'rsl__item--selected': isSelected }, key: opt.id, onClick: () => { this.selectedOption = opt.id; this.valueChange.emit(opt.id); } }, index.h("div", { class: { 'rsl__radio': true, 'rsl__radio--checked': isSelected } }, isSelected && index.h("div", { class: "rsl__radio-dot" })), index.h("div", { class: "rsl__content" }, index.h("span", { class: "rsl__name" }, opt.name), (isSelected || this.alwaysShowDescription) && opt.description && (index.h("span", { class: "rsl__desc" }, opt.description)))));
-        }))));
-    }
-    static get watchers() { return {
-        "options": [{
-                "optionsChanged": 0
-            }]
-    }; }
-};
-DropiRadioSelectionList.style = dropiRadioSelectionListCss();
-
-exports.dropi_radio_selection_list = DropiRadioSelectionList;

package/dist/cjs/dropi-read-more.cjs.entry.js

@@ -1,40 +0,0 @@
-'use strict';
-
-var index = require('./index-077kM98l.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)}`;
-
-const DropiReadMore = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    /** Full text to display */
-    text = '';
-    /** Maximum number of words before truncating */
-    maxWords = 20;
-    /** Allow collapsing back after expanding */
-    showSeeLess = true;
-    /** Inline CSS string applied to the text element (matches Angular `textStyle`) */
-    textStyle = '';
-    /** Inline CSS string applied to the toggle button (matches Angular `buttonStyle`) */
-    buttonStyle = '';
-    expanded = false;
-    get words() {
-        return (this.text || '').split(/\s+/).filter(Boolean);
-    }
-    get needsTruncation() {
-        return this.words.length > this.maxWords;
-    }
-    get displayText() {
-        if (!this.needsTruncation || this.expanded)
-            return this.text;
-        return this.words.slice(0, this.maxWords).join(' ');
-    }
-    render() {
-        const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);
-        return (index.h("div", { key: 'ae43f258e0254cc03f87436486b0bfecc55bc23c', class: "read-more" }, index.h("p", { key: '7b56af2b2bd8e068bb28bfd0e5184da9e7abafd2', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (index.h("button", { key: 'd1a0a8eae3431c35b9bac8cfb9b47102f18cf2f0', 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();
-
-exports.dropi_read_more = DropiReadMore;

package/dist/cjs/dropi-search.cjs.entry.js

@@ -1,124 +0,0 @@
-'use strict';
-
-var index = require('./index-077kM98l.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}`;
-
-const DropiSearch = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.onInput = index.createEvent(this, "onInput", 7);
-        this.onBlur = index.createEvent(this, "onBlur", 7);
-        this.onKeyEnter = index.createEvent(this, "onKeyEnter", 7);
-        this.onChange = index.createEvent(this, "onChange", 7);
-        this.onClear = index.createEvent(this, "onClear", 7);
-        this.modelChange = index.createEvent(this, "modelChange", 7);
-    }
-    /** Visual variant (matches Angular `type`) */
-    type = 'default';
-    /** Placeholder text */
-    placeholder = 'Search...';
-    /** Controlled input value */
-    textInput = '';
-    /** HTML input type: text | number (matches Angular `typeInput`) */
-    typeInput = 'text';
-    /** Max character length */
-    maxLength;
-    /** Show the search icon (matches Angular `showIcon`) */
-    showIcon = true;
-    /** Show clear (×) button when input has text */
-    showClear = true;
-    /** Data source to filter. Pass as array or JSON string */
-    dataToSearch = [];
-    /** Property name to display and search */
-    dataName = 'name';
-    /** Dropdown open direction: down | top (matches Angular `position`) */
-    position = 'down';
-    /** Allow multiple selection */
-    multipleSelectModel = true;
-    /** Max height of dropdown (numeric value) */
-    heightOverlay = 230;
-    /** Label shown above the input */
-    label = '';
-    /** Controlled selected items array (matches Angular `model`) */
-    model = [];
-    open = false;
-    selected = [];
-    parsedOptions = [];
-    /** Emitted on input change. e.detail = current text */
-    onInput;
-    /** Emitted on blur */
-    onBlur;
-    /** Emitted when Enter is pressed. e.detail = current text */
-    onKeyEnter;
-    /** Emitted on change event of the native input (matches Angular `onChange`) */
-    onChange;
-    /** Emitted when clear button clicked */
-    onClear;
-    /** Emitted when selection changes. e.detail = selected items */
-    modelChange;
-    optionsChanged(val) {
-        this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val || []);
-    }
-    componentWillLoad() {
-        this.optionsChanged(this.dataToSearch);
-    }
-    get filtered() {
-        if (!this.textInput)
-            return this.parsedOptions;
-        const q = this.textInput.toLowerCase();
-        return this.parsedOptions.filter(o => String(o[this.dataName] ?? '').toLowerCase().includes(q));
-    }
-    handleInput(e) {
-        this.textInput = e.target.value;
-        this.open = this.parsedOptions.length > 0;
-        this.onInput.emit(this.textInput);
-        this.onChange.emit(this.textInput);
-    }
-    handleKeyDown(e) {
-        if (e.key === 'Enter')
-            this.onKeyEnter.emit(this.textInput);
-        if (e.key === 'Escape')
-            this.open = false;
-    }
-    handleClear() {
-        this.textInput = '';
-        this.open = false;
-        this.onClear.emit();
-        this.onInput.emit('');
-    }
-    isSelected(opt) {
-        return this.selected.some(s => s[this.dataName] === opt[this.dataName]);
-    }
-    selectOption(opt) {
-        if (this.multipleSelectModel) {
-            if (this.isSelected(opt)) {
-                this.selected = this.selected.filter(s => s[this.dataName] !== opt[this.dataName]);
-            }
-            else {
-                this.selected = [...this.selected, opt];
-            }
-        }
-        else {
-            this.textInput = opt[this.dataName] ?? '';
-            this.selected = [opt];
-            this.open = false;
-        }
-        this.modelChange.emit(this.selected);
-    }
-    render() {
-        const showDropdown = this.open && this.parsedOptions.length > 0;
-        return (index.h("div", { key: '3a191ce6fcdede699dcc707411c4f901a4c16e49', class: "search-wrap" }, this.label && index.h("label", { key: '41049aa159d5bdb89d07b94821bbfe41bb12c2c7', class: "search-label" }, this.label), index.h("div", { key: 'fba00db1ed11f78cefc0a12ca4d3be780989a48e', class: `search-input-row search-input-row--${this.type}` }, this.showIcon && index.h("dropi-icon", { key: '7b9d9a9c91eb88161492e4fb8f0c87e89c0f24cb', class: "search-icon", name: "Search", width: "16px", height: "16px", color: "Gray-Gray-400" }), index.h("input", { key: '0340848a8c7cdb336fca7e70a863b83a8e8e31ef', 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.onBlur.emit(); } }), this.showClear && this.textInput && (index.h("button", { key: '80b5c05828f5f67c861b2f05db4e11f3282c995c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, index.h("dropi-icon", { key: 'b83d1998021e65431225e73d1edd0388e01b07ce', name: "Close-small", width: "16px", height: "16px", color: "Gray-Gray-400" })))), showDropdown && (index.h("div", { key: '1800618fb2f8f2a47c9a8ddbb9c9649c254a03d2', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (index.h("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (index.h("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && index.h("dropi-checkbox", { checked: this.isSelected(opt) }), index.h("span", { class: "search-option__label" }, opt[this.dataName])))))))));
-    }
-    static get watchers() { return {
-        "dataToSearch": [{
-                "optionsChanged": 0
-            }]
-    }; }
-};
-DropiSearch.style = dropiSearchCss();
-
-exports.dropi_search = DropiSearch;