@dropi/ui 0.1.49 → 0.1.51

package/hydrate/index.mjs

@@ -5606,6 +5606,15 @@ const LOTTIE_MAP = {
 
 const dropiAlertModalCss = () => `:host{display:contents}.body-alert{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-3);width:100%;flex:1;overflow:visible;padding-bottom:var(--Size-2)}.lottie-img{width:120px;height:120px;overflow:hidden;flex-shrink:0;align-self:center;margin-top:-8px;margin-bottom:var(--Size-2)}.lottie-img lottie-player{display:block;width:120px;height:120px}.lottie-img--loading{width:100%;height:120px;overflow:hidden;display:flex;align-items:center;justify-content:center}.lottie-img--loading lottie-player{width:300px;height:auto;flex-shrink:0}.content-alert{text-align:center;width:100%;display:flex;flex-direction:column;align-items:center}.content-alert h2{color:var(--Gray-Gray-800);font-size:19px;font-weight:var(--font-weight-semibold);margin:0}.content-alert p{color:var(--Gray-Gray-500);font-size:var(--font-size-s);margin-bottom:var(--Size-2);overflow-wrap:anywhere;max-height:100px;overflow:auto}.custom-content{width:100%;text-align:left;margin-top:var(--Size-2);display:flex;flex-direction:column;gap:var(--Size-3)}.actions{display:flex;gap:var(--Size-3);width:100%}.actions dropi-button{flex:1;display:flex;justify-content:center}@media (max-width: 768px){.actions{flex-direction:column}.actions dropi-button{width:100%}}`;
 
+/**
+ * @component dropi-alert-modal
+ * Confirmation/alert modal with Lottie animation, title, message and action buttons.
+ * Uses dropi-modal internally.
+ *
+ * @example
+ * const el = document.querySelector('dropi-alert-modal');
+ * el.visible = true;
+ */
 class DropiAlertModal {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -5615,20 +5624,45 @@ class DropiAlertModal {
         this.dropiHide = createEvent(this, "dropiHide");
     }
     get el() { return getElement(this); }
+    /** Controls visibility */
     visible = false;
+    /** Modal type — determines Lottie animation */
     type = 'question';
+    /** Bold title */
     tittle = '';
+    /** Body message */
     message = '';
+    /** Primary button label */
     primaryButton = 'Accept';
+    /** Secondary button label (hidden if empty) */
     secondaryButton = '';
+    /** Show loading state with loading.json Lottie */
     loading = false;
+    /** Show close icon in header */
     closable = false;
+    /** Hide action buttons */
     displayButtons = true;
+    /** Loading title */
     loadingTitle = 'Loading';
+    /** Loading message */
     loadingMessage = 'Please wait a moment';
+    /**
+     * When true, primary button does NOT auto-close the modal (matches Angular `isStep`).
+     * Useful for step-by-step flows.
+     */
     isStep = false;
+    /** Base z-index for the internal modal overlay (matches Angular `baseZIndex`) */
     baseZIndex = 0;
+    /**
+     * Use White Label (MB) illustration style instead of Lottie animation.
+     */
     isWhiteLabel = false;
+    /**
+     * Convenience object prop — matches Angular `params: ModalParams`.
+     * Fields: tittle, type, message, primaryButton, secondaryButton, loadingTitle,
+     * loadingMessage, closable, displayButtons.
+     * When provided, its values override the corresponding individual props.
+     */
     params = null;
     paramsChanged(val) {
         if (!val)
@@ -5652,9 +5686,13 @@ class DropiAlertModal {
         if (val.displayButtons !== undefined)
             this.displayButtons = val.displayButtons;
     }
+    /** Emitted when primary button is clicked — matches Angular 'primaryButtonEvent' */
     dropiPrimaryClick;
+    /** Emitted when secondary button is clicked — matches Angular 'secondaryButtonEvent' */
     dropiSecondaryClick;
+    /** Emitted when modal open state changes — matches Angular 'modalOpenChange' */
     dropiVisibleChange;
+    /** Emitted when modal is hidden — matches Angular 'onHide' */
     dropiHide;
     componentWillLoad() {
         if (this.params)
@@ -5687,7 +5725,7 @@ class DropiAlertModal {
         const lottieKey = this.loading ? 'loading' : this.type;
         const isLottieLoading = lottieKey === 'loading';
         const lottieSrc = LOTTIE_MAP[lottieKey];
-        return (hAsync("dropi-modal", { key: 'db5113694460c0cc84715a713389470ac7f6b9b1', visible: this.visible, showHeader: this.closable, showCloseIcon: this.closable, dismissable: false, closeOnEscape: false, showFooter: false, size: "s", onDropiHide: () => this.onModalHide() }, hAsync("div", { key: 'abe4496cbcd52f257b713a5bdfd9f44d0de106f0', class: "body-alert" }, lottieSrc && (hAsync("div", { key: 'b1ad0a1816dd8cdc6efb203090215837c8be8bdb', class: `lottie-img${isLottieLoading ? ' lottie-img--loading' : ''}` }, hAsync("lottie-player", { key: lottieKey, src: lottieSrc, background: "transparent", speed: "1", loop: true, autoplay: true }))), hAsync("div", { key: '6749aebfaf51f42c8cb6e8b70c474ba691adf1f6', class: "content-alert" }, hAsync("h2", { key: '575c3c8db1175610bcfa6455063fa427b8cfed5b' }, this.loading ? this.loadingTitle : this.tittle), hAsync("p", { key: '0f542e5944cabe7fe06c0898fccf6d1076742fec' }, this.loading ? this.loadingMessage : this.message)), hAsync("div", { key: 'a891be75965672b1e4e83ee441c0043e5da39580', class: "custom-content" }, hAsync("slot", { key: '1a2124b8f8682be02b231b806e57fd62b8dcdf45' })), !this.loading && this.displayButtons && (hAsync("div", { key: 'f6d1b5a105f185c9127a005642d4630a7f1897c5', class: "actions" }, this.secondaryButton && hAsync("dropi-button", { key: '008d2b52b1510a3d9283d05acbf2bfd2f3e7fb08', text: this.secondaryButton, severity: "secondary", onDropiClick: () => this.handleSecondary(), fullWidth: true }), hAsync("dropi-button", { key: 'ea004b1b9698a5e05450fe366bf62cda44a4f352', text: this.primaryButton, severity: "primary", onDropiClick: () => this.handlePrimary(), fullWidth: true }))))));
+        return (hAsync("dropi-modal", { key: '9e44e3e2336cea618ad493257a9057f6ed05b3b9', visible: this.visible, showHeader: this.closable, showCloseIcon: this.closable, dismissable: false, closeOnEscape: false, showFooter: false, size: "s", onDropiHide: () => this.onModalHide() }, hAsync("div", { key: '2c83ef5ed1bce3821221404572e08ff83e5788a7', class: "body-alert" }, lottieSrc && (hAsync("div", { key: 'aef9b32ed8f6a9eed2d49b78a579efca7c30de35', class: `lottie-img${isLottieLoading ? ' lottie-img--loading' : ''}` }, hAsync("lottie-player", { key: lottieKey, src: lottieSrc, background: "transparent", speed: "1", loop: true, autoplay: true }))), hAsync("div", { key: '5c5161f34e04e783120cda34cbfda41da0061b40', class: "content-alert" }, hAsync("h2", { key: 'ea451c2f1d424a4ca9453eee500055929a4ee0cd' }, this.loading ? this.loadingTitle : this.tittle), hAsync("p", { key: '6fc476e3b79305a8542a9e3254a648df46e612c2' }, this.loading ? this.loadingMessage : this.message)), hAsync("div", { key: 'c6b62bd577696a2f474c05f6a91030f3caa17c9e', class: "custom-content" }, hAsync("slot", { key: '42957aad93193457111a074bad254c6209c5fb12' })), !this.loading && this.displayButtons && (hAsync("div", { key: 'f6bec3425de91611537bc418c7896b7dc510ace6', class: "actions" }, this.secondaryButton && hAsync("dropi-button", { key: 'e169fb4dbd9d6d5548095d59ddde524b6540b7a8', text: this.secondaryButton, severity: "secondary", onDropiClick: () => this.handleSecondary(), fullWidth: true }), hAsync("dropi-button", { key: 'f892a5d0fce7eae2d24fedc71a925c5c2cf767dd', text: this.primaryButton, severity: "primary", onDropiClick: () => this.handlePrimary(), fullWidth: true }))))));
     }
     static get watchers() { return {
         "params": [{
@@ -7556,11 +7594,11 @@ class DropiCountrySelector {
 
 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 = [
+const MONTHS_ES$1 = [
     'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
     'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'
 ];
-const DAYS_ES = ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'];
+const DAYS_ES$1 = ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'];
 /**
  * @component dropi-date-picker
  * Calendar date picker with optional date range mode.
@@ -7759,7 +7797,7 @@ class DropiDatePicker {
                 '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" }, hAsync("dropi-icon", { key: '1044cef59317f88cc472d2a466a6937a0c4d58f7', name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("span", { key: '6a7c5687cd06b9b2f42c256bc03ff0f412ca5573', class: { 'dp-trigger__value': true, 'dp-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder), hAsync("dropi-icon", { key: '4be1fc67ed6f9ffb5a5d936e3e8d8330bb91fb0b', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })), this.open && (hAsync("div", { key: '5ad107e256d62a46b57e4bd1bebead70ecc8e46c', class: "dp-popup" }, hAsync("div", { key: 'e3d51afbd24df88867777e43c9bd63dd41c3f542', class: "dp-nav" }, hAsync("button", { key: '8819f79389c1d50ec639f719228aab88be4d0335', class: "dp-nav__btn", onClick: () => this.prevMonth(), type: "button" }, hAsync("dropi-icon", { key: 'a17004ad24ce40590474d91227a826f46edf50ba', name: "Arrow-Left-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), hAsync("span", { key: 'e91c8a46b963a1e7f0d01c56610c2e4bb6fa3d39', class: "dp-nav__title" }, hAsync("span", { key: '214a575cbd83e8c3bafe64ffbd93e914119b09aa' }, MONTHS_ES[this.viewMonth]), hAsync("span", { key: '1f71a83e7110bf8a91f7b5e14e0400b09ba28e1a' }, this.viewYear)), hAsync("button", { key: '21dbc0fdaabc423bd864bfb33ba314b72ca62d48', class: "dp-nav__btn", onClick: () => this.nextMonth(), type: "button" }, hAsync("dropi-icon", { key: 'f248e65855555878afdbda7d1ba9a802d9eae4d5', name: "Arrow-Right-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), hAsync("div", { key: '4fb29792028bf2132ea78a105c7694cf3806ff05', class: "dp-grid" }, DAYS_ES.map(d => (hAsync("div", { class: "dp-day-header" }, d))), days.map(({ iso, day, currentMonth }) => {
+            }, onClick: () => this.open ? this.open = false : this.open_(), disabled: this.disabled || this.loading, type: "button" }, hAsync("dropi-icon", { key: '1044cef59317f88cc472d2a466a6937a0c4d58f7', name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("span", { key: '6a7c5687cd06b9b2f42c256bc03ff0f412ca5573', class: { 'dp-trigger__value': true, 'dp-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder), hAsync("dropi-icon", { key: '4be1fc67ed6f9ffb5a5d936e3e8d8330bb91fb0b', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })), this.open && (hAsync("div", { key: '5ad107e256d62a46b57e4bd1bebead70ecc8e46c', class: "dp-popup" }, hAsync("div", { key: 'e3d51afbd24df88867777e43c9bd63dd41c3f542', class: "dp-nav" }, hAsync("button", { key: '8819f79389c1d50ec639f719228aab88be4d0335', class: "dp-nav__btn", onClick: () => this.prevMonth(), type: "button" }, hAsync("dropi-icon", { key: 'a17004ad24ce40590474d91227a826f46edf50ba', name: "Arrow-Left-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), hAsync("span", { key: 'e91c8a46b963a1e7f0d01c56610c2e4bb6fa3d39', class: "dp-nav__title" }, hAsync("span", { key: '214a575cbd83e8c3bafe64ffbd93e914119b09aa' }, MONTHS_ES$1[this.viewMonth]), hAsync("span", { key: '1f71a83e7110bf8a91f7b5e14e0400b09ba28e1a' }, this.viewYear)), hAsync("button", { key: '21dbc0fdaabc423bd864bfb33ba314b72ca62d48', class: "dp-nav__btn", onClick: () => this.nextMonth(), type: "button" }, hAsync("dropi-icon", { key: 'f248e65855555878afdbda7d1ba9a802d9eae4d5', name: "Arrow-Right-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), hAsync("div", { key: '4fb29792028bf2132ea78a105c7694cf3806ff05', class: "dp-grid" }, DAYS_ES$1.map(d => (hAsync("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;
@@ -7838,14 +7876,19 @@ class DropiDatePicker {
     }; }
 }
 
-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 dropiDatePickerRangeCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.dpr-label{display:block;font-size:var(--font-size-xxs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.dpr-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}.dpr-trigger:hover:not(:disabled){border-color:var(--Info-Info-500, #50a5f1)}.dpr-trigger--disabled{background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed;opacity:0.6}.dpr-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}.dpr-trigger__placeholder{color:var(--Gray-Gray-400, #858ea6)}.dpr-popup{position:absolute;top:calc(100% + 8px);left:0;display:flex;flex-direction:row;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;overflow:hidden}.dpr-calendar{padding:var(--Size-4, 16px);width:300px;flex-shrink:0}.dpr-divider{width:1px;background:var(--Gray-Gray-100, #e6eaf2);flex-shrink:0}.dpr-shortcuts{padding:var(--Size-4, 16px) var(--Size-3, 12px);display:flex;flex-direction:column;gap:2px;min-width:140px}.shortcut-btn{background:transparent;border:1px solid transparent;padding:6px 10px;font-size:13px;font-family:inherit;color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:6px;transition:background 0.1s ease;font-weight:var(--font-weight-regular);white-space:nowrap}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn--active{border-color:var(--Gray-Gray-200, #c3c9d9);font-weight:var(--font-weight-semibold);background:var(--Gray-Gray-50, #f5f6f8)}.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}.dp-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--Size-4, 16px);padding-bottom:var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.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:6px;column-gap:2px}.dp-day-header{font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);text-align:center;padding:6px 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:background 0.15s;z-index:-1;background:transparent}.dp-cell::before{content:"";position:absolute;top:0;bottom:0;z-index:-2;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:-1px;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start::before{left:50%;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-end::before{left:-1px;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}@keyframes shimmer{0%{background-position:-468px 0}100%{background-position:468px 0}}.skeleton{height:44px;width:100%;border-radius:8px;animation:shimmer 1s linear infinite;background:linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);background-size:800px 104px}`;
 
+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'];
 /**
  * @component dropi-date-picker-range
- * Date range picker with shortcut buttons (Today, Last 7/15/30/90 days).
+ * Date range picker with calendar popup and shortcut panel.
  *
  * @example
- * <dropi-date-picker-range show-label></dropi-date-picker-range>
+ * <dropi-date-picker-range></dropi-date-picker-range>
  */
 class DropiDatePickerRange {
     constructor(hostRef) {
@@ -7861,13 +7904,15 @@ class DropiDatePickerRange {
     /** Show "Rango de fechas" label */
     showLabel = true;
     /** Input placeholder */
-    placeholder = '';
+    placeholder = 'DD/MM/YYYY – DD/MM/YYYY';
     /** Show loading skeleton */
     loading = false;
     /** Max allowed range in days (0 = unlimited) */
     maxDaysRange = 0;
     /** Hide "Hoy" shortcut */
     hideTodayRangeShortcut = false;
+    /** Disabled state */
+    disabled = false;
     /** Emitted when start date changes */
     startDateChange;
     /** Emitted when end date changes */
@@ -7878,8 +7923,18 @@ class DropiDatePickerRange {
     end = '';
     activeRange = -1;
     showWarning = false;
+    open = false;
+    viewYear = new Date().getFullYear();
+    viewMonth = new Date().getMonth();
+    hoverDate = '';
+    get el() { return getElement(this); }
     onStartPropChange(val) { this.start = val; }
     onEndPropChange(val) { this.end = val; }
+    handleDocClick(e) {
+        if (this.open && !e.composedPath().includes(this.el)) {
+            this.open = false;
+        }
+    }
     componentWillLoad() {
         this.start = this.startDate;
         this.end = this.endDate;
@@ -7902,47 +7957,137 @@ class DropiDatePickerRange {
         ];
         return this.hideTodayRangeShortcut ? all.slice(1) : all;
     }
+    get displayValue() {
+        const fmt = (s) => s.split('-').reverse().join('/');
+        if (this.start && this.end)
+            return `${fmt(this.start)} – ${fmt(this.end)}`;
+        if (this.start)
+            return fmt(this.start);
+        return '';
+    }
+    toggleOpen() {
+        if (this.disabled)
+            return;
+        if (!this.open && this.start) {
+            const d = new Date(this.start);
+            this.viewYear = d.getFullYear();
+            this.viewMonth = d.getMonth();
+        }
+        this.open = !this.open;
+    }
+    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')}`;
+    }
+    isInRange(iso) {
+        const end = this.end || this.hoverDate;
+        if (!this.start || !end)
+            return false;
+        const [s, e] = this.start <= end ? [this.start, end] : [end, this.start];
+        return iso > s && iso < e;
+    }
+    selectDate(iso) {
+        if (!this.start || (this.start && this.end)) {
+            this.start = iso;
+            this.end = '';
+            this.activeRange = -1;
+            this.showWarning = false;
+        }
+        else {
+            if (iso < this.start) {
+                this.end = this.start;
+                this.start = iso;
+            }
+            else {
+                this.end = iso;
+            }
+            this.activeRange = -1;
+            if (this.maxDaysRange > 0) {
+                const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;
+                this.showWarning = diff > this.maxDaysRange;
+                if (this.showWarning)
+                    return;
+            }
+            this.open = false;
+            this.emit();
+        }
+    }
     selectShortcut(idx) {
         const s = this.shortcuts[idx];
         this.start = s.start;
         this.end = s.end;
         this.activeRange = idx;
         this.showWarning = false;
+        this.open = 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 });
     }
+    buildDays() {
+        const year = this.viewYear;
+        const month = this.viewMonth;
+        const firstDay = new Date(year, month, 1).getDay();
+        const daysInMonth = new Date(year, month + 1, 0).getDate();
+        const daysInPrevMonth = new Date(year, month, 0).getDate();
+        const cells = [];
+        for (let i = firstDay - 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 });
+        }
+        for (let d = 1; d <= daysInMonth; d++) {
+            cells.push({ iso: this.toISO(year, month, d), day: d, currentMonth: true });
+        }
+        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() {
-        if (this.loading) {
+        if (this.loading)
             return hAsync("div", { class: "skeleton" });
-        }
-        return (hAsync("div", { class: "date-picker-range" }, this.showLabel && hAsync("div", { class: "label" }, "Rango de fechas"), hAsync("div", { class: "inputs-row" }, hAsync("div", { class: "input-group" }, hAsync("label", { class: "input-label" }, "Desde"), hAsync("input", { type: "date", class: "date-input", value: this.start, max: this.end || this.today, onChange: (e) => this.onStartChange(e) })), hAsync("span", { class: "separator" }, "\u2014"), hAsync("div", { class: "input-group" }, hAsync("label", { class: "input-label" }, "Hasta"), hAsync("input", { type: "date", class: "date-input", value: this.end, min: this.start, max: this.today, onChange: (e) => this.onEndChange(e) }))), hAsync("div", { class: "shortcuts" }, this.shortcuts.map((s, i) => (hAsync("button", { key: i, class: `shortcut-btn${this.activeRange === i ? ' active' : ''}`, onClick: () => this.selectShortcut(i) }, s.label)))), this.showWarning && (hAsync("div", { class: "warning-box" }, hAsync("span", { class: "warning-message" }, "Solo puedes filtrar en un rango m\u00E1ximo de ", this.maxDaysRange, " d\u00EDas.")))));
+        const days = this.buildDays();
+        const today = this.today;
+        return (hAsync("div", { class: "dpr-wrap" }, this.showLabel && hAsync("label", { class: "dpr-label" }, "Rango de fechas"), hAsync("button", { class: { 'dpr-trigger': true, 'dpr-trigger--disabled': this.disabled }, onClick: () => this.toggleOpen(), disabled: this.disabled, type: "button" }, hAsync("dropi-icon", { name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("span", { class: { 'dpr-trigger__value': true, 'dpr-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder), hAsync("dropi-icon", { name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })), this.open && (hAsync("div", { class: "dpr-popup" }, hAsync("div", { class: "dpr-calendar" }, hAsync("div", { class: "dp-nav" }, hAsync("button", { class: "dp-nav__btn", onClick: () => this.prevMonth(), type: "button" }, hAsync("dropi-icon", { name: "Arrow-Left-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), hAsync("span", { class: "dp-nav__title" }, hAsync("span", null, MONTHS_ES[this.viewMonth]), hAsync("span", null, this.viewYear)), hAsync("button", { class: "dp-nav__btn", onClick: () => this.nextMonth(), type: "button" }, hAsync("dropi-icon", { name: "Arrow-Right-2", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), hAsync("div", { class: "dp-grid" }, DAYS_ES.map(d => hAsync("div", { class: "dp-day-header" }, d)), days.map(({ iso, day, currentMonth }) => {
+            const isStart = iso === this.start;
+            const isEnd = iso === this.end;
+            const inRange = this.isInRange(iso);
+            const isToday = iso === today;
+            return (hAsync("button", { class: {
+                    'dp-cell': true,
+                    'dp-cell--other-month': !currentMonth,
+                    'dp-cell--today': isToday && !isStart && !isEnd,
+                    'dp-cell--selected': isStart || isEnd,
+                    'dp-cell--range-start': isStart,
+                    'dp-cell--range-end': isEnd,
+                    'dp-cell--in-range': inRange,
+                }, type: "button", onClick: () => this.selectDate(iso), onMouseEnter: () => {
+                    if (this.start && !this.end)
+                        this.hoverDate = iso;
+                }, onMouseLeave: () => this.hoverDate = '' }, day));
+        })), this.showWarning && (hAsync("div", { class: "warning-box" }, hAsync("span", { class: "warning-message" }, "Solo puedes filtrar en un rango m\u00E1ximo de ", this.maxDaysRange, " d\u00EDas.")))), hAsync("div", { class: "dpr-divider" }), hAsync("div", { class: "dpr-shortcuts" }, this.shortcuts.map((s, i) => (hAsync("button", { key: i, class: { 'shortcut-btn': true, 'shortcut-btn--active': this.activeRange === i }, onClick: () => this.selectShortcut(i), type: "button" }, s.label))))))));
     }
     static get watchers() { return {
         "startDate": [{
@@ -7964,12 +8109,17 @@ class DropiDatePickerRange {
             "loading": [4],
             "maxDaysRange": [2, "max-days-range"],
             "hideTodayRangeShortcut": [4, "hide-today-range-shortcut"],
+            "disabled": [4],
             "start": [32],
             "end": [32],
             "activeRange": [32],
-            "showWarning": [32]
+            "showWarning": [32],
+            "open": [32],
+            "viewYear": [32],
+            "viewMonth": [32],
+            "hoverDate": [32]
         },
-        "$listeners$": undefined,
+        "$listeners$": [[4, "click", "handleDocClick"]],
         "$lazyBundleId$": "-",
         "$attrsToReflect$": []
     }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dropi/ui",
-  "version": "0.1.49",
+  "version": "0.1.51",
   "description": "Dropi Design System — Web Components for Angular, React and Vue",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -51,7 +51,8 @@
     "packages/*"
   ],
   "scripts": {
-    "build": "node scripts/generate-icon-map.js && stencil build && npm run build --workspace=packages/react && npm run build --workspace=packages/angular",
+    "generate:maps": "node scripts/generate-icon-map.js && node scripts/generate-illustration-map.js && node scripts/generate-lottie-map.js",
+    "build": "npm run generate:maps && stencil build && npm run build --workspace=packages/react && npm run build --workspace=packages/angular",
     "clear:cache": "node -e \"const fs=require('fs');['.stencil','node_modules/.cache'].forEach(p=>{try{fs.rmSync(p,{recursive:true,force:true})}catch(e){}})\"",
     "publish:react": "npm run build && npm publish --workspace=packages/react",
     "dev": "stencil build --dev --watch & npm run watch --workspace=packages/react",

package/scripts/generate-lottie-map.js

@@ -3,7 +3,6 @@
 const fs = require('fs');
 const path = require('path');
 
-// Keys match dropi-alert-modal's lottieMap; values are the JSON file names
 const ENTRIES = [
   { key: 'question', file: 'question.json' },
   { key: 'warning',  file: 'warning.json'  },
@@ -23,9 +22,7 @@ for (const { key, file } of ENTRIES) {
     console.warn(`⚠️  Missing lottie file: ${file} — skipping`);
     continue;
   }
-  // Store as a minified JSON string to avoid runtime JSON.stringify cost
   const json = JSON.stringify(JSON.parse(fs.readFileSync(filePath, 'utf8')));
-  // Escape backticks and template literal dollar signs
   const escaped = json.replace(/`/g, '\\`').replace(/\$/g, '\\$');
   lines.push(`  '${key}': \`${escaped}\``);
 }

package/dist/components/p-1u2h41fl.js

@@ -1 +0,0 @@
-import{t as r,p as e,H as t,c as i,h as a}from"./index.js";import{d as o}from"./p-CL1y944C.js";const s={success:"Check-circle",error:"Cross-circle",warning:"Warning-circle",info:"Info"},n={success:"Success-Success-500",error:"Error-Error-500",warning:"Warning-Warning-500",info:"Info-Info-500"},l=e(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiClose=i(this,"dropiClose"),this.dropiButtonClick=i(this,"dropiButtonClick"),this.dropiLinkClick=i(this,"dropiLinkClick")}message="";type="default";state="success";dismissable=!0;showButton=!1;buttonText="Close";anchorText="";anchorUrl="";showAlert=!0;textLink="";linkUrl="";clickedText="";dropiClose;dropiButtonClick;dropiLinkClick;render(){return this.showAlert?a("div",{class:{alert:!0,[`alert--${this.type}`]:!0,[`alert--${this.state}`]:!0}},"flag"!==this.type&&a("div",{class:"alert__icon"},a("dropi-icon",{name:s[this.state],iconWidth:"18px",iconHeight:"18px",color:n[this.state]})),a("div",{class:"alert__body"},a("span",{class:"alert__message",innerHTML:this.message}),this.clickedText&&a("a",{class:"alert__link",href:"#",onClick:r=>{r.preventDefault(),this.dropiLinkClick.emit()}},this.clickedText),(this.anchorText||this.textLink)&&a("a",{class:"alert__link",href:this.anchorUrl||this.linkUrl||"#",onClick:r=>{r.preventDefault(),this.dropiLinkClick.emit()}},this.anchorText||this.textLink)),a("div",{class:"alert__actions"},this.showButton&&this.buttonText&&"flag"!==this.type&&a("button",{class:"alert__btn",onClick:()=>this.dropiButtonClick.emit()},this.buttonText),this.dismissable&&a("button",{class:"alert__close",onClick:()=>{this.showAlert=!1,this.dropiClose.emit()},"aria-label":"Cerrar"},a("dropi-icon",{name:"Close-small",iconWidth:"18px",iconHeight:"18px",color:"Gray-Gray-500"})))):null}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.alert{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-3, 12px);border-radius:var(--Border-2, 8px);border:1px solid transparent;width:100%}.alert--success{background:var(--Success-Success-50, #e7f8f3);border-color:var(--Success-Success-500, #0abb87)}.alert--error{background:var(--Error-Error-50, #fef0f0);border-color:var(--Error-Error-500, #f46a6b)}.alert--warning{background:var(--Warning-Warning-50, #fef8ed);border-color:var(--Warning-Warning-500, #f1b44c)}.alert--info{background:var(--Info-Info-50, #eef6fe);border-color:var(--Info-Info-500, #50a5f1)}.alert--flag{padding:var(--Size-1, 4px) var(--Size-2, 8px);border-radius:var(--Border-1, 4px);border:none !important;justify-content:center}.alert--flag .alert__body{justify-content:center;text-align:center}.alert--flag .alert__message{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular)}.alert__icon{display:flex;align-items:center;flex-shrink:0;padding-top:1px}.alert__body{flex:1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--Size-1, 4px)}.alert__message{font-size:var(--font-size-s);color:var(--Gray-600, #475066);font-weight:var(--font-weight-medium);line-height:1.5}.alert__link{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Primary-Primary-500, #f49a3d);text-decoration:underline;cursor:pointer}.alert__actions{display:flex;align-items:center;gap:var(--Size-2, 8px);flex-shrink:0}.alert__btn{height:28px;padding:0 var(--Size-3, 12px);border-radius:var(--Border-2, 8px);border:1px solid var(--Primary-Primary-500, #f49a3d);background:transparent;color:var(--Primary-Primary-500, #f49a3d);font-size:var(--font-size-xs, 10px);font-family:inherit;font-weight:var(--font-weight-bold, 700);cursor:pointer;transition:background 0.15s, color 0.15s}.alert__btn:hover{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff)}.alert__close{display:flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;opacity:0.6;transition:opacity 0.15s}.alert__close:hover{opacity:1}"}},[513,"dropi-alert",{message:[1],type:[1],state:[1],dismissable:[4],showButton:[4,"show-button"],buttonText:[1,"button-text"],anchorText:[1,"anchor-text"],anchorUrl:[1,"anchor-url"],showAlert:[1028,"show-alert"],textLink:[1,"text-link"],linkUrl:[1,"link-url"],clickedText:[1,"clicked-text"]}]);function c(){"undefined"!=typeof customElements&&["dropi-alert","dropi-icon"].forEach((e=>{switch(e){case"dropi-alert":customElements.get(r(e))||customElements.define(r(e),l);break;case"dropi-icon":customElements.get(r(e))||o()}}))}c();export{l as D,c as d}

package/dist/components/p-7lGbTojq.js

@@ -1 +0,0 @@
-import{t,p as e,H as i,c as o,h as r}from"./index.js";import{d as s}from"./p-DWEoG5qY.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dropiInput=o(this,"dropiInput"),this.dropiChange=o(this,"dropiChange"),this.dropiFocus=o(this,"dropiFocus"),this.dropiBlur=o(this,"dropiBlur"),this.internals=this.attachInternals()}internals;inputId="";name="";label="";placeholder=" ";value="";maxLength;disabled=!1;required=!1;showObligatoryAsterisk=!0;fixedLabel=!1;inputMode="text";passwordInput=!1;isMoneyInput=!1;isThousandSeparator=!1;isNumericInput=!1;allowDecimals=!1;isLettersOnly=!1;icon="";iconColor="Gray-Gray-400";hasError=!1;textHelper="";showHelperOnlyOnError=!1;inputProperties=null;showPassword=!1;touched=!1;dropiInput;dropiChange;dropiFocus;dropiBlur;inputPropertiesChanged(t){t&&(void 0!==t.id&&(this.inputId=t.id),void 0!==t.inputId&&(this.inputId=t.inputId),void 0!==t.label&&(this.label=t.label),void 0!==t.placeholder&&(this.placeholder=t.placeholder),void 0!==t.maxLength&&(this.maxLength=t.maxLength),void 0!==t.textHelper&&(this.textHelper=t.textHelper),void 0!==t.passwordInput&&(this.passwordInput=t.passwordInput),void 0!==t.isPasswordInput&&(this.passwordInput=t.isPasswordInput),void 0!==t.icon&&(this.icon=t.icon),void 0!==t.iconColor&&(this.iconColor=t.iconColor),void 0!==t.isMoneyInput&&(this.isMoneyInput=t.isMoneyInput),void 0!==t.showObligatoryAsterisk&&(this.showObligatoryAsterisk=t.showObligatoryAsterisk),void 0!==t.isNumericInput&&(this.isNumericInput=t.isNumericInput),void 0!==t.allowDecimals&&(this.allowDecimals=t.allowDecimals),void 0!==t.isThousandSeparator&&(this.isThousandSeparator=t.isThousandSeparator),void 0!==t.showHelperOnlyOnError&&(this.showHelperOnlyOnError=t.showHelperOnlyOnError),void 0!==t.isLettersOnly&&(this.isLettersOnly=t.isLettersOnly),void 0!==t.inputMode&&(this.inputMode=t.inputMode))}valueChanged(t){this.internals.setFormValue(t)}disabledChanged(t){this.internals.setValidity(t?{customError:!0}:{},t?"Field is disabled":"")}componentWillLoad(){this.internals.setFormValue(this.value??""),this.inputProperties&&this.inputPropertiesChanged(this.inputProperties)}handleInput(t){let e=t.target.value;this.isNumericInput&&(e=this.filterNumbers(e)),this.isLettersOnly&&(e=this.filterLetters(e)),(this.isMoneyInput||this.isThousandSeparator)&&(e=this.formatThousands(e,this.isMoneyInput)),this.value=e,this.internals.setFormValue(e),this.dropiInput.emit(e),this.dropiChange.emit(e)}handleKeyDown(t){(this.isNumericInput||this.isMoneyInput||this.isThousandSeparator)&&!this.isAllowedNumberKey(t)&&t.preventDefault(),this.isLettersOnly&&!this.isAllowedLetterKey(t)&&t.preventDefault()}handleFocus(){this.dropiFocus.emit()}handleBlur(){this.touched=!0,this.dropiBlur.emit()}togglePassword(){this.disabled||(this.showPassword=!this.showPassword)}filterNumbers(t){return t.replace(this.allowDecimals?/[^0-9.]/g:/[^0-9]/g,"")}filterLetters(t){return t.replace(/[^a-zA-ZáéíóúÁÉÍÓÚñÑüÜ\s]/g,"")}isAllowedNumberKey(t){return!!(["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"].includes(t.key)||t.ctrlKey||t.metaKey||/^[0-9]$/.test(t.key)||this.allowDecimals&&"."===t.key)}isAllowedLetterKey(t){return!!["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"," "].includes(t.key)||!(!t.ctrlKey&&!t.metaKey)||/^[a-zA-ZáéíóúÁÉÍÓÚñÑüÜ]$/.test(t.key)}formatThousands(t,e){const i=t.replace(/[^0-9.]/g,""),[o,r]=i.split("."),s=o.replace(/\B(?=(\d{3})+(?!\d))/g,","),a=void 0!==r?`${s}.${r}`:s;return e?`$${a}`:a}get resolvedId(){return this.inputId||this.label}get inputType(){return this.passwordInput?this.showPassword?"text":"password":"text"}get showHelper(){return!!this.textHelper&&(!this.showHelperOnlyOnError||this.hasError&&this.touched)}get isInvalid(){return this.hasError&&this.touched}render(){const t=this.required&&this.showObligatoryAsterisk&&!this.disabled,e=!!this.icon;return r("div",{key:"e4c796c7993efaff51795c1bd98e5ebdd8d290b9",class:{"fixed-label-container":this.fixedLabel}},this.fixedLabel&&r("div",{key:"4beb27652c590c5eeda86ca86bd91695eebc9a28",class:"input-label Body-S-Regular"},this.label,t&&r("span",{key:"907fb3444cdd81b2573c120cf11d03d9eb43abf5",class:"asterisk"}," *")),r("div",{key:"57f9b151ed4588f8907b5d7eb167c7a6db6d1d20",class:"form-group"},r("div",{key:"5d9f1e8d9f02af3b44285c8af32cce234678a16c",class:{"input-container":!0,"input-container--has-icon":e}},e&&r("dropi-icon",{key:"7ed928ebce2196a0b31a7b1b620670b6c7b1047c",class:"icon-input",name:this.icon,color:this.iconColor,iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"}}),this.passwordInput&&r("dropi-icon",{key:"9c69320fd760eb8a41f375d902e5fb371cf024f3",class:"icon-input-password",name:this.showPassword?"Eye":"Eye-crossed",iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"},color:"Gray-Gray-500",onClick:()=>this.togglePassword()}),r("input",{key:"c3e958c4e7293b1c96425fb2f23b9150d8e22b1b",id:this.resolvedId,class:{"form-control":!0,"form-control-valid":!this.isInvalid&&this.touched&&!!this.value,"form-control-invalid":this.isInvalid,"padding-icon":e,"text-password":this.passwordInput&&!this.showPassword,"fixed-label-input":this.fixedLabel},type:this.inputType,value:this.value,placeholder:this.fixedLabel?this.placeholder:" ",disabled:this.disabled,required:this.required,maxLength:this.maxLength,inputMode:this.inputMode,"data-cy":void 0,onInput:t=>this.handleInput(t),onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.handleFocus(),onBlur:()=>this.handleBlur()}),!this.fixedLabel&&r("label",{key:"6c04977ffa24ee362830bb5dc8c3b2600e19c3c0",class:"Body-S-Regular label-bottom",htmlFor:this.resolvedId},this.label,t&&r("span",{key:"98361181d292d929c438c3dd70c920db510499ef",class:"asterisk"}," *")),this.showHelper&&r("div",{key:"21a2e9229eb21a8c0b48ec51a609a143ee8ba2c4",class:"form-control-helper"},this.isInvalid&&r("dropi-icon",{key:"18d18c43c8ea7c35ac5d4a294cbb36a8e05930fc",name:"Warning-circle",iconWidth:"12px",iconHeight:"12px",color:"Error-Error-500"}),r("span",{key:"1c684fa4c25ef0afb852592ca1e2fb059e0db491",class:{"disabled-helper":this.disabled,"invalid-color":this.isInvalid}},this.textHelper)))))}static get formAssociated(){return!0}static get watchers(){return{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.fixed-label-container{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:8px}.input-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);text-align:left}.asterisk{color:var(--Error-Error-500, #f46a6b)}.form-group{position:relative;width:100%}.input-container{position:relative}.icon-input{position:absolute;top:50%;left:12px;transform:translateY(-50%);z-index:1;display:flex;align-items:center;justify-content:center}.icon-input-password{position:absolute;top:50%;right:13px;transform:translateY(-50%);cursor:pointer;z-index:1;display:flex;align-items:center;justify-content:center}.form-control{box-sizing:border-box;width:100%;padding:var(--Size-2, 8px);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);transition:border-color 0.3s ease-in-out;height:40px;outline:none;appearance:none;text-align:left}.form-control::placeholder{color:transparent;transition:color 0.2s ease-in-out}.form-control:focus::placeholder,.fixed-label-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.padding-icon{padding-left:40px}.input-container--has-icon label.label-bottom{left:40px}.input-container--has-icon .form-control:focus+label.label-bottom,.input-container--has-icon .form-control:not(:placeholder-shown)+label.label-bottom{left:0}.text-password{-webkit-text-security:disc;text-security:disc}label.label-bottom{position:absolute;font-weight:var(--font-weight-regular, 400);top:10px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);left:10px;transition:all 0.2s ease-in-out;pointer-events:none;overflow:hidden;width:90%;white-space:nowrap}.form-control:focus+label.label-bottom,.form-control:not(:placeholder-shown)+label.label-bottom{top:-22px;left:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);width:unset}.form-control:disabled+label.label-bottom{color:var(--Gray-Gray-400, #858ea6)}.form-control-helper{display:flex;position:absolute;top:100%;left:0;gap:4px;align-items:center;margin-top:4px}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}"}},[577,"dropi-input",{inputId:[1025,"input-id"],name:[513],label:[1025],placeholder:[1025],value:[1025],maxLength:[1026,"max-length"],disabled:[516],required:[516],showObligatoryAsterisk:[1028,"show-obligatory-asterisk"],fixedLabel:[4,"fixed-label"],inputMode:[1025,"input-mode"],passwordInput:[1028,"password-input"],isMoneyInput:[1028,"is-money-input"],isThousandSeparator:[1028,"is-thousand-separator"],isNumericInput:[1028,"is-numeric-input"],allowDecimals:[1028,"allow-decimals"],isLettersOnly:[1028,"is-letters-only"],icon:[1025],iconColor:[1025,"icon-color"],hasError:[1028,"has-error"],textHelper:[1025,"text-helper"],showHelperOnlyOnError:[1028,"show-helper-only-on-error"],inputProperties:[8,"input-properties"],showPassword:[32],touched:[32]},void 0,{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-input","dropi-icon"].forEach((e=>{switch(e){case"dropi-input":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||s()}}))}n();export{a as D,n as d}

package/dist/components/p-B3c6ZPh9.js

@@ -1 +0,0 @@
-import{t,p as e,H as i,c as o,h as r}from"./index.js";import{d as s}from"./p-C9mRfQtW.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dropiInput=o(this,"dropiInput"),this.dropiChange=o(this,"dropiChange"),this.dropiFocus=o(this,"dropiFocus"),this.dropiBlur=o(this,"dropiBlur"),this.internals=this.attachInternals()}internals;inputId="";name="";label="";placeholder=" ";value="";maxLength;disabled=!1;required=!1;showObligatoryAsterisk=!0;fixedLabel=!1;inputMode="text";passwordInput=!1;isMoneyInput=!1;isThousandSeparator=!1;isNumericInput=!1;allowDecimals=!1;isLettersOnly=!1;icon="";iconColor="Gray-Gray-400";hasError=!1;textHelper="";showHelperOnlyOnError=!1;inputProperties=null;showPassword=!1;touched=!1;dropiInput;dropiChange;dropiFocus;dropiBlur;inputPropertiesChanged(t){t&&(void 0!==t.id&&(this.inputId=t.id),void 0!==t.inputId&&(this.inputId=t.inputId),void 0!==t.label&&(this.label=t.label),void 0!==t.placeholder&&(this.placeholder=t.placeholder),void 0!==t.maxLength&&(this.maxLength=t.maxLength),void 0!==t.textHelper&&(this.textHelper=t.textHelper),void 0!==t.passwordInput&&(this.passwordInput=t.passwordInput),void 0!==t.isPasswordInput&&(this.passwordInput=t.isPasswordInput),void 0!==t.icon&&(this.icon=t.icon),void 0!==t.iconColor&&(this.iconColor=t.iconColor),void 0!==t.isMoneyInput&&(this.isMoneyInput=t.isMoneyInput),void 0!==t.showObligatoryAsterisk&&(this.showObligatoryAsterisk=t.showObligatoryAsterisk),void 0!==t.isNumericInput&&(this.isNumericInput=t.isNumericInput),void 0!==t.allowDecimals&&(this.allowDecimals=t.allowDecimals),void 0!==t.isThousandSeparator&&(this.isThousandSeparator=t.isThousandSeparator),void 0!==t.showHelperOnlyOnError&&(this.showHelperOnlyOnError=t.showHelperOnlyOnError),void 0!==t.isLettersOnly&&(this.isLettersOnly=t.isLettersOnly),void 0!==t.inputMode&&(this.inputMode=t.inputMode))}valueChanged(t){this.internals.setFormValue(t)}disabledChanged(t){this.internals.setValidity(t?{customError:!0}:{},t?"Field is disabled":"")}componentWillLoad(){this.internals.setFormValue(this.value??""),this.inputProperties&&this.inputPropertiesChanged(this.inputProperties)}handleInput(t){let e=t.target.value;this.isNumericInput&&(e=this.filterNumbers(e)),this.isLettersOnly&&(e=this.filterLetters(e)),(this.isMoneyInput||this.isThousandSeparator)&&(e=this.formatThousands(e,this.isMoneyInput)),this.value=e,this.internals.setFormValue(e),this.dropiInput.emit(e),this.dropiChange.emit(e)}handleKeyDown(t){(this.isNumericInput||this.isMoneyInput||this.isThousandSeparator)&&!this.isAllowedNumberKey(t)&&t.preventDefault(),this.isLettersOnly&&!this.isAllowedLetterKey(t)&&t.preventDefault()}handleFocus(){this.dropiFocus.emit()}handleBlur(){this.touched=!0,this.dropiBlur.emit()}togglePassword(){this.disabled||(this.showPassword=!this.showPassword)}filterNumbers(t){return t.replace(this.allowDecimals?/[^0-9.]/g:/[^0-9]/g,"")}filterLetters(t){return t.replace(/[^a-zA-ZáéíóúÁÉÍÓÚñÑüÜ\s]/g,"")}isAllowedNumberKey(t){return!!(["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"].includes(t.key)||t.ctrlKey||t.metaKey||/^[0-9]$/.test(t.key)||this.allowDecimals&&"."===t.key)}isAllowedLetterKey(t){return!!["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"," "].includes(t.key)||!(!t.ctrlKey&&!t.metaKey)||/^[a-zA-ZáéíóúÁÉÍÓÚñÑüÜ]$/.test(t.key)}formatThousands(t,e){const i=t.replace(/[^0-9.]/g,""),[o,r]=i.split("."),s=o.replace(/\B(?=(\d{3})+(?!\d))/g,","),a=void 0!==r?`${s}.${r}`:s;return e?`$${a}`:a}get resolvedId(){return this.inputId||this.label}get inputType(){return this.passwordInput?this.showPassword?"text":"password":"text"}get showHelper(){return!!this.textHelper&&(!this.showHelperOnlyOnError||this.hasError&&this.touched)}get isInvalid(){return this.hasError&&this.touched}render(){const t=this.required&&this.showObligatoryAsterisk&&!this.disabled,e=!!this.icon;return r("div",{key:"e4c796c7993efaff51795c1bd98e5ebdd8d290b9",class:{"fixed-label-container":this.fixedLabel}},this.fixedLabel&&r("div",{key:"4beb27652c590c5eeda86ca86bd91695eebc9a28",class:"input-label Body-S-Regular"},this.label,t&&r("span",{key:"907fb3444cdd81b2573c120cf11d03d9eb43abf5",class:"asterisk"}," *")),r("div",{key:"57f9b151ed4588f8907b5d7eb167c7a6db6d1d20",class:"form-group"},r("div",{key:"5d9f1e8d9f02af3b44285c8af32cce234678a16c",class:{"input-container":!0,"input-container--has-icon":e}},e&&r("dropi-icon",{key:"7ed928ebce2196a0b31a7b1b620670b6c7b1047c",class:"icon-input",name:this.icon,color:this.iconColor,iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"}}),this.passwordInput&&r("dropi-icon",{key:"9c69320fd760eb8a41f375d902e5fb371cf024f3",class:"icon-input-password",name:this.showPassword?"Eye":"Eye-crossed",iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"},color:"Gray-Gray-500",onClick:()=>this.togglePassword()}),r("input",{key:"c3e958c4e7293b1c96425fb2f23b9150d8e22b1b",id:this.resolvedId,class:{"form-control":!0,"form-control-valid":!this.isInvalid&&this.touched&&!!this.value,"form-control-invalid":this.isInvalid,"padding-icon":e,"text-password":this.passwordInput&&!this.showPassword,"fixed-label-input":this.fixedLabel},type:this.inputType,value:this.value,placeholder:this.fixedLabel?this.placeholder:" ",disabled:this.disabled,required:this.required,maxLength:this.maxLength,inputMode:this.inputMode,"data-cy":void 0,onInput:t=>this.handleInput(t),onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.handleFocus(),onBlur:()=>this.handleBlur()}),!this.fixedLabel&&r("label",{key:"6c04977ffa24ee362830bb5dc8c3b2600e19c3c0",class:"Body-S-Regular label-bottom",htmlFor:this.resolvedId},this.label,t&&r("span",{key:"98361181d292d929c438c3dd70c920db510499ef",class:"asterisk"}," *")),this.showHelper&&r("div",{key:"21a2e9229eb21a8c0b48ec51a609a143ee8ba2c4",class:"form-control-helper"},this.isInvalid&&r("dropi-icon",{key:"18d18c43c8ea7c35ac5d4a294cbb36a8e05930fc",name:"Warning-circle",iconWidth:"12px",iconHeight:"12px",color:"Error-Error-500"}),r("span",{key:"1c684fa4c25ef0afb852592ca1e2fb059e0db491",class:{"disabled-helper":this.disabled,"invalid-color":this.isInvalid}},this.textHelper)))))}static get formAssociated(){return!0}static get watchers(){return{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.fixed-label-container{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:8px}.input-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);text-align:left}.asterisk{color:var(--Error-Error-500, #f46a6b)}.form-group{position:relative;width:100%}.input-container{position:relative}.icon-input{position:absolute;top:50%;left:12px;transform:translateY(-50%);z-index:1;display:flex;align-items:center;justify-content:center}.icon-input-password{position:absolute;top:50%;right:13px;transform:translateY(-50%);cursor:pointer;z-index:1;display:flex;align-items:center;justify-content:center}.form-control{box-sizing:border-box;width:100%;padding:var(--Size-2, 8px);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:red;transition:border-color 0.3s ease-in-out;height:40px;outline:none;appearance:none;text-align:left}.form-control::placeholder{color:transparent;transition:color 0.2s ease-in-out}.form-control:focus::placeholder,.fixed-label-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.padding-icon{padding-left:40px}.input-container--has-icon label.label-bottom{left:40px}.input-container--has-icon .form-control:focus+label.label-bottom,.input-container--has-icon .form-control:not(:placeholder-shown)+label.label-bottom{left:0}.text-password{-webkit-text-security:disc;text-security:disc}label.label-bottom{position:absolute;font-weight:var(--font-weight-regular, 400);top:10px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);left:10px;transition:all 0.2s ease-in-out;pointer-events:none;overflow:hidden;width:90%;white-space:nowrap}.form-control:focus+label.label-bottom,.form-control:not(:placeholder-shown)+label.label-bottom{top:-22px;left:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);width:unset}.form-control:disabled+label.label-bottom{color:var(--Gray-Gray-400, #858ea6)}.form-control-helper{display:flex;position:absolute;top:100%;left:0;gap:4px;align-items:center;margin-top:4px}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}"}},[577,"dropi-input",{inputId:[1025,"input-id"],name:[513],label:[1025],placeholder:[1025],value:[1025],maxLength:[1026,"max-length"],disabled:[516],required:[516],showObligatoryAsterisk:[1028,"show-obligatory-asterisk"],fixedLabel:[4,"fixed-label"],inputMode:[1025,"input-mode"],passwordInput:[1028,"password-input"],isMoneyInput:[1028,"is-money-input"],isThousandSeparator:[1028,"is-thousand-separator"],isNumericInput:[1028,"is-numeric-input"],allowDecimals:[1028,"allow-decimals"],isLettersOnly:[1028,"is-letters-only"],icon:[1025],iconColor:[1025,"icon-color"],hasError:[1028,"has-error"],textHelper:[1025,"text-helper"],showHelperOnlyOnError:[1028,"show-helper-only-on-error"],inputProperties:[8,"input-properties"],showPassword:[32],touched:[32]},void 0,{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-input","dropi-icon"].forEach((e=>{switch(e){case"dropi-input":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||s()}}))}n();export{a as D,n as d}

package/dist/components/p-BBtJlnY0.js

@@ -1 +0,0 @@
-import{t as i,p as t,H as e,h as a}from"./index.js";import{d as s}from"./p-CL1y944C.js";const r=t(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow()}type="dropi";state="default";stateInsignia="verified";tagProduct=!1;basePath="/node_modules/@dropi/ui/assets/icons/ilustration";get insigniaIcons(){return{verified:`${this.basePath}/verified-new.svg`,premium:`${this.basePath}/premium-new.svg`,exclusive:`${this.basePath}/exclusive.svg`}}getIconName(i){return{success:"Check-circle",error:"Cross-circle",info:"Comment-round_info",warning:"Comment-round_info"}[i]||"Comment-round_info"}render(){return a("div",{key:"452266c0500ed2426ae0b0d7552a735c0022500b",class:"dropi-ilustration"},"dropi"===this.type&&a("figure",{key:"4ac1e8e482b5b80df9dceaa93630308b52d5db0d",class:"dropi-ilustration__image"},a("img",{key:"019a5c80798fc898a08ce851ab69b381d784e3f9",src:`${this.basePath}/${this.state&&"undefined"!==String(this.state)&&"null"!==String(this.state)?this.state:"default"}.svg`,alt:this.state??"default",onError:i=>{i.target.src=`${this.basePath}/default.svg`}})),"mb"===this.type&&a("figure",{key:"e7416f766fe3c0d633379bd9172ecfbb4b7f2a43",class:`dropi-ilustration__image-mb ${this.state}`},["success","error","info","warning"].includes(this.state)&&a("dropi-icon",{key:"c0fdd2564c0c0f821987cb13a519837a71afddbc",name:this.getIconName(this.state),iconWidth:"24px",iconHeight:"24px",color:"Neutral-White"})),"insignia"===this.type&&a("figure",{key:"8f1f4ace45532d06dbc38d34b3e1e32317d542b7",class:this.tagProduct?"dropi-ilustration-insignia-tag":"dropi-ilustration-insignia"},a("img",{key:"0d114a0b12bb3d31c222a34b09a47bd6a42e1dba",src:this.insigniaIcons[this.stateInsignia],alt:this.stateInsignia,onError:i=>{i.target.src=`${this.basePath}/default.svg`}}),this.tagProduct&&a("p",{key:"d1ef34a4fd92ee7b97a5a224d9a21b9e54976989",class:`tag tag--${this.stateInsignia}`},a("span",{key:"72ea7cef3bbc86f6330abb9c4f34c89e62ac3417",class:"Caption-S"},this.stateInsignia.charAt(0).toUpperCase()+this.stateInsignia.slice(1)))))}static get style(){return":host{display:inline-flex}.dropi-ilustration{display:inline-flex;align-items:center;justify-content:center}.dropi-ilustration__image,.dropi-ilustration-insignia{margin:0;display:flex;align-items:center;justify-content:center}.dropi-ilustration__image img{max-width:100%;height:auto}.dropi-ilustration__image-mb{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0}.dropi-ilustration__image-mb.success{background:var(--Success-Success-500, #22c55e)}.dropi-ilustration__image-mb.error{background:var(--Error-Error-500, #ef4444)}.dropi-ilustration__image-mb.info{background:var(--Info-Info-500, #3b82f6)}.dropi-ilustration__image-mb.warning{background:url('assets/icons/ilustration/bg-warning.svg') no-repeat center;background-size:contain;border-radius:0}.dropi-ilustration-insignia-tag{display:flex;align-items:center;margin:0}.dropi-ilustration-insignia-tag img{position:relative;z-index:2;height:32px;width:auto}.tag{border-radius:32px;color:var(--Neutral-White, #ffffff);text-transform:capitalize;margin:0 0 0 -20px;display:flex;align-items:center;justify-content:flex-start}.tag span{color:var(--Neutral-White, #ffffff);padding:4px 8px 4px 18px;font-size:var(--font-size-xxs)}.tag--verified{background:linear-gradient(90deg, #ffc10d 41.3%, #ff6102 112.32%)}.tag--premium{background:linear-gradient(90deg, #ff6102 56.52%, #ffc10d 107.25%)}.tag--exclusive{background:linear-gradient(90deg, var(--Gray-900, #0e111a) 26.09%, #ff6102 116.67%)}"}},[513,"dropi-ilustration-icon",{type:[1],state:[1],stateInsignia:[1,"state-insignia"],tagProduct:[4,"tag-product"],basePath:[1,"base-path"]}]);function n(){"undefined"!=typeof customElements&&["dropi-ilustration-icon","dropi-icon"].forEach((t=>{switch(t){case"dropi-ilustration-icon":customElements.get(i(t))||customElements.define(i(t),r);break;case"dropi-icon":customElements.get(i(t))||s()}}))}n();export{r as D,n as d}

package/dist/components/p-BIAfpLva.js

@@ -1 +0,0 @@
-import{t as i,p as t,H as e,h as a}from"./index.js";import{d as s}from"./p-C9mRfQtW.js";const r=t(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow()}type="dropi";state="default";stateInsignia="verified";tagProduct=!1;basePath="/node_modules/@dropi/ui/assets/icons/ilustration";get insigniaIcons(){return{verified:`${this.basePath}/verified-new.svg`,premium:`${this.basePath}/premium-new.svg`,exclusive:`${this.basePath}/exclusive.svg`}}getIconName(i){return{success:"Check-circle",error:"Cross-circle",info:"Comment-round_info",warning:"Comment-round_info"}[i]||"Comment-round_info"}render(){return a("div",{key:"452266c0500ed2426ae0b0d7552a735c0022500b",class:"dropi-ilustration"},"dropi"===this.type&&a("figure",{key:"4ac1e8e482b5b80df9dceaa93630308b52d5db0d",class:"dropi-ilustration__image"},a("img",{key:"019a5c80798fc898a08ce851ab69b381d784e3f9",src:`${this.basePath}/${this.state&&"undefined"!==String(this.state)&&"null"!==String(this.state)?this.state:"default"}.svg`,alt:this.state??"default",onError:i=>{i.target.src=`${this.basePath}/default.svg`}})),"mb"===this.type&&a("figure",{key:"e7416f766fe3c0d633379bd9172ecfbb4b7f2a43",class:`dropi-ilustration__image-mb ${this.state}`},["success","error","info","warning"].includes(this.state)&&a("dropi-icon",{key:"c0fdd2564c0c0f821987cb13a519837a71afddbc",name:this.getIconName(this.state),iconWidth:"24px",iconHeight:"24px",color:"Neutral-White"})),"insignia"===this.type&&a("figure",{key:"8f1f4ace45532d06dbc38d34b3e1e32317d542b7",class:this.tagProduct?"dropi-ilustration-insignia-tag":"dropi-ilustration-insignia"},a("img",{key:"0d114a0b12bb3d31c222a34b09a47bd6a42e1dba",src:this.insigniaIcons[this.stateInsignia],alt:this.stateInsignia,onError:i=>{i.target.src=`${this.basePath}/default.svg`}}),this.tagProduct&&a("p",{key:"d1ef34a4fd92ee7b97a5a224d9a21b9e54976989",class:`tag tag--${this.stateInsignia}`},a("span",{key:"72ea7cef3bbc86f6330abb9c4f34c89e62ac3417",class:"Caption-S"},this.stateInsignia.charAt(0).toUpperCase()+this.stateInsignia.slice(1)))))}static get style(){return":host{display:inline-flex}.dropi-ilustration{display:inline-flex;align-items:center;justify-content:center}.dropi-ilustration__image,.dropi-ilustration-insignia{margin:0;display:flex;align-items:center;justify-content:center}.dropi-ilustration__image img{max-width:100%;height:auto}.dropi-ilustration__image-mb{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0}.dropi-ilustration__image-mb.success{background:var(--Success-Success-500, #22c55e)}.dropi-ilustration__image-mb.error{background:var(--Error-Error-500, #ef4444)}.dropi-ilustration__image-mb.info{background:var(--Info-Info-500, #3b82f6)}.dropi-ilustration__image-mb.warning{background:url('assets/icons/ilustration/bg-warning.svg') no-repeat center;background-size:contain;border-radius:0}.dropi-ilustration-insignia-tag{display:flex;align-items:center;margin:0}.dropi-ilustration-insignia-tag img{position:relative;z-index:2;height:32px;width:auto}.tag{border-radius:32px;color:var(--Neutral-White, #ffffff);text-transform:capitalize;margin:0 0 0 -20px;display:flex;align-items:center;justify-content:flex-start}.tag span{color:var(--Neutral-White, #ffffff);padding:4px 8px 4px 18px;font-size:var(--font-size-xxs)}.tag--verified{background:linear-gradient(90deg, #ffc10d 41.3%, #ff6102 112.32%)}.tag--premium{background:linear-gradient(90deg, #ff6102 56.52%, #ffc10d 107.25%)}.tag--exclusive{background:linear-gradient(90deg, var(--Gray-900, #0e111a) 26.09%, #ff6102 116.67%)}"}},[513,"dropi-ilustration-icon",{type:[1],state:[1],stateInsignia:[1,"state-insignia"],tagProduct:[4,"tag-product"],basePath:[1,"base-path"]}]);function n(){"undefined"!=typeof customElements&&["dropi-ilustration-icon","dropi-icon"].forEach((t=>{switch(t){case"dropi-ilustration-icon":customElements.get(i(t))||customElements.define(i(t),r);break;case"dropi-icon":customElements.get(i(t))||s()}}))}n();export{r as D,n as d}

package/dist/components/p-BJzJ1Wch.js

@@ -1 +0,0 @@
-import{t,p as e,H as i,c as o,h as r}from"./index.js";import{d as s}from"./p-BxQ2iEWd.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dropiInput=o(this,"dropiInput"),this.dropiChange=o(this,"dropiChange"),this.dropiFocus=o(this,"dropiFocus"),this.dropiBlur=o(this,"dropiBlur"),this.internals=this.attachInternals()}internals;inputId="";name="";label="";placeholder=" ";value="";maxLength;disabled=!1;required=!1;showObligatoryAsterisk=!0;fixedLabel=!1;inputMode="text";passwordInput=!1;isMoneyInput=!1;isThousandSeparator=!1;isNumericInput=!1;allowDecimals=!1;isLettersOnly=!1;icon="";iconColor="Gray-Gray-400";hasError=!1;textHelper="";showHelperOnlyOnError=!1;inputProperties=null;showPassword=!1;touched=!1;dropiInput;dropiChange;dropiFocus;dropiBlur;inputPropertiesChanged(t){t&&(void 0!==t.id&&(this.inputId=t.id),void 0!==t.inputId&&(this.inputId=t.inputId),void 0!==t.label&&(this.label=t.label),void 0!==t.placeholder&&(this.placeholder=t.placeholder),void 0!==t.maxLength&&(this.maxLength=t.maxLength),void 0!==t.textHelper&&(this.textHelper=t.textHelper),void 0!==t.passwordInput&&(this.passwordInput=t.passwordInput),void 0!==t.isPasswordInput&&(this.passwordInput=t.isPasswordInput),void 0!==t.icon&&(this.icon=t.icon),void 0!==t.iconColor&&(this.iconColor=t.iconColor),void 0!==t.isMoneyInput&&(this.isMoneyInput=t.isMoneyInput),void 0!==t.showObligatoryAsterisk&&(this.showObligatoryAsterisk=t.showObligatoryAsterisk),void 0!==t.isNumericInput&&(this.isNumericInput=t.isNumericInput),void 0!==t.allowDecimals&&(this.allowDecimals=t.allowDecimals),void 0!==t.isThousandSeparator&&(this.isThousandSeparator=t.isThousandSeparator),void 0!==t.showHelperOnlyOnError&&(this.showHelperOnlyOnError=t.showHelperOnlyOnError),void 0!==t.isLettersOnly&&(this.isLettersOnly=t.isLettersOnly),void 0!==t.inputMode&&(this.inputMode=t.inputMode))}valueChanged(t){this.internals.setFormValue(t)}disabledChanged(t){this.internals.setValidity(t?{customError:!0}:{},t?"Field is disabled":"")}componentWillLoad(){this.internals.setFormValue(this.value??""),this.inputProperties&&this.inputPropertiesChanged(this.inputProperties)}handleInput(t){let e=t.target.value;this.isNumericInput&&(e=this.filterNumbers(e)),this.isLettersOnly&&(e=this.filterLetters(e)),(this.isMoneyInput||this.isThousandSeparator)&&(e=this.formatThousands(e,this.isMoneyInput)),this.value=e,this.internals.setFormValue(e),this.dropiInput.emit(e),this.dropiChange.emit(e)}handleKeyDown(t){(this.isNumericInput||this.isMoneyInput||this.isThousandSeparator)&&!this.isAllowedNumberKey(t)&&t.preventDefault(),this.isLettersOnly&&!this.isAllowedLetterKey(t)&&t.preventDefault()}handleFocus(){this.dropiFocus.emit()}handleBlur(){this.touched=!0,this.dropiBlur.emit()}togglePassword(){this.disabled||(this.showPassword=!this.showPassword)}filterNumbers(t){return t.replace(this.allowDecimals?/[^0-9.]/g:/[^0-9]/g,"")}filterLetters(t){return t.replace(/[^a-zA-ZáéíóúÁÉÍÓÚñÑüÜ\s]/g,"")}isAllowedNumberKey(t){return!!(["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"].includes(t.key)||t.ctrlKey||t.metaKey||/^[0-9]$/.test(t.key)||this.allowDecimals&&"."===t.key)}isAllowedLetterKey(t){return!!["Backspace","Delete","ArrowLeft","ArrowRight","Tab","Enter","Home","End"," "].includes(t.key)||!(!t.ctrlKey&&!t.metaKey)||/^[a-zA-ZáéíóúÁÉÍÓÚñÑüÜ]$/.test(t.key)}formatThousands(t,e){const i=t.replace(/[^0-9.]/g,""),[o,r]=i.split("."),s=o.replace(/\B(?=(\d{3})+(?!\d))/g,","),a=void 0!==r?`${s}.${r}`:s;return e?`$${a}`:a}get resolvedId(){return this.inputId||this.label}get inputType(){return this.passwordInput?this.showPassword?"text":"password":"text"}get showHelper(){return!!this.textHelper&&(!this.showHelperOnlyOnError||this.hasError&&this.touched)}get isInvalid(){return this.hasError&&this.touched}render(){const t=this.required&&this.showObligatoryAsterisk&&!this.disabled,e=!!this.icon;return r("div",{key:"e4c796c7993efaff51795c1bd98e5ebdd8d290b9",class:{"fixed-label-container":this.fixedLabel}},this.fixedLabel&&r("div",{key:"4beb27652c590c5eeda86ca86bd91695eebc9a28",class:"input-label Body-S-Regular"},this.label,t&&r("span",{key:"907fb3444cdd81b2573c120cf11d03d9eb43abf5",class:"asterisk"}," *")),r("div",{key:"57f9b151ed4588f8907b5d7eb167c7a6db6d1d20",class:"form-group"},r("div",{key:"5d9f1e8d9f02af3b44285c8af32cce234678a16c",class:{"input-container":!0,"input-container--has-icon":e}},e&&r("dropi-icon",{key:"7ed928ebce2196a0b31a7b1b620670b6c7b1047c",class:"icon-input",name:this.icon,color:this.iconColor,iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"}}),this.passwordInput&&r("dropi-icon",{key:"9c69320fd760eb8a41f375d902e5fb371cf024f3",class:"icon-input-password",name:this.showPassword?"Eye":"Eye-crossed",iconWidth:"20px",iconHeight:"20px",style:{width:"20px",height:"20px"},color:"Gray-Gray-500",onClick:()=>this.togglePassword()}),r("input",{key:"c3e958c4e7293b1c96425fb2f23b9150d8e22b1b",id:this.resolvedId,class:{"form-control":!0,"form-control-valid":!this.isInvalid&&this.touched&&!!this.value,"form-control-invalid":this.isInvalid,"padding-icon":e,"text-password":this.passwordInput&&!this.showPassword,"fixed-label-input":this.fixedLabel},type:this.inputType,value:this.value,placeholder:this.fixedLabel?this.placeholder:" ",disabled:this.disabled,required:this.required,maxLength:this.maxLength,inputMode:this.inputMode,"data-cy":void 0,onInput:t=>this.handleInput(t),onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.handleFocus(),onBlur:()=>this.handleBlur()}),!this.fixedLabel&&r("label",{key:"6c04977ffa24ee362830bb5dc8c3b2600e19c3c0",class:"Body-S-Regular label-bottom",htmlFor:this.resolvedId},this.label,t&&r("span",{key:"98361181d292d929c438c3dd70c920db510499ef",class:"asterisk"}," *")),this.showHelper&&r("div",{key:"21a2e9229eb21a8c0b48ec51a609a143ee8ba2c4",class:"form-control-helper"},this.isInvalid&&r("dropi-icon",{key:"18d18c43c8ea7c35ac5d4a294cbb36a8e05930fc",name:"Warning-circle",iconWidth:"12px",iconHeight:"12px",color:"Error-Error-500"}),r("span",{key:"1c684fa4c25ef0afb852592ca1e2fb059e0db491",class:{"disabled-helper":this.disabled,"invalid-color":this.isInvalid}},this.textHelper)))))}static get formAssociated(){return!0}static get watchers(){return{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.fixed-label-container{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:8px}.input-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);text-align:left}.asterisk{color:var(--Error-Error-500, #f46a6b)}.form-group{position:relative;width:100%}.input-container{position:relative}.icon-input{position:absolute;top:50%;left:12px;transform:translateY(-50%);z-index:1;display:flex;align-items:center;justify-content:center}.icon-input-password{position:absolute;top:50%;right:13px;transform:translateY(-50%);cursor:pointer;z-index:1;display:flex;align-items:center;justify-content:center}.form-control{box-sizing:border-box;width:100%;padding:var(--Size-2, 8px);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);transition:border-color 0.3s ease-in-out;height:40px;outline:none;appearance:none;text-align:left}.form-control::placeholder{color:transparent;transition:color 0.2s ease-in-out}.form-control:focus::placeholder,.fixed-label-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.padding-icon{padding-left:40px}.input-container--has-icon label.label-bottom{left:40px}.input-container--has-icon .form-control:focus+label.label-bottom,.input-container--has-icon .form-control:not(:placeholder-shown)+label.label-bottom{left:0}.text-password{-webkit-text-security:disc;text-security:disc}label.label-bottom{position:absolute;font-weight:var(--font-weight-regular, 400);top:10px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);left:10px;transition:all 0.2s ease-in-out;pointer-events:none;overflow:hidden;width:90%;white-space:nowrap}.form-control:focus+label.label-bottom,.form-control:not(:placeholder-shown)+label.label-bottom{top:-22px;left:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);width:unset}.form-control:disabled+label.label-bottom{color:var(--Gray-Gray-400, #858ea6)}.form-control-helper{display:flex;position:absolute;top:100%;left:0;gap:4px;align-items:center;margin-top:4px}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}"}},[577,"dropi-input",{inputId:[1025,"input-id"],name:[513],label:[1025],placeholder:[1025],value:[1025],maxLength:[1026,"max-length"],disabled:[516],required:[516],showObligatoryAsterisk:[1028,"show-obligatory-asterisk"],fixedLabel:[4,"fixed-label"],inputMode:[1025,"input-mode"],passwordInput:[1028,"password-input"],isMoneyInput:[1028,"is-money-input"],isThousandSeparator:[1028,"is-thousand-separator"],isNumericInput:[1028,"is-numeric-input"],allowDecimals:[1028,"allow-decimals"],isLettersOnly:[1028,"is-letters-only"],icon:[1025],iconColor:[1025,"icon-color"],hasError:[1028,"has-error"],textHelper:[1025,"text-helper"],showHelperOnlyOnError:[1028,"show-helper-only-on-error"],inputProperties:[8,"input-properties"],showPassword:[32],touched:[32]},void 0,{inputProperties:[{inputPropertiesChanged:0}],value:[{valueChanged:0}],disabled:[{disabledChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-input","dropi-icon"].forEach((e=>{switch(e){case"dropi-input":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||s()}}))}n();export{a as D,n as d}

package/dist/components/p-Bp2-jUNL.js

@@ -1 +0,0 @@
-import{t as i,p as t,H as e,h as a}from"./index.js";import{d as s}from"./p-BxQ2iEWd.js";const r=t(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow()}type="dropi";state="default";stateInsignia="verified";tagProduct=!1;basePath="/node_modules/@dropi/ui/assets/icons/ilustration";get insigniaIcons(){return{verified:`${this.basePath}/verified-new.svg`,premium:`${this.basePath}/premium-new.svg`,exclusive:`${this.basePath}/exclusive.svg`}}getIconName(i){return{success:"Check-circle",error:"Cross-circle",info:"Comment-round_info",warning:"Comment-round_info"}[i]||"Comment-round_info"}render(){return a("div",{key:"452266c0500ed2426ae0b0d7552a735c0022500b",class:"dropi-ilustration"},"dropi"===this.type&&a("figure",{key:"4ac1e8e482b5b80df9dceaa93630308b52d5db0d",class:"dropi-ilustration__image"},a("img",{key:"019a5c80798fc898a08ce851ab69b381d784e3f9",src:`${this.basePath}/${this.state&&"undefined"!==String(this.state)&&"null"!==String(this.state)?this.state:"default"}.svg`,alt:this.state??"default",onError:i=>{i.target.src=`${this.basePath}/default.svg`}})),"mb"===this.type&&a("figure",{key:"e7416f766fe3c0d633379bd9172ecfbb4b7f2a43",class:`dropi-ilustration__image-mb ${this.state}`},["success","error","info","warning"].includes(this.state)&&a("dropi-icon",{key:"c0fdd2564c0c0f821987cb13a519837a71afddbc",name:this.getIconName(this.state),iconWidth:"24px",iconHeight:"24px",color:"Neutral-White"})),"insignia"===this.type&&a("figure",{key:"8f1f4ace45532d06dbc38d34b3e1e32317d542b7",class:this.tagProduct?"dropi-ilustration-insignia-tag":"dropi-ilustration-insignia"},a("img",{key:"0d114a0b12bb3d31c222a34b09a47bd6a42e1dba",src:this.insigniaIcons[this.stateInsignia],alt:this.stateInsignia,onError:i=>{i.target.src=`${this.basePath}/default.svg`}}),this.tagProduct&&a("p",{key:"d1ef34a4fd92ee7b97a5a224d9a21b9e54976989",class:`tag tag--${this.stateInsignia}`},a("span",{key:"72ea7cef3bbc86f6330abb9c4f34c89e62ac3417",class:"Caption-S"},this.stateInsignia.charAt(0).toUpperCase()+this.stateInsignia.slice(1)))))}static get style(){return":host{display:inline-flex}.dropi-ilustration{display:inline-flex;align-items:center;justify-content:center}.dropi-ilustration__image,.dropi-ilustration-insignia{margin:0;display:flex;align-items:center;justify-content:center}.dropi-ilustration__image img{max-width:100%;height:auto}.dropi-ilustration__image-mb{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0}.dropi-ilustration__image-mb.success{background:var(--Success-Success-500, #22c55e)}.dropi-ilustration__image-mb.error{background:var(--Error-Error-500, #ef4444)}.dropi-ilustration__image-mb.info{background:var(--Info-Info-500, #3b82f6)}.dropi-ilustration__image-mb.warning{background:url('assets/icons/ilustration/bg-warning.svg') no-repeat center;background-size:contain;border-radius:0}.dropi-ilustration-insignia-tag{display:flex;align-items:center;margin:0}.dropi-ilustration-insignia-tag img{position:relative;z-index:2;height:32px;width:auto}.tag{border-radius:32px;color:var(--Neutral-White, #ffffff);text-transform:capitalize;margin:0 0 0 -20px;display:flex;align-items:center;justify-content:flex-start}.tag span{color:var(--Neutral-White, #ffffff);padding:4px 8px 4px 18px;font-size:var(--font-size-xxs)}.tag--verified{background:linear-gradient(90deg, #ffc10d 41.3%, #ff6102 112.32%)}.tag--premium{background:linear-gradient(90deg, #ff6102 56.52%, #ffc10d 107.25%)}.tag--exclusive{background:linear-gradient(90deg, var(--Gray-900, #0e111a) 26.09%, #ff6102 116.67%)}"}},[513,"dropi-ilustration-icon",{type:[1],state:[1],stateInsignia:[1,"state-insignia"],tagProduct:[4,"tag-product"],basePath:[1,"base-path"]}]);function n(){"undefined"!=typeof customElements&&["dropi-ilustration-icon","dropi-icon"].forEach((t=>{switch(t){case"dropi-ilustration-icon":customElements.get(i(t))||customElements.define(i(t),r);break;case"dropi-icon":customElements.get(i(t))||s()}}))}n();export{r as D,n as d}

package/dist/components/p-BwOjDv2h.js

@@ -1 +0,0 @@
-import{t as e,p as t,H as i,c as s,h as o}from"./index.js";const r=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=s(this,"dropiChange"),this.internals=this.attachInternals()}internals;name;isChecked=!1;disabled=!1;dropiChange;checkedChanged(e){this.internals.setFormValue(e?"on":null)}componentWillLoad(){this.internals.setFormValue(this.isChecked?"on":null)}onToggleChange(e){this.isChecked=e.target.checked,this.dropiChange.emit(this.isChecked)}render(){return o("label",{key:"bb9809e03c3f5f4f6892731d7147eda5313a799b",class:"toggle-switch"},o("input",{key:"b0be8bb8c22705ae04ca6f12d2009bac0c6cd629",type:"checkbox",checked:this.isChecked,disabled:this.disabled,onChange:e=>this.onToggleChange(e)}),o("span",{key:"4073dacb4c17d1fdc2009a9e7329caffade3c932",class:"slider"}))}static get formAssociated(){return!0}static get watchers(){return{isChecked:[{checkedChanged:0}]}}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.toggle-switch{position:relative;display:inline-block;width:40px;height:21px;margin-bottom:0;cursor:pointer}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--Gray-Gray-200, #c3c9d9);transition:0.4s;border-radius:34px}.slider::before{position:absolute;content:'';height:17px;width:17px;left:3px;bottom:2px;background-color:var(--Neutral-White, #ffffff);transition:0.4s;border-radius:50%}input:checked+.slider{background-color:var(--Primary-Primary-500, #f49a3d)}input:checked+.slider::before{transform:translateX(17px)}:host([disabled]) .toggle-switch{cursor:not-allowed;opacity:0.5}"}},[577,"dropi-switch",{name:[513],isChecked:[1540,"is-checked"],disabled:[516]},void 0,{isChecked:[{checkedChanged:0}]}]);function c(){"undefined"!=typeof customElements&&["dropi-switch"].forEach((t=>{"dropi-switch"===t&&(customElements.get(e(t))||customElements.define(e(t),r))}))}c();export{r as D,c as d}

package/dist/components/p-BxQ2iEWd.js

@@ -1 +0,0 @@
-import{t,p as i,H as e,h as s}from"./index.js";const o=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}get el(){return this}name="";iconWidth="20px";iconHeight="20px";color="currentColor";strokeWidth="";spritePath="/assets/icons/symbol/svg/sprite.css.svg";widthChanged(){this.updateHostStyles()}heightChanged(){this.updateHostStyles()}colorChanged(){this.applyColor()}strokeWidthChanged(){this.applyStrokeWidth()}componentWillLoad(){this.applyColor(),this.applyStrokeWidth(),this.updateHostStyles()}componentDidUpdate(){this.updateHostStyles()}applyStrokeWidth(){this.strokeWidth&&this.el.style.setProperty("--icon-stroke-width",this.strokeWidth)}updateHostStyles(){this.el.style.width=this.iconWidth,this.el.style.height=this.iconHeight}applyColor(){if(!this.color)return;const t=this.color.startsWith("#")?this.color:"currentColor"===this.color?"currentColor":`var(--${this.color})`;this.el.style.setProperty("--icon-fill",t)}render(){return s("svg",{key:"300cdf35e749ffb9f37be17271dc604752cee052",width:this.iconWidth,height:this.iconHeight,class:{spin:"Spinner"===(this.name??"")},"aria-hidden":"true"},s("use",{key:"f5bd74b218c26094e7d1e2b2b825a3fa90f66e11",href:`${this.spritePath}#${this.name??""}`}))}static get watchers(){return{iconWidth:[{widthChanged:0}],iconHeight:[{heightChanged:0}],color:[{colorChanged:0}],strokeWidth:[{strokeWidthChanged:0}]}}static get style(){return":host{display:inline-flex;align-items:center;justify-content:center;fill:var(--icon-fill, currentColor);overflow:hidden}svg{fill:inherit;stroke:var(--icon-fill, currentColor);stroke-width:var(--icon-stroke-width, 0);display:block;width:100%;height:100%;vertical-align:middle}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}"}},[513,"dropi-icon",{name:[1],iconWidth:[1,"icon-width"],iconHeight:[1,"icon-height"],color:[1],strokeWidth:[1,"stroke-width"],spritePath:[1,"sprite-path"]},void 0,{iconWidth:[{widthChanged:0}],iconHeight:[{heightChanged:0}],color:[{colorChanged:0}],strokeWidth:[{strokeWidthChanged:0}]}]);function h(){"undefined"!=typeof customElements&&["dropi-icon"].forEach((i=>{"dropi-icon"===i&&(customElements.get(t(i))||customElements.define(t(i),o))}))}h();export{o as D,h as d}