@dropi/ui 0.1.55 → 999.0.0

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

@@ -1,48 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiBreadcrumbCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.breadcrumb{margin:0}.crumb-list{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.crumb-home{display:flex;padding-right:4px;align-items:center;gap:4px}.home-link{display:inline-flex;align-items:center;color:var(--Gray-Gray-500, #69738c);text-decoration:none;transition:color 0.2s ease}.home-link:hover{color:var(--Gray-Gray-700, #32394d)}.crumb{display:flex;padding:0 4px;align-items:center;gap:8px}.crumb-link{color:var(--Gray-Gray-500, #69738c);text-align:center;cursor:pointer;text-decoration:none;transition:color 0.2s ease;font-size:var(--font-size-s, 12px)}.crumb-link:hover{color:var(--Gray-Gray-700, #32394d);text-decoration:underline}.crumb-link.disabled{pointer-events:none;color:var(--Gray-Gray-300, #a1a8b8);cursor:not-allowed;text-decoration:none}.current{color:var(--Gray-Gray-700, #32394d);cursor:default;font-size:var(--font-size-s, 12px)}`;
-
-const DropiBreadcrumb = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiNavigate = index.createEvent(this, "dropiNavigate");
-    }
-    /** Breadcrumb items (array or JSON string). Last item is rendered as current. */
-    items = [];
-    /** Home link href */
-    homeRoute = '/';
-    /** dropi-icon name for home */
-    homeIconName = 'Home';
-    /** Whether the last item is also clickable */
-    lastItemClickable = false;
-    /** Emitted when any item or home is clicked. Detail is the item or homeRoute string. */
-    dropiNavigate;
-    get parsedItems() {
-        if (typeof this.items === 'string') {
-            try {
-                return JSON.parse(this.items);
-            }
-            catch {
-                return [];
-            }
-        }
-        return this.items;
-    }
-    render() {
-        const items = this.parsedItems;
-        return (index.h("nav", { key: 'c4546d7a0c7852e01f685176b5365f1e0082ad24', class: "breadcrumb", "aria-label": "Breadcrumb" }, index.h("div", { key: '924ab634ae4e71f6bd39a67b4b3889cdca20234d', class: "crumb-list" }, index.h("div", { key: 'e7b1b285bdd497a028a041ada1eb8b34f77384b0', class: "crumb-home" }, index.h("a", { key: '9e288d5f5761daed20b35dbf056c7de9c2e7b8e3', href: this.homeRoute, class: "home-link", "aria-label": "Inicio", onClick: (e) => { e.preventDefault(); this.dropiNavigate.emit(this.homeRoute); } }, index.h("dropi-icon", { key: '803ab6d710976b341f19ad7d49fde670acc2c466', name: this.homeIconName, iconWidth: "16px", color: "Gray-Gray-500" })), items.length > 0 && (index.h("dropi-icon", { key: '44d1cad9efa9cbc6a52bc26a2229af6680cd8733', name: "Dropdown-Right", iconWidth: "16px", color: "Gray-Gray-500" }))), items.map((item, idx) => {
-            const isLast = idx === items.length - 1;
-            const href = item.url || item.routerLink || '#';
-            return (index.h("div", { class: "crumb", key: idx }, (!isLast || this.lastItemClickable) ? (index.h("a", { class: `crumb-link Body-S-Regular${item.disabled ? ' disabled' : ''}`, href: href, onClick: (e) => {
-                    e.preventDefault();
-                    if (!item.disabled)
-                        this.dropiNavigate.emit(item);
-                } }, item.label)) : (index.h("span", { class: "current Body-S-Regular", "aria-current": "page" }, item.label)), !isLast && (index.h("dropi-icon", { name: "Dropdown-Right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-500" }))));
-        }))));
-    }
-};
-DropiBreadcrumb.style = dropiBreadcrumbCss();
-
-exports.dropi_breadcrumb = DropiBreadcrumb;

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

@@ -1,104 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiButtonCss = () => `:host{display:inline-block;border:0}:host([full-width]){display:flex;width:100%}:host([full-width]) .btn{width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.btn{all:unset;font-family:var(--font-family-01, 'Inter', sans-serif);box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);border-radius:var(--Border-2, 8px);font-weight:var(--font-weight-bold);min-width:33px;line-height:110%;cursor:pointer;white-space:nowrap;transition:background 0.25s ease,     color 0.25s ease,     border-color 0.25s ease,     transform 0.25s ease}.btn:active{transition:transform 0.01s ease-out;transform:scale(0.98)}.btn:hover:not(:active){transform:scale(1.01)}.btn.without-text{gap:0}.btn.large{padding:var(--Size-4, 16px);font-size:var(--Size-4, 16px);height:48px}.btn.normal{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);height:40px}.btn.small{padding:var(--Size-2, 8px);font-size:var(--font-size-s, 12px);height:29px}.btn.disabled,.btn.loading{cursor:not-allowed;pointer-events:none}.btn.primary.default{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff)}.btn.primary.default:hover{background:var(--Primary-Primary-600, #e58017)}.btn.primary.success{background:var(--Success-Success-500, #0abb87);color:var(--Neutral-White, #ffffff)}.btn.primary.success:hover{background:var(--Success-Success-600, #09aa7b)}.btn.primary.info{background:var(--Info-Info-500, #50a5f1);color:var(--Neutral-White, #ffffff)}.btn.primary.info:hover{background:var(--Info-Info-600, #4996db)}.btn.primary.error{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #ffffff)}.btn.primary.error:hover{background:var(--Error-Error-600, #de6061)}.btn.primary.warning{background:var(--Warning-Warning-500, #f1b44c);color:var(--Neutral-White, #ffffff)}.btn.primary.warning:hover{background:var(--Warning-Warning-600, #dba445)}.btn.primary.legacy{background:var(--Secondary-Secondary-500, #008dbf);color:var(--Neutral-White, #ffffff)}.btn.primary.legacy:hover{background:var(--Secondary-Secondary-600, #007199)}.btn.primary.disabled.default{background:var(--Primary-Primary-300, #f2bc85);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.success{background:var(--Success-Success-300, #5bd1af);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.info{background:var(--Info-Info-300, #8ac3f6);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.error{background:var(--Error-Error-300, #f89b9c);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.warning{background:var(--Warning-Warning-300, #f6cd87);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.legacy{background:var(--Secondary-Secondary-300, #62bad9);color:var(--Neutral-White, #ffffff)}.btn.secondary{background:var(--Neutral-White, #ffffff);border:1px solid}.btn.secondary.default{border-color:var(--Primary-Primary-500, #f49a3d);color:var(--Primary-Primary-500, #f49a3d)}.btn.secondary.default:hover{color:var(--Primary-Primary-600, #e58017);border-color:var(--Primary-Primary-600, #e58017)}.btn.secondary.success{border-color:var(--Success-Success-500, #0abb87);color:var(--Success-Success-500, #0abb87)}.btn.secondary.success:hover{color:var(--Success-Success-600, #09aa7b);border-color:var(--Success-Success-600, #09aa7b)}.btn.secondary.info{border-color:var(--Info-Info-500, #50a5f1);color:var(--Info-Info-500, #50a5f1)}.btn.secondary.info:hover{color:var(--Info-Info-600, #4996db);border-color:var(--Info-Info-600, #4996db)}.btn.secondary.error{border-color:var(--Error-Error-500, #f46a6b);color:var(--Error-Error-500, #f46a6b)}.btn.secondary.error:hover{color:var(--Error-Error-600, #de6061);border-color:var(--Error-Error-600, #de6061)}.btn.secondary.warning{border-color:var(--Warning-Warning-500, #f1b44c);color:var(--Warning-Warning-500, #f1b44c)}.btn.secondary.warning:hover{color:var(--Warning-Warning-600, #dba445);border-color:var(--Warning-Warning-600, #dba445)}.btn.secondary.legacy{border-color:var(--Secondary-Secondary-500, #008dbf);color:var(--Secondary-Secondary-500, #008dbf)}.btn.secondary.legacy:hover{color:var(--Secondary-Secondary-600, #007199);border-color:var(--Secondary-Secondary-600, #007199)}.btn.secondary.disabled.default{border-color:var(--Primary-Primary-300, #f2bc85);color:var(--Primary-Primary-300, #f2bc85)}.btn.secondary.disabled.success{border-color:var(--Success-Success-300, #5bd1af);color:var(--Success-Success-300, #5bd1af)}.btn.secondary.disabled.info{border-color:var(--Info-Info-300, #8ac3f6);color:var(--Info-Info-300, #8ac3f6)}.btn.secondary.disabled.error{border-color:var(--Error-Error-300, #f89b9c);color:var(--Error-Error-300, #f89b9c)}.btn.secondary.disabled.warning{border-color:var(--Warning-Warning-300, #f6cd87);color:var(--Warning-Warning-300, #f6cd87)}.btn.secondary.disabled.legacy{border-color:var(--Secondary-Secondary-300, #62bad9);color:var(--Secondary-Secondary-300, #62bad9)}.btn.tertiary{background:none;border:none}.btn.tertiary.default,.btn.tertiary.legacy{border:none !important;box-shadow:none !important;color:var(--Gray-Gray-500, #69738c)}.btn.tertiary.default:hover,.btn.tertiary.legacy:hover{background:var(--Gray-Gray-50, #f5f6f8);box-shadow:none !important;color:var(--Gray-Gray-600, #475066)}.btn.tertiary.success{color:var(--Success-Success-500, #0abb87)}.btn.tertiary.success:hover{background:var(--Success-Success-50, #e7f8f3)}.btn.tertiary.info{color:var(--Info-Info-500, #50a5f1)}.btn.tertiary.info:hover{background:var(--Info-Info-50, #eef6fe)}.btn.tertiary.error{color:var(--Error-Error-500, #f46a6b)}.btn.tertiary.error:hover{background:var(--Error-Error-50, #fef0f0)}.btn.tertiary.warning{color:var(--Warning-Warning-500, #f1b44c)}.btn.tertiary.warning:hover{background:var(--Warning-Warning-50, #fef8ed)}.btn.tertiary.dropdown{color:var(--Gray-Gray-500, #69738c);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);background:transparent}.btn.tertiary.disabled.default,.btn.tertiary.disabled.legacy{border:none !important;color:var(--Gray-Gray-400, #858ea6)}.btn.tertiary.disabled.success{color:var(--Success-Success-300, #5bd1af)}.btn.tertiary.disabled.info{color:var(--Info-Info-300, #8ac3f6)}.btn.tertiary.disabled.error{color:var(--Error-Error-300, #f89b9c)}.btn.tertiary.disabled.warning{color:var(--Warning-Warning-300, #f6cd87)}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
-
-const DropiButton = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiClick = index.createEvent(this, "dropiClick");
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-    }
-    internals;
-    /** Visual color palette */
-    type = 'default';
-    /** Primary (filled) | Secondary (outlined) | Tertiary (ghost) */
-    severity = 'primary';
-    /** Button size */
-    size = 'normal';
-    /** Button state */
-    state = 'default';
-    /** Full width button */
-    fullWidth = false;
-    /** Icon name to show before the text */
-    preIcon = '';
-    /** Icon name to show after the text */
-    postIcon = '';
-    /** Custom icon color override */
-    customIconColor = '';
-    /** Button label */
-    text = '';
-    /** Native HTML button type (submit, reset, button) */
-    nativeType = 'button';
-    /** Emitted on click (not emitted when disabled or loading) */
-    dropiClick;
-    colorMap = {
-        default: 'Primary-Primary-',
-        success: 'Success-Success-',
-        error: 'Error-Error-',
-        info: 'Info-Info-',
-        legacy: 'Secondary-Secondary-',
-        warning: 'Warning-Warning-',
-        dropdown: 'Gray-Gray-',
-        'default-light': 'Gray-Gray-',
-    };
-    get iconSize() {
-        if (this.size === 'large')
-            return '24px';
-        if (this.size === 'small')
-            return '16px';
-        return '18px';
-    }
-    get color() {
-        const intensity = this.state === 'disabled' ? '300' : '500';
-        return (this.colorMap[this.type] ?? 'Primary-Primary-') + intensity;
-    }
-    get fontColor() {
-        if (this.severity === 'tertiary') {
-            return this.type === 'default' || this.type === 'legacy' ? 'Gray-Gray-500' : this.color;
-        }
-        if (this.severity === 'secondary')
-            return this.color;
-        return 'Neutral-White';
-    }
-    handleClick(e) {
-        if (this.state !== 'disabled' && this.state !== 'loading') {
-            this.dropiClick.emit(e);
-            if (this.nativeType === 'submit') {
-                this.internals.form?.requestSubmit();
-            }
-            else if (this.nativeType === 'reset') {
-                this.internals.form?.reset();
-            }
-        }
-    }
-    renderLoadingSpinner() {
-        return (index.h("svg", { class: "spin", width: this.iconSize, height: this.iconSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M22.8 12C23.4627 12 24.0062 11.4614 23.9401 10.802C23.8232 9.6371 23.5362 8.49339 23.0866 7.4078C22.4835 5.95189 21.5996 4.62902 20.4853 3.51472C19.371 2.40042 18.0481 1.5165 16.5922 0.913445C15.5066 0.463778 14.3629 0.17683 13.198 0.0599502C12.5386 -0.00621439 12 0.537258 12 1.2C12 1.86274 12.5393 2.39227 13.1969 2.4749C14.0463 2.58164 14.8795 2.80176 15.6738 3.13076C16.8385 3.6132 17.8968 4.32033 18.7882 5.21177C19.6797 6.10322 20.3868 7.16151 20.8692 8.32624C21.1982 9.12051 21.4184 9.95367 21.5251 10.8031C21.6077 11.4607 22.1373 12 22.8 12Z", fill: `var(--${this.fontColor})` })));
-    }
-    render() {
-        const isDisabled = this.state === 'disabled' || this.state === 'loading';
-        const hasText = (this.text ?? '') !== '';
-        const showPostIcon = (this.postIcon ?? '') !== '' || (this.type ?? 'default') === 'dropdown';
-        const dropdownIcon = (this.type ?? 'default') === 'dropdown' ? 'Dropdown-down' : (this.postIcon ?? '');
-        return (index.h("button", { key: '21d2654de08dff8db6c2b1ba87594e1184a7aa35', class: {
-                btn: true,
-                'without-text': !hasText,
-                [this.severity ?? 'primary']: true,
-                [this.type ?? 'default']: true,
-                [this.size ?? 'normal']: true,
-                [this.state ?? 'default']: true,
-                'full-width': this.fullWidth,
-            }, type: this.nativeType, disabled: isDisabled, onClick: (e) => this.handleClick(e) }, this.preIcon && (index.h("dropi-icon", { key: '6c6c01c923a37df20b614602b18cd2da949bcb91', name: this.preIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), hasText && index.h("span", { key: '82447aab8b87bc4a89105cd0209e6c5681222f28', class: "text" }, this.text), showPostIcon && (index.h("dropi-icon", { key: '6bdefe7c1c819b213d24e0100c2303fb7840ea00', name: dropdownIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), this.state === 'loading' && this.renderLoadingSpinner(), index.h("slot", { key: '44483caf52d2ca617ad86c1574a54709f8e77ab5' })));
-    }
-    static get formAssociated() { return true; }
-};
-DropiButton.style = dropiButtonCss();
-
-exports.dropi_button = DropiButton;

package/dist/cjs/dropi-card-checkbox.cjs.entry.js

@@ -1,48 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCardCheckboxCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.container-card-check{padding:var(--Size-4, 16px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Size-2, 8px);width:100%;display:flex;align-items:center;gap:var(--Size-3, 12px);cursor:pointer;height:66px;overflow:hidden;transition:background 0.15s ease, border-color 0.15s ease}.container-card-check.disabled{border-radius:var(--Border-2, 8px);border:1px solid var(--Gray-Gray-100, #e6eaf2);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:default}.container-card-check.disabled .title-check,.container-card-check.disabled .description-text,.container-card-check.disabled .extra-info{color:var(--Gray-Gray-400, #858ea6)}.container-text{width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:start;overflow:hidden}.title-check{color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-regular, 400);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.description-text{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);margin-top:var(--Size-1, 4px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.extra-info{display:flex;justify-content:space-between;align-items:center;flex-direction:column;gap:4px;flex-shrink:0;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066)}.extra-info h4{margin:0;font-weight:var(--font-weight-semibold);color:inherit;line-height:inherit}.default-card{border:none}.is-checked{background:var(--Primary-Primary-50, #fff8f0);border:1px solid var(--Primary-Primary-500, #f49a3d)}`;
-
-const DropiCardCheckbox = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiChange = index.createEvent(this, "dropiChange");
-    }
-    /** Visual type — matches Angular: 'default' | 'with card' */
-    type = 'default';
-    /** Whether the checkbox is checked — matches Angular 'state' */
-    state = 'checked';
-    /** Main title — matches Angular 'title' */
-    title = 'Tittle';
-    /** Optional description below title */
-    description = '';
-    /** Optional extra info shown on the right */
-    extraInfo = '';
-    /** Optional extra info description shown below extraInfo */
-    extraInfoDescription = '';
-    /** Disables interaction */
-    disabled = false;
-    /** Emitted with the new checked state when clicked */
-    dropiChange;
-    get isChecked() {
-        return this.state === 'checked';
-    }
-    handleClick() {
-        if (this.disabled)
-            return;
-        this.state = this.isChecked ? 'default' : 'checked';
-        this.dropiChange.emit(this.isChecked);
-    }
-    render() {
-        return (index.h("div", { key: 'b9004c813a03956904cfed8484cac2d8290be86f', class: {
-                'container-card-check': true,
-                'default-card': this.type === 'default',
-                'is-checked': this.isChecked && this.type === 'with card',
-                'disabled': this.disabled,
-            }, onClick: () => this.handleClick() }, index.h("dropi-checkbox", { key: '7ac16d56fb2f3a0e415274f1e767ccddf49dc35d', name: "_card-checkbox", checked: this.isChecked, disabled: this.disabled }), index.h("div", { key: 'a7d782c96ef6a5fad7e98ea2b7c5e5db09dfefe4', class: "container-text" }, index.h("div", { key: '4cb9ecb3ec80a1ce375cefb044aedd8a6818f1f1', class: "title-check" }, this.title), this.description && index.h("div", { key: '2f763eba23e8e1c52392cf251d6492e46d9d8c7c', class: "description-text" }, this.description)), (this.extraInfo || this.extraInfoDescription) && (index.h("div", { key: 'f853d59072a10b4f9e924c6e62132ea3b7c5feca', class: "extra-info" }, this.extraInfo && index.h("div", { key: '3c198762cd1e70622419959e39c0be41d51b1273' }, this.extraInfo), this.extraInfoDescription && index.h("h4", { key: 'dc98cf76aa221d1a6cd49002376be6b9c3dcff3a' }, this.extraInfoDescription)))));
-    }
-};
-DropiCardCheckbox.style = dropiCardCheckboxCss();
-
-exports.dropi_card_checkbox = DropiCardCheckbox;

package/dist/cjs/dropi-card-product.cjs.entry.js

@@ -1,78 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCardProductCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropi-card-product{position:relative;background:#ffffff;border-radius:8px;overflow:hidden;transition:all 0.2s ease-in-out;cursor:pointer;display:flex;flex-direction:column;height:100%;box-sizing:border-box;width:100%;max-width:450px;box-shadow:none}.product-image-container{padding:4px;flex-shrink:0}.product-image{position:relative;width:100%;aspect-ratio:1;border-radius:8px;border:1px solid #c3c9d9;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa}.product-image img{width:100%;height:100%;object-fit:cover;border-radius:8px}.product-image img.error-img{object-fit:contain}.favorite-button{position:absolute;bottom:5px;right:6px;border-radius:8px;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;z-index:2;display:flex;align-items:center;justify-content:center;width:42px;height:40px;background:#ffffff;border:1px solid #858ea6}.favorite-button.favorite-active{background:var(--Primary-Primary-500, #f49a3d);border:1px solid var(--Primary-Primary-500, #f49a3d)}.product-info{position:relative;padding:8px;display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}.supplier-insignia{position:absolute;top:-24px;left:0px}.product-header{display:flex;justify-content:space-between;align-items:center;width:100%;height:26px}.category{color:#69738c;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5;flex:1}.stock-info{display:flex;align-items:center;gap:2px;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5}.stock-label{color:#69738c}.stock-value{font-weight:500}.product-name{color:#32394d;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:16px;font-weight:500;line-height:1.5;margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.supplier-info{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;line-height:1.2}.supplier-label{color:#69738c;font-weight:400}.supplier-name{color:#50a5f1;font-weight:400;margin-left:4px;cursor:pointer}.price-container{display:flex;gap:8px;margin-top:4px}.price-item{flex:1;display:flex;flex-direction:column}.price-label{color:#69738c;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5;height:18px;min-width:max-content}.price-value{color:#32394d;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:14px;font-weight:700;line-height:1.1;margin-top:2px}.separator{height:1px;background:#e6eaf2;margin:0;flex-shrink:0}.action-button{background:#ffffff;border:none;border-top:1px solid #e6eaf2;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;display:flex;align-items:center;justify-content:center;gap:8px;height:40px;flex-shrink:0}.action-button--disabled{opacity:0.3;cursor:not-allowed}.button-text{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:14px;font-weight:700;line-height:1.1;color:#f49a3d;text-align:center;white-space:nowrap}`;
-
-const DropiCardProduct = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiProductClick = index.createEvent(this, "dropiProductClick");
-        this.dropiFavoriteChange = index.createEvent(this, "dropiFavoriteChange");
-        this.dropiAddProduct = index.createEvent(this, "dropiAddProduct");
-        this.dropiSupplierClick = index.createEvent(this, "dropiSupplierClick");
-    }
-    /** Product image URL */
-    image = '';
-    /** Product name */
-    productName = '';
-    /** Sale / supplier price (Precio proveedor) */
-    salePrice = 0;
-    /** Suggested price for the dropshipper (Precio sugerido) */
-    suggestedPrice = 0;
-    /** Price currency symbol */
-    currency = '$';
-    /** Supplier / store name */
-    supplier = '';
-    /** Category label */
-    category = '';
-    /** Stock quantity (0 = Agotado) */
-    stock = 0;
-    /** Supplier category for insignia: 'verified' | 'premium' | 'exclusive' | '' */
-    supplierCategory = '';
-    /** Show favorite button */
-    showFavorite = true;
-    /** Is marked as favorite */
-    isFavorite = false;
-    /** Show "Enviar a cliente" button */
-    showAddButton = true;
-    /** Emitted when card is clicked — matches Angular 'onProductClick' */
-    dropiProductClick;
-    /** Emitted when favorite toggled — matches Angular 'changeFavorite' */
-    dropiFavoriteChange;
-    /** Emitted when "Enviar a cliente" button clicked */
-    dropiAddProduct;
-    /** Emitted when supplier name clicked */
-    dropiSupplierClick;
-    formatPrice(val) {
-        if (val == null)
-            return '0';
-        return val.toLocaleString('es-CO');
-    }
-    get inStock() {
-        return this.stock > 0;
-    }
-    getStockColor() {
-        if (this.stock === 0)
-            return 'var(--Error-Error-500, #f46a6b)';
-        if (this.stock <= 10)
-            return 'var(--Warning-Warning-500, #f59e0b)';
-        return 'var(--Success-Success-500, #0abb87)';
-    }
-    render() {
-        return (index.h("div", { key: '2fe4ce42e1c331a99fd1171c82e6e48bfb5dbff0', class: "dropi-card-product", onClick: () => this.dropiProductClick.emit() }, index.h("div", { key: '3f94077ee059e347f3ff4fff808a3a3f3a0ac827', class: "product-image-container" }, index.h("div", { key: '1d6e8181cc630ab03efc90e316c349dfe9765b46', class: "product-image" }, index.h("img", { key: 'f6647c21ac24d378482c6e6fe5220d6d18ff694b', src: this.image || '', alt: this.productName, onError: (e) => {
-                e.target.src = './assets/utils/no-image.jpg';
-            }, class: !this.image ? 'error-img' : '' }), this.showFavorite && (index.h("button", { key: '37c23af5e1345e2f2b2ac42dd38f88eb17254889', class: { 'favorite-button': true, 'favorite-active': this.isFavorite }, onClick: (e) => {
-                e.stopPropagation();
-                this.isFavorite = !this.isFavorite;
-                this.dropiFavoriteChange.emit(this.isFavorite);
-            }, "aria-label": "Favorito" }, index.h("dropi-icon", { key: 'c6d6c87dcb5ae0f9a0d416667a3d39c7e153b7a6', name: this.isFavorite ? 'Heart-solid' : 'Heart', iconWidth: "18px", iconHeight: "18px", color: this.isFavorite ? '#fff' : '#858ea6' }))))), index.h("div", { key: '66dbcb028acb35e9a43502e9ff9a00fd2ebf8bf2', class: "product-info" }, this.supplierCategory && (index.h("dropi-ilustration-icon", { key: 'fd3d94e953a6b91418decc09ed426755a85bac1b', class: "supplier-insignia", type: "insignia", stateInsignia: this.supplierCategory, tagProduct: true })), index.h("div", { key: '45817e3bb0bfdaa0ec8cb4a23fdac1bb943e93dc', class: "product-header" }, this.category && (index.h("span", { key: 'c721519a5339a2ac40d20c283bbe8797b78e4b27', class: "category" }, this.category)), index.h("div", { key: '49f5013738dfffcdb83dfde628f5d1d21164c3d2', class: "stock-info" }, index.h("span", { key: 'bd49d5069d07b3ae10ac9c85a4b84bbb573f926e', class: "stock-label" }, "Stock:"), index.h("span", { key: 'd0eefb88240c13c9c56e7470e79cbacc9d86caf4', class: "stock-value", style: { color: this.getStockColor() } }, this.stock === 0 ? 'Agotado' : this.stock))), index.h("h3", { key: 'a880d0df13af0b75d553daf18e876905b93e6ef1', class: "product-name" }, this.productName), this.supplier && (index.h("div", { key: 'faa82e269979084e7510b6a17fb1f3caee8ad181', class: "supplier-info" }, index.h("span", { key: 'b4b223620c58cb30945b1c6be50559614937eb5f', class: "supplier-label" }, "Proveedor:"), index.h("span", { key: '989580f42383c3b6adb6484a493d1293a2a11904', class: "supplier-name", onClick: (e) => { e.stopPropagation(); this.dropiSupplierClick.emit(); } }, this.supplier))), index.h("div", { key: '451c1ab830c7ab38c4e414e94f11f63ffcf86162', class: "price-container" }, index.h("div", { key: '755f3f8aac6f7b1d458d28b74dec2734b42794a6', class: "price-item" }, index.h("span", { key: 'fff0a718b4f22641adcd28bbcb7e81a0f21755e9', class: "price-label" }, "Precio proveedor"), index.h("span", { key: '5bb6843a4a293195f0dbda5c3eccfc4f38c719b1', class: "price-value" }, this.currency, " ", this.formatPrice(this.salePrice))), index.h("div", { key: '468b1d7596ec5d727846a087b5d89461c5fef858', class: "price-item" }, index.h("span", { key: '91b15e4d58d27997b2dfdb9c73fd417a8f8ba5fb', class: "price-label" }, "Precio sugerido"), index.h("span", { key: '378483760ffac07491f5b65b37d5e27d41423ec5', class: "price-value" }, this.currency, " ", this.formatPrice(this.suggestedPrice))))), index.h("div", { key: '71467832049894083ea3454618a12d082cb15844', class: "separator" }), this.showAddButton && (index.h("div", { key: 'f9f0450e3dfa2b91ae7caa468811cc739d7a280e', class: { 'action-button': true, 'action-button--disabled': !this.inStock }, onClick: (e) => {
-                e.stopPropagation();
-                if (this.inStock)
-                    this.dropiAddProduct.emit();
-            } }, index.h("dropi-icon", { key: '50a9fad974460c2728fb1fca74628d093cbb1875', name: "Shopping-cart-arrow-rigth", iconWidth: "20px", iconHeight: "20px", color: "#f49a3d" }), index.h("span", { key: 'f5ac44dd20e01bc644e863c3cbf51e3493821e70', class: "button-text" }, "Enviar a cliente")))));
-    }
-};
-DropiCardProduct.style = dropiCardProductCss();
-
-exports.dropi_card_product = DropiCardProduct;

package/dist/cjs/dropi-card-section.cjs.entry.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCardSectionCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.card-section{display:flex;align-items:center;justify-content:space-between;gap:var(--Size-4, 16px);padding:var(--Size-3, 12px) var(--Size-4, 16px);background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-100, #e6eaf2);border-radius:var(--Border-2, 8px)}.card-section__text{flex:1}.card-section__title{margin:0 0 4px;font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1f2433)}h5.card-section__title{font-size:var(--font-size-m, 14px)}h6.card-section__title{font-size:var(--font-size-s, 12px)}.card-section__desc{margin:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}.card-section__control{flex-shrink:0}.card-section__dropdown-btn{display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer}`;
-
-const DropiCardSection = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiChange = index.createEvent(this, "dropiChange");
-        this.dropiClick = index.createEvent(this, "dropiClick");
-    }
-    /** Section title — matches Angular 'title' */
-    title = 'title';
-    /** Section description */
-    description = 'Description';
-    /** Control type on the right */
-    typeElement = 'dropdown';
-    /** Title size variant */
-    type = 'important';
-    /** Switch checked state */
-    isChecked = false;
-    /** Emitted when switch changes */
-    dropiChange;
-    /** Emitted when dropdown icon is clicked */
-    dropiClick;
-    render() {
-        return (index.h("div", { key: '06fe2a580fb23484419ea4b1c41a265facb722de', class: "card-section" }, index.h("div", { key: '1020ea256b0311a200a721387b3ecb8d0f3809ab', class: "card-section__text" }, this.type === 'important'
-            ? index.h("h5", { class: "card-section__title card-section__title--important" }, this.title)
-            : index.h("h6", { class: "card-section__title" }, this.title), this.description && index.h("p", { key: '52ea93b6b2736c4c6e3ebb953c2878db90d34b4c', class: "card-section__desc" }, this.description)), index.h("div", { key: '7ec0ed96e43b45256fd5dec5ee24b0dfd6488403', class: "card-section__control" }, this.typeElement === 'switch' ? (index.h("dropi-switch", { name: "_card-section-switch", isChecked: this.isChecked, onDropiChange: (e) => {
-                this.isChecked = e.detail;
-                this.dropiChange.emit(e.detail);
-            } })) : (index.h("button", { class: "card-section__dropdown-btn", onClick: () => this.dropiClick.emit(), "aria-label": "Expandir" }, index.h("dropi-icon", { name: "Dropdown-down", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" }))))));
-    }
-};
-DropiCardSection.style = dropiCardSectionCss();
-
-exports.dropi_card_section = DropiCardSection;

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

@@ -1,153 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCarouselCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.dropi-carousel-container{display:flex;flex-direction:column;position:relative;width:100%;max-width:100%;overflow:hidden;padding:0 var(--Size-4)}.dropi-carousel-content{display:flex;align-items:center;position:relative;padding:1rem 0;width:100%}.dropi-carousel-items-content{overflow:hidden;flex:1;padding:0;width:100%;max-width:100%}.dropi-carousel-items-container{display:flex;padding-bottom:var(--Size-3);will-change:transform}.dropi-carousel-item{flex:0 0 auto;padding:0 0.5rem;box-sizing:border-box}.dropi-carousel-item>*{width:100%;box-sizing:border-box;display:block}.dropi-carousel-nav{display:flex;width:40px;height:40px;justify-content:center;align-items:center;cursor:pointer;transition:all 0.2s;flex-shrink:0;z-index:1;border-radius:var(--Border-5);background:var(--Neutral-White, #fff);box-shadow:var(--Shadow-medium);border:none;appearance:none;padding:0}.dropi-carousel-nav:hover{background:var(--Gray-Gray-50)}.dropi-carousel-nav:disabled{opacity:0.4;cursor:not-allowed;box-shadow:none}.dropi-carousel-prev{margin-right:1rem}.dropi-carousel-next{margin-left:1rem}.dropi-carousel-indicators{display:flex;justify-content:center;gap:0.5rem;list-style:none;padding:1rem 0 0 0;margin:0}.dropi-carousel-indicators li{cursor:pointer}.dropi-carousel-indicators li button{width:1rem;height:1rem;border-radius:50%;border:1px solid var(--Gray-Gray-100, #eceef4);background:var(--Neutral-White, #fff);cursor:pointer;transition:all 0.2s;padding:0}.dropi-carousel-indicators li.active button{background:var(--Primary-Primary-500);border-color:var(--Primary-Primary-500)}.dropi-carousel-indicators li:hover button{background:var(--Gray-Gray-200)}.vertical .dropi-carousel-content{flex-direction:column}.vertical .dropi-carousel-items-container{flex-direction:column}.vertical .dropi-carousel-prev{margin:0 0 1rem 0}.vertical .dropi-carousel-next{margin:1rem 0 0 0}@media (max-width: 768px){.dropi-carousel-container{padding:0}.dropi-carousel-item{padding:0 0.25rem}}`;
-
-const DropiCarousel = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiPageChange = index.createEvent(this, "dropiPageChange");
-        this.dropiPage = index.createEvent(this, "dropiPage");
-    }
-    get el() { return index.getElement(this); }
-    /** Items to display (Array of URLs or objects) */
-    value = [];
-    /** Active page index */
-    page = 0;
-    /** Number of items visible per page */
-    numVisible = 1;
-    /** Number of items to scroll per click */
-    numScroll = 1;
-    /** Orientation of the carousel */
-    orientation = 'horizontal';
-    /** Show navigation arrows */
-    showNavigators = true;
-    /** Show dot indicators */
-    showIndicators = true;
-    /** Autoplay interval in ms (0 = disabled) */
-    autoplayInterval = 0;
-    /** Infinite scrolling */
-    circular = false;
-    parsedValue = [];
-    internalPage = 0;
-    isAnimating = false;
-    totalPages = 0;
-    itemsContainer;
-    timer;
-    dropiPageChange;
-    dropiPage;
-    handleValue(val) {
-        this.parsedValue = typeof val === 'string' ? JSON.parse(val) : (val || []);
-        this.updateTotalPages();
-        this.updateTransform();
-    }
-    handlePage(val) {
-        this.internalPage = val;
-        this.updateTransform();
-    }
-    componentWillLoad() {
-        if (!this.value || (Array.isArray(this.value) && this.value.length === 0)) {
-            const attrValue = this.el.getAttribute('value');
-            if (attrValue)
-                this.value = attrValue;
-        }
-        this.handleValue(this.value);
-        this.internalPage = this.page;
-    }
-    componentDidLoad() {
-        this.updateTransform();
-        if (this.autoplayInterval > 0) {
-            this.startAutoplay();
-        }
-        window.addEventListener('resize', this.onResize);
-    }
-    disconnectedCallback() {
-        this.stopAutoplay();
-        window.removeEventListener('resize', this.onResize);
-    }
-    onResize = () => {
-        this.updateTotalPages();
-        this.updateTransform();
-    };
-    startAutoplay() {
-        this.timer = setInterval(() => this.navForward(), this.autoplayInterval);
-    }
-    stopAutoplay() {
-        if (this.timer)
-            clearInterval(this.timer);
-    }
-    updateTotalPages() {
-        if (!this.parsedValue.length || this.parsedValue.length <= this.numVisible) {
-            this.totalPages = 1;
-            return;
-        }
-        const totalItems = this.parsedValue.length;
-        const remainingItems = totalItems - this.numVisible;
-        this.totalPages = Math.ceil(remainingItems / this.numScroll) + 1;
-    }
-    updateTransform() {
-        if (!this.itemsContainer)
-            return;
-        const prop = this.orientation === 'vertical' ? 'translateY' : 'translateX';
-        const firstItem = this.itemsContainer.querySelector('.dropi-carousel-item');
-        if (!firstItem)
-            return;
-        const itemSize = this.orientation === 'vertical' ? firstItem.offsetHeight : firstItem.offsetWidth;
-        const itemsScrolled = this.internalPage * this.numScroll;
-        const maxScroll = Math.max(0, this.parsedValue.length - this.numVisible);
-        const safeScroll = Math.min(itemsScrolled, maxScroll);
-        const translateValue = -(safeScroll * itemSize);
-        this.itemsContainer.style.transform = `${prop}(${translateValue}px)`;
-    }
-    navForward = (e) => {
-        if (e)
-            e.preventDefault();
-        if (this.circular || this.internalPage < this.totalPages - 1) {
-            this.isAnimating = true;
-            this.internalPage = (this.internalPage + 1) % this.totalPages;
-            this.page = this.internalPage;
-            this.updateTransform();
-            this.dropiPageChange.emit(this.internalPage);
-            setTimeout(() => (this.isAnimating = false), 500);
-        }
-    };
-    navBackward = (e) => {
-        if (e)
-            e.preventDefault();
-        if (this.circular || this.internalPage > 0) {
-            this.isAnimating = true;
-            this.internalPage = (this.internalPage - 1 + this.totalPages) % this.totalPages;
-            this.page = this.internalPage;
-            this.updateTransform();
-            this.dropiPageChange.emit(this.internalPage);
-            setTimeout(() => (this.isAnimating = false), 500);
-        }
-    };
-    onDotClick(index) {
-        this.isAnimating = true;
-        this.internalPage = index;
-        this.page = this.internalPage;
-        this.updateTransform();
-        this.dropiPageChange.emit(this.internalPage);
-        setTimeout(() => (this.isAnimating = false), 500);
-    }
-    render() {
-        const items = this.parsedValue;
-        if (!items.length)
-            return null;
-        const itemFlexBasis = `${100 / this.numVisible}%`;
-        return (index.h("div", { class: { 'dropi-carousel-container': true, 'vertical': this.orientation === 'vertical' } }, index.h("div", { class: "dropi-carousel-content" }, this.showNavigators && items.length > this.numVisible && (index.h("button", { class: "dropi-carousel-nav dropi-carousel-prev", disabled: !this.circular && this.internalPage === 0, onClick: (e) => this.navBackward(e), "aria-label": "Anterior" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { d: "M14.659 17.5a.833.833 0 0 1-.589-.244l-4.43-4.431a.833.833 0 0 1 0-1.178l4.43-4.431a.834.834 0 0 1 1.179 1.178L11.42 12.25l3.83 3.829a.833.833 0 0 1-.59 1.421Z", fill: "#475066" })))), index.h("div", { class: "dropi-carousel-items-content" }, index.h("div", { class: "dropi-carousel-items-container", ref: (el) => (this.itemsContainer = el), style: { transition: this.isAnimating ? 'transform 0.5s ease' : 'none' } }, items.map((item, i) => (index.h("div", { class: "dropi-carousel-item", style: { flex: `0 0 ${itemFlexBasis}` } }, typeof item === 'string' ? (index.h("img", { src: item, alt: `Slide ${i + 1}` })) : (index.h("slot", { name: `item-${i}` }))))))), this.showNavigators && items.length > this.numVisible && (index.h("button", { class: "dropi-carousel-nav dropi-carousel-next", disabled: !this.circular && this.internalPage >= this.totalPages - 1, onClick: (e) => this.navForward(e), "aria-label": "Siguiente" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { d: "M9.341 17.5a.833.833 0 0 0 .589-.244l4.43-4.431a.833.833 0 0 0 0-1.178l-4.43-4.431a.834.834 0 0 0-1.179 1.178l3.83 3.829-3.83 3.829a.833.833 0 0 0 .59 1.421Z", fill: "#475066" }))))), this.showIndicators && this.totalPages > 1 && (index.h("ul", { class: "dropi-carousel-indicators" }, Array.from({ length: this.totalPages }).map((_, i) => (index.h("li", { class: { active: i === this.internalPage }, onClick: () => this.onDotClick(i) }, index.h("button", { type: "button", "aria-label": `Página ${i + 1}` }))))))));
-    }
-    static get watchers() { return {
-        "value": [{
-                "handleValue": 0
-            }],
-        "page": [{
-                "handlePage": 0
-            }]
-    }; }
-};
-DropiCarousel.style = dropiCarouselCss();
-
-exports.dropi_carousel = DropiCarousel;

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

@@ -1,73 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCheckboxSelectionListCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.csl__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)}.csl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:transparent}.csl__clear{display:flex;background:none;border:none;padding:0;cursor:pointer}.csl__list{display:flex;flex-direction:column}.csl__item{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;border-radius:var(--Border-1, 4px);transition:background 0.15s}.csl__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.csl__icon{width:24px;height:24px;border-radius:50%;object-fit:cover;flex-shrink:0}.csl__label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);flex:1}.csl__empty{padding:var(--Size-4, 16px);text-align:center;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6)}`;
-
-const DropiCheckboxSelectionList = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiCheckedValues = index.createEvent(this, "dropiCheckedValues");
-        this.dropiSearch = index.createEvent(this, "dropiSearch");
-    }
-    /** Options array or JSON string */
-    options = [];
-    /** Show search filter */
-    showFilter = true;
-    /** Search placeholder */
-    filterPlaceholder = 'Search';
-    /** Show "no results" message */
-    showNotFound = true;
-    /** Empty state message */
-    notFoundMessage = 'No related results found';
-    /** Allow multiple selection */
-    multiSelect = true;
-    /** Debounce delay in ms for search input (matches Angular `searchDelay`) */
-    searchDelay = 100;
-    filterText = '';
-    selected = [];
-    parsedOptions = [];
-    /** Emitted when selection changes — matches Angular 'checkedValues' */
-    dropiCheckedValues;
-    /** Emitted on search — matches Angular 'onSearch' */
-    dropiSearch;
-    optionsChanged(val) {
-        this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val || []);
-    }
-    componentWillLoad() { this.optionsChanged(this.options); }
-    get filtered() {
-        if (!this.filterText)
-            return this.parsedOptions;
-        const q = this.filterText.toLowerCase();
-        return this.parsedOptions.filter(o => o.label?.toLowerCase().includes(q));
-    }
-    toggle(id) {
-        if (this.multiSelect) {
-            this.selected = this.selected.includes(id)
-                ? this.selected.filter(s => s !== id)
-                : [...this.selected, id];
-        }
-        else {
-            this.selected = this.selected.includes(id) ? [] : [id];
-        }
-        this.dropiCheckedValues.emit(this.selected);
-    }
-    render() {
-        const items = this.filtered;
-        return (index.h("div", { key: '95774833547807d6001525158bf199883661b649', class: "csl" }, this.showFilter && (index.h("div", { key: '13f6bfd33150cdf138e90b93fc8121dfcc311050', class: "csl__search" }, index.h("dropi-icon", { key: '4edf5c21eeac0aa442e58845621b7715d8484c1b', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), index.h("input", { key: '40071d0c189c7fd1f1bf8090ebe1d64ce9605602', class: "csl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
-                this.filterText = e.target.value;
-                this.dropiSearch.emit(this.filterText);
-            } }), this.filterText && (index.h("button", { key: 'a560cab7ce53e57e036696194054286aa1dd6fd9', class: "csl__clear", onClick: () => { this.filterText = ''; this.dropiSearch.emit(''); } }, index.h("dropi-icon", { key: 'f1ae7e38fcb954761edb02bb32af139fb5eea610', name: "Close-small", iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-400" }))))), index.h("div", { key: 'e93dfccc8215e96640ebe8c69f33f0bff5f655f2', class: "csl__list" }, items.length === 0 && this.showNotFound ? (index.h("div", { class: "csl__empty" }, this.notFoundMessage)) : (items.map(opt => {
-            const checked = this.selected.includes(opt.id);
-            return (index.h("div", { class: "csl__item", key: opt.id, onClick: () => this.toggle(opt.id) }, index.h("dropi-checkbox", { name: "_csl-option", checked: checked }), opt.icon && index.h("img", { class: "csl__icon", src: opt.icon, alt: opt.label }), index.h("span", { class: "csl__label" }, opt.label)));
-        })))));
-    }
-    static get watchers() { return {
-        "options": [{
-                "optionsChanged": 0
-            }]
-    }; }
-};
-DropiCheckboxSelectionList.style = dropiCheckboxSelectionListCss();
-
-exports.dropi_checkbox_selection_list = DropiCheckboxSelectionList;

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

@@ -1,57 +0,0 @@
-'use strict';
-
-var index = require('./index-eMp8lMK1.js');
-
-const dropiCheckboxCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.container-dropi-checkbox{display:inline-block}.check{width:20px;height:20px;border-radius:var(--Border-1, 4px);cursor:pointer;transition:background-color 0.3s ease-in-out,     border-style 0.3s ease-in-out}.noCheck{border-style:solid;border-width:2px;border-color:var(--Gray-Gray-200, #c3c9d9);display:flex;justify-content:center;align-items:center}.noCheck svg{visibility:hidden}.isCheck{display:flex;background-color:var(--Primary-Primary-500, #f49a3d);justify-content:center;align-items:center}.disabled{background-color:var(--Gray-Gray-50, #f7f8fa);border-color:var(--Gray-Gray-100, #e6eaf2);cursor:not-allowed}`;
-
-const DropiCheckbox = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.dropiChange = index.createEvent(this, "dropiChange");
-        if (hostRef.$hostElement$["s-ei"]) {
-            this.internals = hostRef.$hostElement$["s-ei"];
-        }
-        else {
-            this.internals = hostRef.$hostElement$.attachInternals();
-            hostRef.$hostElement$["s-ei"] = this.internals;
-        }
-    }
-    internals;
-    /** Name for native form submission */
-    name;
-    /** Whether the checkbox is checked */
-    checked = false;
-    /** Whether the checkbox is disabled */
-    disabled = false;
-    /** Emitted when the checked state changes */
-    dropiChange;
-    checkedChanged(val) {
-        this.internals.setFormValue(val ? 'on' : null);
-    }
-    componentWillLoad() {
-        this.internals.setFormValue(this.checked ? 'on' : null);
-    }
-    changeState() {
-        if (this.disabled)
-            return;
-        this.checked = !this.checked;
-        this.dropiChange.emit(this.checked);
-    }
-    render() {
-        return (index.h("div", { key: '091a0802423ae37f0473938259313d97a460645e', class: "container-dropi-checkbox", onClick: () => this.changeState() }, index.h("div", { key: 'bf5c681b5285a6469e7652422010b3559ac057db', class: {
-                check: true,
-                isCheck: this.checked,
-                noCheck: !this.checked,
-                disabled: this.disabled,
-            } }, index.h("svg", { key: 'be7eecf60b8f45fa6ebaa7c43d6a2087c79f02d0', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { key: '6eda9ca377ab8480479f3f2ad880895dd9b54b9d', d: "M20.5991 5.69251L9.08325 17.2075C9.00583 17.2852 8.91382 17.3469 8.8125 17.389C8.71118 17.4311 8.60255 17.4527 8.49283 17.4527C8.38312 17.4527 8.27449 17.4311 8.17317 17.389C8.07185 17.3469 7.97984 17.2852 7.90242 17.2075L3.44908 12.75C3.37166 12.6723 3.27965 12.6106 3.17833 12.5685C3.07701 12.5264 2.96838 12.5048 2.85867 12.5048C2.74896 12.5048 2.64032 12.5264 2.53901 12.5685C2.43769 12.6106 2.34568 12.6723 2.26825 12.75C2.19052 12.8274 2.12884 12.9194 2.08676 13.0208C2.04467 13.1221 2.02301 13.2307 2.02301 13.3404C2.02301 13.4501 2.04467 13.5588 2.08676 13.6601C2.12884 13.7614 2.19052 13.8534 2.26825 13.9308L6.72325 18.385C7.19321 18.8541 7.83008 19.1175 8.49408 19.1175C9.15809 19.1175 9.79496 18.8541 10.2649 18.385L21.7799 6.87251C21.8575 6.7951 21.9191 6.70314 21.9611 6.6019C22.0031 6.50065 22.0247 6.39212 22.0247 6.28251C22.0247 6.17289 22.0031 6.06436 21.9611 5.96312C21.9191 5.86188 21.8575 5.76992 21.7799 5.69251C21.7025 5.61478 21.6105 5.5531 21.5092 5.51101C21.4078 5.46893 21.2992 5.44727 21.1895 5.44727C21.0798 5.44727 20.9712 5.46893 20.8698 5.51101C20.7685 5.5531 20.6765 5.61478 20.5991 5.69251Z", fill: "#FFFFFF" })))));
-    }
-    static get formAssociated() { return true; }
-    static get watchers() { return {
-        "checked": [{
-                "checkedChanged": 0
-            }]
-    }; }
-};
-DropiCheckbox.style = dropiCheckboxCss();
-
-exports.dropi_checkbox = DropiCheckbox;