npm - @dropi/ui - Versions diffs - 0.1.24 → 0.1.26 - Mend

@dropi/ui 0.1.24 → 0.1.26

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

Files changed (491) hide show

package/dist/dropi-ui/dropi-paginator.entry.js ADDED Viewed

@@ -0,0 +1,70 @@
+import { r as registerInstance, d as createEvent, h } from './index-Cvp2LQOM.js';
+const dropiPaginatorCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.paginator{display:flex;align-items:center;justify-content:flex-end;gap:var(--Size-4, 16px);flex-wrap:wrap}.paginator-pages{display:flex;align-items:center;gap:var(--Size-1, 4px)}.paginator-btn{width:32px;height:32px;padding:0;border:none;border-radius:50%;background:transparent;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background 0.15s ease}.paginator-btn:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.paginator-btn:disabled{opacity:0.4;cursor:not-allowed}.paginator-btn--active{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.paginator-btn--active:hover{background:var(--Primary-Primary-500, #f49a3d)}.paginator-btn--arrow{width:auto;padding:0 var(--Size-2, 8px);border-radius:var(--Border-1, 4px);gap:4px}.paginator-btn--arrow:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.paginator-label{font-size:var(--font-size-s, 12px);color:inherit}.paginator-ellipsis{color:var(--Gray-Gray-400, #858ea6);padding:0 4px;font-size:var(--font-size-s, 12px);display:flex;align-items:center}.paginator-size{display:flex;align-items:center;gap:var(--Size-2, 8px)}.paginator-size-label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c)}.paginator-size-select{height:32px;padding:0 var(--Size-2, 8px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-1, 4px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:inherit;cursor:pointer;outline:none}`;
+const DropiPaginator = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.pageChange = createEvent(this, "pageChange", 7);
+    }
+    /** Total number of pages */
+    totalPages = 1;
+    /** Current page (1-based) */
+    currentPage = 1;
+    /** Disabled state */
+    disabled = false;
+    /** Max page buttons to show at once */
+    maxVisiblePages = 8;
+    /** Hide total page count (show only arrows) */
+    isNotTotalPages = false;
+    /** Hide "Anterior"/"Siguiente" text labels, show only arrows */
+    noLabels = false;
+    /** Emitted when page changes. e.detail = new page number */
+    pageChange;
+    get pageNumbers() {
+        const total = this.totalPages;
+        const cur = this.currentPage;
+        const max = this.maxVisiblePages;
+        if (total <= max)
+            return Array.from({ length: total }, (_, i) => i + 1);
+        const half = Math.floor(max / 2);
+        let start = Math.max(1, cur - half);
+        let end = Math.min(total, start + max - 1);
+        if (end - start < max - 1)
+            start = Math.max(1, end - max + 1);
+        const pages = [];
+        if (start > 1) {
+            pages.push(1);
+            if (start > 2)
+                pages.push('...');
+        }
+        for (let i = start; i <= end; i++)
+            pages.push(i);
+        if (end < total) {
+            if (end < total - 1)
+                pages.push('...');
+            pages.push(total);
+        }
+        return pages;
+    }
+    goTo(p) {
+        if (this.disabled || p < 1 || p > this.totalPages || p === this.currentPage)
+            return;
+        this.currentPage = p;
+        this.pageChange.emit(this.currentPage);
+    }
+    render() {
+        const pages = this.pageNumbers;
+        const isFirst = this.currentPage <= 1;
+        const isLast = this.currentPage >= this.totalPages;
+        return (h("div", { key: 'b601f88e4f971f885835d81fe876303fe97027c7', class: "paginator" }, h("div", { key: '988ffb7ed122d4a666af4525bc85159d8d36538a', class: "paginator-pages" }, !isFirst && !this.noLabels && (h("button", { key: '920a1a407782bde436fb6560caeb39848e9c7e28', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(1), "aria-label": "Primera p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: '67bc6ba66852a8883a19b2a3182be3cb298f2c8d', name: "Arrow-double-small-left", width: "16px", height: "16px", color: "Gray-Gray-600" }))), !isFirst && (h("button", { key: 'b1d0c5a8f66056cb53c31b01959177754632a906', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage - 1), "aria-label": "Anterior", disabled: this.disabled }, h("dropi-icon", { key: '951435cbf9b7a8b9bd0e0f33d2c9eacaea6e7af1', name: "Dropdown-left", width: "16px", height: "16px", color: "Gray-Gray-600" }), !this.noLabels && h("span", { key: 'fed8a203b3e62f5da3e6fa055b1ee6e35453147c', class: "paginator-label" }, "Anterior"))), pages.map((p, i) => p === '...'
+            ? h("span", { class: "paginator-ellipsis", key: `e${i}` }, "\u2026")
+            : h("button", { key: p, class: { 'paginator-btn': true, 'paginator-btn--active': p === this.currentPage }, onClick: () => this.goTo(p), "aria-current": p === this.currentPage ? 'page' : undefined, disabled: this.disabled }, p)), !isLast && (h("button", { key: '35a728e031880403ee0ff984484237ab701bd406', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage + 1), "aria-label": "Siguiente", disabled: this.disabled }, !this.noLabels && h("span", { key: '4a73ba225105e449f8dfe8a504c5b1ad3e9c31cd', class: "paginator-label" }, "Siguiente"), h("dropi-icon", { key: '7b140df9437922acc8c24d6ee1ff15d69ce7b7f1', name: "Dropdown-Right", width: "16px", height: "16px", color: "Gray-Gray-600" }))), !isLast && !this.noLabels && (h("button", { key: '6157fa189ca011be4c13da803d2cd110d882bb8e', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.totalPages), "aria-label": "\u00DAltima p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: '7b6c1b31d4caed8203b739cc10f3084568e40f10', name: "Arrow-double-small-right", width: "16px", height: "16px", color: "Gray-Gray-600" }))))));
+    }
+};
+DropiPaginator.style = dropiPaginatorCss();
+export { DropiPaginator as dropi_paginator };
+//# sourceMappingURL=dropi-paginator.entry.esm.js.map
+//# sourceMappingURL=dropi-paginator.entry.js.map

package/dist/dropi-ui/dropi-paginator.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"dropi-paginator.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-paginator/dropi-paginator.css?tag=dropi-paginator&encapsulation=shadow","src/components/dropi-paginator/dropi-paginator.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n*, *::before, *::after { box-sizing: border-box; }\n\n.paginator {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: var(--Size-4, 16px);\n flex-wrap: wrap;\n}\n\n.paginator-pages {\n display: flex;\n align-items: center;\n gap: var(--Size-1, 4px);\n}\n\n.paginator-btn {\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: 50%;\n background: transparent;\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.15s ease;\n}\n\n.paginator-btn:hover:not(:disabled) {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.paginator-btn:disabled {\n opacity: 0.4;\n cursor: not-allowed;\n}\n\n.paginator-btn--active {\n background: var(--Primary-Primary-500, #f49a3d);\n color: var(--Neutral-White, #ffffff);\n font-weight: var(--font-weight-bold, 700);\n}\n\n.paginator-btn--active:hover {\n background: var(--Primary-Primary-500, #f49a3d);\n}\n\n.paginator-btn--arrow {\n width: auto;\n padding: 0 var(--Size-2, 8px);\n border-radius: var(--Border-1, 4px);\n gap: 4px;\n}\n\n.paginator-btn--arrow:hover:not(:disabled) {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.paginator-label {\n font-size: var(--font-size-s, 12px);\n color: inherit;\n}\n\n.paginator-ellipsis {\n color: var(--Gray-Gray-400, #858ea6);\n padding: 0 4px;\n font-size: var(--font-size-s, 12px);\n display: flex;\n align-items: center;\n}\n\n.paginator-size {\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n}\n\n.paginator-size-label {\n font-size: var(--font-size-s, 12px);\n color: var(--Gray-Gray-500, #69738c);\n}\n\n.paginator-size-select {\n height: 32px;\n padding: 0 var(--Size-2, 8px);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-1, 4px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n cursor: pointer;\n outline: none;\n}\n","import { Component, Prop, Event, EventEmitter, h } from '@stencil/core';\n\n/**\n * @component dropi-paginator\n * Pagination control with page numbers, prev/next buttons and items-per-page selector.\n */\n@Component({\n tag: 'dropi-paginator',\n styleUrl: 'dropi-paginator.css',\n shadow: true,\n})\nexport class DropiPaginator {\n /** Total number of pages */\n @Prop() totalPages: number = 1;\n /** Current page (1-based) */\n @Prop({ mutable: true, reflect: true }) currentPage: number = 1;\n /** Disabled state */\n @Prop() disabled: boolean = false;\n /** Max page buttons to show at once */\n @Prop() maxVisiblePages: number = 8;\n /** Hide total page count (show only arrows) */\n @Prop() isNotTotalPages: boolean = false;\n /** Hide \"Anterior\"/\"Siguiente\" text labels, show only arrows */\n @Prop() noLabels: boolean = false;\n\n /** Emitted when page changes. e.detail = new page number */\n @Event() pageChange: EventEmitter<number>;\n\n private get pageNumbers(): (number | '...')[] {\n const total = this.totalPages;\n const cur = this.currentPage;\n const max = this.maxVisiblePages;\n\n if (total <= max) return Array.from({ length: total }, (_, i) => i + 1);\n\n const half = Math.floor(max / 2);\n let start = Math.max(1, cur - half);\n let end = Math.min(total, start + max - 1);\n if (end - start < max - 1) start = Math.max(1, end - max + 1);\n\n const pages: (number | '...')[] = [];\n if (start > 1) { pages.push(1); if (start > 2) pages.push('...'); }\n for (let i = start; i <= end; i++) pages.push(i);\n if (end < total) { if (end < total - 1) pages.push('...'); pages.push(total); }\n return pages;\n }\n\n private goTo(p: number) {\n if (this.disabled || p < 1 || p > this.totalPages || p === this.currentPage) return;\n this.currentPage = p;\n this.pageChange.emit(this.currentPage);\n }\n\n render() {\n const pages = this.pageNumbers;\n const isFirst = this.currentPage <= 1;\n const isLast = this.currentPage >= this.totalPages;\n\n return (\n <div class=\"paginator\">\n <div class=\"paginator-pages\">\n {!isFirst && !this.noLabels && (\n <button\n class={{ 'paginator-btn': true, 'paginator-btn--arrow': true }}\n onClick={() => this.goTo(1)}\n aria-label=\"Primera página\"\n disabled={this.disabled}\n >\n <dropi-icon name=\"Arrow-double-small-left\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-600\" />\n </button>\n )}\n\n {!isFirst && (\n <button\n class={{ 'paginator-btn': true, 'paginator-btn--arrow': true }}\n onClick={() => this.goTo(this.currentPage - 1)}\n aria-label=\"Anterior\"\n disabled={this.disabled}\n >\n <dropi-icon name=\"Dropdown-left\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-600\" />\n {!this.noLabels && <span class=\"paginator-label\">Anterior</span>}\n </button>\n )}\n\n {pages.map((p, i) =>\n p === '...'\n ? <span class=\"paginator-ellipsis\" key={`e${i}`}>…</span>\n : <button\n key={p}\n class={{ 'paginator-btn': true, 'paginator-btn--active': p === this.currentPage }}\n onClick={() => this.goTo(p as number)}\n aria-current={p === this.currentPage ? 'page' : undefined}\n disabled={this.disabled}\n >\n {p}\n </button>\n )}\n\n {!isLast && (\n <button\n class={{ 'paginator-btn': true, 'paginator-btn--arrow': true }}\n onClick={() => this.goTo(this.currentPage + 1)}\n aria-label=\"Siguiente\"\n disabled={this.disabled}\n >\n {!this.noLabels && <span class=\"paginator-label\">Siguiente</span>}\n <dropi-icon name=\"Dropdown-Right\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-600\" />\n </button>\n )}\n\n {!isLast && !this.noLabels && (\n <button\n class={{ 'paginator-btn': true, 'paginator-btn--arrow': true }}\n onClick={() => this.goTo(this.totalPages)}\n aria-label=\"Última página\"\n disabled={this.disabled}\n >\n <dropi-icon name=\"Arrow-double-small-right\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-600\" />\n </button>\n )}\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-phone-input.entry.js RENAMED Viewed

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

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

@@ -0,0 +1 @@

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

package/dist/{esm → dropi-ui}/dropi-radio-button.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, d as createEvent, h } from './index-Cvp2LQOM.js';
 const dropiRadioButtonCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}`;
@@ -43,3 +43,6 @@ const DropiRadioButton = class {
 DropiRadioButton.style = dropiRadioButtonCss();
 export { DropiRadioButton as dropi_radio_button };
+//# sourceMappingURL=dropi-radio-button.entry.esm.js.map
+//# sourceMappingURL=dropi-radio-button.entry.js.map

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

@@ -0,0 +1 @@

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

package/dist/{esm → dropi-ui}/dropi-radio-selection-list.entry.js RENAMED Viewed

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

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

@@ -0,0 +1 @@

+ {"file":"dropi-radio-selection-list.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-radio-selection-list/dropi-radio-selection-list.css?tag=dropi-radio-selection-list&encapsulation=shadow","src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx"],"sourcesContent":[":host { display: block; width: 100%; }\n*, *::before, *::after { box-sizing: border-box; }\n\n.rsl__search {\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n padding: var(--Size-2, 8px) var(--Size-3, 12px);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n margin-bottom: var(--Size-2, 8px);\n}\n\n.rsl__search-input {\n flex: 1;\n border: none;\n outline: none;\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n background: transparent;\n}\n\n.rsl__list { display: flex; flex-direction: column; gap: var(--Size-2, 8px); }\n\n.rsl__item {\n display: flex;\n align-items: flex-start;\n gap: var(--Size-3, 12px);\n padding: var(--Size-3, 12px);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n cursor: pointer;\n transition: border-color 0.15s, background 0.15s;\n}\n\n.rsl__item:hover { background: var(--Gray-Gray-50, #f7f8fa); }\n.rsl__item--selected { border-color: var(--Primary-Primary-500, #f49a3d); background: var(--Primary-Primary-50, #fff5eb); }\n\n.rsl__radio {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n border: 2px solid var(--Gray-Gray-300, #a3abbf);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n margin-top: 3px;\n transition: border-color 0.15s;\n}\n\n.rsl__radio--checked { border-color: var(--Primary-Primary-500, #f49a3d); }\n\n.rsl__radio-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--Primary-Primary-500, #f49a3d);\n}\n\n.rsl__content { display: flex; flex-direction: column; gap: 2px; }\n.rsl__name { font-size: var(--font-size-s, 12px); color: var(--Gray-Gray-700, #32394d); }\n.rsl__desc { font-size: var(--font-size-xs, 10px); line-height: 1.4; color: var(--Gray-Gray-500, #69738c); }\n","import { Component, Prop, State, Event, EventEmitter, Watch, h } from '@stencil/core';\n\nexport interface RadioOption {\n id: string | number;\n name: string;\n description?: string;\n icon?: string;\n [key: string]: any;\n}\n\n/**\n * @component dropi-radio-selection-list\n * List of radio button options with optional search filter.\n */\n@Component({\n tag: 'dropi-radio-selection-list',\n styleUrl: 'dropi-radio-selection-list.css',\n shadow: true,\n})\nexport class DropiRadioSelectionList {\n /** Options array or JSON string */\n @Prop() options: RadioOption[] | string = [];\n /** Selected option id */\n @Prop({ mutable: true }) selectedOption: string | number = '';\n /** Show search box */\n @Prop() showFilter: boolean = false;\n /** Search placeholder */\n @Prop() filterPlaceholder: string = 'Search';\n /** Show description even when option is not selected */\n @Prop() alwaysShowDescription: boolean = true;\n /** Layout type */\n @Prop() typeLayout: 'description' | 'default' = 'default';\n /** Delay before filtering (matches Angular `searchDelay`) */\n @Prop() searchDelay: number = 100;\n\n @State() private filterText: string = '';\n @State() private parsedOptions: RadioOption[] = [];\n\n /** Emitted on selection change. e.detail = selected option id */\n @Event() valueChange: EventEmitter<string | number>;\n /** Emitted on search — matches Angular 'onSearch' */\n @Event() onSearch: EventEmitter<{ searchValue: string; filteredOptions: RadioOption[] }>;\n\n @Watch('options')\n optionsChanged(val: RadioOption[] | string) {\n this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val || []);\n }\n\n componentWillLoad() { this.optionsChanged(this.options); }\n\n private get filtered(): RadioOption[] {\n if (!this.filterText) return this.parsedOptions;\n const q = this.filterText.toLowerCase();\n return this.parsedOptions.filter(o => o.name?.toLowerCase().includes(q));\n }\n\n render() {\n return (\n <div class=\"rsl\">\n {this.showFilter && (\n <div class=\"rsl__search\">\n <dropi-icon name=\"Search\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-400\" />\n <input\n class=\"rsl__search-input\"\n type=\"text\"\n placeholder={this.filterPlaceholder}\n value={this.filterText}\n onInput={(e) => {\n this.filterText = (e.target as HTMLInputElement).value;\n this.onSearch.emit({ searchValue: this.filterText, filteredOptions: this.filtered });\n }}\n />\n </div>\n )}\n\n <div class=\"rsl__list\">\n {this.filtered.map(opt => {\n const isSelected = opt.id === this.selectedOption;\n return (\n <div\n class={{ 'rsl__item': true, 'rsl__item--selected': isSelected }}\n key={opt.id}\n onClick={() => { this.selectedOption = opt.id; this.valueChange.emit(opt.id); }}\n >\n <div class={{ 'rsl__radio': true, 'rsl__radio--checked': isSelected }}>\n {isSelected && <div class=\"rsl__radio-dot\" />}\n </div>\n <div class=\"rsl__content\">\n <span class=\"rsl__name\">{opt.name}</span>\n {(isSelected || this.alwaysShowDescription) && opt.description && (\n <span class=\"rsl__desc\">{opt.description}</span>\n )}\n </div>\n </div>\n );\n })}\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-read-more.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, h } from './index-Cvp2LQOM.js';
 const dropiReadMoreCss = () => `:host{display:block}.read-more__text{margin:0;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-800, #1f2433);line-height:1.5}.read-more__toggle{all:unset;display:inline;font-size:var(--font-size-s, 12px);font-family:inherit;font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-600);cursor:pointer}.read-more__toggle:hover{color:var(--Primary-Primary-600, #d4872e)}`;
@@ -36,3 +36,6 @@ const DropiReadMore = class {
 DropiReadMore.style = dropiReadMoreCss();
 export { DropiReadMore as dropi_read_more };
+//# sourceMappingURL=dropi-read-more.entry.esm.js.map
+//# sourceMappingURL=dropi-read-more.entry.js.map

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

@@ -0,0 +1 @@

+ {"file":"dropi-read-more.entry.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,kZAAkZ,CAAC;;MCWta,aAAa,GAAA,MAAA;;;;;IAEhB,IAAI,GAAW,EAAE;;IAEjB,QAAQ,GAAW,EAAE;;IAErB,WAAW,GAAY,IAAI;;IAE3B,SAAS,GAAW,EAAE;;IAEtB,WAAW,GAAW,EAAE;IAEf,QAAQ,GAAY,KAAK;AAE1C,IAAA,IAAY,KAAK,GAAA;AACf,QAAA,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;;AAGvD,IAAA,IAAY,eAAe,GAAA;QACzB,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ;;AAG1C,IAAA,IAAY,WAAW,GAAA;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC,IAAI;AAC5D,QAAA,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;;IAGrD,MAAM,GAAA;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QAEpF,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,iBAAiB,EAAC,KAAK,EAAE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAgB,GAAG,SAAS,EAAA,EACjF,IAAI,CAAC,WAAW,EAChB,UAAU,KACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,mBAAmB,EAAC,KAAK,EAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAkB,GAAG,SAAS,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAA,EAC3I,IAAI,CAAC,QAAQ,GAAG,YAAY,GAAG,aAAa,CACtC,CACV,CACC,CACA;;;;;;;","names":[],"sources":["src/components/dropi-read-more/dropi-read-more.css?tag=dropi-read-more&encapsulation=shadow","src/components/dropi-read-more/dropi-read-more.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.read-more__text {\n margin: 0;\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n color: var(--Gray-Gray-800, #1f2433);\n line-height: 1.5;\n}\n\n.read-more__toggle {\n all: unset;\n display: inline;\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n font-weight: var(--font-weight-bold, 700);\n color: var(--Gray-Gray-600);\n cursor: pointer;\n}\n\n.read-more__toggle:hover {\n color: var(--Primary-Primary-600, #d4872e);\n}\n","import { Component, Prop, State, h } from '@stencil/core';\n\n/**\n * @component dropi-read-more\n * Truncates text to a word limit with an expandable \"Ver más / Ver menos\" toggle.\n */\n@Component({\n tag: 'dropi-read-more',\n styleUrl: 'dropi-read-more.css',\n shadow: true,\n})\nexport class DropiReadMore {\n /** Full text to display */\n @Prop() text: string = '';\n /** Maximum number of words before truncating */\n @Prop() maxWords: number = 20;\n /** Allow collapsing back after expanding */\n @Prop() showSeeLess: boolean = true;\n /** Inline CSS string applied to the text element (matches Angular `textStyle`) */\n @Prop() textStyle: string = '';\n /** Inline CSS string applied to the toggle button (matches Angular `buttonStyle`) */\n @Prop() buttonStyle: string = '';\n\n @State() private expanded: boolean = false;\n\n private get words(): string[] {\n return (this.text || '').split(/\\s+/).filter(Boolean);\n }\n\n private get needsTruncation(): boolean {\n return this.words.length > this.maxWords;\n }\n\n private get displayText(): string {\n if (!this.needsTruncation || this.expanded) return this.text;\n return this.words.slice(0, this.maxWords).join(' ');\n }\n\n render() {\n const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);\n\n return (\n <div class=\"read-more\">\n <p class=\"read-more__text\" style={this.textStyle ? this.textStyle as any : undefined}>\n {this.displayText}\n {showToggle && (\n <button class=\"read-more__toggle\" style={this.buttonStyle ? this.buttonStyle as any : undefined} onClick={() => this.expanded = !this.expanded}>\n {this.expanded ? ' Ver menos' : '... Ver más'}\n </button>\n )}\n </p>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-search.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, d as createEvent, h } from './index-Cvp2LQOM.js';
 const dropiSearchCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.search-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.search-input-row{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:10px;pointer-events:none;z-index:1}.search-input{width:100%;height:40px;padding:0 36px 0 34px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);outline:none;transition:border-color 0.2s}.search-input:focus{border-color:var(--Info-Info-500, #50a5f1)}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{position:absolute;right:10px;display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer;z-index:1}.search-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:var(--dropdown-height, 240px);overflow-y:auto;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);z-index:100}.search-option{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.search-option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.search-option--selected{background:var(--Primary-Primary-50, #fff5eb)}.search-option__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-no-results{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6);text-align:center}`;
@@ -120,3 +120,6 @@ const DropiSearch = class {
 DropiSearch.style = dropiSearchCss();
 export { DropiSearch as dropi_search };
+//# sourceMappingURL=dropi-search.entry.esm.js.map
+//# sourceMappingURL=dropi-search.entry.js.map

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

@@ -0,0 +1 @@

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

package/dist/{esm → dropi-ui}/dropi-select.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, d as createEvent, a as getElement, h } from './index-Cvp2LQOM.js';
 const dropiSelectCss = () => `:host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:inherit;display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.2s ease;gap:8px}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.select-button-error{border-color:var(--Error-Error-500, #f46a6b) !important}.no-border{border:none !important;color:var(--Gray-Gray-600, #475066);padding:var(--Size-4, 16px);background-color:transparent !important;gap:var(--Size-2, 8px)}.no-border:disabled{background-color:transparent !important}.button-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1;min-width:0}.elipsis{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-dropdown-overlay{position:fixed;max-height:250px;overflow-y:auto;list-style:none;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);margin:0;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);box-shadow:0px 8px 24px rgba(0, 0, 0, 0.12);z-index:9999;animation:dropdown-open 120ms ease-out}@keyframes dropdown-open{from{opacity:0;transform:scaleY(0.95);transform-origin:top}to{opacity:1;transform:scaleY(1);transform-origin:top}}.option{box-sizing:border-box;width:100%;min-height:40px;border-radius:var(--Border-2, 8px);padding:var(--Size-3, 12px) var(--Size-4, 16px);border:none;background:transparent;text-align:left;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:var(--Size-2, 8px);transition:background 0.15s ease}.option:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled,.disabled-option{opacity:0.5;cursor:not-allowed}.option.selected-option:not(.option-radio){background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-group-title{padding:var(--Size-3, 12px) var(--Size-4, 16px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Gray-Gray-500, #69738c);list-style:none}.option-group{padding-left:var(--Size-6, 32px)}.sticky-search{position:sticky;top:calc(-1 * var(--Size-4, 16px));background:var(--Neutral-White, #ffffff);z-index:10;margin:calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;padding:var(--Size-2, 8px) var(--Size-4, 16px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2);list-style:none}.search-wrapper{display:flex;align-items:center;gap:8px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);padding:6px 10px;background:var(--Neutral-White, #ffffff)}.search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.multi-checkbox{width:18px;height:18px;min-width:18px;border-radius:var(--Border-1, 4px);border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s, border-color 0.15s}.multi-checkbox.checked{background:var(--Primary-Primary-500, #f49a3d);border-color:var(--Primary-Primary-500, #f49a3d)}.option-radio{display:flex;align-items:center;gap:12px}.option-radio.selected-option{border-radius:var(--Border-2, 8px);background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-radio.selected-option .option-second-label{color:var(--Primary-Primary-500, #f49a3d)}.radio{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio.selected{border-color:var(--Primary-Primary-500, #f49a3d)}.circle{width:12px;height:12px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.labels-container{display:flex;justify-content:space-between;width:100%;min-width:0}.option-image{width:24px;height:24px;border-radius:60px;object-fit:cover;flex-shrink:0}.small-image{width:20px;height:20px}.option-image-fallback{width:24px;height:24px;border-radius:60px;background:var(--Primary-Primary-500, #f49a3d);color:white;font-size:13px;font-weight:var(--font-weight-bold);display:flex;justify-content:center;align-items:center;flex-shrink:0}.small-image.option-image-fallback{width:20px;height:20px}.option-second-label{color:var(--Gray-Gray-700, #32394d);font-weight:var(--font-weight-bold);white-space:nowrap}.flag-placeholder{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--Gray-Gray-500, #69738c);flex-shrink:0}.select-helper,.select-helper-error{display:flex;gap:var(--Size-1, 4px);align-items:center;margin-top:var(--Size-1, 4px)}.select-helper span{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.select-helper-error span{color:var(--Error-Error-500, #f46a6b);font-size:var(--font-size-xs, 10px)}.no-results{padding:var(--Size-3, 12px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 12px);list-style:none;text-align:center}`;
@@ -378,3 +378,6 @@ const DropiSelect = class {
 DropiSelect.style = dropiSelectCss();
 export { DropiSelect as dropi_select };
+//# sourceMappingURL=dropi-select.entry.esm.js.map
+//# sourceMappingURL=dropi-select.entry.js.map

package/dist/dropi-ui/dropi-select.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"dropi-select.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-select/dropi-select.css?tag=dropi-select&encapsulation=shadow","src/components/dropi-select/dropi-select.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n text-align: left;\n}\n\n*, *::before, *::after { box-sizing: border-box; }\n\n/* ── Wrapper ────────────────────────────────────────────────── */\n.custom-select {\n position: relative;\n width: 100%;\n}\n\n.custom-select label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-600, #475066);\n}\n\n.disabled-label {\n color: var(--Gray-Gray-400, #858ea6) !important;\n}\n\n.asterisk {\n color: var(--Error-Error-500, #f46a6b);\n}\n\n/* ── Trigger row ────────────────────────────────────────────── */\n.dropdown-container {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.left-label {\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-m, 14px);\n white-space: nowrap;\n}\n\n/* ── Trigger button ─────────────────────────────────────────── */\n.select-button {\n box-sizing: border-box;\n width: 100%;\n height: 40px;\n padding: 0 0.75rem;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-500, #69738c);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n cursor: pointer;\n transition: border-color 0.2s ease;\n gap: 8px;\n}\n\n.select-button:focus {\n outline: none;\n border-color: var(--Info-Info-500, #50a5f1);\n}\n\n.select-button:disabled {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n color: var(--Gray-Gray-400, #858ea6);\n background-color: var(--Gray-Gray-50, #f7f8fa);\n cursor: not-allowed;\n}\n\n.select-completed {\n border-color: var(--Gray-Gray-400, #858ea6);\n color: var(--Gray-Gray-600, #475066);\n}\n\n.select-button-error {\n border-color: var(--Error-Error-500, #f46a6b) !important;\n}\n\n.no-border {\n border: none !important;\n color: var(--Gray-Gray-600, #475066);\n padding: var(--Size-4, 16px);\n background-color: transparent !important;\n gap: var(--Size-2, 8px);\n}\n\n.no-border:disabled {\n background-color: transparent !important;\n}\n\n/* ── Button content ─────────────────────────────────────────── */\n.button-content {\n display: flex;\n align-items: center;\n gap: 8px;\n overflow: hidden;\n flex: 1;\n min-width: 0;\n}\n\n.elipsis {\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* ── Dropdown overlay (fixed position) ──────────────────────── */\n.select-dropdown-overlay {\n position: fixed;\n max-height: 250px;\n overflow-y: auto;\n list-style: none;\n padding: var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);\n margin: 0;\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.12);\n z-index: 9999;\n animation: dropdown-open 120ms ease-out;\n}\n\n@keyframes dropdown-open {\n from { opacity: 0; transform: scaleY(0.95); transform-origin: top; }\n to { opacity: 1; transform: scaleY(1); transform-origin: top; }\n}\n\n/* ── Options ────────────────────────────────────────────────── */\n.option {\n box-sizing: border-box;\n width: 100%;\n min-height: 40px;\n border-radius: var(--Border-2, 8px);\n padding: var(--Size-3, 12px) var(--Size-4, 16px);\n border: none;\n background: transparent;\n text-align: left;\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n transition: background 0.15s ease;\n}\n\n.option:hover:not(:disabled) {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n\n.option:disabled,\n.disabled-option {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.option.selected-option:not(.option-radio) {\n background: var(--Primary-Primary-50, #fef8f2);\n color: var(--Primary-Primary-500, #f49a3d);\n}\n\n/* ── Grouped options ─────────────────────────────────────────── */\n.option-group-title {\n padding: var(--Size-3, 12px) var(--Size-4, 16px);\n font-size: var(--font-size-s, 12px);\n font-weight: var(--font-weight-medium, 500);\n color: var(--Gray-Gray-500, #69738c);\n list-style: none;\n}\n\n.option-group {\n padding-left: var(--Size-6, 32px);\n}\n\n/* ── Sticky search ───────────────────────────────────────────── */\n.sticky-search {\n position: sticky;\n top: calc(-1 * var(--Size-4, 16px));\n background: var(--Neutral-White, #ffffff);\n z-index: 10;\n margin: calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;\n padding: var(--Size-2, 8px) var(--Size-4, 16px);\n border-bottom: 1px solid var(--Gray-Gray-100, #e6eaf2);\n list-style: none;\n}\n\n.search-wrapper {\n display: flex;\n align-items: center;\n gap: 8px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n padding: 6px 10px;\n background: var(--Neutral-White, #ffffff);\n}\n\n.search-input {\n flex: 1;\n border: none;\n outline: none;\n font-size: var(--font-size-s, 12px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n background: transparent;\n}\n\n.search-input::placeholder {\n color: var(--Gray-Gray-400, #858ea6);\n}\n\n.search-clear {\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n display: flex;\n align-items: center;\n}\n\n/* ── Multi-select checkbox ───────────────────────────────────── */\n.multi-checkbox {\n width: 18px;\n height: 18px;\n min-width: 18px;\n border-radius: var(--Border-1, 4px);\n border: 2px solid var(--Gray-Gray-200, #c3c9d9);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition: background 0.15s, border-color 0.15s;\n}\n\n.multi-checkbox.checked {\n background: var(--Primary-Primary-500, #f49a3d);\n border-color: var(--Primary-Primary-500, #f49a3d);\n}\n\n/* ── Radio options ───────────────────────────────────────────── */\n.option-radio {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.option-radio.selected-option {\n border-radius: var(--Border-2, 8px);\n background: var(--Primary-Primary-50, #fef8f2);\n color: var(--Primary-Primary-500, #f49a3d);\n}\n\n.option-radio.selected-option .option-second-label {\n color: var(--Primary-Primary-500, #f49a3d);\n}\n\n.radio {\n width: 20px;\n height: 20px;\n min-width: 20px;\n border-radius: 50%;\n border: 2px solid var(--Gray-Gray-200, #c3c9d9);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.radio.selected {\n border-color: var(--Primary-Primary-500, #f49a3d);\n}\n\n.circle {\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: var(--Primary-Primary-500, #f49a3d);\n}\n\n.labels-container {\n display: flex;\n justify-content: space-between;\n width: 100%;\n min-width: 0;\n}\n\n.option-image {\n width: 24px;\n height: 24px;\n border-radius: 60px;\n object-fit: cover;\n flex-shrink: 0;\n}\n\n.small-image {\n width: 20px;\n height: 20px;\n}\n\n.option-image-fallback {\n width: 24px;\n height: 24px;\n border-radius: 60px;\n background: var(--Primary-Primary-500, #f49a3d);\n color: white;\n font-size: 13px;\n font-weight: var(--font-weight-bold);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n}\n\n.small-image.option-image-fallback {\n width: 20px;\n height: 20px;\n}\n\n.option-second-label {\n color: var(--Gray-Gray-700, #32394d);\n font-weight: var(--font-weight-bold);\n white-space: nowrap;\n}\n\n/* ── Country flag placeholder ────────────────────────────────── */\n.flag-placeholder {\n font-size: 11px;\n font-weight: var(--font-weight-semibold);\n color: var(--Gray-Gray-500, #69738c);\n flex-shrink: 0;\n}\n\n/* ── Helper / error text ────────────────────────────────────── */\n.select-helper,\n.select-helper-error {\n display: flex;\n gap: var(--Size-1, 4px);\n align-items: center;\n margin-top: var(--Size-1, 4px);\n}\n\n.select-helper span {\n color: var(--Gray-Gray-600, #475066);\n font-size: var(--font-size-xs, 10px);\n}\n\n.select-helper-error span {\n color: var(--Error-Error-500, #f46a6b);\n font-size: var(--font-size-xs, 10px);\n}\n\n/* ── No results ─────────────────────────────────────────────── */\n.no-results {\n padding: var(--Size-3, 12px) var(--Size-4, 16px);\n color: var(--Gray-Gray-400, #858ea6);\n font-size: var(--font-size-s, 12px);\n list-style: none;\n text-align: center;\n}\n","import {\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n Method,\n Watch,\n Listen,\n Element,\n AttachInternals,\n h,\n} from '@stencil/core';\nimport { SelectOption, SelectOptionGroup } from './select.types';\n\n/**\n * @component dropi-select\n * Feature-rich select with support for:\n * - Single / multi select\n * - Grouped options\n * - Search / filter\n * - Country flags\n * - Radio-style options with images\n * - Inline (dropdownType) or bordered trigger\n * - Native form association\n *\n * ## Usage\n * Options must be set via JS property (not HTML attribute) for object arrays:\n * ```js\n * document.querySelector('dropi-select').options = [\n * { id: 1, label: 'Option A' },\n * { id: 2, label: 'Option B' },\n * ];\n * ```\n */\n@Component({\n tag: 'dropi-select',\n styleUrl: 'dropi-select.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiSelect {\n @Element() el: HTMLElement;\n @AttachInternals() internals: ElementInternals;\n\n private buttonRef!: HTMLButtonElement;\n private scrollDebounce: any;\n private hasEmittedScrollEnd = false;\n private lastScrollTop = 0;\n\n // ── Props ────────────────────────────────────────────────────\n @Prop({ mutable: true }) label: string = '';\n @Prop({ mutable: true }) placeholder: string = 'Select';\n /** Array of SelectOption or SelectOptionGroup */\n @Prop({ mutable: true }) options: SelectOption[] | SelectOptionGroup[] = [];\n @Prop() name: string = '';\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ mutable: true }) hasError: boolean = false;\n @Prop({ mutable: true }) errorText: string = '';\n @Prop({ mutable: true }) textHelper: string = '';\n @Prop({ mutable: true }) showObligatory: boolean = false;\n /** Enables text search inside the dropdown */\n @Prop({ mutable: true }) searchEnabled: boolean = false;\n /** Allows selecting multiple options */\n @Prop({ mutable: true }) multiSelect: boolean = false;\n /** Renders trigger without border (inline/dropdown style) */\n @Prop({ mutable: true }) dropdownType: boolean = false;\n /** Show country flags next to option labels */\n @Prop() showCountryFlags: boolean = false;\n /** Renders options as radio buttons with optional image */\n @Prop({ mutable: true }) radioOptions: boolean = false;\n /** Placeholder inside the search field */\n @Prop() placeHolderSearch: string = 'Buscar';\n /** Icon name shown before the trigger label */\n @Prop({ mutable: true }) preIcon: string = '';\n /** Pre-select an option by id */\n @Prop({ mutable: true }) defaultSelectedId: string | number;\n /** Controlled selected option (single select) - matches Angular 'selectedOption' */\n @Prop({ mutable: true }) selectedOption: SelectOption | null = null;\n /** Custom CSS class for the dropdown overlay */\n @Prop() overlayClass: string = '';\n /**\n * Convenience object prop — matches Angular `selectProperties: SelectProperties`.\n * Fields: label, placeholder, options, showObligatory, textHelper,\n * searchEnabled, multiSelect, dropdownType, hasError, errorText,\n * radioOptions, preIcon.\n * When provided, its non-null fields override individual props.\n */\n @Prop() selectProperties: any = null;\n\n // ── State ────────────────────────────────────────────────────\n @State() private isOpen: boolean = false;\n @State() private _selectedOption: SelectOption | null = null;\n @State() private multiSelected: SelectOption[] = [];\n @State() private filteredOptions: SelectOption[] | SelectOptionGroup[] = [];\n @State() private searchTerm: string = '';\n @State() private dropdownStyle: { top: string; left: string; width: string } = {\n top: '0px', left: '0px', width: '0px',\n };\n\n // ── Events ───────────────────────────────────────────────────\n /** Emitted when an option is selected — matches Angular 'onChangeSelect' */\n @Event() onChangeSelect: EventEmitter<SelectOption | SelectOption[]>;\n /** Emitted when the selection is cleared — matches Angular 'onClear' */\n @Event() onClear: EventEmitter<void>;\n /** Emitted on search input — matches Angular 'onSearch' */\n @Event() onSearch: EventEmitter<string>;\n /** Emitted when the list is scrolled to the end — matches Angular 'scrolledToEnd' */\n @Event() scrolledToEnd: EventEmitter<void>;\n /** Emitted on Enter key inside search — matches Angular 'onKeyEnter' */\n @Event() onKeyEnter: EventEmitter<KeyboardEvent>;\n\n // ── Lifecycle ────────────────────────────────────────────────\n componentWillLoad() {\n if (this.selectProperties) this.selectPropertiesChanged(this.selectProperties);\n this.normalizeOptions();\n this.filteredOptions = [...(this.options as any[])];\n this.applyDefaultSelection();\n }\n\n @Watch('selectProperties')\n selectPropertiesChanged(val: any) {\n if (!val) return;\n if (val.label !== undefined) this.label = val.label;\n if (val.placeholder !== undefined) this.placeholder = val.placeholder;\n if (val.options !== undefined) this.options = val.options;\n if (val.showObligatory !== undefined) this.showObligatory = val.showObligatory;\n if (val.textHelper !== undefined) this.textHelper = val.textHelper;\n if (val.searchEnabled !== undefined) this.searchEnabled = val.searchEnabled;\n if (val.multiSelect !== undefined) this.multiSelect = val.multiSelect;\n if (val.dropdownType !== undefined) this.dropdownType = val.dropdownType;\n if (val.hasError !== undefined) this.hasError = val.hasError;\n if (val.errorText !== undefined) this.errorText = val.errorText;\n if (val.radioOptions !== undefined) this.radioOptions = val.radioOptions;\n if (val.preIcon !== undefined) this.preIcon = val.preIcon;\n }\n\n @Watch('options')\n optionsChanged() {\n this.normalizeOptions();\n this.filteredOptions = [...(this.options as any[])];\n this.applyDefaultSelection();\n }\n\n private normalizeOptions() {\n if (!this.options) { this.options = []; return; }\n if (typeof this.options === 'string') {\n try { this.options = JSON.parse(this.options as any); } catch (_) { this.options = []; }\n }\n }\n\n @Watch('defaultSelectedId')\n defaultChanged(newId: string | number) {\n this.applyDefaultSelection(newId);\n }\n\n @Watch('selectedOption')\n valueChanged(v: SelectOption | null) {\n this._selectedOption = v;\n this.internals.setFormValue(v ? String(v.id) : '');\n }\n\n // ── Public Methods ───────────────────────────────────────────\n /** Select an option by its id */\n @Method()\n async setById(id: string | number) {\n const opt = (this.options as SelectOption[]).find(\n o => o.id === id || String(o.id) === String(id),\n );\n if (opt) this.selectOption(opt);\n }\n\n /** Select an option by its label */\n @Method()\n async setByLabel(label: string) {\n const opt = (this.options as SelectOption[]).find(o => o.label === label);\n if (opt) this.selectOption(opt);\n }\n\n /** Clear the current selection */\n @Method()\n async clearSelection() {\n this._selectedOption = null;\n this.multiSelected = [];\n this.internals.setFormValue('');\n this.onClear.emit();\n }\n\n /** Reset multi-select state and show a placeholder label */\n @Method()\n async resetMultiSelect(_placeholder?: string) {\n this.multiSelected = [];\n this.internals.setFormValue('');\n }\n\n // ── Click outside ────────────────────────────────────────────\n @Listen('click', { target: 'document' })\n handleOutsideClick(e: MouseEvent) {\n if (this.isOpen && !e.composedPath().includes(this.el)) {\n this.closeDropdown();\n }\n }\n\n // ── Helpers ──────────────────────────────────────────────────\n private applyDefaultSelection(id?: string | number) {\n const targetId = id ?? this.defaultSelectedId;\n if (targetId === '' || targetId === undefined || targetId === null) return;\n const flat = this.flatOptions();\n const found = flat.find(o => o.id === targetId || String(o.id) === String(targetId));\n if (found) {\n this._selectedOption = found;\n this.internals.setFormValue(String(found.id));\n }\n }\n\n private flatOptions(): SelectOption[] {\n if (!this.options?.length) return [];\n if ('category' in this.options[0]) {\n return (this.options as SelectOptionGroup[]).flatMap(g => g.options);\n }\n return this.options as SelectOption[];\n }\n\n private get isGrouped(): boolean {\n return this.options?.length > 0 && 'category' in this.options[0];\n }\n\n private get triggerLabel(): string {\n if (this.multiSelect) {\n return this.multiSelected.length\n ? this.multiSelected.map(o => o.label).join(', ')\n : this.placeholder;\n }\n if (this._selectedOption) {\n return this.showCountryFlags && this._selectedOption.shortLabel\n ? this._selectedOption.shortLabel\n : this._selectedOption.label;\n }\n return this.placeholder;\n }\n\n // ── Dropdown positioning ─────────────────────────────────────\n private openDropdown() {\n if (this.disabled) return;\n const rect = this.buttonRef.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const dropdownHeight = 250;\n const spaceBelow = viewportHeight - rect.bottom;\n const top = spaceBelow >= dropdownHeight\n ? rect.bottom + 4\n : rect.top - dropdownHeight - 4;\n\n this.dropdownStyle = {\n top: `${top}px`,\n left: `${rect.left}px`,\n width: `${rect.width}px`,\n };\n this.isOpen = true;\n\n if (this.searchEnabled) {\n setTimeout(() => {\n const searchInput = this.el.shadowRoot?.querySelector('.search-input') as HTMLInputElement;\n searchInput?.focus();\n }, 50);\n }\n }\n\n private closeDropdown() {\n this.isOpen = false;\n this.searchTerm = '';\n this.filteredOptions = [...(this.options as any[])];\n }\n\n private toggleDropdown() {\n this.isOpen ? this.closeDropdown() : this.openDropdown();\n }\n\n // ── Option selection ─────────────────────────────────────────\n private selectOption(option: SelectOption) {\n if (option.disabled) return;\n\n if (this.multiSelect) {\n const idx = this.multiSelected.findIndex(o => o.id === option.id);\n if (idx >= 0) {\n this.multiSelected = this.multiSelected.filter(o => o.id !== option.id);\n } else {\n this.multiSelected = [...this.multiSelected, option];\n }\n this.internals.setFormValue(this.multiSelected.map(o => o.id).join(','));\n this.onChangeSelect.emit([...this.multiSelected]);\n } else {\n this._selectedOption = option;\n this.internals.setFormValue(String(option.id));\n this.onChangeSelect.emit(option);\n this.closeDropdown();\n }\n }\n\n private isOptionChecked(option: SelectOption): boolean {\n return this.multiSelected.some(o => o.id === option.id);\n }\n\n // ── Search ───────────────────────────────────────────────────\n private handleSearch(term: string) {\n this.searchTerm = term;\n this.onSearch.emit(term);\n const lower = term.toLowerCase().trim();\n\n if (!lower) {\n this.filteredOptions = [...(this.options as any[])];\n return;\n }\n\n if (this.isGrouped) {\n this.filteredOptions = (this.options as SelectOptionGroup[])\n .map(g => ({ ...g, options: g.options.filter(o => o.label.toLowerCase().includes(lower)) }))\n .filter(g => g.options.length > 0);\n } else {\n this.filteredOptions = (this.options as SelectOption[]).filter(\n o => o.label.toLowerCase().includes(lower),\n );\n }\n }\n\n // ── Scroll to end ─────────────────────────────────────────────\n private handleScroll(e: Event) {\n const el = e.target as HTMLElement;\n clearTimeout(this.scrollDebounce);\n this.scrollDebounce = setTimeout(() => {\n if (!el) return;\n const distFromBottom = el.scrollHeight - el.scrollTop - el.clientHeight;\n const threshold = Math.min(50, el.clientHeight / 2);\n\n if (el.scrollTop < this.lastScrollTop) this.hasEmittedScrollEnd = false;\n this.lastScrollTop = el.scrollTop;\n\n if (distFromBottom <= threshold && !this.hasEmittedScrollEnd) {\n this.scrolledToEnd.emit();\n this.hasEmittedScrollEnd = true;\n setTimeout(() => { this.hasEmittedScrollEnd = false; }, 1000);\n }\n }, 100);\n }\n\n // ── Render helpers ───────────────────────────────────────────\n private renderTrigger() {\n const isCompleted = this.multiSelect ? this.multiSelected.length > 0 : !!this._selectedOption;\n const iconColor = this.disabled ? 'Gray-Gray-300' : this.dropdownType ? 'Gray-Gray-600' : 'Gray-Gray-400';\n const iconSize = this.dropdownType ? '24px' : '20px';\n\n return (\n <button\n type=\"button\"\n class={{\n 'select-button': true,\n 'select-completed': isCompleted,\n 'select-button-error': this.hasError,\n 'no-border': this.dropdownType,\n }}\n disabled={this.disabled}\n ref={el => (this.buttonRef = el as HTMLButtonElement)}\n onClick={() => this.toggleDropdown()}\n >\n <div class={{\n 'button-content': true,\n 'option-radio': this.radioOptions && !!this._selectedOption && !this.multiSelect,\n }}>\n {this.preIcon && (\n <dropi-icon name={this.preIcon} width=\"20px\" height=\"20px\" color=\"Gray-Gray-500\" />\n )}\n\n {/* Radio option selected preview */}\n {this.radioOptions && this._selectedOption && !this.multiSelect && [\n this._selectedOption.imageUrl && !this._selectedOption.isFallback\n ? <img class=\"option-image small-image\" src={this._selectedOption.imageUrl} alt=\"\" onError={() => { if (this._selectedOption) this._selectedOption = { ...this._selectedOption, isFallback: true }; }} />\n : this._selectedOption.isFallback\n ? <span class=\"option-image-fallback small-image\">{this._selectedOption.label.charAt(0).toUpperCase()}</span>\n : null,\n <div class=\"labels-container elipsis\">\n <span>{this._selectedOption.label}</span>\n {this._selectedOption.secondLabel && <span class=\"option-second-label\">{this._selectedOption.secondLabel}</span>}\n </div>,\n ]}\n\n {/* Standard label */}\n {!(this.radioOptions && this._selectedOption && !this.multiSelect) && (\n <div class=\"elipsis\">{this.triggerLabel}</div>\n )}\n </div>\n\n <dropi-icon\n name={this.isOpen ? 'Dropdown-up' : 'Dropdown-down'}\n width={iconSize}\n height={iconSize}\n color={iconColor}\n />\n </button>\n );\n }\n\n private renderOption(option: SelectOption) {\n const isSelected = this.multiSelect\n ? this.isOptionChecked(option)\n : this._selectedOption?.id === option.id;\n\n return (\n <li key={option.id}>\n <button\n type=\"button\"\n class={{\n option: true,\n 'option-radio': this.radioOptions,\n 'option-with-flag': this.showCountryFlags && !!option.countryCode,\n 'disabled-option': !!option.disabled,\n 'selected-option': isSelected,\n }}\n disabled={option.disabled}\n onClick={() => this.selectOption(option)}\n >\n {this.multiSelect && (\n <span class={{ 'multi-checkbox': true, checked: isSelected }}>\n {isSelected && (\n <svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\">\n <path d=\"M20.6 5.7L9.1 17.2c-.2.2-.5.3-.8.3s-.6-.1-.8-.3L3 12.8c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l3.9 3.9L19.2 4.3c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4z\" fill=\"white\"/>\n </svg>\n )}\n </span>\n )}\n\n {this.radioOptions && (\n <div class={{ radio: true, selected: isSelected }}>\n {isSelected && <div class=\"circle\" />}\n </div>\n )}\n\n {!this.radioOptions && option.preIcon && (\n <dropi-icon name={option.preIcon} width=\"20px\" height=\"20px\" color=\"Gray-Gray-500\" />\n )}\n\n {this.radioOptions && option.imageUrl && !option.isFallback && (\n <img class=\"option-image\" src={option.imageUrl} alt=\"\" onError={() => { option.isFallback = true; this.options = [...this.options as any[]]; }} />\n )}\n {this.radioOptions && option.isFallback && (\n <span class=\"option-image-fallback\">{option.label.charAt(0).toUpperCase()}</span>\n )}\n\n {this.showCountryFlags && option.countryCode && (\n <span class=\"flag-placeholder\">{option.countryCode}</span>\n )}\n\n {this.radioOptions\n ? (\n <div class=\"labels-container\">\n <span class=\"elipsis\">{option.label}</span>\n {option.secondLabel && <span class=\"option-second-label\">{option.secondLabel}</span>}\n </div>\n )\n : (\n <span class=\"elipsis\">\n {this.showCountryFlags && option.shortLabel ? option.shortLabel : option.label}\n </span>\n )\n }\n </button>\n </li>\n );\n }\n\n private renderDropdown() {\n if (!this.isOpen) return null;\n\n return (\n <ul\n class={`select-dropdown-overlay ${this.overlayClass}`}\n style={this.dropdownStyle}\n onScroll={(e) => this.handleScroll(e)}\n >\n {/* Search */}\n {this.searchEnabled && (\n <li class=\"sticky-search\">\n <div class=\"search-wrapper\">\n <dropi-icon name=\"Search\" width=\"16px\" height=\"16px\" color=\"Gray-Gray-400\" />\n <input\n class=\"search-input\"\n type=\"text\"\n placeholder={this.placeHolderSearch}\n value={this.searchTerm}\n onInput={(e) => this.handleSearch((e.target as HTMLInputElement).value)}\n onKeyDown={(e) => { if (e.key === 'Enter') this.onKeyEnter.emit(e as KeyboardEvent); }}\n />\n {this.searchTerm && (\n <button type=\"button\" class=\"search-clear\" onClick={() => this.handleSearch('')}>\n <dropi-icon name=\"Close\" width=\"14px\" height=\"14px\" color=\"Gray-Gray-400\" />\n </button>\n )}\n </div>\n </li>\n )}\n\n {/* Grouped options */}\n {this.isGrouped && (this.filteredOptions as SelectOptionGroup[]).map(group => [\n <li class=\"option-group-title\">{group.category}</li>,\n ...group.options.map(opt => (\n <li key={opt.id}>\n <button\n type=\"button\"\n class={{ option: true, 'option-group': true, 'disabled-option': !!opt.disabled }}\n disabled={opt.disabled}\n onClick={() => this.selectOption(opt)}\n >\n {opt.preIcon && <dropi-icon name={opt.preIcon} width=\"20px\" height=\"20px\" color=\"Gray-Gray-500\" />}\n <span class=\"elipsis\">{opt.label}</span>\n </button>\n </li>\n )),\n ])}\n\n {/* Flat options (single or multi) */}\n {!this.isGrouped && (this.filteredOptions as SelectOption[]).map(opt => this.renderOption(opt))}\n\n {/* Empty state */}\n {(this.filteredOptions as any[]).length === 0 && (\n <li class=\"no-results\">Sin resultados</li>\n )}\n </ul>\n );\n }\n\n render() {\n return (\n <div class=\"custom-select\">\n {/* Top label */}\n {!this.dropdownType && this.label && (\n <label class={{ 'disabled-label': this.disabled }}>\n {this.label}\n {this.showObligatory && !this.disabled && <span class=\"asterisk\"> *</span>}\n </label>\n )}\n\n {/* Trigger row */}\n <div class=\"dropdown-container\">\n {this.dropdownType && this.label && (\n <div class=\"left-label\">{this.label}</div>\n )}\n {this.renderTrigger()}\n </div>\n\n {/* Helper text */}\n {this.textHelper && !this.hasError && (\n <div class=\"select-helper\">\n <span>{this.textHelper}</span>\n </div>\n )}\n\n {/* Error text */}\n {this.hasError && this.errorText && (\n <div class=\"select-helper-error\">\n <dropi-icon name=\"Warning-circle\" width=\"12px\" height=\"12px\" color=\"Error-Error-500\" />\n <span>{this.errorText}</span>\n </div>\n )}\n\n {/* Dropdown portal — fixed position */}\n {this.renderDropdown()}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-sidebar.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, d as createEvent, h } from './index-Cvp2LQOM.js';
 const dropiSidebarCss = () => `:host{display:block}.main-sidebar-container{margin-top:20px}.sidebar-option{height:45px;display:flex;align-items:center;position:relative;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);border-radius:var(--Border-1, 4px);min-width:147px;cursor:pointer;user-select:none}.sidebar-option .arrow{position:absolute;right:17px;transition:transform 0.3s ease}.sidebar-option .arrow-expanded{transform:rotate(180deg)}.sidebar-default-option{color:var(--Gray-Gray-500, #68738f)}.sidebar-active-option{color:var(--Primary-Primary-500, #f49a3d);background-color:#fef8f1}.sidebar-sub-item{overflow:hidden;max-height:0;height:auto;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);cursor:pointer;opacity:0;padding:0 var(--Size-3, 12px) 0 var(--Size-8, 32px);transition:max-height 0.3s ease-out,     opacity 0.3s ease-out,     padding 0.3s ease-out;user-select:none}.sidebar-sub-item.sidebar-expanded{max-height:200px;opacity:1;padding:var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-8, 32px)}.sidebar-sub-item-default{color:var(--Gray-Gray-500, #68738f)}.sidebar-sub-item-active{color:var(--Primary-Primary-500, #f49a3d)}.space-between{justify-content:space-between}`;
@@ -74,3 +74,6 @@ const DropiSidebar = class {
 DropiSidebar.style = dropiSidebarCss();
 export { DropiSidebar as dropi_sidebar };
+//# sourceMappingURL=dropi-sidebar.entry.esm.js.map
+//# sourceMappingURL=dropi-sidebar.entry.js.map

package/dist/dropi-ui/dropi-sidebar.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"dropi-sidebar.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-sidebar/dropi-sidebar.css?tag=dropi-sidebar&encapsulation=shadow","src/components/dropi-sidebar/dropi-sidebar.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.main-sidebar-container {\n margin-top: 20px;\n}\n\n.sidebar-option {\n height: 45px;\n display: flex;\n align-items: center;\n position: relative;\n font-weight: var(--font-weight-medium, 500);\n gap: var(--Size-3, 12px);\n padding: var(--Size-3, 12px);\n font-size: var(--font-size-s, 12px);\n border-radius: var(--Border-1, 4px);\n min-width: 147px;\n cursor: pointer;\n user-select: none;\n}\n\n.sidebar-option .arrow {\n position: absolute;\n right: 17px;\n transition: transform 0.3s ease;\n}\n\n.sidebar-option .arrow-expanded {\n transform: rotate(180deg);\n}\n\n.sidebar-default-option {\n color: var(--Gray-Gray-500, #68738f);\n}\n\n.sidebar-active-option {\n color: var(--Primary-Primary-500, #f49a3d);\n background-color: #fef8f1;\n}\n\n.sidebar-sub-item {\n overflow: hidden;\n max-height: 0;\n height: auto;\n font-weight: var(--font-weight-medium, 500);\n gap: var(--Size-3, 12px);\n font-size: var(--font-size-s, 12px);\n cursor: pointer;\n opacity: 0;\n padding: 0 var(--Size-3, 12px) 0 var(--Size-8, 32px);\n transition:\n max-height 0.3s ease-out,\n opacity 0.3s ease-out,\n padding 0.3s ease-out;\n user-select: none;\n}\n\n.sidebar-sub-item.sidebar-expanded {\n max-height: 200px;\n opacity: 1;\n padding: var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-8, 32px);\n}\n\n.sidebar-sub-item-default {\n color: var(--Gray-Gray-500, #68738f);\n}\n\n.sidebar-sub-item-active {\n color: var(--Primary-Primary-500, #f49a3d);\n}\n\n.space-between {\n justify-content: space-between;\n}\n","import { Component, Prop, Event, EventEmitter, h, State, Watch } from '@stencil/core';\n\nexport interface SidebarItem {\n id: number;\n icon: string;\n text: string;\n route: string;\n expandedMenu?: boolean;\n active?: boolean;\n}\n\nexport interface SidebarProperties {\n id: number;\n icon: string;\n text: string;\n route: string;\n expandedMenu?: boolean;\n active?: boolean;\n subItems?: SidebarItem[];\n}\n\n/**\n * @component dropi-sidebar\n * Sidebar list container (Strictly ported from Angular core). \n * This component handles rendering the sidebar items array natively.\n */\n@Component({\n tag: 'dropi-sidebar',\n styleUrl: 'dropi-sidebar.css',\n shadow: true,\n})\nexport class DropiSidebar {\n /**\n * Define las propiedades y la cantidad de elementos a renderizar.\n * Pasarlo como JSON string o directamente como array de SidebarProperties.\n */\n @Prop({ mutable: true }) sideBarProperties: SidebarProperties[] | string = [];\n \n /**\n * Evento emitido cuando se selecciona una opción en el menú o un sub-hijo.\n */\n @Event() onIndexChanged: EventEmitter<SidebarProperties>;\n\n @State() parsedProperties: SidebarProperties[] = [];\n\n @Watch('sideBarProperties')\n watchPropHandler(newValue: SidebarProperties[] | string) {\n this.parsedProperties = typeof newValue === 'string' ? JSON.parse(newValue) : (newValue || []);\n }\n\n componentWillLoad() {\n this.watchPropHandler(this.sideBarProperties);\n }\n\n private setExpandedPropertie(id: number) {\n const propertieIndex = this.parsedProperties.findIndex((item) => item.id === id);\n if (propertieIndex !== -1) {\n const newProps = [...this.parsedProperties];\n newProps[propertieIndex] = {\n ...newProps[propertieIndex],\n expandedMenu: !newProps[propertieIndex].expandedMenu\n };\n this.parsedProperties = newProps;\n }\n }\n\n private onItemClick(itemClicked: SidebarProperties) {\n this.onIndexChanged.emit(itemClicked);\n \n if (itemClicked.subItems && itemClicked.subItems.length > 0) {\n this.setExpandedPropertie(itemClicked.id);\n }\n }\n\n private onSubItemClick(itemClicked: SidebarProperties) {\n this.onIndexChanged.emit(itemClicked);\n }\n\n render() {\n return (\n <div class=\"main-sidebar-container\">\n {this.parsedProperties.map(item => {\n return [\n /* Item Principal */\n <div\n class={{\n 'sidebar-option': true,\n 'sidebar-active-option': !!item.active,\n 'sidebar-default-option': !item.active\n }}\n onClick={() => this.onItemClick(item)}\n >\n <dropi-icon\n name={item.icon || 'Cube'}\n width=\"20px\"\n height=\"20px\"\n color={item.active ? 'Primary-Primary-500' : 'Gray-Gray-500'}\n ></dropi-icon>\n \n <span>{item.text}</span>\n \n {item.subItems && item.subItems.length > 0 && (\n <dropi-icon\n class={{\n 'arrow': true,\n 'arrow-expanded': !!item.expandedMenu\n }}\n name=\"Dropdown-down\"\n width=\"20px\"\n height=\"20px\"\n color={item.active ? 'Primary-Primary-500' : 'Gray-Gray-500'}\n ></dropi-icon>\n )}\n </div>,\n\n /* SubItems Renderizados al mismo nivel DOM que instruye Angular ng-container */\n item.subItems && item.subItems.length > 0 && (\n item.subItems.map(subOption => (\n <div\n class={{\n 'sidebar-sub-item': true,\n 'sidebar-expanded': !!item.expandedMenu,\n 'sidebar-sub-item-default': !subOption.active,\n 'sidebar-sub-item-active': !!subOption.active\n }}\n onClick={(e) => { e.stopPropagation(); this.onSubItemClick(subOption); }}\n >\n {subOption.text}\n </div>\n ))\n )\n ];\n })}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-simple-stepper.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, h } from './index-Cvp2LQOM.js';
 const dropiSimpleStepperCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__item{display:flex;flex-direction:column;align-items:center;flex:1}.stepper__circle-row{display:flex;align-items:center;width:100%}.stepper__circle{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.stepper__circle--active{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__dot{width:8px;height:8px;border-radius:50%;background:var(--Neutral-White, #ffffff);display:block}.stepper__circle--pending .stepper__dot{background:var(--Gray-Gray-400, #858ea6)}.stepper__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Neutral-White, #ffffff)}.stepper__circle--pending .stepper__number{color:var(--Gray-Gray-500, #69738c)}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200, #c3c9d9);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500, #f49a3d)}.stepper__label{margin-top:6px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);text-align:center}`;
@@ -49,3 +49,6 @@ const DropiSimpleStepper = class {
 DropiSimpleStepper.style = dropiSimpleStepperCss();
 export { DropiSimpleStepper as dropi_simple_stepper };
+//# sourceMappingURL=dropi-simple-stepper.entry.esm.js.map
+//# sourceMappingURL=dropi-simple-stepper.entry.js.map

package/dist/dropi-ui/dropi-simple-stepper.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"dropi-simple-stepper.entry.js","mappings":";;AAAA,MAAM,qBAAqB,GAAG,MAAM,CAAC,09CAA09C,CAAC;;MCcn/C,kBAAkB,GAAA,MAAA;;;;;IAErB,UAAU,GAAW,CAAC;;IAEtB,QAAQ,GAAgB,OAAO;;IAE/B,WAAW,GAAW,CAAC;;IAEvB,YAAY,GAAsB,EAAE;;IAEpC,QAAQ,GAAa,cAAc;;IAEnC,WAAW,GAAW,OAAO;AAErC,IAAA,IAAY,YAAY,GAAA;AACtB,QAAA,IAAI,OAAO,IAAI,CAAC,YAAY,KAAK,QAAQ,EAAE;AACzC,YAAA,IAAI;gBAAE,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC;;AAAI,YAAA,MAAM;AAAE,gBAAA,OAAO,EAAE;;;AAEjE,QAAA,OAAO,IAAI,CAAC,YAAY,IAAI,EAAE;;IAGhC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY;QAChC,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAEtE,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAA,EACjB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAI;AACrB,YAAA,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC,WAAW;AAC3C,YAAA,MAAM,QAAQ,GAAG,IAAI,KAAK,IAAI,CAAC,WAAW;YAC1C,MAAM,MAAM,GAAG,CAAC,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;AACrC,YAAA,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC;AAEvB,YAAA,QACE,WAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAE,IAAI,EAAA,EAClC,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE;AACV,oBAAA,iBAAiB,EAAE,IAAI;AACvB,oBAAA,yBAAyB,EAAE,QAAQ;AACnC,oBAAA,4BAA4B,EAAE,WAAW;AACzC,oBAAA,0BAA0B,EAAE,CAAC,QAAQ,IAAI,CAAC,WAAW;AACtD,iBAAA,EAAA,EACE,IAAI,CAAC,QAAQ,KAAK,OAAO,IACxB,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,cAAc,EAAA,CAAG,KAE7B,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAAE,IAAI,CAAQ,CAC5C,CACG,EACL,CAAC,MAAM,IAAI,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,eAAe,EAAE,IAAI,EAAE,qBAAqB,EAAE,WAAW,EAAE,GAAI,CACrF,EACL,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,gBAAgB,IAAE,KAAK,CAAQ,CACjD;SAET,CAAC,CACE;;;;;;;","names":[],"sources":["src/components/dropi-simple-stepper/dropi-simple-stepper.css?tag=dropi-simple-stepper&encapsulation=shadow","src/components/dropi-simple-stepper/dropi-simple-stepper.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n*, *::before, *::after { box-sizing: border-box; }\n\n.stepper {\n display: flex;\n align-items: flex-start;\n width: 100%;\n}\n\n.stepper__item {\n display: flex;\n flex-direction: column;\n align-items: center;\n flex: 1;\n}\n\n.stepper__circle-row {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n/* ── Circle ─────────────────────────────────────────────── */\n.stepper__circle {\n width: 24px;\n height: 24px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition: background 0.2s, border-color 0.2s;\n}\n\n.stepper__circle--pending {\n background: var(--Gray-Gray-100, #e6eaf2);\n border: 2px solid var(--Gray-Gray-200, #c3c9d9);\n}\n\n.stepper__circle--active {\n background: var(--Primary-Primary-500, #f49a3d);\n border: 2px solid var(--Primary-Primary-500, #f49a3d);\n}\n\n.stepper__circle--completed {\n background: var(--Primary-Primary-500, #f49a3d);\n border: 2px solid var(--Primary-Primary-500, #f49a3d);\n}\n\n.stepper__dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--Neutral-White, #ffffff);\n display: block;\n}\n\n.stepper__circle--pending .stepper__dot {\n background: var(--Gray-Gray-400, #858ea6);\n}\n\n.stepper__number {\n font-size: var(--font-size-xs, 10px);\n font-weight: var(--font-weight-bold, 700);\n color: var(--Neutral-White, #ffffff);\n}\n\n.stepper__circle--pending .stepper__number {\n color: var(--Gray-Gray-500, #69738c);\n}\n\n/* ── Connecting line ────────────────────────────────────── */\n.stepper__line {\n flex: 1;\n height: 2px;\n background: var(--Gray-Gray-200, #c3c9d9);\n transition: background 0.2s;\n}\n\n.stepper__line--done {\n background: var(--Primary-Primary-500, #f49a3d);\n}\n\n/* ── Label ──────────────────────────────────────────────── */\n.stepper__label {\n margin-top: 6px;\n font-size: var(--font-size-xs, 10px);\n color: var(--Gray-Gray-600, #475066);\n text-align: center;\n}\n","import { Component, Prop, h } from '@stencil/core';\n\nexport type StepperType = 'point' | 'number';\nexport type FlowMode = 'Simultaneous' | 'Sequential';\n\n/**\n * @component dropi-simple-stepper\n * Compact horizontal stepper using dots or numbers.\n */\n@Component({\n tag: 'dropi-simple-stepper',\n styleUrl: 'dropi-simple-stepper.css',\n shadow: true,\n})\nexport class DropiSimpleStepper {\n /** Total steps */\n @Prop() stepsCount: number = 3;\n /** Circle content: 'point' (dot) | 'number' */\n @Prop() typeStep: StepperType = 'point';\n /** Current active step (1-based) */\n @Prop() currentStep: number = 0;\n /** Labels shown below each step. Pass as JSON string or array */\n @Prop() labelStepper: string[] | string = [];\n /** Flow mode (visual only) */\n @Prop() flowMode: FlowMode = 'Simultaneous';\n /** White-label brand identifier (matches Angular `white_brand`) */\n @Prop() white_brand: string = 'dropi';\n\n private get parsedLabels(): string[] {\n if (typeof this.labelStepper === 'string') {\n try { return JSON.parse(this.labelStepper); } catch { return []; }\n }\n return this.labelStepper || [];\n }\n\n render() {\n const labels = this.parsedLabels;\n const steps = Array.from({ length: this.stepsCount }, (_, i) => i + 1);\n\n return (\n <div class=\"stepper\">\n {steps.map((step, i) => {\n const isCompleted = step < this.currentStep;\n const isActive = step === this.currentStep;\n const isLast = i === steps.length - 1;\n const label = labels[i];\n\n return (\n <div class=\"stepper__item\" key={step}>\n <div class=\"stepper__circle-row\">\n <div class={{\n 'stepper__circle': true,\n 'stepper__circle--active': isActive,\n 'stepper__circle--completed': isCompleted,\n 'stepper__circle--pending': !isActive && !isCompleted,\n }}>\n {this.typeStep === 'point' ? (\n <span class=\"stepper__dot\" />\n ) : (\n <span class=\"stepper__number\">{step}</span>\n )}\n </div>\n {!isLast && <div class={{ 'stepper__line': true, 'stepper__line--done': isCompleted }} />}\n </div>\n {label && <span class=\"stepper__label\">{label}</span>}\n </div>\n );\n })}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/{esm → dropi-ui}/dropi-skeleton.entry.js RENAMED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-D5SAM1O2.js';
+import { r as registerInstance, h } from './index-Cvp2LQOM.js';
 const dropiSkeletonCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.skeleton-lines{display:flex;flex-direction:column;gap:8px}.skeleton{background:linear-gradient(     90deg,     var(--Gray-Gray-100, #e6eaf2) 25%,     var(--Gray-Gray-50, #f7f8fa) 50%,     var(--Gray-Gray-100, #e6eaf2) 75%   );background-size:200% 100%;animation:shimmer 1.6s ease-in-out infinite}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
@@ -53,3 +53,6 @@ const DropiSkeleton = class {
 DropiSkeleton.style = dropiSkeletonCss();
 export { DropiSkeleton as dropi_skeleton };
+//# sourceMappingURL=dropi-skeleton.entry.esm.js.map
+//# sourceMappingURL=dropi-skeleton.entry.js.map