@dropi/ui 0.1.19 → 0.1.20

package/dist/collection/components/dropi-tabs/dropi-tabs.js

@@ -32,7 +32,7 @@ export class DropiTabs {
         this.dropiTabChange.emit(tab);
     }
     render() {
-        return (h("div", { key: '73bb4c928411c00cd9c6cfa6c0ed591c4573bbb1', class: "tabs-container", role: "tablist" }, this.parsedTabs.map(tab => {
+        return (h("div", { key: '9db1e2f4fdd15fc4ea4407d83fe33c562270acec', class: "tabs-container", role: "tablist" }, this.parsedTabs.map(tab => {
             const isActive = tab.id === this.activeTab;
             return (h("div", { role: "tab", "aria-selected": String(isActive), class: { 'tab-item': true, 'tab-item--active': isActive && !tab.disabled, 'tab-item--disabled': !!tab.disabled }, onClick: () => this.handleClick(tab) }, h("span", { class: "tab-label-row" }, h("span", { class: "tab-label" }, tab.label), tab.counter !== undefined && tab.counter !== null && (h("span", { class: { 'tab-counter': true, 'tab-counter--active': isActive } }, tab.counter))), this.showIcon && (tab.completed
                 ? h("dropi-icon", { name: "Check-circle", width: "12px", height: "12px", color: "Success-Success-500" })

package/dist/collection/components/dropi-tag/dropi-tag.css

@@ -1,5 +1,5 @@
 :host {
-  display: inline-block;
+  display: inline-flex;
 }
 
 *, *::before, *::after { box-sizing: border-box; }
@@ -31,7 +31,6 @@
 
 .file-icon {
   display: flex;
-  margin-right: 4px;
 }
 
 @keyframes fade-in {

package/dist/collection/components/dropi-tag/dropi-tag.js

@@ -48,7 +48,7 @@ export class DropiTag {
         return typeof this.text === 'string' && this.text.trim().length > 0;
     }
     render() {
-        return (h("div", { key: '65711113151698b330e945197d0b626130dc06ef', class: "container-chips" }, h("div", { key: 'c49964c1bcdfd96f538a1782a4b564a0e73fa87e', class: { tags: true, 'icon-only': this.showIcon && !this.hasContent }, style: { backgroundColor: this.bgColor, color: this.textColor } }, this.showIcon && this.icon && (h("dropi-icon", { key: 'cb1ed97b3f33c8e4171899f78a84e3572a37e462', class: "file-icon", name: this.icon, width: "16px", height: "16px", color: this.iconColor })), this.hasContent && h("span", { key: '92d71bb6f51dd7fa362023c230f27f9fa59744c0' }, this.text))));
+        return (h("div", { key: 'ca7fdd40b3d059abe34a6c4ccfba5cbfbdb5c786', class: "container-chips" }, h("div", { key: '897f4ab4a9d2d5ecb7088c6732f59c6cc3138c43', class: { tags: true, 'icon-only': this.showIcon && !this.hasContent }, style: { backgroundColor: this.bgColor, color: this.textColor } }, this.showIcon && this.icon && (h("dropi-icon", { key: '77b9315e4d1d4bd257331a4ce4cb3b82480430c0', class: "file-icon", name: this.icon, width: "16px", height: "16px", color: this.iconColor })), this.hasContent && h("span", { key: 'c55aede3070168989b8ebefa85480968f71eb08a' }, this.text))));
     }
     static get is() { return "dropi-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-tag-type-product/dropi-tag-type-product.css

@@ -0,0 +1,14 @@
+:host {
+  display: inline-block;
+}
+
+.type-variation {
+  border-radius: 4px;
+  background: #f1b44c;
+  padding: 2px 6px;
+  font-size: 12px;
+  color: #fff;
+  text-transform: capitalize;
+  font-weight: 400;
+  width: fit-content;
+}

package/dist/collection/components/dropi-tag-type-product/dropi-tag-type-product.js

@@ -0,0 +1,48 @@
+import { h } from "@stencil/core";
+/**
+ * @component dropi-tag-type-product
+ * Tag badge showing the product variation type.
+ */
+export class DropiTagTypeProduct {
+    /** Label text. Default: VARIABLE */
+    label = 'VARIABLE';
+    render() {
+        return h("div", { key: '7002748963348a2361665d0d307f4d8eb3a24e3a', class: "type-variation" }, this.label);
+    }
+    static get is() { return "dropi-tag-type-product"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["dropi-tag-type-product.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["dropi-tag-type-product.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Label text. Default: VARIABLE"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label",
+                "defaultValue": "'VARIABLE'"
+            }
+        };
+    }
+}

package/dist/collection/components/dropi-text-area/dropi-text-area.css

@@ -1,5 +1,6 @@
 :host {
-  display: block;
+  display: flex;
+  flex-direction: column;
   width: 100%;
 }
 

package/dist/collection/components/dropi-text-area/dropi-text-area.js

@@ -70,12 +70,12 @@ export class DropiTextArea {
     render() {
         const showAsterisk = this.required && this.showAsterisk && !this.disabled;
         const showHelper = this.helperText || this.isInvalid;
-        return (h("div", { key: 'e61f93feb18b6ed2fd3a9e2b7a301b3383c59ef1', class: "textarea-wrapper" }, this.label && (h("label", { key: '3dce1ef5e6335f838778c09de911235115111623', htmlFor: this.resolvedId, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : 'var(--Gray-Gray-600)' } }, this.label, showAsterisk && h("span", { key: 'bdeb923cb358ea947bbf22cb0a76545aef5d7b80', class: "asterisk" }, " *"))), h("div", { key: '402aae3d238a559ac670e69aa3a003baa36fd2c2', class: "textarea-container" }, h("textarea", { key: 'afe5dae36cb27dbd461ab9d4f998f83a43babf90', id: this.resolvedId, class: {
+        return (h("div", { key: 'ea3be8cb6a7316f6c7e7b41b51e14db24654db7a', class: "textarea-wrapper" }, this.label && (h("label", { key: 'd6b48ca844611e26ac378070863334a481179cd5', htmlFor: this.resolvedId, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : 'var(--Gray-Gray-600)' } }, this.label, showAsterisk && h("span", { key: 'a3f28346716188fd46ae411e54a64242856c9ec1', class: "asterisk" }, " *"))), h("div", { key: 'c0532ad518a267ff14884c687e49b005ff39c381', class: "textarea-container" }, h("textarea", { key: '3bdd909fb0b1710bba23d348fe46058414a0f244', id: this.resolvedId, class: {
                 'form-control': true,
                 'Body-M-Regular': true,
                 'form-control-valid': !this.isInvalid && this.touched && !!this.value,
                 'form-control-invalid': this.isInvalid,
-            }, rows: this.rows, placeholder: this.placeholder, maxLength: this.maxlength, minLength: this.minlength, disabled: this.disabled, required: this.required, style: { resize: this.resize }, onInput: (e) => this.handleInput(e), onFocus: () => this.dropiFocus.emit(), onBlur: () => this.handleBlur() }, this.value), this.maxlength > 0 && (h("div", { key: '0c9a7c6555594e7101f72b47c819838e2ffe5236', class: "char-counter" }, this.charCount, "/", this.maxlength))), showHelper && (h("div", { key: 'ad4d6435c21ec013a271b490c74f66839de4d6c2', class: "form-control-helper" }, this.isInvalid && (h("dropi-icon", { key: '11e480a0cb3f59f1838915850d09a0758160b2fc', name: "Warning-circle", width: "12px", height: "12px", color: "Error-Error-500" })), h("span", { key: '461e0f727feecb2fd6d5f21e51f39d017ff275b3', class: { 'invalid-color': this.isInvalid }, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : undefined } }, this.helperText)))));
+            }, rows: this.rows, placeholder: this.placeholder, maxLength: this.maxlength, minLength: this.minlength, disabled: this.disabled, required: this.required, style: { resize: this.resize }, onInput: (e) => this.handleInput(e), onFocus: () => this.dropiFocus.emit(), onBlur: () => this.handleBlur() }, this.value), this.maxlength > 0 && (h("div", { key: '7c4f136b776dd9d5d930d690401d422d856139d1', class: "char-counter" }, this.charCount, "/", this.maxlength))), showHelper && (h("div", { key: 'e72f689564b1c58cb706b5ad607044ec7cc267e7', class: "form-control-helper" }, this.isInvalid && (h("dropi-icon", { key: '93308a1c97c96da20dd246ecc23c10ed6fd656a8', name: "Warning-circle", width: "12px", height: "12px", color: "Error-Error-500" })), h("span", { key: '18df68d1cb37302d3bfeb5742432bf89806e0d98', class: { 'invalid-color': this.isInvalid }, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : undefined } }, this.helperText)))));
     }
     static get is() { return "dropi-text-area"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-time-line/dropi-time-line.js

@@ -19,7 +19,7 @@ export class DropiTimeLine {
     }
     render() {
         const steps = this.parsedSteps;
-        return (h("div", { key: '9391536f472117d8788456df24de433fc9f6ae1e', class: "timeline" }, steps.map((step, i) => {
+        return (h("div", { key: 'b8a4dee055ec85242e2a62a497a6b13fcea29bbc', class: "timeline" }, steps.map((step, i) => {
             const isLast = i === steps.length - 1;
             return (h("div", { class: { 'tl-step': true, [`tl-step--${step.status}`]: true }, key: step.id || i }, h("div", { class: "tl-step__marker" }, h("div", { class: "tl-step__icon" }, step.icon ? (h("dropi-icon", { name: step.icon, width: "16px", height: "16px", color: step.status === 'done' ? 'Neutral-White' : step.status === 'active' ? 'Primary-Primary-500' : 'Gray-Gray-400' })) : (h("span", { class: "tl-step__dot" }))), !isLast && h("div", { class: "tl-step__line" })), h("div", { class: "tl-step__content" }, h("span", { class: "tl-step__label" }, step.label), step.subtitle && h("span", { class: "tl-step__subtitle" }, step.subtitle))));
         })));

package/dist/collection/components/dropi-toast/dropi-toast.js

@@ -47,7 +47,7 @@ export class DropiToast {
         return `<lottie-player src="${this.lottieMap[severity]}" background="transparent" speed="1" loop autoplay></lottie-player>`;
     }
     render() {
-        return (h("div", { key: 'ee7e397e3ae32ac5a30b9a37777823315d2e653d', class: `toast-container toast-container--${this.position}` }, this.items.map(item => (h("div", { key: item.msg.id, class: { 'toast-wrapper': true, 'toast-wrapper--leaving': item.leaving } }, h("div", { class: `toast toast--${item.msg.severity}` }, h("div", { class: "toast-content" }, h("div", { class: "lottie-img" }, h("div", { class: "lottie-player-container", innerHTML: this.getLottieHtml(item.msg.severity) })), h("div", { class: "info-container" }, h("p", { class: "title" }, item.msg.summary), item.msg.detail && h("p", { class: "description" }, item.msg.detail))), item.msg.closable && (h("button", { class: "toast-close", onClick: () => this.remove(item.msg.id) }, h("dropi-icon", { name: "Close-small", width: "20px", height: "20px", color: "Gray-Gray-400" })))))))));
+        return (h("div", { key: 'c29bfdfa90eb237f24a4d682ae05e7c29b754404', class: `toast-container toast-container--${this.position}` }, this.items.map(item => (h("div", { key: item.msg.id, class: { 'toast-wrapper': true, 'toast-wrapper--leaving': item.leaving } }, h("div", { class: `toast toast--${item.msg.severity}` }, h("div", { class: "toast-content" }, h("div", { class: "lottie-img" }, h("div", { class: "lottie-player-container", innerHTML: this.getLottieHtml(item.msg.severity) })), h("div", { class: "info-container" }, h("p", { class: "title" }, item.msg.summary), item.msg.detail && h("p", { class: "description" }, item.msg.detail))), item.msg.closable && (h("button", { class: "toast-close", onClick: () => this.remove(item.msg.id) }, h("dropi-icon", { name: "Close-small", width: "20px", height: "20px", color: "Gray-Gray-400" })))))))));
     }
     static get is() { return "dropi-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-tooltip/dropi-tooltip.js

@@ -35,7 +35,7 @@ export class DropiTooltip {
         this.visible = false;
     };
     render() {
-        return (h("div", { key: 'fa52d7ff250fe76fefd529f2dab27338d0a8bd0a', class: "tooltip-wrapper", onMouseEnter: this.show, onMouseLeave: this.hide, onFocusin: this.show, onFocusout: this.hide }, h("slot", { key: 'e301fead7186cec3b817a9339a0878006b750cbf' }), this.text && (h("div", { key: 'e24cb85fd227d0f96935dfe6095804ad9fcbc140', class: { 'tooltip-bubble': true, [`tooltip-bubble--${this.position}`]: true, 'tooltip-bubble--visible': this.visible }, style: { maxWidth: this.maxWidth }, role: "tooltip" }, this.text, h("span", { key: 'a2dbe5693bfb2c0894d20bc2831d303b5634869e', class: `tooltip-arrow tooltip-arrow--${this.position}` })))));
+        return (h("div", { key: '9f328904e1954d08cf18d51ca765f07ec8b9d3c1', class: "tooltip-wrapper", onMouseEnter: this.show, onMouseLeave: this.hide, onFocusin: this.show, onFocusout: this.hide }, h("slot", { key: '697ebc090a9b3d7db25666b6ae8726bc9c389d3c' }), this.text && (h("div", { key: 'f82c4ad44cd13b3eb7fd3bbfa54bb598166fba1c', class: { 'tooltip-bubble': true, [`tooltip-bubble--${this.position}`]: true, 'tooltip-bubble--visible': this.visible }, style: { maxWidth: this.maxWidth }, role: "tooltip" }, this.text, h("span", { key: 'f850e6f1b5a66a686e9741b3d5e9df3bd5b81e95', class: `tooltip-arrow tooltip-arrow--${this.position}` })))));
     }
     static get is() { return "dropi-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-vertical-steps/dropi-vertical-steps.js

@@ -37,7 +37,7 @@ export class DropiVerticalSteps {
     }
     render() {
         const steps = this.parsedSteps;
-        return (h("div", { key: '4e23932cbc36257cf0f435735d95fc68be174cb7', class: "vertical-steps" }, steps.map((step, i) => {
+        return (h("div", { key: 'ec06949df14eae6937921d930e37cf7638454263', class: "vertical-steps" }, steps.map((step, i) => {
             const state = this.resolveState(i, step);
             const isLast = i === steps.length - 1;
             const isClickable = this.clickable && state === 'completed';

package/dist/collection/components/dropi-youtube-lazy-video/dropi-youtube-lazy-video.css

@@ -0,0 +1,73 @@
+:host {
+  display: block;
+  width: 100%;
+}
+
+.video-wrapper {
+  position: relative;
+  width: 100%;
+  padding-bottom: 56.25%;
+  background: #000;
+  overflow: hidden;
+  border-radius: 12px;
+}
+
+.video-wrapper iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border: none;
+}
+
+.thumbnail {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+
+.thumbnail img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  transition: transform 0.3s ease;
+}
+
+.thumbnail:hover img {
+  transform: scale(1.05);
+}
+
+.play-button {
+  position: absolute;
+  color: white;
+  border: none;
+  border-radius: 50%;
+  width: 70px;
+  height: 70px;
+  cursor: pointer;
+  transition: background 0.3s ease;
+  background: rgba(14, 17, 26, 0.6);
+  backdrop-filter: blur(2px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.play-button:hover {
+  background: rgba(0, 0, 0, 0.8);
+}
+
+@media screen and (max-width: 768px) {
+  .play-button {
+    width: 40px;
+    height: 40px;
+  }
+}

package/dist/collection/components/dropi-youtube-lazy-video/dropi-youtube-lazy-video.js

@@ -0,0 +1,110 @@
+import { h } from "@stencil/core";
+/**
+ * @component dropi-youtube-lazy-video
+ * Lazy-loads a YouTube video. Shows thumbnail until user clicks play.
+ *
+ * @example
+ * <dropi-youtube-lazy-video video-id="dQw4w9WgXcQ" video-title="Never Gonna Give You Up"></dropi-youtube-lazy-video>
+ */
+export class DropiYoutubeLazyVideo {
+    /** YouTube video ID */
+    videoId = '';
+    /** Local asset thumbnail path (without /assets/images/ prefix and .png extension) */
+    thumbnailSrc = '';
+    /** Video title for iframe accessibility */
+    videoTitle = '';
+    isPlaying = false;
+    get thumbnail() {
+        if (this.thumbnailSrc) {
+            return `/assets/images/${this.thumbnailSrc}.png`;
+        }
+        return `https://img.youtube.com/vi/${this.videoId}/hqdefault.jpg`;
+    }
+    get videoUrl() {
+        return `https://www.youtube.com/embed/${this.videoId}?autoplay=1&rel=0&modestbranding=1`;
+    }
+    render() {
+        return (h("div", { key: 'df20b4b0098b3283f266b012d56d3a0377a46420', class: `video-wrapper${this.isPlaying ? ' playing' : ''}` }, !this.isPlaying && (h("div", { key: '43b76b1e6d85da93b97ec0441331b82d567d2abe', class: "thumbnail", onClick: () => { this.isPlaying = true; } }, h("img", { key: '3719d3c151b9242f32b313047ccee4fc9b83f990', src: this.thumbnail, alt: `Video thumbnail ${this.videoId}` }), h("button", { key: '81c578b338b65168920cf38fb4dbc4ef82e6a1a7', class: "play-button", "aria-label": "Reproducir video" }, h("dropi-icon", { key: 'ce505abe0eae58cf7d24eda6527168267e3412ea', name: "Play", width: "17px", height: "21px", color: "Neutral-White" })))), this.isPlaying && (h("iframe", { key: 'bf25278bda2376f3de5776057223a139e8112d33', src: this.videoUrl, title: this.videoTitle, frameborder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, loading: "lazy" }))));
+    }
+    static get is() { return "dropi-youtube-lazy-video"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["dropi-youtube-lazy-video.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["dropi-youtube-lazy-video.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "videoId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "YouTube video ID"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "video-id",
+                "defaultValue": "''"
+            },
+            "thumbnailSrc": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Local asset thumbnail path (without /assets/images/ prefix and .png extension)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "thumbnail-src",
+                "defaultValue": "''"
+            },
+            "videoTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Video title for iframe accessibility"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "video-title",
+                "defaultValue": "''"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isPlaying": {}
+        };
+    }
+}

package/dist/components/dropi-accordion.js

@@ -1 +1 @@
-import{t as e,p as o,H as a,c as i,h as t}from"./index.js";import{d}from"./p-CPs3fHRc.js";const r=o(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiToggle=i(this,"dropiToggle")}header="";open=!1;disabled=!1;preIcon="";dropiToggle;contentHeight="0px";contentRef;openChanged(e){this.updateHeight(e)}componentDidLoad(){this.updateHeight(this.open)}updateHeight(e){this.contentRef&&(this.contentHeight=e?this.contentRef.scrollHeight+"px":"0px")}handleToggle(){this.disabled||(this.open=!this.open,this.dropiToggle.emit(this.open),setTimeout((()=>this.updateHeight(this.open)),0))}render(){return t("div",{key:"af11e06f8e10d85d6dffdbcb639479ce7095ed6e",class:{accordion:!0,"accordion--open":this.open,"accordion--disabled":this.disabled}},t("button",{key:"5c3e5303dc6e5a37dece808559dcf6a8c6245980",class:"accordion-header",onClick:()=>this.handleToggle(),"aria-expanded":this.open+"",disabled:this.disabled},t("span",{key:"062be2726403e5b9d90694555317db406c70d93f",class:"accordion-header-left"},this.preIcon&&t("dropi-icon",{key:"c626c98aaab3074cdf754460d5eff45739683404",name:this.preIcon,width:"20px",height:"20px",color:"Gray-Gray-600"}),t("span",{key:"3143e043a462df9e2b794fd2ff608ab910972a54",class:"accordion-title"},this.header)),t("span",{key:"3ffd80e303fa17582b57a0778b2bc610c6dff899",class:{"accordion-chevron":!0,"accordion-chevron--open":this.open}},t("dropi-icon",{key:"b353a6cbfbd3b51d408ced11c29eeb8a8cded9a6",name:"Dropdown-down",width:"20px",height:"20px",color:"Gray-Gray-500"}))),t("div",{key:"0754969bc5483586224ddb3774f65328dd8cd3cb",class:"accordion-body",style:{maxHeight:this.contentHeight},ref:e=>this.contentRef=e},t("div",{key:"96e87adb7ca8de258541be0d4626ba9ce09e1f97",class:"accordion-content"},t("slot",{key:"5b82c186bc11b7e9e5a714217454c0c6058be5cf"}))))}static get watchers(){return{open:[{openChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.accordion{border:1px solid var(--Gray-Gray-100,#e6eaf2);border-radius:var(--Border-2,8px);background:var(--Neutral-White,#fff);overflow:hidden}.accordion-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--Size-4,16px) var(--Size-5,20px);background:transparent;border:none;cursor:pointer;gap:12px;text-align:left}.accordion-header:disabled{cursor:not-allowed;opacity:0.5}.accordion--open .accordion-header{border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2)}.accordion-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.accordion-title{font-size:var(--font-size-m,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-700,#32394d);line-height:1.4}.accordion-chevron{display:flex;align-items:center;flex-shrink:0;transition:transform 0.22s ease}.accordion-chevron--open{transform:rotate(180deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height 0.28s ease}.accordion-content{padding:0 var(--Size-5,20px) var(--Size-4,16px);color:var(--Gray-Gray-600,#475066);font-size:var(--font-size-s,12px);line-height:1.6}"}},[769,"dropi-accordion",{header:[1],open:[1540],disabled:[4],preIcon:[1,"pre-icon"],contentHeight:[32]},void 0,{open:[{openChanged:0}]}]);function c(){"undefined"!=typeof customElements&&["dropi-accordion","dropi-icon"].forEach((o=>{switch(o){case"dropi-accordion":customElements.get(e(o))||customElements.define(e(o),r);break;case"dropi-icon":customElements.get(e(o))||d()}}))}c();const n=r,s=c;export{n as DropiAccordion,s as defineCustomElement}
+import{t as e,p as o,H as i,c as a,h as d}from"./index.js";import{d as t}from"./p-wO1yy0Zr.js";const r=o(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiToggle=a(this,"dropiToggle",7)}header="";open=!1;disabled=!1;preIcon="";dropiToggle;contentHeight="0px";contentRef;openChanged(e){this.updateHeight(e)}componentDidLoad(){this.updateHeight(this.open)}updateHeight(e){this.contentRef&&(this.contentHeight=e?this.contentRef.scrollHeight+"px":"0px")}handleToggle(){this.disabled||(this.open=!this.open,this.dropiToggle.emit(this.open),setTimeout((()=>this.updateHeight(this.open)),0))}render(){return d("div",{key:"833499ceed32f31227940efdea0250074a26dad4",class:{accordion:!0,"accordion--open":this.open,"accordion--disabled":this.disabled}},d("button",{key:"067856e0af05669e75197e0e38b4e165166e2125",class:"accordion-header",onClick:()=>this.handleToggle(),"aria-expanded":this.open+"",disabled:this.disabled},d("span",{key:"ee22e3b4251cad0c03143d7fd512f6b43b25080c",class:"accordion-header-left"},this.preIcon&&d("dropi-icon",{key:"935d87ddcd347ffb910c8093c164c768ddc85cad",name:this.preIcon,width:"20px",height:"20px",color:"Gray-Gray-600"}),d("span",{key:"88d229607eca9d6d538c620dab8040d6ebbc304f",class:"accordion-title"},this.header)),d("span",{key:"5d29cc7263bb56c5da1455f57ef3000e375489c8",class:{"accordion-chevron":!0,"accordion-chevron--open":this.open}},d("dropi-icon",{key:"c179d4d5db7fb988d9b6f41430d27e93ad36e7e4",name:"Dropdown-down",width:"20px",height:"20px",color:"Gray-Gray-500"}))),d("div",{key:"60052ec92c3659b1ab87358ec264d38faf2ed389",class:"accordion-body",style:{maxHeight:this.contentHeight},ref:e=>this.contentRef=e},d("div",{key:"3565ad511fcfa017bb264a2829ee54ee6d0d7d96",class:"accordion-content"},d("slot",{key:"1c2c4cab25bcbdf15cdd2ed699710f09dcbbbb74"}))))}static get watchers(){return{open:[{openChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.accordion{border:1px solid var(--Gray-Gray-100,#e6eaf2);border-radius:var(--Border-2,8px);background:var(--Neutral-White,#fff);overflow:hidden}.accordion-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--Size-4,16px) var(--Size-5,20px);background:transparent;border:none;cursor:pointer;gap:12px;text-align:left}.accordion-header:disabled{cursor:not-allowed;opacity:0.5}.accordion--open .accordion-header{border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2)}.accordion-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.accordion-title{font-size:var(--font-size-m,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-700,#32394d);line-height:1.4}.accordion-chevron{display:flex;align-items:center;flex-shrink:0;transition:transform 0.22s ease}.accordion-chevron--open{transform:rotate(180deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height 0.28s ease}.accordion-content{padding:0 var(--Size-5,20px) var(--Size-4,16px);color:var(--Gray-Gray-600,#475066);font-size:var(--font-size-s,12px);line-height:1.6}"}},[769,"dropi-accordion",{header:[1],open:[1540],disabled:[4],preIcon:[1,"pre-icon"],contentHeight:[32]},void 0,{open:[{openChanged:0}]}]);function c(){"undefined"!=typeof customElements&&["dropi-accordion","dropi-icon"].forEach((o=>{switch(o){case"dropi-accordion":customElements.get(e(o))||customElements.define(e(o),r);break;case"dropi-icon":customElements.get(e(o))||t()}}))}c();const n=r,s=c;export{n as DropiAccordion,s as defineCustomElement}

package/dist/components/dropi-alert-modal.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiAlertModal extends Components.DropiAlertModal, HTMLElement {}
+export const DropiAlertModal: {
+    prototype: DropiAlertModal;
+    new (): DropiAlertModal;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dropi-alert-modal.js

@@ -0,0 +1 @@
+import{t,p as e,H as i,c as s,h as o}from"./index.js";import{d as a}from"./p-DUX_WvqW.js";import{d as n}from"./p-wO1yy0Zr.js";import{d as r}from"./p-BY_J-4Sm.js";const d=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.dropiPrimary=s(this,"dropiPrimary",7),this.dropiSecondary=s(this,"dropiSecondary",7),this.dropiHide=s(this,"dropiHide",7)}visible=!1;type="question";alertTitle="";message="";primaryButton="Aceptar";secondaryButton="";loading=!1;closable=!1;displayButtons=!0;loadingTitle="Cargando";loadingMessage="Por favor espera un momento";dropiPrimary;dropiSecondary;dropiHide;lottieMap={question:"/assets/lottie-files/question.json",warning:"/assets/lottie-files/warning.json",success:"/assets/lottie-files/success.json",error:"/assets/lottie-files/failure.json",loading:"/assets/lottie-files/loading.json"};async show(){this.visible=!0}async hide(){this.visible=!1}handlePrimary(){this.dropiPrimary.emit(),this.visible=!1}handleSecondary(){this.dropiSecondary.emit(),this.visible=!1}onModalHide(){this.visible=!1,this.dropiHide.emit()}render(){const t=this.loading?"loading":this.type,e=this.loading?"300px":"120px";return console.log("[DropiAlertModal] type:",this.type,"lottieKey:",t,"src:",this.lottieMap[t]),o("dropi-modal",{key:"4038a17b3572d834f6eb015ad1ece188735d5f74",visible:this.visible,showHeader:this.closable,showCloseIcon:this.closable,dismissable:!1,closeOnEscape:!1,size:"s",onDropiHide:()=>this.onModalHide()},o("div",{key:"89a8709256c27102bde8ac25a387dc90f3f61ed4",class:"body-alert"+(this.loading?" is-loading":"")},this.lottieMap[t]&&o("div",{key:"5bf98eb48cd930bfa8fe4b94077753031830de6b",class:"lottie-img"+(this.loading?" lottie-img--loading":"")},o("dotlottie-player",{key:t,src:this.lottieMap[t],background:"transparent",speed:"1",style:{width:e,height:"auto"},loop:!0,autoplay:!0})),o("div",{key:"a2c9cd8f737ea3584a6706b0e92270893b592870",class:"content-alert"},o("h2",{key:"2cd2e5567910995c62eeb64e60c13ed40fdd14a1"},this.loading?this.loadingTitle:this.alertTitle),o("p",{key:"c6baa31f8f6bbbeb2b1f514e3584d61a50616096"},this.loading?this.loadingMessage:this.message)),!this.loading&&this.displayButtons&&o("div",{key:"7bc16afdb60ea6549fa5dff250a0146141a5715d",class:"actions"},this.secondaryButton&&o("dropi-button",{key:"8b289d9bf39622340ad2cae9ab21457a948c4843",text:this.secondaryButton,severity:"secondary",onDropiClick:()=>this.handleSecondary(),fullWidth:!0}),o("dropi-button",{key:"f87a1a80be2e72b26ddeac81d5f7638f40ddd8f7",text:this.primaryButton,severity:"primary",onDropiClick:()=>this.handlePrimary(),fullWidth:!0}))))}static get style(){return":host{display:contents}.body-alert{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-3, 12px);padding:0;overflow:hidden;width:100%;text-align:center !important}.lottie-img{display:flex;align-items:center;justify-content:center;min-height:100px;width:120px;margin-top:-8px;margin-bottom:var(--Size-2, 8px)}.lottie-img--loading{min-height:160px;width:100%}.content-alert{text-align:center;width:100%}.content-alert h2{color:var(--Gray-Gray-700, #32394d);font-size:var(--Size-5, 24px);font-weight:700;margin:0 0 var(--Size-2, 8px);text-align:center !important}.content-alert p{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 14px);margin:0;text-align:center !important;overflow-wrap:anywhere;max-height:100px;overflow:auto}.actions{display:flex;gap:12px;width:100%;margin-top:var(--Size-4, 16px)}.actions dropi-button{flex:1;display:flex}@media (max-width: 768px){.actions{flex-direction:column}}"}},[513,"dropi-alert-modal",{visible:[1540],type:[1],alertTitle:[1,"alert-title"],message:[1],primaryButton:[1,"primary-button"],secondaryButton:[1,"secondary-button"],loading:[4],closable:[4],displayButtons:[4,"display-buttons"],loadingTitle:[1,"loading-title"],loadingMessage:[1,"loading-message"],show:[64],hide:[64]}]);function l(){"undefined"!=typeof customElements&&["dropi-alert-modal","dropi-button","dropi-icon","dropi-modal"].forEach((e=>{switch(e){case"dropi-alert-modal":customElements.get(t(e))||customElements.define(t(e),d);break;case"dropi-button":customElements.get(t(e))||a();break;case"dropi-icon":customElements.get(t(e))||n();break;case"dropi-modal":customElements.get(t(e))||r()}}))}l();const c=d,p=l;export{c as DropiAlertModal,p as defineCustomElement}

package/dist/components/dropi-alert.js

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

package/dist/components/dropi-avatars.js

@@ -1 +1 @@
-import{t,p as a,H as i,h as r}from"./index.js";const e="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PGNpcmNsZSBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiIGZpbGw9IiNlNmVhZjIiLz48Y2lyY2xlIGN4PSIxOCIgY3k9IjE0IiByPSI2IiBmaWxsPSIjODU4ZWE2Ii8+PHBhdGggZD0iTTYgMzJjMC04IDI0LTggMjQgMCIgZmlsbD0iIzg1OGVhNiIvPjwvc3ZnPg==",s=a(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}image="";alt="avatar";type="users";initials="";handleError(t){t.target.src=e}render(){const t=this.initials?.slice(0,2).toUpperCase(),a=!this.image&&t;return r("figure",{key:"5bce853f6d1d17dcad603cf103d6de09ae612147",class:{avatar:!0,["avatar--"+this.type]:!0}},a?r("div",{class:"avatar__initials"},t):r("img",{src:this.image||e,alt:this.alt,onError:t=>this.handleError(t)}))}static get style(){return":host{display:inline-block}.avatar{margin:0;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar--users,.avatar--transport,.avatar--payment{width:35px;height:35px}.avatar--supplier{width:70px;height:70px}.avatar--counter{width:33px;height:33px}.avatar__initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background-color:var(--Primary-Primary-100, #fde9d0);color:var(--Primary-Primary-600, #d4872e);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.5px}"}},[513,"dropi-avatars",{image:[1],alt:[1],type:[1],initials:[1]}]);function n(){"undefined"!=typeof customElements&&["dropi-avatars"].forEach((a=>{"dropi-avatars"===a&&(customElements.get(t(a))||customElements.define(t(a),s))}))}n();const d=s,o=n;export{d as DropiAvatars,o as defineCustomElement}
+import{t,p as a,H as i,h as r}from"./index.js";const e="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PGNpcmNsZSBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiIGZpbGw9IiNlNmVhZjIiLz48Y2lyY2xlIGN4PSIxOCIgY3k9IjE0IiByPSI2IiBmaWxsPSIjODU4ZWE2Ii8+PHBhdGggZD0iTTYgMzJjMC04IDI0LTggMjQgMCIgZmlsbD0iIzg1OGVhNiIvPjwvc3ZnPg==",s=a(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}image="";alt="avatar";type="users";initials="";handleError(t){t.target.src=e}render(){const t=this.initials?.slice(0,2).toUpperCase(),a=!this.image&&t;return r("figure",{key:"207390b678faada7a5c276b23246573b04c0416c",class:{avatar:!0,["avatar--"+this.type]:!0}},a?r("div",{class:"avatar__initials"},t):r("img",{src:this.image||e,alt:this.alt,onError:t=>this.handleError(t)}))}static get style(){return":host{display:inline-block}.avatar{margin:0;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar--users,.avatar--transport,.avatar--payment{width:35px;height:35px}.avatar--supplier{width:70px;height:70px}.avatar--counter{width:33px;height:33px}.avatar__initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background-color:var(--Primary-Primary-100, #fde9d0);color:var(--Primary-Primary-600, #d4872e);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.5px}"}},[513,"dropi-avatars",{image:[1],alt:[1],type:[1],initials:[1]}]);function n(){"undefined"!=typeof customElements&&["dropi-avatars"].forEach((a=>{"dropi-avatars"===a&&(customElements.get(t(a))||customElements.define(t(a),s))}))}n();const o=s,c=n;export{o as DropiAvatars,c as defineCustomElement}

package/dist/components/dropi-badge.js

@@ -1 +1 @@
-import{t as e,p as t,H as a,h as n}from"./index.js";const s=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}state="pending";stateText={pending:"Pendiente",active:"Activo",canceled:"Cancelado",frozen:"Congelado"};renderIcon(){return"active"===this.state?n("svg",{width:"17",height:"17",viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{d:"M11.5444 5.87067L12.5389 6.88004L8.43554 10.9225C8.16142 11.1966 7.80087 11.3333 7.43892 11.3333C7.07696 11.3333 6.71287 11.1952 6.43592 10.919L4.46533 9.00929L5.45204 7.99142L7.43042 9.90887L11.5444 5.87067ZM17 8.5C17 13.187 13.187 17 8.5 17C3.81296 17 0 13.187 0 8.5C0 3.81296 3.81296 0 8.5 0C13.187 0 17 3.81296 17 8.5ZM15.5833 8.5C15.5833 4.59425 12.4057 1.41667 8.5 1.41667C4.59425 1.41667 1.41667 4.59425 1.41667 8.5C1.41667 12.4057 4.59425 15.5833 8.5 15.5833C12.4057 15.5833 15.5833 12.4057 15.5833 8.5Z",fill:"currentColor"})):"pending"===this.state?n("svg",{width:"17",height:"17",viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{d:"M8.5 17C3.81296 17 0 13.187 0 8.5C0 3.81296 3.81296 0 8.5 0C13.187 0 17 3.81296 17 8.5C17 13.187 13.187 17 8.5 17ZM8.5 1.41667C4.59425 1.41667 1.41667 4.59425 1.41667 8.5C1.41667 12.4057 4.59425 15.5833 8.5 15.5833C12.4057 15.5833 15.5833 12.4057 15.5833 8.5C15.5833 4.59425 12.4057 1.41667 8.5 1.41667ZM9.20833 8.5V4.25C9.20833 3.859 8.891 3.54167 8.5 3.54167C8.109 3.54167 7.79167 3.859 7.79167 4.25V7.79167H5.66667C5.27567 7.79167 4.95833 8.109 4.95833 8.5C4.95833 8.891 5.27567 9.20833 5.66667 9.20833H8.5C8.891 9.20833 9.20833 8.891 9.20833 8.5Z",fill:"currentColor"})):"canceled"===this.state?n("svg",{width:"12",height:"14",viewBox:"0 0 14 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M11.5497 4.86859V5.76046C12.1075 6.00391 12.5823 6.40464 12.916 6.91364C13.2497 7.42264 13.4279 8.01785 13.4287 8.62648V12.3844C13.4277 13.2146 13.0974 14.0106 12.5103 14.5976C11.9233 15.1847 11.1273 15.515 10.2971 15.516H4.03392C3.20368 15.515 2.40773 15.1847 1.82066 14.5976C1.23359 14.0106 0.903338 13.2146 0.902344 12.3844V8.62648C0.903144 8.01785 1.08129 7.42264 1.41498 6.91364C1.74868 6.40464 2.22347 6.00391 2.78129 5.76046V4.86859C2.78129 3.70582 3.2432 2.59068 4.0654 1.76848C4.8876 0.946282 6.00274 0.484375 7.1655 0.484375C8.32827 0.484375 9.44341 0.946282 10.2656 1.76848C11.0878 2.59068 11.5497 3.70582 11.5497 4.86859ZM4.95114 2.65422C4.36386 3.24151 4.03392 4.03804 4.03392 4.86859V5.4949H10.2971V4.86859C10.2971 4.03804 9.96715 3.24151 9.37986 2.65422C8.79258 2.06694 7.99605 1.73701 7.1655 1.73701C6.33496 1.73701 5.53843 2.06694 4.95114 2.65422ZM11.6257 13.713C11.9781 13.3606 12.176 12.8827 12.176 12.3844V8.62648C12.176 8.12815 11.9781 7.65023 11.6257 7.29786C11.2733 6.94549 10.7954 6.74753 10.2971 6.74753H4.03392C3.53559 6.74753 3.05768 6.94549 2.70531 7.29786C2.35294 7.65023 2.15498 8.12815 2.15498 8.62648V12.3844C2.15498 12.8827 2.35294 13.3606 2.70531 13.713C3.05768 14.0654 3.53559 14.2633 4.03392 14.2633H10.2971C10.7954 14.2633 11.2733 14.0654 11.6257 13.713ZM6.72263 9.43615C6.84009 9.31869 6.99939 9.25271 7.1655 9.25271C7.33161 9.25271 7.49092 9.31869 7.60837 9.43615C7.72583 9.55361 7.79182 9.71291 7.79182 9.87902V11.1317C7.79182 11.2978 7.72583 11.4571 7.60837 11.5745C7.49092 11.692 7.33161 11.758 7.1655 11.758C6.99939 11.758 6.84009 11.692 6.72263 11.5745C6.60517 11.4571 6.53919 11.2978 6.53919 11.1317V9.87902C6.53919 9.71291 6.60517 9.55361 6.72263 9.43615Z",fill:"currentColor"})):null}render(){return n("div",{key:"7a043420848f083d161765c16da41dc1f7c38065",class:"tag-state "+this.state},this.renderIcon(),n("p",{key:"4227bf47f3169673f44b62bde46498e3c8d607cd"},this.stateText[this.state]))}static get style(){return":host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.tag-state{border-radius:12px;padding:2px 10px;display:flex;align-items:center;gap:4px}.tag-state svg{width:13px}.tag-state p{font-size:13px;font-weight:500;line-height:20px;margin:0;padding:0}.tag-state.active{background:var(--Success-Success-50, #e7f8f3);color:var(--Success-Success-500, #0abb87)}.tag-state.pending{color:var(--Orange-orange-500, #f49a3d);background:var(--Orange-orange-50, #fef5ec)}.tag-state.canceled,.tag-state.frozen{color:var(--Gray-Gray-500, #69738c);background:var(--Gray-Gray-50, #f7f8fa)}"}},[513,"dropi-badge",{state:[1]}]);function r(){"undefined"!=typeof customElements&&["dropi-badge"].forEach((t=>{"dropi-badge"===t&&(customElements.get(e(t))||customElements.define(e(t),s))}))}r();const i=s,C=r;export{i as DropiBadge,C as defineCustomElement}
+import{t as e,p as t,H as a,h as n}from"./index.js";const s=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}state="pending";stateText={pending:"Pendiente",active:"Activo",canceled:"Cancelado",frozen:"Congelado"};renderIcon(){return"active"===this.state?n("svg",{width:"17",height:"17",viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{d:"M11.5444 5.87067L12.5389 6.88004L8.43554 10.9225C8.16142 11.1966 7.80087 11.3333 7.43892 11.3333C7.07696 11.3333 6.71287 11.1952 6.43592 10.919L4.46533 9.00929L5.45204 7.99142L7.43042 9.90887L11.5444 5.87067ZM17 8.5C17 13.187 13.187 17 8.5 17C3.81296 17 0 13.187 0 8.5C0 3.81296 3.81296 0 8.5 0C13.187 0 17 3.81296 17 8.5ZM15.5833 8.5C15.5833 4.59425 12.4057 1.41667 8.5 1.41667C4.59425 1.41667 1.41667 4.59425 1.41667 8.5C1.41667 12.4057 4.59425 15.5833 8.5 15.5833C12.4057 15.5833 15.5833 12.4057 15.5833 8.5Z",fill:"currentColor"})):"pending"===this.state?n("svg",{width:"17",height:"17",viewBox:"0 0 17 17",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{d:"M8.5 17C3.81296 17 0 13.187 0 8.5C0 3.81296 3.81296 0 8.5 0C13.187 0 17 3.81296 17 8.5C17 13.187 13.187 17 8.5 17ZM8.5 1.41667C4.59425 1.41667 1.41667 4.59425 1.41667 8.5C1.41667 12.4057 4.59425 15.5833 8.5 15.5833C12.4057 15.5833 15.5833 12.4057 15.5833 8.5C15.5833 4.59425 12.4057 1.41667 8.5 1.41667ZM9.20833 8.5V4.25C9.20833 3.859 8.891 3.54167 8.5 3.54167C8.109 3.54167 7.79167 3.859 7.79167 4.25V7.79167H5.66667C5.27567 7.79167 4.95833 8.109 4.95833 8.5C4.95833 8.891 5.27567 9.20833 5.66667 9.20833H8.5C8.891 9.20833 9.20833 8.891 9.20833 8.5Z",fill:"currentColor"})):"canceled"===this.state?n("svg",{width:"12",height:"14",viewBox:"0 0 14 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},n("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M11.5497 4.86859V5.76046C12.1075 6.00391 12.5823 6.40464 12.916 6.91364C13.2497 7.42264 13.4279 8.01785 13.4287 8.62648V12.3844C13.4277 13.2146 13.0974 14.0106 12.5103 14.5976C11.9233 15.1847 11.1273 15.515 10.2971 15.516H4.03392C3.20368 15.515 2.40773 15.1847 1.82066 14.5976C1.23359 14.0106 0.903338 13.2146 0.902344 12.3844V8.62648C0.903144 8.01785 1.08129 7.42264 1.41498 6.91364C1.74868 6.40464 2.22347 6.00391 2.78129 5.76046V4.86859C2.78129 3.70582 3.2432 2.59068 4.0654 1.76848C4.8876 0.946282 6.00274 0.484375 7.1655 0.484375C8.32827 0.484375 9.44341 0.946282 10.2656 1.76848C11.0878 2.59068 11.5497 3.70582 11.5497 4.86859ZM4.95114 2.65422C4.36386 3.24151 4.03392 4.03804 4.03392 4.86859V5.4949H10.2971V4.86859C10.2971 4.03804 9.96715 3.24151 9.37986 2.65422C8.79258 2.06694 7.99605 1.73701 7.1655 1.73701C6.33496 1.73701 5.53843 2.06694 4.95114 2.65422ZM11.6257 13.713C11.9781 13.3606 12.176 12.8827 12.176 12.3844V8.62648C12.176 8.12815 11.9781 7.65023 11.6257 7.29786C11.2733 6.94549 10.7954 6.74753 10.2971 6.74753H4.03392C3.53559 6.74753 3.05768 6.94549 2.70531 7.29786C2.35294 7.65023 2.15498 8.12815 2.15498 8.62648V12.3844C2.15498 12.8827 2.35294 13.3606 2.70531 13.713C3.05768 14.0654 3.53559 14.2633 4.03392 14.2633H10.2971C10.7954 14.2633 11.2733 14.0654 11.6257 13.713ZM6.72263 9.43615C6.84009 9.31869 6.99939 9.25271 7.1655 9.25271C7.33161 9.25271 7.49092 9.31869 7.60837 9.43615C7.72583 9.55361 7.79182 9.71291 7.79182 9.87902V11.1317C7.79182 11.2978 7.72583 11.4571 7.60837 11.5745C7.49092 11.692 7.33161 11.758 7.1655 11.758C6.99939 11.758 6.84009 11.692 6.72263 11.5745C6.60517 11.4571 6.53919 11.2978 6.53919 11.1317V9.87902C6.53919 9.71291 6.60517 9.55361 6.72263 9.43615Z",fill:"currentColor"})):null}render(){return n("div",{key:"5fe86b98326a2bc1b6916421ff51204fe307e7b7",class:"tag-state "+this.state},this.renderIcon(),n("p",{key:"887a979f44c1128a3e78f01be2f20750aab9b276"},this.stateText[this.state]))}static get style(){return":host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.tag-state{border-radius:12px;padding:2px 10px;display:flex;align-items:center;gap:4px}.tag-state svg{width:13px}.tag-state p{font-size:13px;font-weight:500;line-height:20px;margin:0;padding:0}.tag-state.active{background:var(--Success-Success-50, #e7f8f3);color:var(--Success-Success-500, #0abb87)}.tag-state.pending{color:var(--Orange-orange-500, #f49a3d);background:var(--Orange-orange-50, #fef5ec)}.tag-state.canceled,.tag-state.frozen{color:var(--Gray-Gray-500, #69738c);background:var(--Gray-Gray-50, #f7f8fa)}"}},[513,"dropi-badge",{state:[1]}]);function r(){"undefined"!=typeof customElements&&["dropi-badge"].forEach((t=>{"dropi-badge"===t&&(customElements.get(e(t))||customElements.define(e(t),s))}))}r();const i=s,C=r;export{i as DropiBadge,C as defineCustomElement}

package/dist/components/dropi-banner-external.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiBannerExternal extends Components.DropiBannerExternal, HTMLElement {}
+export const DropiBannerExternal: {
+    prototype: DropiBannerExternal;
+    new (): DropiBannerExternal;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dropi-banner-external.js

@@ -0,0 +1 @@
+import{t as r,p as e,H as i,c as n,h as t}from"./index.js";import{d as o}from"./p-wO1yy0Zr.js";const a=e(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiBannerClick=n(this,"dropiBannerClick",7),this.dropiBannerClose=n(this,"dropiBannerClose",7)}imageUrl="";link="";alt="";backgroundColor="transparent";closed=!1;dropiBannerClick;dropiBannerClose;handleClick(r){this.link||(r.preventDefault(),this.dropiBannerClick.emit())}closeBanner(r){r.preventDefault(),r.stopPropagation(),this.closed=!0,this.dropiBannerClose.emit()}render(){if(this.closed||!this.imageUrl)return null;const r=t("div",{class:"inner"},t("img",{src:this.imageUrl,alt:this.alt,loading:"lazy"}),t("button",{class:"close-btn","aria-label":"Cerrar banner",onClick:r=>this.closeBanner(r)},t("dropi-icon",{name:"Close-small",width:"20px",height:"20px",color:"Gray-Gray-600"})));return t("div",{class:"dropi-banner-external",style:{background:this.backgroundColor}},this.link?t("a",{href:this.link,target:"_blank",rel:"noopener noreferrer",onClick:r=>this.handleClick(r)},r):t("div",{class:"click-wrapper",onClick:r=>this.handleClick(r)},r))}static get style(){return":host{display:block;width:100%}.dropi-banner-external{display:block;width:100%;position:relative;margin-bottom:16px;border-radius:var(--Border-2, 8px)}.dropi-banner-external a{display:block;text-decoration:none}.click-wrapper{cursor:pointer}.inner{position:relative;display:block}.inner img{display:block;width:100%;height:auto;border-radius:var(--Border-2, 8px);max-width:1220px;margin:auto}.close-btn{position:absolute;top:4px;right:4px;background:rgba(255, 255, 255, 0.8);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background 0.15s ease}.close-btn:hover{background:rgba(255, 255, 255, 1)}"}},[513,"dropi-banner-external",{imageUrl:[1,"image-url"],link:[1],alt:[1],backgroundColor:[1,"background-color"],closed:[32]}]);function s(){"undefined"!=typeof customElements&&["dropi-banner-external","dropi-icon"].forEach((e=>{switch(e){case"dropi-banner-external":customElements.get(r(e))||customElements.define(r(e),a);break;case"dropi-icon":customElements.get(r(e))||o()}}))}s();const l=a,c=s;export{l as DropiBannerExternal,c as defineCustomElement}

package/dist/components/dropi-breadcrumb.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiBreadcrumb extends Components.DropiBreadcrumb, HTMLElement {}
+export const DropiBreadcrumb: {
+    prototype: DropiBreadcrumb;
+    new (): DropiBreadcrumb;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dropi-breadcrumb.js

@@ -0,0 +1 @@
+import{t as e,p as r,H as a,c as o,h as t}from"./index.js";import{d as i}from"./p-wO1yy0Zr.js";const c=r(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiNavigate=o(this,"dropiNavigate",7)}items=[];homeRoute="/";homeIconName="Home";lastItemClickable=!1;dropiNavigate;get parsedItems(){if("string"==typeof this.items)try{return JSON.parse(this.items)}catch{return[]}return this.items}render(){const e=this.parsedItems;return t("nav",{key:"03396956a168feaa860265e9962d9c5cbca8b23f",class:"breadcrumb","aria-label":"Breadcrumb"},t("div",{key:"88e05f4ea225b26a9686bc9f1a01e8e3710806dc",class:"crumb-list"},t("div",{key:"54e0dfc3bbef05a3041d187cd9ec0536f69c34e3",class:"crumb-home"},t("a",{key:"31c971efc13b5122ff2775ee2f79b25c06a01b0f",href:this.homeRoute,class:"home-link","aria-label":"Inicio",onClick:e=>{e.preventDefault(),this.dropiNavigate.emit(this.homeRoute)}},t("dropi-icon",{key:"8a436c3d254884e4479713a9c6981929bb91df55",name:this.homeIconName,width:"16px",color:"Gray-Gray-500"})),e.length>0&&t("dropi-icon",{key:"f57beceaa6dab5ed00a2c1c38ff43ea6bce040f5",name:"Dropdown-Right",width:"16px",color:"Gray-Gray-500"})),e.map(((r,a)=>{const o=a===e.length-1;return t("div",{class:"crumb",key:a},!o||this.lastItemClickable?t("a",{class:"crumb-link Body-S-Regular"+(r.disabled?" disabled":""),href:r.url||r.routerLink||"#",onClick:e=>{e.preventDefault(),r.disabled||this.dropiNavigate.emit(r)}},r.label):t("span",{class:"current Body-S-Regular","aria-current":"page"},r.label),!o&&t("dropi-icon",{name:"Dropdown-Right",width:"16px",height:"16px",color:"Gray-Gray-500"}))}))))}static get style(){return":host{display:block}*,*::before,*::after{box-sizing:border-box}.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)}"}},[513,"dropi-breadcrumb",{items:[1],homeRoute:[1,"home-route"],homeIconName:[1,"home-icon-name"],lastItemClickable:[4,"last-item-clickable"]}]);function s(){"undefined"!=typeof customElements&&["dropi-breadcrumb","dropi-icon"].forEach((r=>{switch(r){case"dropi-breadcrumb":customElements.get(e(r))||customElements.define(e(r),c);break;case"dropi-icon":customElements.get(e(r))||i()}}))}s();const n=c,l=s;export{n as DropiBreadcrumb,l as defineCustomElement}

package/dist/components/dropi-button.js

@@ -1 +1 @@
-import{D as o,d as s}from"./p-WZTFyFH2.js";const p=o,r=s;export{p as DropiButton,r as defineCustomElement}
+import{D as o,d as s}from"./p-DUX_WvqW.js";const p=o,r=s;export{p as DropiButton,r as defineCustomElement}

package/dist/components/dropi-card-checkbox.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiCardCheckbox extends Components.DropiCardCheckbox, HTMLElement {}
+export const DropiCardCheckbox: {
+    prototype: DropiCardCheckbox;
+    new (): DropiCardCheckbox;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dropi-card-checkbox.js

@@ -0,0 +1 @@
+import{t as e,p as i,H as r,c as a,h as t}from"./index.js";import{d as c}from"./p-DUPOnSiL.js";const d=i(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=a(this,"dropiChange",7)}type="default";checked=!1;cardTitle="";description="";extraInfo="";extraInfoDescription="";disabled=!1;dropiChange;handleClick(){this.disabled||(this.checked=!this.checked,this.dropiChange.emit(this.checked))}render(){return t("div",{key:"9c647faab478d2817593315051b1f02d0334756d",class:{"container-card-check":!0,"default-card":"default"===this.type,"is-checked":this.checked&&"with-card"===this.type,disabled:this.disabled},onClick:()=>this.handleClick()},t("dropi-checkbox",{key:"31db5cd31da290692d6aa77e0129b7e4361c23aa",checked:this.checked,disabled:this.disabled}),t("div",{key:"4b5c8eeadd255a79344d634d84e3ff93fafa34b4",class:"container-text"},t("div",{key:"30a03f764294e0b4ca8a2bf4fd1badc08d0dc7e9",class:"title-check"},this.cardTitle),this.description&&t("div",{key:"751b4fac066b17c903e56a0aa5ef16b0d4151944",class:"description-text"},this.description)),(this.extraInfo||this.extraInfoDescription)&&t("div",{key:"6b7eec457d42169ac87d1042b65b1bebdd436a5e",class:"extra-info"},this.extraInfo&&t("div",{key:"07e1cfa079668255343570498e0ad0dc0351effb"},this.extraInfo),this.extraInfoDescription&&t("h4",{key:"3a8277e2749b9cbdaf7d5d11086c7f2ac11dc39c"},this.extraInfoDescription)))}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.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-size:var(--font-size-s, 12px)}.default-card{border:none}.is-checked{background:var(--Primary-Primary-50, #fff8f0);border:1px solid var(--Primary-Primary-500, #f49a3d)}"}},[513,"dropi-card-checkbox",{type:[1],checked:[1028],cardTitle:[1,"card-title"],description:[1],extraInfo:[1,"extra-info"],extraInfoDescription:[1,"extra-info-description"],disabled:[4]}]);function o(){"undefined"!=typeof customElements&&["dropi-card-checkbox","dropi-checkbox"].forEach((i=>{switch(i){case"dropi-card-checkbox":customElements.get(e(i))||customElements.define(e(i),d);break;case"dropi-checkbox":customElements.get(e(i))||c()}}))}o();const s=d,n=o;export{s as DropiCardCheckbox,n as defineCustomElement}

package/dist/components/dropi-card-product.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiCardProduct extends Components.DropiCardProduct, HTMLElement {}
+export const DropiCardProduct: {
+    prototype: DropiCardProduct;
+    new (): DropiCardProduct;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/dropi-card-product.js

@@ -0,0 +1 @@
+import{t as r,p as a,H as e,c as o,h as i}from"./index.js";import{d}from"./p-wO1yy0Zr.js";const t=a(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiCardClick=o(this,"dropiCardClick",7),this.dropiToggleFavorite=o(this,"dropiToggleFavorite",7),this.dropiAddProduct=o(this,"dropiAddProduct",7)}image="";productName="";price=0;currency="$";supplier="";category="";showFavorite=!0;isFavorite=!1;showAddButton=!0;badge="";badgeType="default";inStock=!0;dropiCardClick;dropiToggleFavorite;dropiAddProduct;formatPrice(r){return r.toLocaleString("es-CO")}render(){return i("div",{key:"98684e3d5fac7968633bcd62b46dba6f0e0f5d64",class:"card",onClick:()=>this.dropiCardClick.emit()},i("div",{key:"848cf4ef786584e5b02a99249df3cfa48c41d428",class:"card__image-wrap"},this.image?i("img",{class:"card__image",src:this.image,alt:this.productName,loading:"lazy"}):i("div",{class:"card__image-placeholder"},i("dropi-icon",{name:"Image",width:"32px",height:"32px",color:"Gray-Gray-300"})),this.badge&&i("span",{key:"7238c35891b35a0bb12a774817542323bcd33e99",class:"card__badge card__badge--"+this.badgeType},this.badge),this.showFavorite&&i("button",{key:"647c8569997ff8ba96ca0d4d19a12570fb353d93",class:{card__fav:!0,"card__fav--active":this.isFavorite},onClick:r=>{r.stopPropagation(),this.isFavorite=!this.isFavorite,this.dropiToggleFavorite.emit(this.isFavorite)},"aria-label":"Favorito"},i("dropi-icon",{key:"a9d654e3bdc5816f2c58537cb07c486a61021fcd",name:this.isFavorite?"Heart-filled":"Heart",width:"16px",height:"16px",color:this.isFavorite?"Error-Error-500":"Gray-Gray-400"}))),i("div",{key:"c553168c5926dafb582210b680571eb9b4ae72ea",class:"card__body"},this.category&&i("span",{key:"6cee8941275bc0461c9d06b0c5bf2f0a75f14f0b",class:"card__category"},this.category),i("p",{key:"d4577a94b9a7b7b8b9c275987369dc56e4a0c2b4",class:"card__name"},this.productName),i("p",{key:"2ead66bd7ce7a7f15285b8099cfea7de8d4f6d1a",class:"card__price"},i("span",{key:"90e317dc5bdad1cbe6199ef9abd13cf6468a439b",class:"card__price-currency"},this.currency),this.formatPrice(this.price)),this.supplier&&i("p",{key:"f70fc28afbc468d7eca3683afbc193ec47c275f4",class:"card__supplier"},this.supplier),!this.inStock&&i("p",{key:"37d9911367a0e0504e661e52eee69f4628572bb1",class:"card__no-stock"},"Sin stock disponible")),this.showAddButton&&i("div",{key:"eef0213d00268319b6fa9901ced750d2f06735ed",class:"card__footer"},i("button",{key:"f026718a0146fdea94dbcda40614354be80fa932",class:"card__add-btn",disabled:!this.inStock,onClick:r=>{r.stopPropagation(),this.dropiAddProduct.emit()}},i("dropi-icon",{key:"dc3ff5553e60df93a3eb93bab43be874f8d6582d",name:"Plus",width:"14px",height:"14px",color:"Neutral-White"}),"Agregar")))}static get style(){return":host{display:block}*,*::before,*::after{box-sizing:border-box}.card{display:flex;flex-direction:column;border:1px solid var(--Gray-Gray-100, #eceef4);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);overflow:hidden;cursor:pointer;transition:box-shadow 0.2s, transform 0.2s}.card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.1);transform:translateY(-2px)}.card__image-wrap{position:relative;width:100%;aspect-ratio:1;background:var(--Gray-Gray-50, #f7f8fa);overflow:hidden}.card__image{width:100%;height:100%;object-fit:cover}.card__image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.card__badge{position:absolute;top:var(--Size-2, 8px);left:var(--Size-2, 8px);padding:2px 8px;border-radius:100px;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700)}.card__badge--default{background:var(--Gray-Gray-100, #eceef4);color:var(--Gray-Gray-700, #32394d)}.card__badge--success{background:var(--Success-Success-100, #d4f5de);color:var(--Success-Success-700, #0f7b2e)}.card__badge--warning{background:var(--Warning-Warning-100, #fef3cd);color:var(--Warning-Warning-700, #856404)}.card__badge--error{background:var(--Error-Error-100, #fde8e8);color:var(--Error-Error-700, #9b1c1c)}.card__badge--info{background:var(--Info-Info-100, #dbeafe);color:var(--Info-Info-700, #1d4ed8)}.card__fav{position:absolute;top:var(--Size-2, 8px);right:var(--Size-2, 8px);background:var(--Neutral-White, #fff);border:none;border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.12);transition:transform 0.15s}.card__fav:hover{transform:scale(1.1)}.card__fav--active{background:var(--Error-Error-50, #fef2f2)}.card__body{flex:1;padding:var(--Size-3, 12px);display:flex;flex-direction:column;gap:4px}.card__category{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-400, #858ea6);text-transform:uppercase;letter-spacing:0.5px}.card__name{margin:0;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1a2033);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card__price{margin:4px 0 0;font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Primary-Primary-500, #f49a3d)}.card__price-currency{font-size:var(--font-size-xs, 10px);margin-right:2px}.card__supplier{margin:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-400, #858ea6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card__no-stock{margin:4px 0 0;font-size:var(--font-size-xs, 10px);color:var(--Error-Error-500, #f46a6b)}.card__footer{padding:var(--Size-2, 8px) var(--Size-3, 12px) var(--Size-3, 12px)}.card__add-btn{width:100%;height:36px;display:flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #fff);border:none;border-radius:var(--Border-2, 8px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);font-family:inherit;cursor:pointer;transition:background 0.15s}.card__add-btn:hover:not(:disabled){background:var(--Primary-Primary-600, #e08526)}.card__add-btn:disabled{background:var(--Gray-Gray-200, #c3c9d9);cursor:not-allowed}"}},[513,"dropi-card-product",{image:[1],productName:[1,"product-name"],price:[2],currency:[1],supplier:[1],category:[1],showFavorite:[4,"show-favorite"],isFavorite:[1028,"is-favorite"],showAddButton:[4,"show-add-button"],badge:[1],badgeType:[1,"badge-type"],inStock:[4,"in-stock"]}]);function c(){"undefined"!=typeof customElements&&["dropi-card-product","dropi-icon"].forEach((a=>{switch(a){case"dropi-card-product":customElements.get(r(a))||customElements.define(r(a),t);break;case"dropi-icon":customElements.get(r(a))||d()}}))}c();const s=t,n=c;export{s as DropiCardProduct,n as defineCustomElement}

package/dist/components/dropi-card-section.js

@@ -1 +1 @@
-import{t as e,p as t,H as i,c as s,h as c}from"./index.js";import{d as r}from"./p-CPs3fHRc.js";import{d as o}from"./p-Ds74ZOlC.js";const n=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=s(this,"dropiChange"),this.dropiClick=s(this,"dropiClick")}sectionTitle="";description="";typeElement="switch";type="medium";isChecked=!1;dropiChange;dropiClick;render(){return c("div",{key:"5820426132998a0fcc95ec9bc5626044809bc8f9",class:"card-section"},c("div",{key:"56023483c0be283b4e8b71bdb8ab91c3bbe0e518",class:"card-section__text"},"important"===this.type?c("h5",{class:"card-section__title card-section__title--important"},this.sectionTitle):c("h6",{class:"card-section__title"},this.sectionTitle),this.description&&c("p",{key:"123f616e6404040a052c8e3313ea74368ef1564e",class:"card-section__desc"},this.description)),c("div",{key:"70d91f09bfe12b561a0457d6b1c531e04c697119",class:"card-section__control"},"switch"===this.typeElement?c("dropi-switch",{isChecked:this.isChecked,onDropiChange:e=>{this.isChecked=e.detail,this.dropiChange.emit(e.detail)}}):c("button",{class:"card-section__dropdown-btn",onClick:()=>this.dropiClick.emit(),"aria-label":"Expandir"},c("dropi-icon",{name:"Dropdown-down",width:"20px",height:"20px",color:"Gray-Gray-500"}))))}static get style(){return":host{display:block;width:100%}*,*::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, #fff);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:inherit;font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1a2033)}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}"}},[513,"dropi-card-section",{sectionTitle:[1,"section-title"],description:[1],typeElement:[1,"type-element"],type:[1],isChecked:[1028,"is-checked"]}]);function a(){"undefined"!=typeof customElements&&["dropi-card-section","dropi-icon","dropi-switch"].forEach((t=>{switch(t){case"dropi-card-section":customElements.get(e(t))||customElements.define(e(t),n);break;case"dropi-icon":customElements.get(e(t))||r();break;case"dropi-switch":customElements.get(e(t))||o()}}))}a();const d=n,p=a;export{d as DropiCardSection,p as defineCustomElement}
+import{t as e,p as t,H as i,c as s,h as r}from"./index.js";import{d as c}from"./p-wO1yy0Zr.js";import{d as o}from"./p-CYCV-5qV.js";const a=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=s(this,"dropiChange",7),this.dropiClick=s(this,"dropiClick",7)}sectionTitle="";description="";typeElement="switch";type="medium";isChecked=!1;dropiChange;dropiClick;render(){return r("div",{key:"f2653804e3d325fb6859d5cc096c893c8fb08ed8",class:"card-section"},r("div",{key:"25fb5e34a9abcdc6a2761adf7053256cb431304d",class:"card-section__text"},"important"===this.type?r("h5",{class:"card-section__title card-section__title--important"},this.sectionTitle):r("h6",{class:"card-section__title"},this.sectionTitle),this.description&&r("p",{key:"fbfb5509a685f39053aa787b57df7c9f2ba1b6eb",class:"card-section__desc"},this.description)),r("div",{key:"f5e6a3d27b08cd6d8be791d9d8bb007c2859d9d2",class:"card-section__control"},"switch"===this.typeElement?r("dropi-switch",{isChecked:this.isChecked,onDropiChange:e=>{this.isChecked=e.detail,this.dropiChange.emit(e.detail)}}):r("button",{class:"card-section__dropdown-btn",onClick:()=>this.dropiClick.emit(),"aria-label":"Expandir"},r("dropi-icon",{name:"Dropdown-down",width:"20px",height:"20px",color:"Gray-Gray-500"}))))}static get style(){return":host{display:block;width:100%}*,*::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, #fff);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:inherit;font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1a2033)}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}"}},[513,"dropi-card-section",{sectionTitle:[1,"section-title"],description:[1],typeElement:[1,"type-element"],type:[1],isChecked:[1028,"is-checked"]}]);function n(){"undefined"!=typeof customElements&&["dropi-card-section","dropi-icon","dropi-switch"].forEach((t=>{switch(t){case"dropi-card-section":customElements.get(e(t))||customElements.define(e(t),a);break;case"dropi-icon":customElements.get(e(t))||c();break;case"dropi-switch":customElements.get(e(t))||o()}}))}n();const d=a,p=n;export{d as DropiCardSection,p as defineCustomElement}

package/dist/components/dropi-carousel.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DropiCarousel extends Components.DropiCarousel, HTMLElement {}
+export const DropiCarousel: {
+    prototype: DropiCarousel;
+    new (): DropiCarousel;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;