@dropi/ui 0.1.22 → 0.1.23

package/dist/cjs/dropi-country-selector.cjs.entry.js

@@ -1,197 +0,0 @@
-'use strict';
-
-var index = require('./index-C8kwDvpf.js');
-
-const dropiCountrySelectorCss = () => `:host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}label{display:block;font-size:var(--font-size-xs, 11px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:6px}.required{color:var(--Error-Error-500, #ef4444);margin-left:2px}.select-button{width:100%;height:44px;padding:0 12px;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, 14px);font-family:inherit;display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.15s ease}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #3b82f6)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-button.select-completed{color:var(--Gray-Gray-700, #32394d)}.select-button.select-invalid{border-color:var(--Error-Error-500, #ef4444)}.selected-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1}.selected-option{display:flex;align-items:center;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 14px)}.placeholder-text{color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 14px)}.flag-img{border-radius:var(--Border-1, 4px);width:24px;height:24px;object-fit:cover;flex-shrink:0}.select-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);z-index:200;list-style:none;padding:0;margin:0;box-shadow:0 8px 24px rgba(0, 0, 0, 0.10);overflow:hidden;transition:max-height 0.2s ease, opacity 0.2s ease}.select-dropdown.expanded{max-height:300px;opacity:1;overflow-y:auto}.select-dropdown.collapsed{max-height:0;opacity:0;pointer-events:none;border-color:transparent;box-shadow:none}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-track{background:transparent}.select-dropdown::-webkit-scrollbar-thumb{background:var(--Gray-Gray-200, #c3c9d9);border-radius:4px}.select-dropdown::-webkit-scrollbar-thumb:hover{background:var(--Gray-Gray-300, #a3abbf)}.search-li{padding:10px 12px;position:sticky;top:0;background:var(--Neutral-White, #ffffff);z-index:1;border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.search-field{position:relative;display:flex;align-items:center}.country-search{width:100%;height:36px;padding:0 36px 0 12px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);outline:none;font-size:var(--font-size-s, 14px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:var(--Gray-Gray-50, #f7f8fa);transition:border-color 0.15s, background 0.15s}.country-search:focus{border-color:var(--Info-Info-500, #50a5f1);background:var(--Neutral-White, #ffffff)}.country-search::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-icon{position:absolute;right:10px;display:flex;align-items:center;pointer-events:none}.option{width:100%;min-height:44px;padding:10px 16px;border:none;background:transparent;text-align:left;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 14px);font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:10px;transition:background 0.1s ease;white-space:nowrap}.option:hover{background:var(--Gray-Gray-50, #f7f8fa)}`;
-
-const COUNTRIES = [
-    { name: 'Afghanistan', code: 'AF', codePhone: '93' },
-    { name: 'Albania', code: 'AL', codePhone: '355' },
-    { name: 'Algeria', code: 'DZ', codePhone: '213' },
-    { name: 'Argentina', code: 'AR', codePhone: '54' },
-    { name: 'Australia', code: 'AU', codePhone: '61' },
-    { name: 'Austria', code: 'AT', codePhone: '43' },
-    { name: 'Azerbaijan', code: 'AZ', codePhone: '994' },
-    { name: 'Bahamas', code: 'BS', codePhone: '1242' },
-    { name: 'Bahrain', code: 'BH', codePhone: '973' },
-    { name: 'Bangladesh', code: 'BD', codePhone: '880' },
-    { name: 'Belgium', code: 'BE', codePhone: '32' },
-    { name: 'Bolivia', code: 'BO', codePhone: '591' },
-    { name: 'Brazil', code: 'BR', codePhone: '55' },
-    { name: 'Cambodia', code: 'KH', codePhone: '855' },
-    { name: 'Canada', code: 'CA', codePhone: '1' },
-    { name: 'Chile', code: 'CL', codePhone: '56' },
-    { name: 'China', code: 'CN', codePhone: '86' },
-    { name: 'Colombia', code: 'CO', codePhone: '57' },
-    { name: 'Costa Rica', code: 'CR', codePhone: '506' },
-    { name: 'Cuba', code: 'CU', codePhone: '53' },
-    { name: 'Czech Republic', code: 'CZ', codePhone: '420' },
-    { name: 'Denmark', code: 'DK', codePhone: '45' },
-    { name: 'Dominican Republic', code: 'DO', codePhone: '1' },
-    { name: 'Ecuador', code: 'EC', codePhone: '593' },
-    { name: 'Egypt', code: 'EG', codePhone: '20' },
-    { name: 'El Salvador', code: 'SV', codePhone: '503' },
-    { name: 'Estonia', code: 'EE', codePhone: '372' },
-    { name: 'Ethiopia', code: 'ET', codePhone: '251' },
-    { name: 'Finland', code: 'FI', codePhone: '358' },
-    { name: 'France', code: 'FR', codePhone: '33' },
-    { name: 'Germany', code: 'DE', codePhone: '49' },
-    { name: 'Ghana', code: 'GH', codePhone: '233' },
-    { name: 'Greece', code: 'GR', codePhone: '30' },
-    { name: 'Guatemala', code: 'GT', codePhone: '502' },
-    { name: 'Honduras', code: 'HN', codePhone: '504' },
-    { name: 'Hong Kong', code: 'HK', codePhone: '852' },
-    { name: 'Hungary', code: 'HU', codePhone: '36' },
-    { name: 'India', code: 'IN', codePhone: '91' },
-    { name: 'Indonesia', code: 'ID', codePhone: '62' },
-    { name: 'Iran, Islamic Republic Of', code: 'IR', codePhone: '98' },
-    { name: 'Iraq', code: 'IQ', codePhone: '964' },
-    { name: 'Ireland', code: 'IE', codePhone: '353' },
-    { name: 'Israel', code: 'IL', codePhone: '972' },
-    { name: 'Italy', code: 'IT', codePhone: '39' },
-    { name: 'Jamaica', code: 'JM', codePhone: '1876' },
-    { name: 'Japan', code: 'JP', codePhone: '81' },
-    { name: 'Jordan', code: 'JO', codePhone: '962' },
-    { name: 'Kazakhstan', code: 'KZ', codePhone: '7' },
-    { name: 'Kenya', code: 'KE', codePhone: '254' },
-    { name: 'Kuwait', code: 'KW', codePhone: '965' },
-    { name: 'Lebanon', code: 'LB', codePhone: '961' },
-    { name: 'Malaysia', code: 'MY', codePhone: '60' },
-    { name: 'Mexico', code: 'MX', codePhone: '52' },
-    { name: 'Morocco', code: 'MA', codePhone: '212' },
-    { name: 'Netherlands', code: 'NL', codePhone: '31' },
-    { name: 'New Zealand', code: 'NZ', codePhone: '64' },
-    { name: 'Nicaragua', code: 'NI', codePhone: '505' },
-    { name: 'Nigeria', code: 'NG', codePhone: '234' },
-    { name: 'Norway', code: 'NO', codePhone: '47' },
-    { name: 'Pakistan', code: 'PK', codePhone: '92' },
-    { name: 'Panama', code: 'PA', codePhone: '507' },
-    { name: 'Paraguay', code: 'PY', codePhone: '595' },
-    { name: 'Peru', code: 'PE', codePhone: '51' },
-    { name: 'Philippines', code: 'PH', codePhone: '63' },
-    { name: 'Poland', code: 'PL', codePhone: '48' },
-    { name: 'Portugal', code: 'PT', codePhone: '351' },
-    { name: 'Qatar', code: 'QA', codePhone: '974' },
-    { name: 'Romania', code: 'RO', codePhone: '40' },
-    { name: 'Russian Federation', code: 'RU', codePhone: '7' },
-    { name: 'Saudi Arabia', code: 'SA', codePhone: '966' },
-    { name: 'Singapore', code: 'SG', codePhone: '65' },
-    { name: 'South Africa', code: 'ZA', codePhone: '27' },
-    { name: 'Spain', code: 'ES', codePhone: '34' },
-    { name: 'Sri Lanka', code: 'LK', codePhone: '94' },
-    { name: 'Sweden', code: 'SE', codePhone: '46' },
-    { name: 'Switzerland', code: 'CH', codePhone: '41' },
-    { name: 'Taiwan, Province of China', code: 'TW', codePhone: '886' },
-    { name: 'Thailand', code: 'TH', codePhone: '66' },
-    { name: 'Tunisia', code: 'TN', codePhone: '216' },
-    { name: 'Turkey', code: 'TR', codePhone: '90' },
-    { name: 'Uganda', code: 'UG', codePhone: '256' },
-    { name: 'Ukraine', code: 'UA', codePhone: '380' },
-    { name: 'United Arab Emirates', code: 'AE', codePhone: '971' },
-    { name: 'United Kingdom', code: 'GB', codePhone: '44' },
-    { name: 'United States', code: 'US', codePhone: '1' },
-    { name: 'Uruguay', code: 'UY', codePhone: '598' },
-    { name: 'Venezuela', code: 'VE', codePhone: '58' },
-    { name: 'Viet Nam', code: 'VN', codePhone: '84' },
-    { name: 'Zimbabwe', code: 'ZW', codePhone: '263' },
-];
-const DropiCountrySelector = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.onChangeSelect = index.createEvent(this, "onChangeSelect", 7);
-    }
-    /** Label above the select */
-    label = '';
-    /** Placeholder when nothing is selected */
-    placeholder = 'Selecciona un país';
-    /** Pre-selected country code (ISO 3166-1 alpha-2) */
-    currentSelection = '';
-    /** Whether the selector is disabled */
-    disabled = false;
-    /** Show asterisk for required field */
-    showObligatory = false;
-    /** Show error border */
-    hasError = false;
-    /** Helper text below the select */
-    textHelper = '';
-    /** Search term for filtering (matches Angular `searchTerm`) */
-    searchTerm = '';
-    /**
-     * Convenience object prop — matches Angular `selectProperties: SelectProperties`.
-     * When provided, its non-null fields override individual props.
-     */
-    selectProperties = null;
-    /** Emitted when a country is selected. Detail is the CountryItem. */
-    onChangeSelect;
-    isOpen = false;
-    selected = null;
-    get el() { return index.getElement(this); }
-    handleDocClick(e) {
-        if (this.isOpen && !e.composedPath().includes(this.el)) {
-            this.isOpen = false;
-        }
-    }
-    searchInputRef;
-    currentSelectionChanged(val) {
-        this.selected = COUNTRIES.find(c => c.code === val) || null;
-    }
-    selectPropertiesChanged(val) {
-        if (!val)
-            return;
-        if (val.label !== undefined)
-            this.label = val.label;
-        if (val.placeholder !== undefined)
-            this.placeholder = val.placeholder;
-        if (val.showObligatory !== undefined)
-            this.showObligatory = val.showObligatory;
-        if (val.textHelper !== undefined)
-            this.textHelper = val.textHelper;
-        if (val.hasError !== undefined)
-            this.hasError = val.hasError;
-    }
-    componentWillLoad() {
-        if (this.selectProperties)
-            this.selectPropertiesChanged(this.selectProperties);
-        if (this.currentSelection)
-            this.currentSelectionChanged(this.currentSelection);
-    }
-    get filtered() {
-        if (!this.searchTerm)
-            return COUNTRIES;
-        const t = this.searchTerm.toLowerCase();
-        return COUNTRIES.filter(c => c.name.toLowerCase().includes(t));
-    }
-    open() {
-        if (this.disabled)
-            return;
-        this.isOpen = !this.isOpen;
-        if (this.isOpen) {
-            setTimeout(() => this.searchInputRef?.focus(), 50);
-        }
-    }
-    select(country) {
-        this.selected = country;
-        this.isOpen = false;
-        this.searchTerm = '';
-        this.currentSelection = country.code;
-        this.onChangeSelect.emit(country);
-    }
-    render() {
-        return (index.h("div", { key: '78179f7b5e30c4eb7d5345431f476f625a60534a', class: "custom-select" }, this.label && (index.h("label", { key: '13566e714a55c3820facffab298a97fc37c97133' }, this.label, this.showObligatory && index.h("span", { key: '7772ddd762bd50da043ed030b5a3442e10de47b0', class: "required" }, "*"))), index.h("button", { key: '649759c1d921318a48fd1abf8e71977d52b6ae2d', type: "button", class: {
-                'select-button': true,
-                'select-completed': !!this.selected,
-                'select-invalid': this.hasError,
-            }, disabled: this.disabled, onClick: () => this.open() }, index.h("div", { key: '79df14d64f598d312a1cd82f294edf8aa14ed32e', class: "selected-content" }, this.selected ? (index.h("span", { class: "selected-option" }, index.h("img", { class: "flag-img", src: `https://flagsapi.com/${this.selected.code}/shiny/24.png`, alt: this.selected.name }), this.selected.name)) : (index.h("span", { class: "placeholder-text" }, this.placeholder))), index.h("dropi-icon", { key: 'dfa717ce51975386fab6a3af796637a27a8cb039', name: this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2', width: "20px", height: "20px", color: "Gray-Gray-500" })), index.h("ul", { key: '4f72db336c9d1bc1ce149279970cdaa4dcaa4f77', class: `select-dropdown${this.isOpen ? ' expanded' : ' collapsed'}` }, index.h("li", { key: '3badbda75f609e979f5edf7ad3f5783bf9cdf001', class: "search-li" }, index.h("div", { key: 'cae7ee12d3d3d40a3bb9728f4c109cd0ba513995', class: "search-field" }, index.h("input", { key: '82b7703b0531c80d51b5fb70d3e2f0b804e3089f', ref: (el) => { this.searchInputRef = el; }, type: "text", class: "country-search", placeholder: "Buscar pa\u00EDs...", value: this.searchTerm, onInput: (e) => { this.searchTerm = e.target.value; } }), index.h("span", { key: '45378fac8b73b656fc8c5bb16d7f072398890508', class: "search-icon" }, index.h("dropi-icon", { key: '39c3a426407fd68367a3494c3d319bdbcf9692bb', name: "Search", width: "16px", height: "16px", color: "Gray-Gray-400" })))), this.filtered.map(country => (index.h("li", { key: country.code }, index.h("button", { class: "option", type: "button", onClick: () => this.select(country) }, index.h("img", { class: "flag-img", src: `https://flagsapi.com/${country.code}/shiny/24.png`, alt: country.name }), country.name))))), this.textHelper && (index.h("div", { key: '58f747d7cfecd23d3bdc166f21c3560e642f336d', class: { 'select-helper': true, 'select-helper-error': this.hasError } }, this.hasError && index.h("dropi-icon", { key: 'fb68e291bd8dcfe5955281504b3de80699fa0ff0', name: "Warning-circle", width: "12px", height: "12px", color: "Error-Error-500" }), index.h("span", { key: '9d5287f387f09f2b90b41f14f05c3572a44d74a3' }, this.textHelper)))));
-    }
-    static get watchers() { return {
-        "currentSelection": [{
-                "currentSelectionChanged": 0
-            }],
-        "selectProperties": [{
-                "selectPropertiesChanged": 0
-            }]
-    }; }
-};
-DropiCountrySelector.style = dropiCountrySelectorCss();
-
-exports.dropi_country_selector = DropiCountrySelector;

package/dist/cjs/dropi-date-picker-range.cjs.entry.js

@@ -1,115 +0,0 @@
-'use strict';
-
-var index = require('./index-C8kwDvpf.js');
-
-const dropiDatePickerRangeCss = () => `:host{display:block;width:100%;max-width:380px}*,*::before,*::after{box-sizing:border-box}.date-picker-range{width:100%;font-family:inherit}.label{font-size:11px;font-weight:var(--font-weight-medium);color:#7b8190;margin-bottom:8px}.inputs-row{display:flex;align-items:flex-end;gap:8px}.input-group{flex:1;display:flex;flex-direction:column;gap:4px}.input-label{font-size:var(--font-size-xs, 11px);color:var(--Gray-Gray-500, #69738c);font-weight:var(--font-weight-medium, 500)}.date-input{width:100%;height:40px;padding:0 10px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-600, #475066);font-size:13px;font-family:inherit;outline:none;cursor:pointer;transition:border-color 0.15s ease}.date-input:focus{border-color:var(--Primary-Primary-500, #f49a3d)}.separator{padding-bottom:8px;color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-m)}.shortcuts{display:flex;flex-direction:column;gap:2px;margin-top:10px;border-left:1px solid var(--Gray-Gray-100, #e6eaf2);padding-left:10px}.shortcut-btn{background:transparent;border:none;padding:4px 6px;font-size:13px;font-family:inherit;color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:5px;transition:background 0.1s ease;font-weight:var(--font-weight-regular)}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn.active{background:var(--Gray-Gray-50, #f5f6f8);font-weight:var(--font-weight-semibold)}.warning-box{margin-top:8px;padding:4px 8px;border:1px solid var(--Warning-Warning-400);border-radius:4px;background:var(--Warning-Warning-50)}.warning-message{color:#495057;font-size:var(--font-size-xxs);line-height:16px}@keyframes shimmer{0%{background-position:-468px 0}100%{background-position:468px 0}}.skeleton{height:40px;width:100%;min-width:180px;border-radius:6px;animation:shimmer 1s linear infinite;background:linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);background-size:800px 104px}@media screen and (max-width: 480px){.inputs-row{flex-direction:column}.separator{display:none}.shortcuts{flex-direction:row;flex-wrap:wrap;border-left:none;padding-left:0;border-top:1px solid var(--Gray-Gray-100, #e6eaf2);padding-top:8px}}`;
-
-const DropiDatePickerRange = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.startDateChange = index.createEvent(this, "startDateChange", 7);
-        this.endDateChange = index.createEvent(this, "endDateChange", 7);
-        this.dropiRangeChange = index.createEvent(this, "dropiRangeChange", 7);
-    }
-    /** Start date (YYYY-MM-DD) */
-    startDate = '';
-    /** End date (YYYY-MM-DD) */
-    endDate = '';
-    /** Show "Rango de fechas" label */
-    showLabel = true;
-    /** Input placeholder */
-    placeholder = '';
-    /** Show loading skeleton */
-    loading = false;
-    /** Max allowed range in days (0 = unlimited) */
-    maxDaysRange = 0;
-    /** Hide "Hoy" shortcut */
-    hideTodayRangeShortcut = false;
-    /** Emitted when start date changes */
-    startDateChange;
-    /** Emitted when end date changes */
-    endDateChange;
-    /** Emitted with full range when both dates are set */
-    dropiRangeChange;
-    start = '';
-    end = '';
-    activeRange = -1;
-    showWarning = false;
-    onStartPropChange(val) { this.start = val; }
-    onEndPropChange(val) { this.end = val; }
-    componentWillLoad() {
-        this.start = this.startDate;
-        this.end = this.endDate;
-    }
-    get today() {
-        return new Date().toISOString().split('T')[0];
-    }
-    daysAgo(n) {
-        const d = new Date();
-        d.setDate(d.getDate() - n);
-        return d.toISOString().split('T')[0];
-    }
-    get shortcuts() {
-        const all = [
-            { label: 'Hoy', start: this.today, end: this.today },
-            { label: 'Últimos 7 días', start: this.daysAgo(6), end: this.today },
-            { label: 'Últimos 15 días', start: this.daysAgo(14), end: this.today },
-            { label: 'Últimos 30 días', start: this.daysAgo(29), end: this.today },
-            { label: 'Últimos 90 días', start: this.daysAgo(89), end: this.today },
-        ];
-        return this.hideTodayRangeShortcut ? all.slice(1) : all;
-    }
-    selectShortcut(idx) {
-        const s = this.shortcuts[idx];
-        this.start = s.start;
-        this.end = s.end;
-        this.activeRange = idx;
-        this.showWarning = false;
-        this.emit();
-    }
-    onStartChange(e) {
-        this.start = e.target.value;
-        this.activeRange = -1;
-        this.checkRange();
-        if (this.start && this.end)
-            this.emit();
-    }
-    onEndChange(e) {
-        this.end = e.target.value;
-        this.activeRange = -1;
-        this.checkRange();
-        if (this.start && this.end)
-            this.emit();
-    }
-    checkRange() {
-        if (this.start && this.end && this.maxDaysRange > 0) {
-            const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;
-            this.showWarning = diff > this.maxDaysRange;
-        }
-        else {
-            this.showWarning = false;
-        }
-    }
-    emit() {
-        this.startDateChange.emit(this.start);
-        this.endDateChange.emit(this.end);
-        this.dropiRangeChange.emit({ start: this.start, end: this.end });
-    }
-    render() {
-        if (this.loading) {
-            return index.h("div", { class: "skeleton" });
-        }
-        return (index.h("div", { class: "date-picker-range" }, this.showLabel && index.h("div", { class: "label" }, "Rango de fechas"), index.h("div", { class: "inputs-row" }, index.h("div", { class: "input-group" }, index.h("label", { class: "input-label" }, "Desde"), index.h("input", { type: "date", class: "date-input", value: this.start, max: this.end || this.today, onChange: (e) => this.onStartChange(e) })), index.h("span", { class: "separator" }, "\u2014"), index.h("div", { class: "input-group" }, index.h("label", { class: "input-label" }, "Hasta"), index.h("input", { type: "date", class: "date-input", value: this.end, min: this.start, max: this.today, onChange: (e) => this.onEndChange(e) }))), index.h("div", { class: "shortcuts" }, this.shortcuts.map((s, i) => (index.h("button", { key: i, class: `shortcut-btn${this.activeRange === i ? ' active' : ''}`, onClick: () => this.selectShortcut(i) }, s.label)))), this.showWarning && (index.h("div", { class: "warning-box" }, index.h("span", { class: "warning-message" }, "Solo puedes filtrar en un rango m\u00E1ximo de ", this.maxDaysRange, " d\u00EDas.")))));
-    }
-    static get watchers() { return {
-        "startDate": [{
-                "onStartPropChange": 0
-            }],
-        "endDate": [{
-                "onEndPropChange": 0
-            }]
-    }; }
-};
-DropiDatePickerRange.style = dropiDatePickerRangeCss();
-
-exports.dropi_date_picker_range = DropiDatePickerRange;

package/dist/cjs/dropi-date-picker.cjs.entry.js

@@ -1,223 +0,0 @@
-'use strict';
-
-var index = require('./index-C8kwDvpf.js');
-
-const dropiDatePickerCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.dp-label{display:block;font-size:var(--font-size-xxs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.dp-trigger{width:100%;height:44px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:inherit;transition:border-color 0.2s}.dp-trigger:hover:not(:disabled){border-color:var(--Info-Info-500, #50a5f1)}.dp-trigger--disabled{background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed;opacity:0.6}.dp-trigger__value{flex:1;text-align:left;font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-700, #32394d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dp-trigger__placeholder{color:var(--Gray-Gray-400, #858ea6)}.dp-popup{position:absolute;top:calc(100% + 8px);left:0;width:320px;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-3, 12px);box-shadow:0 4px 16px rgba(0,0,0,0.08);z-index:300;padding:var(--Size-4, 16px)}.dp-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--Size-4, 16px)}.dp-nav__btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:background 0.15s}.dp-nav__btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-nav__title{font-size:var(--font-size-s, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);display:flex;gap:8px}.dp-grid{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:8px;column-gap:4px}.dp-day-header{font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);text-align:center;padding:8px 0;font-weight:var(--font-weight-bold, 700)}.dp-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 12px);font-family:inherit;border:none;cursor:pointer;background:transparent;color:var(--Gray-Gray-600, #475066);width:100%;position:relative;z-index:1;padding:0}.dp-cell::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;transition:all 0.2s;z-index:-1;background:transparent}.dp-cell::before{content:"";position:absolute;top:0;bottom:0;z-index:-2;border-radius:0;background:transparent}.dp-cell:hover:not(:disabled)::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--other-month{color:var(--Gray-Gray-300, #a0a9c0)}.dp-cell--today{font-weight:var(--font-weight-bold, 700)}.dp-cell--today::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--selected{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--selected::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--range-start,.dp-cell--range-end{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--range-start::after,.dp-cell--range-end::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--in-range{color:var(--Orange-orange-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.dp-cell--in-range::before{left:-2px;right:-2px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start::before{left:50%;right:-2px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-end::before{left:-2px;right:50%;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start.dp-cell--range-end::before{background:transparent}.dp-cell--disabled{opacity:0.35;cursor:not-allowed}.dp-footer{display:flex;justify-content:space-between;margin-top:var(--Size-3, 12px);border-top:1px solid var(--Gray-Gray-100, #e6eaf2);padding-top:var(--Size-2, 8px)}.dp-footer__clear,.dp-footer__today{background:none;border:none;padding:4px 8px;font-size:var(--font-size-xxs, 10px);font-family:inherit;cursor:pointer;border-radius:var(--Border-1, 4px);transition:background 0.15s}.dp-footer__clear{color:var(--Gray-Gray-500, #69738c)}.dp-footer__today{color:var(--Orange-orange-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.dp-footer__clear:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-footer__today:hover{background:var(--Orange-orange-50, #fef5ec)}`;
-
-const MONTHS_ES = [
-    'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
-    'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'
-];
-const DAYS_ES = ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'];
-const DropiDatePicker = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.onChangeDate = index.createEvent(this, "onChangeDate", 7);
-        this.onClosePanel = index.createEvent(this, "onClosePanel", 7);
-        this.dropiRangeChange = index.createEvent(this, "dropiRangeChange", 7);
-    }
-    /** Selected date (ISO string, single mode) - matches Angular 'selectedDate' */
-    selectedDate = '';
-    /** Range start date (ISO string, range mode) */
-    startDate = '';
-    /** Range end date (ISO string, range mode) */
-    endDate = '';
-    /** Enable range selection - matches Angular selectionMode */
-    selectionMode = 'single';
-    /** Min selectable date (ISO string) */
-    minDate = '';
-    /** Max selectable date (ISO string) */
-    maxDate = '';
-    /** Label */
-    label = null;
-    /** Placeholder */
-    placeholder = 'DD/MM/YYYY';
-    /** Disabled */
-    disabled = false;
-    /** Is invalid state - matches Angular */
-    isInvalid = false;
-    /** Loading state - matches Angular */
-    loading = false;
-    open = false;
-    viewYear = new Date().getFullYear();
-    viewMonth = new Date().getMonth();
-    hoverDate = '';
-    get el() { return index.getElement(this); }
-    handleDocClick(e) {
-        if (this.open && !e.composedPath().includes(this.el)) {
-            this.open = false;
-        }
-    }
-    /** Emitted when date selected — matches Angular 'onChangeDate' */
-    onChangeDate;
-    /** Emitted when panel closes — matches Angular 'onClosePanel' */
-    onClosePanel;
-    /** Emitted when range selected */
-    dropiRangeChange;
-    get displayValue() {
-        if (this.selectionMode === 'range') {
-            if (this.startDate && this.endDate)
-                return `${this.startDate} – ${this.endDate}`;
-            if (this.startDate)
-                return this.startDate;
-            return '';
-        }
-        return this.selectedDate;
-    }
-    open_() {
-        if (this.disabled)
-            return;
-        if (this.selectedDate) {
-            const d = new Date(this.selectedDate);
-            this.viewYear = d.getFullYear();
-            this.viewMonth = d.getMonth();
-        }
-        else if (this.startDate) {
-            const d = new Date(this.startDate);
-            this.viewYear = d.getFullYear();
-            this.viewMonth = d.getMonth();
-        }
-        this.open = true;
-    }
-    prevMonth() {
-        if (this.viewMonth === 0) {
-            this.viewMonth = 11;
-            this.viewYear--;
-        }
-        else
-            this.viewMonth--;
-    }
-    nextMonth() {
-        if (this.viewMonth === 11) {
-            this.viewMonth = 0;
-            this.viewYear++;
-        }
-        else
-            this.viewMonth++;
-    }
-    toISO(year, month, day) {
-        return `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
-    }
-    isDisabled(iso) {
-        if (this.minDate && iso < this.minDate)
-            return true;
-        if (this.maxDate && iso > this.maxDate)
-            return true;
-        return false;
-    }
-    isInRange(iso) {
-        if (this.selectionMode !== 'range')
-            return false;
-        const start = this.startDate;
-        const end = this.endDate || this.hoverDate;
-        if (!start || !end)
-            return false;
-        const [s, e] = start <= end ? [start, end] : [end, start];
-        return iso > s && iso < e;
-    }
-    selectDate(iso) {
-        if (this.isDisabled(iso))
-            return;
-        if (this.selectionMode !== 'range') {
-            this.selectedDate = iso;
-            this.open = false;
-            this.onChangeDate.emit(iso);
-            return;
-        }
-        // Range mode
-        if (!this.startDate || (this.startDate && this.endDate)) {
-            this.startDate = iso;
-            this.endDate = '';
-        }
-        else {
-            if (iso < this.startDate) {
-                this.endDate = this.startDate;
-                this.startDate = iso;
-            }
-            else {
-                this.endDate = iso;
-            }
-            this.open = false;
-            this.dropiRangeChange.emit({ start: this.startDate, end: this.endDate });
-        }
-    }
-    buildDays() {
-        const year = this.viewYear;
-        const month = this.viewMonth;
-        const firstDay = new Date(year, month, 1).getDay();
-        // Adjust to Sunday-first
-        const startOffset = firstDay;
-        const daysInMonth = new Date(year, month + 1, 0).getDate();
-        const daysInPrevMonth = new Date(year, month, 0).getDate();
-        const cells = [];
-        // Previous month filler
-        for (let i = startOffset - 1; i >= 0; i--) {
-            const d = daysInPrevMonth - i;
-            const m = month === 0 ? 11 : month - 1;
-            const y = month === 0 ? year - 1 : year;
-            cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });
-        }
-        // Current month
-        for (let d = 1; d <= daysInMonth; d++) {
-            cells.push({ iso: this.toISO(year, month, d), day: d, currentMonth: true });
-        }
-        // Next month filler
-        const remaining = 42 - cells.length;
-        for (let d = 1; d <= remaining; d++) {
-            const m = month === 11 ? 0 : month + 1;
-            const y = month === 11 ? year + 1 : year;
-            cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });
-        }
-        return cells;
-    }
-    render() {
-        const days = this.buildDays();
-        const today = new Date().toISOString().slice(0, 10);
-        return (index.h("div", { key: 'ff426d80bb5bf05ca8b0c27773dee52f13cf4090', class: "dp-wrap" }, this.label && index.h("label", { key: 'fc7ebd6f14227533288b02c95933f6d4833e3f51', class: "dp-label" }, this.label), index.h("button", { key: '2fa9b1f3d2c9bfc4876724492a265ff0b29f8d23', class: {
-                'dp-trigger': true,
-                'dp-trigger--disabled': this.disabled,
-                'dp-trigger--invalid': this.isInvalid,
-                'dp-trigger--loading': this.loading
-            }, onClick: () => this.open ? this.open = false : this.open_(), disabled: this.disabled || this.loading, type: "button" }, index.h("dropi-icon", { key: '51b6fed8a232d7d22494c0bdf9f17e8c6ae0dbbe', name: "Calendar", width: "16px", height: "16px", color: "Gray-Gray-400" }), index.h("span", { key: 'ecbe872cd13efb112ef106f1dfde58cd745c124c', class: { 'dp-trigger__value': true, 'dp-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder), index.h("dropi-icon", { key: '6025abcf99d825dd885c9916f755c6b06e0657ed', name: "Arrow-Down-2", width: "12px", height: "12px", color: "Gray-Gray-400" })), this.open && (index.h("div", { key: 'b46a2bd022bc6ec2edfdf07a8a21b010b56610a4', class: "dp-popup" }, index.h("div", { key: '8aedcc47ab11c03bf8bc3309fc92ba3f83587520', class: "dp-nav" }, index.h("button", { key: 'e5a7f2a8edc8d33e08449713a976008b83108f36', class: "dp-nav__btn", onClick: () => this.prevMonth(), type: "button" }, index.h("dropi-icon", { key: '515211fe3c12cd2e9399bd8fad7c0dd84a4de3cd', name: "Arrow-Left-2", width: "16px", height: "16px", color: "Gray-Gray-600" })), index.h("span", { key: '0d5acefc9c8418749b4065d3bc92c8fb53744557', class: "dp-nav__title" }, index.h("span", { key: 'd4b68ef6a5c2885cf7cd05e7b49e47623b8c0d00' }, MONTHS_ES[this.viewMonth]), index.h("span", { key: '8aefcf2e7e383111994c58a743706d6d19607f65' }, this.viewYear)), index.h("button", { key: 'b7524552e5b05f592633bd6e16cdcda8659aeacf', class: "dp-nav__btn", onClick: () => this.nextMonth(), type: "button" }, index.h("dropi-icon", { key: '5e14a0dafb227ba6f2e90298005401050b55a3bb', name: "Arrow-Right-2", width: "16px", height: "16px", color: "Gray-Gray-600" }))), index.h("div", { key: '37d7428dc36bdc805fb60c36126a86509f3b1188', class: "dp-grid" }, DAYS_ES.map(d => (index.h("div", { class: "dp-day-header" }, d))), days.map(({ iso, day, currentMonth }) => {
-            const isSelected = this.selectionMode !== 'range'
-                ? iso === this.selectedDate
-                : iso === this.startDate || iso === this.endDate;
-            const isRangeStart = this.selectionMode === 'range' && iso === this.startDate;
-            const isRangeEnd = this.selectionMode === 'range' && iso === this.endDate;
-            const inRange = this.isInRange(iso);
-            const disabled = this.isDisabled(iso);
-            const isToday = iso === today;
-            return (index.h("button", { class: {
-                    'dp-cell': true,
-                    'dp-cell--other-month': !currentMonth,
-                    'dp-cell--today': isToday,
-                    'dp-cell--selected': isSelected,
-                    'dp-cell--range-start': isRangeStart,
-                    'dp-cell--range-end': isRangeEnd,
-                    'dp-cell--in-range': inRange,
-                    'dp-cell--disabled': disabled,
-                }, type: "button", disabled: disabled, onClick: () => this.selectDate(iso), onMouseEnter: () => {
-                    if (this.selectionMode === 'range' && this.startDate && !this.endDate)
-                        this.hoverDate = iso;
-                }, onMouseLeave: () => this.hoverDate = '' }, day));
-        })), index.h("div", { key: '9a16f2d3aaffda303f2cf7c4d8045ad355eb3e88', class: "dp-footer" }, index.h("button", { key: '2c236322d33b4dbc37e683c328bc2c17aa1422cf', class: "dp-footer__clear", type: "button", onClick: () => {
-                this.selectedDate = '';
-                this.startDate = '';
-                this.endDate = '';
-                this.open = false;
-            } }, "Limpiar"), index.h("button", { key: 'a08afb2358819fc8c15c7949dc7e4cbdf14b52fb', class: "dp-footer__today", type: "button", onClick: () => {
-                if (this.selectionMode !== 'range') {
-                    this.selectedDate = today;
-                    this.open = false;
-                    this.onChangeDate.emit(today);
-                }
-                else {
-                    this.startDate = today;
-                    this.endDate = '';
-                }
-            } }, "Hoy"))))));
-    }
-};
-DropiDatePicker.style = dropiDatePickerCss();
-
-exports.dropi_date_picker = DropiDatePicker;

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

@@ -1,79 +0,0 @@
-'use strict';
-
-var index = require('./index-C8kwDvpf.js');
-
-const dropiDrawerCss = () => `:host{display:contents;font-family:'Inter', sans-serif}*,*::before,*::after{box-sizing:border-box}.drawer-host{position:fixed;inset:0;z-index:1000;pointer-events:none;visibility:hidden}.drawer-host--open{pointer-events:all;visibility:visible}.drawer-backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.5);opacity:0;transition:opacity 0.25s}.drawer-host--open .drawer-backdrop{opacity:1}.drawer-panel{position:absolute;background:var(--Neutral-White, #ffffff);display:flex;flex-direction:column;transition:transform 0.25s ease;overflow:hidden;max-width:100%;min-width:auto}.drawer-panel--right{top:0;right:0;bottom:0;transform:translateX(100%);box-shadow:-4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--right{transform:translateX(0)}.drawer-panel--left{top:0;left:0;bottom:0;transform:translateX(-100%);box-shadow:4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--left{transform:translateX(0)}.drawer-panel--bottom{bottom:0;left:0;right:0;transform:translateY(100%);border-radius:var(--Border-2, 8px) var(--Border-2, 8px) 0 0;box-shadow:0 -4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--bottom{transform:translateY(0)}.drawer-panel--top{top:0;left:0;right:0;transform:translateY(-100%);border-radius:0 0 var(--Border-2, 8px) var(--Border-2, 8px);box-shadow:0 4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--top{transform:translateY(0)}.drawer-panel--size-m{width:550px}.drawer-panel--size-l{width:1137px}.drawer-panel--size-xl{width:1280px}.drawer-panel--size-xxl{width:1330px}.drawer-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);flex-shrink:0}.drawer-header--headless{display:none}.drawer-header__title{color:var(--Gray-700, #32394d);font-family:Inter, sans-serif;font-size:24px;font-style:normal;font-weight:700;line-height:110%;margin:0}.drawer-header__close{width:var(--Size-6, 32px);height:var(--Size-6, 32px);background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--Gray-400, #858ea6);border-radius:var(--Border-1, 4px);transition:background 0.15s;flex-shrink:0}.drawer-header__close:hover{background:var(--Gray-Gray-50, #f7f8fa)}.drawer-body{flex:1;overflow-y:auto;padding:var(--Size-4, 16px);display:flex;flex-direction:column}.drawer-footer{display:none}`;
-
-const DropiDrawer = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiClose = index.createEvent(this, "dropiClose", 7);
-    }
-    drawerTitle = '';
-    /** Controls visibility (alias of open for Angular parity) */
-    drawerIsOpen = false;
-    /** Controls visibility */
-    open = false;
-    /** Side from which the drawer slides in */
-    position = 'right';
-    /** Preset size (overrides width when set): 'm' | 'l' | 'xl' | 'xxl' */
-    size = '';
-    /** Custom width for left/right drawers (used when size is not set) */
-    width = '400px';
-    /** Custom height for top/bottom drawers */
-    height = '50vh';
-    /** Hide the header (headless mode) */
-    headless = false;
-    /** Close on backdrop click */
-    closeOnBackdrop = true;
-    /** Emitted when drawer closes */
-    dropiClose;
-    openChanged(val) {
-        this.open = val;
-        this.drawerIsOpen = val;
-        if (typeof document !== 'undefined') {
-            if (val)
-                document.body.classList.add('dropi-modal-open');
-            else
-                document.body.classList.remove('dropi-modal-open');
-        }
-    }
-    componentWillLoad() {
-        if (this.drawerIsOpen)
-            this.open = true;
-        if (this.open)
-            this.drawerIsOpen = true;
-    }
-    close() {
-        this.open = false;
-        this.dropiClose.emit();
-    }
-    render() {
-        const isHorizontal = this.position === 'left' || this.position === 'right';
-        // Clase de tamaño según prop size
-        const sizeClass = this.size ? `drawer-panel--size-${this.size}` : '';
-        // Estilo inline solo cuando no hay size preset
-        const panelStyle = {};
-        if (!this.size) {
-            if (isHorizontal)
-                panelStyle['width'] = this.width;
-            else
-                panelStyle['height'] = this.height;
-        }
-        return (index.h("div", { key: '7792ce8e001adf404aef387e35c5fb601f69b1e2', class: { 'drawer-host': true, 'drawer-host--open': this.open } }, index.h("div", { key: '186c33be6a7cd1e34e6d1f852219be91b24a15b9', class: "drawer-backdrop", onClick: () => {
-                if (this.closeOnBackdrop)
-                    this.close();
-            } }), index.h("div", { key: '3a48c465707125c2de1e369e70375689fe5ff9c1', class: `drawer-panel drawer-panel--${this.position}${sizeClass ? ' ' + sizeClass : ''}`, style: panelStyle, role: "dialog", "aria-modal": "true" }, index.h("div", { key: '840bb2933bc7e2264269bbadd5d9d61649fe58fe', class: { 'drawer-header': true, 'drawer-header--headless': this.headless } }, index.h("h3", { key: 'bfd9c7db02e9db07ce32115ca6386a9840c61288', class: "drawer-header__title" }, this.drawerTitle), index.h("button", { key: '6dc350e26f74d4e3aead7697bd2f5552e49e833c', class: "drawer-header__close", onClick: () => this.close(), "aria-label": "Cerrar" }, index.h("dropi-icon", { key: 'fcc5331391009f97254db5f729c61631edc33d8c', name: "Close-small", width: "32px", height: "32px", color: "Gray-Gray-400" }))), index.h("div", { key: 'e50ae31043bde759a79fbc9b4f734e06dc6c2a3f', class: "drawer-body" }, index.h("slot", { key: 'f1f0d7314b8bd7f6fd6fdec88a818963c1d5834f' })), index.h("div", { key: 'b14833f885757bbcfa687b7b2ee1cf847301134b', class: "drawer-footer" }, index.h("slot", { key: '5cba1759160a934c3b54166914a10b1335075151', name: "footer" })))));
-    }
-    static get watchers() { return {
-        "open": [{
-                "openChanged": 0
-            }],
-        "drawerIsOpen": [{
-                "openChanged": 0
-            }]
-    }; }
-};
-DropiDrawer.style = dropiDrawerCss();
-
-exports.dropi_drawer = DropiDrawer;