@dropi/ui 0.1.18 → 0.1.20

package/dist/components/dropi-radio-button.js

@@ -1 +1 @@
-import{t as e,p as r,H as t,c as i,h as o}from"./index.js";const a=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=i(this,"dropiChange")}label="";name="radio";inputId="radioButton";checked=!1;resetTrigger=!1;dropiChange;onResetTrigger(e){e&&(this.checked=!1)}handleChange(e){this.checked=e.target.checked,this.dropiChange.emit(e)}render(){return o("div",{key:"fd1153aa79130eeb865c0289b7e323bdf2459a8c",class:"dropi-radio-button"},o("label",{key:"b4fbe10ac36213905779f0976e2e80b549323a52",htmlFor:this.inputId},o("input",{key:"8f9b74ed53912bdff637b879a50faf4d83b7d62b",id:this.inputId,type:"radio",name:this.name,checked:this.checked,onChange:e=>this.handleChange(e)}),this.label))}static get formAssociated(){return!0}static get watchers(){return{resetTrigger:[{onResetTrigger:0}]}}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}"}},[577,"dropi-radio-button",{label:[1],name:[1],inputId:[1,"input-id"],checked:[1540],resetTrigger:[4,"reset-trigger"]},void 0,{resetTrigger:[{onResetTrigger:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-radio-button"].forEach((r=>{"dropi-radio-button"===r&&(customElements.get(e(r))||customElements.define(e(r),a))}))}n();const s=a,d=n;export{s as DropiRadioButton,d as defineCustomElement}
+import{t as e,p as r,H as t,c as i,h as o}from"./index.js";const a=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=i(this,"dropiChange",7)}label="";name="radio";inputId="radioButton";checked=!1;resetTrigger=!1;dropiChange;onResetTrigger(e){e&&(this.checked=!1)}handleChange(e){this.checked=e.target.checked,this.dropiChange.emit(e)}render(){return o("div",{key:"50ae300b1dc5972c7c8979f7711edd5f59109653",class:"dropi-radio-button"},o("label",{key:"c91a4ee63c63fe9ae437f344fa1b249db227a4cb",htmlFor:this.inputId},o("input",{key:"ad993a1748315909539f512c09176713693a99d9",id:this.inputId,type:"radio",name:this.name,checked:this.checked,onChange:e=>this.handleChange(e)}),this.label))}static get formAssociated(){return!0}static get watchers(){return{resetTrigger:[{onResetTrigger:0}]}}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}"}},[577,"dropi-radio-button",{label:[1],name:[1],inputId:[1,"input-id"],checked:[1540],resetTrigger:[4,"reset-trigger"]},void 0,{resetTrigger:[{onResetTrigger:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-radio-button"].forEach((r=>{"dropi-radio-button"===r&&(customElements.get(e(r))||customElements.define(e(r),a))}))}n();const s=a,d=n;export{s as DropiRadioButton,d as defineCustomElement}

package/dist/components/dropi-radio-selection-list.d.ts

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

package/dist/components/dropi-radio-selection-list.js

@@ -0,0 +1 @@
+import{t as r,p as e,H as i,c as s,h as t}from"./index.js";import{d as a}from"./p-wO1yy0Zr.js";const o=e(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiChange=s(this,"dropiChange",7),this.dropiSearch=s(this,"dropiSearch",7)}options=[];selectedOption="";showFilter=!1;filterPlaceholder="Buscar...";typeLayout="default";filterText="";parsedOptions=[];dropiChange;dropiSearch;optionsChanged(r){this.parsedOptions="string"==typeof r?JSON.parse(r):r||[]}componentWillLoad(){this.optionsChanged(this.options)}get filtered(){if(!this.filterText)return this.parsedOptions;const r=this.filterText.toLowerCase();return this.parsedOptions.filter((e=>e.name?.toLowerCase().includes(r)))}render(){return t("div",{key:"162776e2e2c09a26761b276a078d526308d205fd",class:"rsl"},this.showFilter&&t("div",{key:"ea0d6f907ff1ff79ce672b0cbb75572f48d6c44b",class:"rsl__search"},t("dropi-icon",{key:"c7dc88e18883942492f778f53932fd99cbd1a9bc",name:"Search",width:"16px",height:"16px",color:"Gray-Gray-400"}),t("input",{key:"07ea27e2502f8aeaedb24ab4cfdb42c1573f6125",class:"rsl__search-input",type:"text",placeholder:this.filterPlaceholder,value:this.filterText,onInput:r=>{this.filterText=r.target.value,this.dropiSearch.emit(this.filterText)}})),t("div",{key:"95a4463b79a0795c8c0e7a30047f4ccd5f1d656d",class:"rsl__list"},this.filtered.map((r=>{const e=r.id===this.selectedOption;return t("div",{class:{rsl__item:!0,"rsl__item--selected":e},key:r.id,onClick:()=>{this.selectedOption=r.id,this.dropiChange.emit(r.id)}},t("div",{class:{rsl__radio:!0,"rsl__radio--checked":e}},e&&t("div",{class:"rsl__radio-dot"})),t("div",{class:"rsl__content"},t("span",{class:"rsl__name"},r.name),"description"===this.typeLayout&&r.description&&t("span",{class:"rsl__desc"},r.description)))}))))}static get watchers(){return{options:[{optionsChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.rsl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.rsl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.rsl__list{display:flex;flex-direction:column;gap:var(--Size-2, 8px)}.rsl__item{display:flex;align-items:flex-start;gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);cursor:pointer;transition:border-color 0.15s, background 0.15s}.rsl__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.rsl__item--selected{border-color:var(--Primary-Primary-500, #f49a3d);background:var(--Primary-Primary-50, #fff5eb)}.rsl__radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--Gray-Gray-300, #a3abbf);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;transition:border-color 0.15s}.rsl__radio--checked{border-color:var(--Primary-Primary-500, #f49a3d)}.rsl__radio-dot{width:8px;height:8px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.rsl__content{display:flex;flex-direction:column;gap:2px}.rsl__name{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.rsl__desc{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}"}},[513,"dropi-radio-selection-list",{options:[1],selectedOption:[1032,"selected-option"],showFilter:[4,"show-filter"],filterPlaceholder:[1,"filter-placeholder"],typeLayout:[1,"type-layout"],filterText:[32],parsedOptions:[32]},void 0,{options:[{optionsChanged:0}]}]);function d(){"undefined"!=typeof customElements&&["dropi-radio-selection-list","dropi-icon"].forEach((e=>{switch(e){case"dropi-radio-selection-list":customElements.get(r(e))||customElements.define(r(e),o);break;case"dropi-icon":customElements.get(r(e))||a()}}))}d();const l=o,n=d;export{l as DropiRadioSelectionList,n as defineCustomElement}

package/dist/components/dropi-read-more.d.ts

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

package/dist/components/dropi-read-more.js

@@ -0,0 +1 @@
+import{t as e,p as t,H as r,h as s}from"./index.js";const o=t(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}text="";maxWords=20;showSeeLess=!0;expanded=!1;get words(){return(this.text||"").split(/\s+/).filter(Boolean)}get needsTruncation(){return this.words.length>this.maxWords}get displayText(){return!this.needsTruncation||this.expanded?this.text:this.words.slice(0,this.maxWords).join(" ")+"…"}render(){const e=this.needsTruncation&&(!this.expanded||this.showSeeLess);return s("div",{key:"82c3554cc4488391be3b70c5e3bbb5a38a957ec8",class:"read-more"},s("p",{key:"48287caef84486c77d8e8f36080c59c32c90cd00",class:"read-more__text"},this.displayText),e&&s("button",{key:"b808d8cf10d65381e16cdda460db8ceb4d8467c0",class:"read-more__toggle",onClick:()=>this.expanded=!this.expanded},this.expanded?"Ver menos":"Ver más"))}static get style(){return":host{display:block}.read-more__text{margin:0 0 4px;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-800, #1a2033);line-height:1.5}.read-more__toggle{background:none;border:none;padding:0;margin:0;font-size:var(--font-size-s, 12px);font-family:inherit;font-weight:var(--font-weight-bold, 700);color:var(--Primary-Primary-500, #f49a3d);cursor:pointer;text-decoration:underline}.read-more__toggle:hover{color:var(--Primary-Primary-600, #d4872e)}"}},[513,"dropi-read-more",{text:[1],maxWords:[2,"max-words"],showSeeLess:[4,"show-see-less"],expanded:[32]}]);function i(){"undefined"!=typeof customElements&&["dropi-read-more"].forEach((t=>{"dropi-read-more"===t&&(customElements.get(e(t))||customElements.define(e(t),o))}))}i();const n=o,a=i;export{n as DropiReadMore,a as defineCustomElement}

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

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

package/dist/components/dropi-search.js

@@ -0,0 +1 @@
+import{t as e,p as t,H as s,c as i,h as r}from"./index.js";import{d as o}from"./p-DUPOnSiL.js";import{d as a}from"./p-wO1yy0Zr.js";const n=t(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiInput=i(this,"dropiInput",7),this.dropiBlur=i(this,"dropiBlur",7),this.dropiKeyEnter=i(this,"dropiKeyEnter",7),this.dropiClear=i(this,"dropiClear",7),this.dropiChange=i(this,"dropiChange",7)}placeholder="Buscar...";value="";maxlength;showClear=!0;options=[];labelKey="name";multiSelect=!1;dropdownHeight="240px";label="";open=!1;selected=[];parsedOptions=[];dropiInput;dropiBlur;dropiKeyEnter;dropiClear;dropiChange;optionsChanged(e){this.parsedOptions="string"==typeof e?JSON.parse(e):e||[]}componentWillLoad(){this.optionsChanged(this.options)}get filtered(){if(!this.value)return this.parsedOptions;const e=this.value.toLowerCase();return this.parsedOptions.filter((t=>((t[this.labelKey]??"")+"").toLowerCase().includes(e)))}handleInput(e){this.value=e.target.value,this.open=this.parsedOptions.length>0,this.dropiInput.emit(this.value)}handleKeyDown(e){"Enter"===e.key&&this.dropiKeyEnter.emit(this.value),"Escape"===e.key&&(this.open=!1)}handleClear(){this.value="",this.open=!1,this.dropiClear.emit(),this.dropiInput.emit("")}isSelected(e){return this.selected.some((t=>t[this.labelKey]===e[this.labelKey]))}selectOption(e){this.multiSelect?this.selected=this.isSelected(e)?this.selected.filter((t=>t[this.labelKey]!==e[this.labelKey])):[...this.selected,e]:(this.value=e[this.labelKey]??"",this.selected=[e],this.open=!1),this.dropiChange.emit(this.selected)}render(){const e=this.open&&this.parsedOptions.length>0;return r("div",{key:"f7b5b5256a42dc534286dd02248b419fddd74d39",class:"search-wrap"},this.label&&r("label",{key:"721b09602381aad6f1f72acdc1029556222144c8",class:"search-label"},this.label),r("div",{key:"a6c9cff477367a5a6e3653ddd2ae56066acc9236",class:"search-input-row"},r("dropi-icon",{key:"95a51114f701aa87c258e620ccd60e2282830554",class:"search-icon",name:"Search",width:"16px",height:"16px",color:"Gray-Gray-400"}),r("input",{key:"fc0f13786b69d08a1fa71accf5316ca98d6e3823",class:"search-input",type:"text",placeholder:this.placeholder,value:this.value,maxLength:this.maxlength,onInput:e=>this.handleInput(e),onKeyDown:e=>this.handleKeyDown(e),onFocus:()=>{this.parsedOptions.length&&(this.open=!0)},onBlur:()=>{setTimeout((()=>this.open=!1),150),this.dropiBlur.emit()}}),this.showClear&&this.value&&r("button",{key:"e16e8746a1800927966aec5268c73bf8c4c10275",class:"search-clear",onClick:()=>this.handleClear(),"aria-label":"Limpiar"},r("dropi-icon",{key:"691106cf972751b909d1a0a467268098e3ff02e8",name:"Close-small",width:"16px",height:"16px",color:"Gray-Gray-400"}))),e&&r("div",{key:"41f2d2f38dbe9d5fb1c48e1b960888fb8cc5738b",class:"search-dropdown",style:{"--dropdown-height":this.dropdownHeight}},0===this.filtered.length?r("div",{class:"search-no-results"},"Sin resultados"):this.filtered.map(((e,t)=>r("div",{class:{"search-option":!0,"search-option--selected":this.isSelected(e)},key:t,onMouseDown:t=>{t.preventDefault(),this.selectOption(e)}},this.multiSelect&&r("dropi-checkbox",{checked:this.isSelected(e)}),r("span",{class:"search-option__label"},e[this.labelKey]))))))}static get watchers(){return{options:[{optionsChanged:0}]}}static get style(){return":host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.search-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.search-input-row{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:10px;pointer-events:none;z-index:1}.search-input{width:100%;height:40px;padding:0 36px 0 34px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);outline:none;transition:border-color 0.2s}.search-input:focus{border-color:var(--Info-Info-500, #50a5f1)}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{position:absolute;right:10px;display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer;z-index:1}.search-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:var(--dropdown-height, 240px);overflow-y:auto;background:var(--Neutral-White, #fff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);z-index:100}.search-option{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.search-option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.search-option--selected{background:var(--Primary-Primary-50, #fff5eb)}.search-option__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-no-results{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6);text-align:center}"}},[513,"dropi-search",{placeholder:[1],value:[1025],maxlength:[2],showClear:[4,"show-clear"],options:[1],labelKey:[1,"label-key"],multiSelect:[4,"multi-select"],dropdownHeight:[1,"dropdown-height"],label:[1],open:[32],selected:[32],parsedOptions:[32]},void 0,{options:[{optionsChanged:0}]}]);function h(){"undefined"!=typeof customElements&&["dropi-search","dropi-checkbox","dropi-icon"].forEach((t=>{switch(t){case"dropi-search":customElements.get(e(t))||customElements.define(e(t),n);break;case"dropi-checkbox":customElements.get(e(t))||o();break;case"dropi-icon":customElements.get(e(t))||a()}}))}h();const c=n,d=h;export{c as DropiSearch,d as defineCustomElement}

package/dist/components/dropi-select.js

@@ -1 +1 @@
-import{t as e,p as t,H as i,c as r,h as o}from"./index.js";import{d as a}from"./p-ChOXWKmI.js";const s=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=r(this,"dropiChange"),this.dropiClear=r(this,"dropiClear"),this.dropiSearch=r(this,"dropiSearch"),this.dropiScrollEnd=r(this,"dropiScrollEnd"),this.dropiKeyEnter=r(this,"dropiKeyEnter"),this.internals=this.attachInternals()}get el(){return this}internals;buttonRef;scrollDebounce;hasEmittedScrollEnd=!1;lastScrollTop=0;label="";placeholder="Seleccionar";options=[];name="";disabled=!1;invalid=!1;errorText="";helperText="";showObligatory=!1;searchEnabled=!1;multiSelect=!1;dropdownType=!1;showCountryFlags=!1;radioOptions=!1;placeHolderSearch="Buscar";preIcon="";defaultSelectedId="";value=null;isOpen=!1;selectedOption=null;multiSelected=[];filteredOptions=[];searchTerm="";dropdownStyle={top:"0px",left:"0px",width:"0px"};dropiChange;dropiClear;dropiSearch;dropiScrollEnd;dropiKeyEnter;componentWillLoad(){this.normalizeOptions(),this.filteredOptions=[...this.options],this.applyDefaultSelection()}optionsChanged(){this.normalizeOptions(),this.filteredOptions=[...this.options],this.applyDefaultSelection()}normalizeOptions(){if("string"==typeof this.options)try{this.options=JSON.parse(this.options)}catch(e){this.options=[]}}defaultChanged(e){this.applyDefaultSelection(e)}valueChanged(e){this.selectedOption=e,this.internals.setFormValue(e?e.id+"":"")}async setById(e){const t=this.options.find((t=>t.id===e||t.id+""==e+""));t&&this.selectOption(t)}async setByLabel(e){const t=this.options.find((t=>t.label===e));t&&this.selectOption(t)}async clearSelection(){this.selectedOption=null,this.multiSelected=[],this.internals.setFormValue(""),this.dropiClear.emit()}async resetMultiSelect(e){this.multiSelected=[],this.internals.setFormValue("")}handleOutsideClick(e){this.el.contains(e.target)||this.closeDropdown()}applyDefaultSelection(e){const t=e??this.defaultSelectedId;if(""===t||null==t)return;const i=this.flatOptions().find((e=>e.id===t||e.id+""==t+""));i&&(this.selectedOption=i,this.internals.setFormValue(i.id+""))}flatOptions(){return this.options?.length?"category"in this.options[0]?this.options.flatMap((e=>e.options)):this.options:[]}get isGrouped(){return this.options?.length>0&&"category"in this.options[0]}get triggerLabel(){return this.multiSelect?this.multiSelected.length?this.multiSelected.map((e=>e.label)).join(", "):this.placeholder:this.selectedOption?this.showCountryFlags&&this.selectedOption.shortLabel?this.selectedOption.shortLabel:this.selectedOption.label:this.placeholder}openDropdown(){if(this.disabled)return;const e=this.buttonRef.getBoundingClientRect(),t=window.innerHeight;this.dropdownStyle={top:(t-e.bottom>=250?e.bottom+4:e.top-250-4)+"px",left:e.left+"px",width:e.width+"px"},this.isOpen=!0,this.searchEnabled&&setTimeout((()=>{const e=this.el.shadowRoot?.querySelector(".search-input");e?.focus()}),50)}closeDropdown(){this.isOpen=!1,this.searchTerm="",this.filteredOptions=[...this.options]}toggleDropdown(){this.isOpen?this.closeDropdown():this.openDropdown()}selectOption(e){if(!e.disabled)if(this.multiSelect){const t=this.multiSelected.findIndex((t=>t.id===e.id));this.multiSelected=t>=0?this.multiSelected.filter((t=>t.id!==e.id)):[...this.multiSelected,e],this.internals.setFormValue(this.multiSelected.map((e=>e.id)).join(",")),this.dropiChange.emit([...this.multiSelected])}else this.selectedOption=e,this.internals.setFormValue(e.id+""),this.dropiChange.emit(e),this.closeDropdown()}isOptionChecked(e){return this.multiSelected.some((t=>t.id===e.id))}handleSearch(e){this.searchTerm=e,this.dropiSearch.emit(e);const t=e.toLowerCase().trim();this.filteredOptions=t?this.isGrouped?this.options.map((e=>({...e,options:e.options.filter((e=>e.label.toLowerCase().includes(t)))}))).filter((e=>e.options.length>0)):this.options.filter((e=>e.label.toLowerCase().includes(t))):[...this.options]}handleScroll(e){const t=e.target;clearTimeout(this.scrollDebounce),this.scrollDebounce=setTimeout((()=>{if(!t)return;const e=t.scrollHeight-t.scrollTop-t.clientHeight,i=Math.min(50,t.clientHeight/2);t.scrollTop<this.lastScrollTop&&(this.hasEmittedScrollEnd=!1),this.lastScrollTop=t.scrollTop,e<=i&&!this.hasEmittedScrollEnd&&(this.dropiScrollEnd.emit(),this.hasEmittedScrollEnd=!0,setTimeout((()=>{this.hasEmittedScrollEnd=!1}),1e3))}),100)}renderTrigger(){const e=this.disabled?"Gray-Gray-300":this.dropdownType?"Gray-Gray-600":"Gray-Gray-400",t=this.dropdownType?"24px":"20px";return o("button",{type:"button",class:{"select-button":!0,"select-completed":this.multiSelect?this.multiSelected.length>0:!!this.selectedOption,"select-button-error":this.invalid,"no-border":this.dropdownType},disabled:this.disabled,ref:e=>this.buttonRef=e,onClick:()=>this.toggleDropdown()},o("div",{class:{"button-content":!0,"option-radio":this.radioOptions&&!!this.selectedOption&&!this.multiSelect}},this.preIcon&&o("dropi-icon",{name:this.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),this.radioOptions&&this.selectedOption&&!this.multiSelect&&[this.selectedOption.imageUrl&&!this.selectedOption.isFallback?o("img",{class:"option-image small-image",src:this.selectedOption.imageUrl,alt:"",onError:()=>{this.selectedOption&&(this.selectedOption={...this.selectedOption,isFallback:!0})}}):this.selectedOption.isFallback?o("span",{class:"option-image-fallback small-image"},this.selectedOption.label.charAt(0).toUpperCase()):null,o("div",{class:"labels-container elipsis"},o("span",null,this.selectedOption.label),this.selectedOption.secondLabel&&o("span",{class:"option-second-label"},this.selectedOption.secondLabel))],!(this.radioOptions&&this.selectedOption&&!this.multiSelect)&&o("div",{class:"elipsis"},this.triggerLabel)),o("dropi-icon",{name:this.isOpen?"Dropdown-up":"Dropdown-down",width:t,height:t,color:e}))}renderOption(e){const t=this.multiSelect?this.isOptionChecked(e):this.selectedOption?.id===e.id;return o("li",{key:e.id},o("button",{type:"button",class:{option:!0,"option-radio":this.radioOptions,"option-with-flag":this.showCountryFlags&&!!e.countryCode,"disabled-option":!!e.disabled,"selected-option":t},disabled:e.disabled,onClick:()=>this.selectOption(e)},this.multiSelect&&o("span",{class:{"multi-checkbox":!0,checked:t}},t&&o("svg",{width:"10",height:"10",viewBox:"0 0 24 24",fill:"none"},o("path",{d:"M20.6 5.7L9.1 17.2c-.2.2-.5.3-.8.3s-.6-.1-.8-.3L3 12.8c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l3.9 3.9L19.2 4.3c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4z",fill:"white"}))),this.radioOptions&&o("div",{class:{radio:!0,selected:t}},t&&o("div",{class:"circle"})),!this.radioOptions&&e.preIcon&&o("dropi-icon",{name:e.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),this.radioOptions&&e.imageUrl&&!e.isFallback&&o("img",{class:"option-image",src:e.imageUrl,alt:"",onError:()=>{e.isFallback=!0,this.options=[...this.options]}}),this.radioOptions&&e.isFallback&&o("span",{class:"option-image-fallback"},e.label.charAt(0).toUpperCase()),this.showCountryFlags&&e.countryCode&&o("span",{class:"flag-placeholder"},e.countryCode),this.radioOptions?o("div",{class:"labels-container"},o("span",{class:"elipsis"},e.label),e.secondLabel&&o("span",{class:"option-second-label"},e.secondLabel)):o("span",{class:"elipsis"},this.showCountryFlags&&e.shortLabel?e.shortLabel:e.label)))}renderDropdown(){return this.isOpen?o("ul",{class:"select-dropdown-overlay",style:this.dropdownStyle,onScroll:e=>this.handleScroll(e)},this.searchEnabled&&o("li",{class:"sticky-search"},o("div",{class:"search-wrapper"},o("dropi-icon",{name:"Search",width:"16px",height:"16px",color:"Gray-Gray-400"}),o("input",{class:"search-input",type:"text",placeholder:this.placeHolderSearch,value:this.searchTerm,onInput:e=>this.handleSearch(e.target.value),onKeyDown:e=>{"Enter"===e.key&&this.dropiKeyEnter.emit(e)}}),this.searchTerm&&o("button",{type:"button",class:"search-clear",onClick:()=>this.handleSearch("")},o("dropi-icon",{name:"Close",width:"14px",height:"14px",color:"Gray-Gray-400"})))),this.isGrouped&&this.filteredOptions.map((e=>[o("li",{class:"option-group-title"},e.category),...e.options.map((e=>o("li",{key:e.id},o("button",{type:"button",class:{option:!0,"option-group":!0,"disabled-option":!!e.disabled},disabled:e.disabled,onClick:()=>this.selectOption(e)},e.preIcon&&o("dropi-icon",{name:e.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),o("span",{class:"elipsis"},e.label)))))])),!this.isGrouped&&this.filteredOptions.map((e=>this.renderOption(e))),0===this.filteredOptions.length&&o("li",{class:"no-results"},"Sin resultados")):null}render(){return o("div",{key:"0062ad3d0ca25d9126dff2f8130c9159a6b356f6",class:"custom-select"},!this.dropdownType&&this.label&&o("label",{key:"ad5db5fa4fe19ee2200ab65fd1f3fcdf65bd851f",class:{"disabled-label":this.disabled}},this.label,this.showObligatory&&!this.disabled&&o("span",{key:"27e474c585d345168d01e156acf8fdaa9c70dbfc",class:"asterisk"}," *")),o("div",{key:"2cc4da6a0109022a7bdb21b4b7410cf1ea2a6c01",class:"dropdown-container"},this.dropdownType&&this.label&&o("div",{key:"c60838f5ce7a250bb36164a989b68c93973aa661",class:"left-label"},this.label),this.renderTrigger()),this.helperText&&!this.invalid&&o("div",{key:"a30c3cb4f8abf4b820c1e1d73005547398c8ff12",class:"select-helper"},o("span",{key:"239dffdcdc8bceca6c21b0160a78078acf96eb09"},this.helperText)),this.invalid&&this.errorText&&o("div",{key:"76fced13295c9dff83389920caf128430c2fd35c",class:"select-helper-error"},o("dropi-icon",{key:"f1c5798ee5f504387ba80a4ddeca817a6416b770",name:"Warning-circle",width:"12px",height:"12px",color:"Error-Error-500"}),o("span",{key:"84a93d1b293b2abe0027316c6fd9824410f20efd"},this.errorText)),this.renderDropdown())}static get formAssociated(){return!0}static get watchers(){return{options:[{optionsChanged:0}],defaultSelectedId:[{defaultChanged:0}],value:[{valueChanged:0}]}}static get style(){return":host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:inherit;display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.2s ease;gap:8px}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.select-button-error{border-color:var(--Error-Error-500, #f46a6b) !important}.no-border{border:none !important;color:var(--Gray-Gray-600, #475066);padding:var(--Size-4, 16px);background-color:transparent !important;gap:var(--Size-2, 8px)}.no-border:disabled{background-color:transparent !important}.button-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1;min-width:0}.elipsis{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-dropdown-overlay{position:fixed;max-height:250px;overflow-y:auto;list-style:none;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);margin:0;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);box-shadow:0px 8px 24px rgba(0, 0, 0, 0.12);z-index:9999;animation:dropdown-open 120ms ease-out}@keyframes dropdown-open{from{opacity:0;transform:scaleY(0.95);transform-origin:top}to{opacity:1;transform:scaleY(1);transform-origin:top}}.option{box-sizing:border-box;width:100%;min-height:40px;border-radius:var(--Border-2, 8px);padding:var(--Size-3, 12px) var(--Size-4, 16px);border:none;background:transparent;text-align:left;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:var(--Size-2, 8px);transition:background 0.15s ease}.option:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled,.disabled-option{opacity:0.5;cursor:not-allowed}.option.selected-option:not(.option-radio){background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-group-title{padding:var(--Size-3, 12px) var(--Size-4, 16px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Gray-Gray-500, #69738c);list-style:none}.option-group{padding-left:var(--Size-6, 32px)}.sticky-search{position:sticky;top:calc(-1 * var(--Size-4, 16px));background:var(--Neutral-White, #fff);z-index:10;margin:calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;padding:var(--Size-2, 8px) var(--Size-4, 16px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2);list-style:none}.search-wrapper{display:flex;align-items:center;gap:8px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);padding:6px 10px;background:var(--Neutral-White, #fff)}.search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.multi-checkbox{width:18px;height:18px;min-width:18px;border-radius:var(--Border-1, 4px);border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s, border-color 0.15s}.multi-checkbox.checked{background:var(--Primary-Primary-500, #f49a3d);border-color:var(--Primary-Primary-500, #f49a3d)}.option-radio{display:flex;align-items:center;gap:12px}.option-radio.selected-option{border-radius:var(--Border-2, 8px);background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-radio.selected-option .option-second-label{color:var(--Primary-Primary-500, #f49a3d)}.radio{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio.selected{border-color:var(--Primary-Primary-500, #f49a3d)}.circle{width:12px;height:12px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.labels-container{display:flex;justify-content:space-between;width:100%;min-width:0}.option-image{width:24px;height:24px;border-radius:60px;object-fit:cover;flex-shrink:0}.small-image{width:20px;height:20px}.option-image-fallback{width:24px;height:24px;border-radius:60px;background:var(--Primary-Primary-500, #f49a3d);color:white;font-size:13px;font-weight:bold;display:flex;justify-content:center;align-items:center;flex-shrink:0}.small-image.option-image-fallback{width:20px;height:20px}.option-second-label{color:var(--Gray-Gray-700, #32394d);font-weight:700;white-space:nowrap}.flag-placeholder{font-size:11px;font-weight:600;color:var(--Gray-Gray-500, #69738c);flex-shrink:0}.select-helper,.select-helper-error{display:flex;gap:var(--Size-1, 4px);align-items:center;margin-top:var(--Size-1, 4px)}.select-helper span{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.select-helper-error span{color:var(--Error-Error-500, #f46a6b);font-size:var(--font-size-xs, 10px)}.no-results{padding:var(--Size-3, 12px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 12px);list-style:none;text-align:center}"}},[577,"dropi-select",{label:[1],placeholder:[1],options:[1040],name:[1],disabled:[516],invalid:[4],errorText:[1,"error-text"],helperText:[1,"helper-text"],showObligatory:[4,"show-obligatory"],searchEnabled:[4,"search-enabled"],multiSelect:[4,"multi-select"],dropdownType:[4,"dropdown-type"],showCountryFlags:[4,"show-country-flags"],radioOptions:[4,"radio-options"],placeHolderSearch:[1,"place-holder-search"],preIcon:[1,"pre-icon"],defaultSelectedId:[1032,"default-selected-id"],value:[1040],isOpen:[32],selectedOption:[32],multiSelected:[32],filteredOptions:[32],searchTerm:[32],dropdownStyle:[32],setById:[64],setByLabel:[64],clearSelection:[64],resetMultiSelect:[64]},[[4,"click","handleOutsideClick"]],{options:[{optionsChanged:0}],defaultSelectedId:[{defaultChanged:0}],value:[{valueChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-select","dropi-icon"].forEach((t=>{switch(t){case"dropi-select":customElements.get(e(t))||customElements.define(e(t),s);break;case"dropi-icon":customElements.get(e(t))||a()}}))}n();const l=s,c=n;export{l as DropiSelect,c as defineCustomElement}
+import{t as e,p as t,H as i,c as r,h as o}from"./index.js";import{d as s}from"./p-wO1yy0Zr.js";const a=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiChange=r(this,"dropiChange",7),this.dropiClear=r(this,"dropiClear",7),this.dropiSearch=r(this,"dropiSearch",7),this.dropiScrollEnd=r(this,"dropiScrollEnd",7),this.dropiKeyEnter=r(this,"dropiKeyEnter",7),this.internals=this.attachInternals()}get el(){return this}internals;buttonRef;scrollDebounce;hasEmittedScrollEnd=!1;lastScrollTop=0;label="";placeholder="Seleccionar";options=[];name="";disabled=!1;invalid=!1;errorText="";helperText="";showObligatory=!1;searchEnabled=!1;multiSelect=!1;dropdownType=!1;showCountryFlags=!1;radioOptions=!1;placeHolderSearch="Buscar";preIcon="";defaultSelectedId="";value=null;isOpen=!1;selectedOption=null;multiSelected=[];filteredOptions=[];searchTerm="";dropdownStyle={top:"0px",left:"0px",width:"0px"};dropiChange;dropiClear;dropiSearch;dropiScrollEnd;dropiKeyEnter;componentWillLoad(){this.normalizeOptions(),this.filteredOptions=[...this.options],this.applyDefaultSelection()}optionsChanged(){this.normalizeOptions(),this.filteredOptions=[...this.options],this.applyDefaultSelection()}normalizeOptions(){if("string"==typeof this.options)try{this.options=JSON.parse(this.options)}catch(e){this.options=[]}}defaultChanged(e){this.applyDefaultSelection(e)}valueChanged(e){this.selectedOption=e,this.internals.setFormValue(e?e.id+"":"")}async setById(e){const t=this.options.find((t=>t.id===e||t.id+""==e+""));t&&this.selectOption(t)}async setByLabel(e){const t=this.options.find((t=>t.label===e));t&&this.selectOption(t)}async clearSelection(){this.selectedOption=null,this.multiSelected=[],this.internals.setFormValue(""),this.dropiClear.emit()}async resetMultiSelect(e){this.multiSelected=[],this.internals.setFormValue("")}handleOutsideClick(e){this.el.contains(e.target)||this.closeDropdown()}applyDefaultSelection(e){const t=e??this.defaultSelectedId;if(""===t||null==t)return;const i=this.flatOptions().find((e=>e.id===t||e.id+""==t+""));i&&(this.selectedOption=i,this.internals.setFormValue(i.id+""))}flatOptions(){return this.options?.length?"category"in this.options[0]?this.options.flatMap((e=>e.options)):this.options:[]}get isGrouped(){return this.options?.length>0&&"category"in this.options[0]}get triggerLabel(){return this.multiSelect?this.multiSelected.length?this.multiSelected.map((e=>e.label)).join(", "):this.placeholder:this.selectedOption?this.showCountryFlags&&this.selectedOption.shortLabel?this.selectedOption.shortLabel:this.selectedOption.label:this.placeholder}openDropdown(){if(this.disabled)return;const e=this.buttonRef.getBoundingClientRect(),t=window.innerHeight;this.dropdownStyle={top:(t-e.bottom>=250?e.bottom+4:e.top-250-4)+"px",left:e.left+"px",width:e.width+"px"},this.isOpen=!0,this.searchEnabled&&setTimeout((()=>{const e=this.el.shadowRoot?.querySelector(".search-input");e?.focus()}),50)}closeDropdown(){this.isOpen=!1,this.searchTerm="",this.filteredOptions=[...this.options]}toggleDropdown(){this.isOpen?this.closeDropdown():this.openDropdown()}selectOption(e){if(!e.disabled)if(this.multiSelect){const t=this.multiSelected.findIndex((t=>t.id===e.id));this.multiSelected=t>=0?this.multiSelected.filter((t=>t.id!==e.id)):[...this.multiSelected,e],this.internals.setFormValue(this.multiSelected.map((e=>e.id)).join(",")),this.dropiChange.emit([...this.multiSelected])}else this.selectedOption=e,this.internals.setFormValue(e.id+""),this.dropiChange.emit(e),this.closeDropdown()}isOptionChecked(e){return this.multiSelected.some((t=>t.id===e.id))}handleSearch(e){this.searchTerm=e,this.dropiSearch.emit(e);const t=e.toLowerCase().trim();this.filteredOptions=t?this.isGrouped?this.options.map((e=>({...e,options:e.options.filter((e=>e.label.toLowerCase().includes(t)))}))).filter((e=>e.options.length>0)):this.options.filter((e=>e.label.toLowerCase().includes(t))):[...this.options]}handleScroll(e){const t=e.target;clearTimeout(this.scrollDebounce),this.scrollDebounce=setTimeout((()=>{if(!t)return;const e=t.scrollHeight-t.scrollTop-t.clientHeight,i=Math.min(50,t.clientHeight/2);t.scrollTop<this.lastScrollTop&&(this.hasEmittedScrollEnd=!1),this.lastScrollTop=t.scrollTop,e<=i&&!this.hasEmittedScrollEnd&&(this.dropiScrollEnd.emit(),this.hasEmittedScrollEnd=!0,setTimeout((()=>{this.hasEmittedScrollEnd=!1}),1e3))}),100)}renderTrigger(){const e=this.disabled?"Gray-Gray-300":this.dropdownType?"Gray-Gray-600":"Gray-Gray-400",t=this.dropdownType?"24px":"20px";return o("button",{type:"button",class:{"select-button":!0,"select-completed":this.multiSelect?this.multiSelected.length>0:!!this.selectedOption,"select-button-error":this.invalid,"no-border":this.dropdownType},disabled:this.disabled,ref:e=>this.buttonRef=e,onClick:()=>this.toggleDropdown()},o("div",{class:{"button-content":!0,"option-radio":this.radioOptions&&!!this.selectedOption&&!this.multiSelect}},this.preIcon&&o("dropi-icon",{name:this.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),this.radioOptions&&this.selectedOption&&!this.multiSelect&&[this.selectedOption.imageUrl&&!this.selectedOption.isFallback?o("img",{class:"option-image small-image",src:this.selectedOption.imageUrl,alt:"",onError:()=>{this.selectedOption&&(this.selectedOption={...this.selectedOption,isFallback:!0})}}):this.selectedOption.isFallback?o("span",{class:"option-image-fallback small-image"},this.selectedOption.label.charAt(0).toUpperCase()):null,o("div",{class:"labels-container elipsis"},o("span",null,this.selectedOption.label),this.selectedOption.secondLabel&&o("span",{class:"option-second-label"},this.selectedOption.secondLabel))],!(this.radioOptions&&this.selectedOption&&!this.multiSelect)&&o("div",{class:"elipsis"},this.triggerLabel)),o("dropi-icon",{name:this.isOpen?"Dropdown-up":"Dropdown-down",width:t,height:t,color:e}))}renderOption(e){const t=this.multiSelect?this.isOptionChecked(e):this.selectedOption?.id===e.id;return o("li",{key:e.id},o("button",{type:"button",class:{option:!0,"option-radio":this.radioOptions,"option-with-flag":this.showCountryFlags&&!!e.countryCode,"disabled-option":!!e.disabled,"selected-option":t},disabled:e.disabled,onClick:()=>this.selectOption(e)},this.multiSelect&&o("span",{class:{"multi-checkbox":!0,checked:t}},t&&o("svg",{width:"10",height:"10",viewBox:"0 0 24 24",fill:"none"},o("path",{d:"M20.6 5.7L9.1 17.2c-.2.2-.5.3-.8.3s-.6-.1-.8-.3L3 12.8c-.4-.4-.4-1 0-1.4.4-.4 1-.4 1.4 0l3.9 3.9L19.2 4.3c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4z",fill:"white"}))),this.radioOptions&&o("div",{class:{radio:!0,selected:t}},t&&o("div",{class:"circle"})),!this.radioOptions&&e.preIcon&&o("dropi-icon",{name:e.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),this.radioOptions&&e.imageUrl&&!e.isFallback&&o("img",{class:"option-image",src:e.imageUrl,alt:"",onError:()=>{e.isFallback=!0,this.options=[...this.options]}}),this.radioOptions&&e.isFallback&&o("span",{class:"option-image-fallback"},e.label.charAt(0).toUpperCase()),this.showCountryFlags&&e.countryCode&&o("span",{class:"flag-placeholder"},e.countryCode),this.radioOptions?o("div",{class:"labels-container"},o("span",{class:"elipsis"},e.label),e.secondLabel&&o("span",{class:"option-second-label"},e.secondLabel)):o("span",{class:"elipsis"},this.showCountryFlags&&e.shortLabel?e.shortLabel:e.label)))}renderDropdown(){return this.isOpen?o("ul",{class:"select-dropdown-overlay",style:this.dropdownStyle,onScroll:e=>this.handleScroll(e)},this.searchEnabled&&o("li",{class:"sticky-search"},o("div",{class:"search-wrapper"},o("dropi-icon",{name:"Search",width:"16px",height:"16px",color:"Gray-Gray-400"}),o("input",{class:"search-input",type:"text",placeholder:this.placeHolderSearch,value:this.searchTerm,onInput:e=>this.handleSearch(e.target.value),onKeyDown:e=>{"Enter"===e.key&&this.dropiKeyEnter.emit(e)}}),this.searchTerm&&o("button",{type:"button",class:"search-clear",onClick:()=>this.handleSearch("")},o("dropi-icon",{name:"Close",width:"14px",height:"14px",color:"Gray-Gray-400"})))),this.isGrouped&&this.filteredOptions.map((e=>[o("li",{class:"option-group-title"},e.category),...e.options.map((e=>o("li",{key:e.id},o("button",{type:"button",class:{option:!0,"option-group":!0,"disabled-option":!!e.disabled},disabled:e.disabled,onClick:()=>this.selectOption(e)},e.preIcon&&o("dropi-icon",{name:e.preIcon,width:"20px",height:"20px",color:"Gray-Gray-500"}),o("span",{class:"elipsis"},e.label)))))])),!this.isGrouped&&this.filteredOptions.map((e=>this.renderOption(e))),0===this.filteredOptions.length&&o("li",{class:"no-results"},"Sin resultados")):null}render(){return o("div",{key:"65b15f83612bdb8b11eb321b2c92321b4c621862",class:"custom-select"},!this.dropdownType&&this.label&&o("label",{key:"10688d90de470bdc4cdd70c21fd62cc820475c9b",class:{"disabled-label":this.disabled}},this.label,this.showObligatory&&!this.disabled&&o("span",{key:"c8c7e5d8fcc9e029bfd944b4a061289affe39c58",class:"asterisk"}," *")),o("div",{key:"6a5d1230282ec67dcaed51d9ecda4570f155a895",class:"dropdown-container"},this.dropdownType&&this.label&&o("div",{key:"83842d69f63c2738cc3bd7b0fbb1232cb4bc7adf",class:"left-label"},this.label),this.renderTrigger()),this.helperText&&!this.invalid&&o("div",{key:"a3c1b7552bac043d3d32bfe703f44961bf95df3d",class:"select-helper"},o("span",{key:"060c5a578be91210aec96d8bdb08eddd9446ea41"},this.helperText)),this.invalid&&this.errorText&&o("div",{key:"97c6348abd628bb5def8b3a2a667e90f7f27d951",class:"select-helper-error"},o("dropi-icon",{key:"08ab2f0397605bfe0c82ef5ba8ae4b623f98bdb3",name:"Warning-circle",width:"12px",height:"12px",color:"Error-Error-500"}),o("span",{key:"97e1d844b586c2da1518bc9a7c0b69aa856515e7"},this.errorText)),this.renderDropdown())}static get formAssociated(){return!0}static get watchers(){return{options:[{optionsChanged:0}],defaultSelectedId:[{defaultChanged:0}],value:[{valueChanged:0}]}}static get style(){return":host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:inherit;display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.2s ease;gap:8px}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.select-button-error{border-color:var(--Error-Error-500, #f46a6b) !important}.no-border{border:none !important;color:var(--Gray-Gray-600, #475066);padding:var(--Size-4, 16px);background-color:transparent !important;gap:var(--Size-2, 8px)}.no-border:disabled{background-color:transparent !important}.button-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1;min-width:0}.elipsis{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-dropdown-overlay{position:fixed;max-height:250px;overflow-y:auto;list-style:none;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);margin:0;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #fff);box-shadow:0px 8px 24px rgba(0, 0, 0, 0.12);z-index:9999;animation:dropdown-open 120ms ease-out}@keyframes dropdown-open{from{opacity:0;transform:scaleY(0.95);transform-origin:top}to{opacity:1;transform:scaleY(1);transform-origin:top}}.option{box-sizing:border-box;width:100%;min-height:40px;border-radius:var(--Border-2, 8px);padding:var(--Size-3, 12px) var(--Size-4, 16px);border:none;background:transparent;text-align:left;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:var(--Size-2, 8px);transition:background 0.15s ease}.option:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled,.disabled-option{opacity:0.5;cursor:not-allowed}.option.selected-option:not(.option-radio){background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-group-title{padding:var(--Size-3, 12px) var(--Size-4, 16px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Gray-Gray-500, #69738c);list-style:none}.option-group{padding-left:var(--Size-6, 32px)}.sticky-search{position:sticky;top:calc(-1 * var(--Size-4, 16px));background:var(--Neutral-White, #fff);z-index:10;margin:calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;padding:var(--Size-2, 8px) var(--Size-4, 16px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2);list-style:none}.search-wrapper{display:flex;align-items:center;gap:8px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);padding:6px 10px;background:var(--Neutral-White, #fff)}.search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:transparent}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.multi-checkbox{width:18px;height:18px;min-width:18px;border-radius:var(--Border-1, 4px);border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s, border-color 0.15s}.multi-checkbox.checked{background:var(--Primary-Primary-500, #f49a3d);border-color:var(--Primary-Primary-500, #f49a3d)}.option-radio{display:flex;align-items:center;gap:12px}.option-radio.selected-option{border-radius:var(--Border-2, 8px);background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-radio.selected-option .option-second-label{color:var(--Primary-Primary-500, #f49a3d)}.radio{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio.selected{border-color:var(--Primary-Primary-500, #f49a3d)}.circle{width:12px;height:12px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.labels-container{display:flex;justify-content:space-between;width:100%;min-width:0}.option-image{width:24px;height:24px;border-radius:60px;object-fit:cover;flex-shrink:0}.small-image{width:20px;height:20px}.option-image-fallback{width:24px;height:24px;border-radius:60px;background:var(--Primary-Primary-500, #f49a3d);color:white;font-size:13px;font-weight:bold;display:flex;justify-content:center;align-items:center;flex-shrink:0}.small-image.option-image-fallback{width:20px;height:20px}.option-second-label{color:var(--Gray-Gray-700, #32394d);font-weight:700;white-space:nowrap}.flag-placeholder{font-size:11px;font-weight:600;color:var(--Gray-Gray-500, #69738c);flex-shrink:0}.select-helper,.select-helper-error{display:flex;gap:var(--Size-1, 4px);align-items:center;margin-top:var(--Size-1, 4px)}.select-helper span{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.select-helper-error span{color:var(--Error-Error-500, #f46a6b);font-size:var(--font-size-xs, 10px)}.no-results{padding:var(--Size-3, 12px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 12px);list-style:none;text-align:center}"}},[577,"dropi-select",{label:[1],placeholder:[1],options:[1040],name:[1],disabled:[516],invalid:[4],errorText:[1,"error-text"],helperText:[1,"helper-text"],showObligatory:[4,"show-obligatory"],searchEnabled:[4,"search-enabled"],multiSelect:[4,"multi-select"],dropdownType:[4,"dropdown-type"],showCountryFlags:[4,"show-country-flags"],radioOptions:[4,"radio-options"],placeHolderSearch:[1,"place-holder-search"],preIcon:[1,"pre-icon"],defaultSelectedId:[1032,"default-selected-id"],value:[1040],isOpen:[32],selectedOption:[32],multiSelected:[32],filteredOptions:[32],searchTerm:[32],dropdownStyle:[32],setById:[64],setByLabel:[64],clearSelection:[64],resetMultiSelect:[64]},[[4,"click","handleOutsideClick"]],{options:[{optionsChanged:0}],defaultSelectedId:[{defaultChanged:0}],value:[{valueChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-select","dropi-icon"].forEach((t=>{switch(t){case"dropi-select":customElements.get(e(t))||customElements.define(e(t),a);break;case"dropi-icon":customElements.get(e(t))||s()}}))}n();const l=a,d=n;export{l as DropiSelect,d as defineCustomElement}

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

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

package/dist/components/dropi-sidebar.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 s}from"./p-wO1yy0Zr.js";const o=i(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiSidebarItemClick=a(this,"dropiSidebarItemClick",7),this.dropiCollapse=a(this,"dropiCollapse",7)}items=[];activeId="";collapsed=!1;showToggle=!0;logoUrl="";width="240px";expandedIds=new Set;dropiSidebarItemClick;dropiCollapse;get parsedItems(){const e=this.items;return"string"==typeof e?JSON.parse(e):e||[]}toggleExpand(e){this.expandedIds.has(e)?this.expandedIds.delete(e):this.expandedIds.add(e),this.expandedIds=new Set(this.expandedIds)}renderItem(e,i=0){const r=e.children&&e.children.length>0,a=this.expandedIds.has(e.id),s=e.id===this.activeId;return t("li",null,t("button",{class:{sidebar__item:!0,"sidebar__item--active":s,"sidebar__item--depth1":1===i},style:{paddingLeft:i>0?12+12*i+"px":void 0},onClick:()=>{r?this.toggleExpand(e.id):this.dropiSidebarItemClick.emit(e.id)},type:"button",title:this.collapsed?e.label:void 0},e.icon&&t("dropi-icon",{name:e.icon,width:"18px",height:"18px",color:s?"Primary-Primary-500":"Gray-Gray-600"}),!this.collapsed&&t("span",{class:"sidebar__item-label"},e.label),!this.collapsed&&null!=e.badge&&e.badge+""!="0"&&t("span",{class:"sidebar__badge"},e.badge),!this.collapsed&&r&&t("dropi-icon",{name:a?"Arrow-Up-2":"Arrow-Down-2",width:"12px",height:"12px",color:"Gray-Gray-400"})),r&&a&&!this.collapsed&&t("ul",{class:"sidebar__sub"},e.children.map((e=>this.renderItem(e,i+1)))))}render(){const e=this.parsedItems;return t("aside",{key:"97c46e8c84a9e389fb67b34364321c35b0c5ebf2",class:{sidebar:!0,"sidebar--collapsed":this.collapsed},style:{width:this.collapsed?"56px":this.width}},this.logoUrl&&t("div",{key:"211e43514bcdd6b613aa1001ef630e5b9629091a",class:"sidebar__logo-wrap"},t("img",{key:"ce6b7a3b9ce26f4caa1eafd4821f5a2fa70e4dda",class:"sidebar__logo",src:this.logoUrl,alt:"Logo"})),this.showToggle&&t("button",{key:"ba66d7664b76ecdea519f9d128e998331106da8f",class:"sidebar__toggle",onClick:()=>{this.collapsed=!this.collapsed,this.dropiCollapse.emit(this.collapsed)},"aria-label":this.collapsed?"Expandir":"Colapsar",type:"button"},t("dropi-icon",{key:"3a362cb657dfa881523ae29c1e677e6cc16afb61",name:this.collapsed?"Arrow-Right-2":"Arrow-Left-2",width:"16px",height:"16px",color:"Gray-Gray-400"})),t("nav",{key:"02152d2e92f7802daa1192bd9d00d21c13619de4",class:"sidebar__nav"},t("ul",{key:"9e90a7d2d25a63885713b881c6d091528027ec57",class:"sidebar__list"},e.map((e=>this.renderItem(e))))),t("div",{key:"b70d89a324de1b56e022ec66b52ecb2b01031d34",class:"sidebar__footer"},t("slot",{key:"6ead0e515e6a59194cd3495bd691ae9acdb0dd05",name:"footer"})))}static get style(){return":host{display:block;height:100%}*,*::before,*::after{box-sizing:border-box}.sidebar{display:flex;flex-direction:column;height:100%;background:var(--Neutral-White, #fff);border-right:1px solid var(--Gray-Gray-100, #eceef4);transition:width 0.25s ease;overflow:hidden;flex-shrink:0}.sidebar__logo-wrap{display:flex;align-items:center;justify-content:center;padding:var(--Size-4, 16px) var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #eceef4)}.sidebar__logo{height:28px;object-fit:contain;max-width:100%}.sidebar__toggle{align-self:flex-end;margin:var(--Size-2, 8px);background:none;border:1px solid var(--Gray-Gray-100, #eceef4);border-radius:var(--Border-1, 4px);width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.15s;flex-shrink:0}.sidebar__toggle:hover{background:var(--Gray-Gray-50, #f7f8fa)}.sidebar__nav{flex:1;overflow-y:auto;padding:var(--Size-2, 8px) 0}.sidebar__list,.sidebar__sub{list-style:none;margin:0;padding:0}.sidebar__item{width:100%;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);background:none;border:none;font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-600, #475066);cursor:pointer;text-align:left;transition:background 0.15s, color 0.15s;white-space:nowrap;overflow:hidden}.sidebar__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.sidebar__item--active{background:var(--Primary-Primary-50, #fff5eb);color:var(--Primary-Primary-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.sidebar__item--depth1{font-size:var(--font-size-xs, 10px)}.sidebar__item-label{flex:1;overflow:hidden;text-overflow:ellipsis}.sidebar__badge{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #fff);font-size:9px;font-weight:700;min-width:16px;height:16px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px;flex-shrink:0}.sidebar__sub{padding-left:0}.sidebar__footer{padding:var(--Size-3, 12px);border-top:1px solid var(--Gray-Gray-100, #eceef4);flex-shrink:0}.sidebar__footer:empty{display:none}.sidebar--collapsed .sidebar__item{justify-content:center;padding:var(--Size-2, 8px)}"}},[769,"dropi-sidebar",{items:[1],activeId:[1,"active-id"],collapsed:[1028],showToggle:[4,"show-toggle"],logoUrl:[1,"logo-url"],width:[1]}]);function d(){"undefined"!=typeof customElements&&["dropi-sidebar","dropi-icon"].forEach((i=>{switch(i){case"dropi-sidebar":customElements.get(e(i))||customElements.define(e(i),o);break;case"dropi-icon":customElements.get(e(i))||s()}}))}d();const n=o,l=d;export{n as DropiSidebar,l as defineCustomElement}

package/dist/components/dropi-simple-stepper.d.ts

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

package/dist/components/dropi-simple-stepper.js

@@ -0,0 +1 @@
+import{t as e,p as r,H as t,h as s}from"./index.js";const p=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}stepsCount=3;typeStep="number";currentStep=1;labelStepper=[];flowMode="Sequential";get parsedLabels(){if("string"==typeof this.labelStepper)try{return JSON.parse(this.labelStepper)}catch{return[]}return this.labelStepper||[]}render(){const e=this.parsedLabels,r=Array.from({length:this.stepsCount},((e,r)=>r+1));return s("div",{key:"9991a928ba08a7720d8ded5aea01b3bc77372e71",class:"stepper"},r.map(((t,p)=>{const i=t<this.currentStep,a=t===this.currentStep,n=p===r.length-1,c=e[p];return s("div",{class:"stepper__item",key:t},s("div",{class:"stepper__circle-row"},s("div",{class:{stepper__circle:!0,"stepper__circle--active":a,"stepper__circle--completed":i,"stepper__circle--pending":!a&&!i}},"point"===this.typeStep?s("span",{class:"stepper__dot"}):s("span",{class:"stepper__number"},t)),!n&&s("div",{class:{stepper__line:!0,"stepper__line--done":i}})),c&&s("span",{class:"stepper__label"},c))})))}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__item{display:flex;flex-direction:column;align-items:center;flex:1}.stepper__circle-row{display:flex;align-items:center;width:100%}.stepper__circle{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.stepper__circle--active{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__dot{width:8px;height:8px;border-radius:50%;background:var(--Neutral-White, #fff);display:block}.stepper__circle--pending .stepper__dot{background:var(--Gray-Gray-400, #858ea6)}.stepper__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Neutral-White, #fff)}.stepper__circle--pending .stepper__number{color:var(--Gray-Gray-500, #69738c)}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200, #c3c9d9);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500, #f49a3d)}.stepper__label{margin-top:6px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);text-align:center}"}},[513,"dropi-simple-stepper",{stepsCount:[2,"steps-count"],typeStep:[1,"type-step"],currentStep:[2,"current-step"],labelStepper:[1,"label-stepper"],flowMode:[1,"flow-mode"]}]);function i(){"undefined"!=typeof customElements&&["dropi-simple-stepper"].forEach((r=>{"dropi-simple-stepper"===r&&(customElements.get(e(r))||customElements.define(e(r),p))}))}i();const a=p,n=i;export{a as DropiSimpleStepper,n as defineCustomElement}

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

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

package/dist/components/dropi-steps.js

@@ -0,0 +1 @@
+import{t as e,p as r,H as t,h as s}from"./index.js";import{d as i}from"./p-wO1yy0Zr.js";const a=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}stepsCount=3;showNumberOfStep=!0;currentStep=1;stepLabels=[];get parsedLabels(){if("string"==typeof this.stepLabels)try{return JSON.parse(this.stepLabels)}catch{return[]}return this.stepLabels||[]}stepState(e){return e<this.currentStep?"completed":e===this.currentStep?"focus":"pending"}render(){const e=this.parsedLabels,r=Array.from({length:this.stepsCount},((e,r)=>r+1));return s("div",{key:"95573c2ac185f7fc63fa804a03873499ba296e5c",class:"stepper"},r.map((r=>{const t=this.stepState(r),i=e[r-1],a=r===this.stepsCount;return s("div",{class:"stepper__step",key:r},s("div",{class:"stepper__circle-wrap"},s("div",{class:{stepper__circle:!0,["stepper__circle--"+t]:!0}},"completed"===t?s("dropi-icon",{name:"Check",width:"12px",height:"12px",color:"Neutral-White"}):this.showNumberOfStep?s("span",null,r):null),!a&&s("div",{class:{stepper__line:!0,"stepper__line--done":"completed"===t}})),i&&s("div",{class:"stepper__label"},i.title&&s("span",{class:"stepper__title"},i.title),i.description&&s("span",{class:"stepper__desc"},i.description)))})))}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative}.stepper__circle-wrap{display:flex;align-items:center;width:100%;position:relative}.stepper__circle{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);flex-shrink:0;z-index:1;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Neutral-White, #fff);border:2px solid var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6)}.stepper__circle--focus{background:var(--Neutral-White, #fff);border:2px solid var(--Primary-Primary-500, #f49a3d);color:var(--Primary-Primary-500, #f49a3d)}.stepper__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #fff)}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200, #c3c9d9);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500, #f49a3d)}.stepper__label{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:var(--Size-2, 8px);text-align:center;padding:0 4px}.stepper__title{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.stepper__desc{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}"}},[513,"dropi-steps",{stepsCount:[2,"steps-count"],showNumberOfStep:[4,"show-number-of-step"],currentStep:[2,"current-step"],stepLabels:[1,"step-labels"]}]);function p(){"undefined"!=typeof customElements&&["dropi-steps","dropi-icon"].forEach((r=>{switch(r){case"dropi-steps":customElements.get(e(r))||customElements.define(e(r),a);break;case"dropi-icon":customElements.get(e(r))||i()}}))}p();const o=a,n=p;export{o as DropiSteps,n as defineCustomElement}

package/dist/components/dropi-switch.js

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

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

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

package/dist/components/dropi-table.js

@@ -0,0 +1 @@
+import{t as e,p as t,H as r,c as a,h as s}from"./index.js";import{d as i}from"./p-DUPOnSiL.js";import{d as o}from"./p-wO1yy0Zr.js";const l=t(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiSort=a(this,"dropiSort",7),this.dropiSelection=a(this,"dropiSelection",7),this.dropiRowClick=a(this,"dropiRowClick",7)}columns=[];rows=[];selectable=!1;loading=!1;emptyMessage="No hay datos disponibles";striped=!1;parsedColumns=[];parsedRows=[];sortKey="";sortDir=null;selectedKeys=new Set;dropiSort;dropiSelection;dropiRowClick;columnsChanged(e){this.parsedColumns="string"==typeof e?JSON.parse(e):e||[]}rowsChanged(e){this.parsedRows="string"==typeof e?JSON.parse(e):e||[],this.selectedKeys=new Set}componentWillLoad(){this.columnsChanged(this.columns),this.rowsChanged(this.rows)}get sortedRows(){if(!this.sortKey||!this.sortDir)return this.parsedRows;const e=this.sortKey,t="asc"===this.sortDir?1:-1;return[...this.parsedRows].sort(((r,a)=>{const s=r[e]??"",i=a[e]??"";return s<i?-t:s>i?t:0}))}handleSort(e){e.sortable&&(this.sortKey===e.key?(this.sortDir="asc"===this.sortDir?"desc":"desc"===this.sortDir?null:"asc",null===this.sortDir&&(this.sortKey="")):(this.sortKey=e.key,this.sortDir="asc"),this.dropiSort.emit({key:this.sortKey,dir:this.sortDir}))}toggleRow(e){const t=new Set(this.selectedKeys);t.has(e)?t.delete(e):t.add(e),this.selectedKeys=t,this.dropiSelection.emit(Array.from(t))}toggleAll(e){this.selectedKeys=e?new Set(this.sortedRows.map(((e,t)=>t))):new Set,this.dropiSelection.emit(Array.from(this.selectedKeys))}sortIcon(e){return e.sortable?s("dropi-icon",this.sortKey!==e.key?{name:"Sort",width:"12px",height:"12px",color:"Gray-Gray-300"}:"asc"===this.sortDir?{name:"Arrow-Up-2",width:"12px",height:"12px",color:"Primary-Primary-500"}:{name:"Arrow-Down-2",width:"12px",height:"12px",color:"Primary-Primary-500"}):null}render(){const e=this.sortedRows;return s("div",{key:"3e06da209d1f71b8a4a250f4bcd8a8213f34781d",class:"table-wrap"},s("table",{key:"20056c30e2652f2a405eeb00954dd7b9c9b5924b",class:{table:!0,"table--striped":this.striped}},s("thead",{key:"1a1ea1914f81d1ef8814f202de4d60308801dc1d"},s("tr",{key:"22447d7fef0cf22c27c6249570c454d44b0865d3"},this.selectable&&s("th",{key:"d51aa876d97e01840a5adc34a5ec53f30fc2cac6",class:"table__th table__th--check"},s("dropi-checkbox",{key:"192639cf8599dc5f3b095092a403509050e43efa",checked:e.length>0&&this.selectedKeys.size===e.length,onDropiChange:e=>this.toggleAll(e.detail)})),this.parsedColumns.map((e=>s("th",{class:{table__th:!0,"table__th--sortable":!!e.sortable},style:{width:e.width,textAlign:e.align||"left"},onClick:()=>this.handleSort(e)},s("span",{class:"table__th-inner"},e.label,this.sortIcon(e))))))),s("tbody",{key:"93f65647369b59f913b381f541a18a215e8e0e9a"},this.loading?Array.from({length:5}).map((()=>s("tr",{class:"table__tr--skeleton"},this.selectable&&s("td",{class:"table__td"},s("div",{class:"skeleton skeleton--sm"})),this.parsedColumns.map((()=>s("td",{class:"table__td"},s("div",{class:"skeleton"}))))))):0===e.length?s("tr",null,s("td",{class:"table__td table__td--empty",colSpan:this.parsedColumns.length+(this.selectable?1:0)},s("dropi-icon",{name:"Document",width:"24px",height:"24px",color:"Gray-Gray-300"}),s("p",null,this.emptyMessage))):e.map(((e,t)=>s("tr",{class:{table__tr:!0,"table__tr--selected":this.selectedKeys.has(t)},onClick:()=>this.dropiRowClick.emit({row:e,index:t})},this.selectable&&s("td",{class:"table__td table__td--check",onClick:e=>e.stopPropagation()},s("dropi-checkbox",{checked:this.selectedKeys.has(t),onDropiChange:()=>this.toggleRow(t)})),this.parsedColumns.map((t=>s("td",{class:"table__td",style:{textAlign:t.align||"left"}},e[t.key]??"—")))))))))}static get watchers(){return{columns:[{columnsChanged:0}],rows:[{rowsChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.table-wrap{width:100%;overflow-x:auto;border:1px solid var(--Gray-Gray-100, #eceef4);border-radius:var(--Border-2, 8px)}.table{width:100%;border-collapse:collapse;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);background:var(--Neutral-White, #fff)}.table__th{padding:var(--Size-3, 12px) var(--Size-3, 12px);background:var(--Gray-Gray-50, #f7f8fa);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.5px;white-space:nowrap;border-bottom:1px solid var(--Gray-Gray-100, #eceef4);user-select:none}.table__th--check{width:40px}.table__th--sortable{cursor:pointer}.table__th--sortable:hover{background:var(--Gray-Gray-100, #eceef4)}.table__th-inner{display:inline-flex;align-items:center;gap:4px}.table__tr{cursor:pointer;transition:background 0.15s}.table__tr:hover{background:var(--Gray-Gray-50, #f7f8fa)}.table__tr--selected{background:var(--Primary-Primary-50, #fff5eb)}.table--striped .table__tr:nth-child(even){background:var(--Gray-Gray-50, #f7f8fa)}.table--striped .table__tr:nth-child(even):hover{background:var(--Gray-Gray-100, #eceef4)}.table__td{padding:var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);vertical-align:middle}.table__td--check{width:40px}.table__td--empty{text-align:center;padding:var(--Size-8, 48px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6)}.table__td--empty p{margin:var(--Size-2, 8px) 0 0}.skeleton{height:14px;background:linear-gradient(90deg, var(--Gray-Gray-100, #eceef4) 25%, var(--Gray-Gray-50, #f7f8fa) 50%, var(--Gray-Gray-100, #eceef4) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--Border-1, 4px)}.skeleton--sm{width:20px}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}"}},[513,"dropi-table",{columns:[1],rows:[1],selectable:[4],loading:[4],emptyMessage:[1,"empty-message"],striped:[4],parsedColumns:[32],parsedRows:[32],sortKey:[32],sortDir:[32],selectedKeys:[32]},void 0,{columns:[{columnsChanged:0}],rows:[{rowsChanged:0}]}]);function d(){"undefined"!=typeof customElements&&["dropi-table","dropi-checkbox","dropi-icon"].forEach((t=>{switch(t){case"dropi-table":customElements.get(e(t))||customElements.define(e(t),l);break;case"dropi-checkbox":customElements.get(e(t))||i();break;case"dropi-icon":customElements.get(e(t))||o()}}))}d();const n=l,c=d;export{n as DropiTable,c as defineCustomElement}

package/dist/components/dropi-tabs.js

@@ -1 +1 @@
-import{t as a,p as t,H as e,c as r,h as i}from"./index.js";import{d as s}from"./p-ChOXWKmI.js";const o=t(class extends e{constructor(a){super(),!1!==a&&this.__registerHost(),this.__attachShadow(),this.dropiTabChange=r(this,"dropiTabChange")}tabs=[];activeTab=0;showIcon=!1;dropiTabChange;parsedTabs=[];tabsChanged(a){this.parsedTabs="string"==typeof a?JSON.parse(a):a??[]}componentWillLoad(){this.tabsChanged(this.tabs)}handleClick(a){a.disabled||(this.activeTab=a.id,this.dropiTabChange.emit(a))}render(){return i("div",{key:"5b28faac5789a5e29aa68fe2892854cdebccda75",class:"tabs-container",role:"tablist"},this.parsedTabs.map((a=>{const t=a.id===this.activeTab;return i("div",{role:"tab","aria-selected":t+"",class:{"tab-item":!0,"tab-item--active":t&&!a.disabled,"tab-item--disabled":!!a.disabled},onClick:()=>this.handleClick(a)},i("span",{class:"tab-label-row"},i("span",{class:"tab-label"},a.label),null!=a.counter&&i("span",{class:{"tab-counter":!0,"tab-counter--active":t}},a.counter)),this.showIcon&&(a.completed?i("dropi-icon",{name:"Check-circle",width:"12px",height:"12px",color:"Success-Success-500"}):i("span",{class:"tab-status-dot"})))})))}static get watchers(){return{tabs:[{tabsChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.tabs-container{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;height:52px;scrollbar-width:none}.tabs-container::-webkit-scrollbar{width:0;height:0}.tab-item{padding:var(--Size-4,16px) var(--Size-5,20px);background:var(--Neutral-White,#fff);border-bottom:2px solid var(--Gray-Gray-100,#e6eaf2);cursor:pointer;display:flex;gap:16px;align-items:center;white-space:nowrap;flex-shrink:0;transition:border-color 0.15s ease;user-select:none}.tab-item:hover:not(.tab-item--disabled):not(.tab-item--active){border-color:var(--Gray-Gray-300,#a3abbf)}.tab-item--active{border-bottom:2px solid var(--Primary-Primary-500,#f49a3d)}.tab-item--disabled{background:rgba(223,228,237,0.22);cursor:not-allowed;opacity:0.7;pointer-events:none}.tab-label-row{display:flex;align-items:center;gap:8px}.tab-label{font-size:var(--font-size-m,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-400,#858ea6);line-height:20px}.tab-item--active .tab-label{color:var(--Gray-Gray-600,#475066)}.tab-item--disabled .tab-label{font-weight:300;color:var(--Gray-Gray-300,#a3abbf)}.tab-counter{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:20px;font-size:var(--font-size-xs,10px);font-weight:var(--font-weight-medium,500);background:var(--Gray-Gray-100,#e6eaf2);color:var(--Gray-Gray-500,#69738c)}.tab-counter--active{background:var(--Primary-Primary-100,#fde8d0);color:var(--Primary-Primary-500,#f49a3d)}.tab-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--Primary-Primary-500, #f49a3d);flex-shrink:0}"}},[513,"dropi-tabs",{tabs:[1],activeTab:[1544,"active-tab"],showIcon:[4,"show-icon"],parsedTabs:[32]},void 0,{tabs:[{tabsChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-tabs","dropi-icon"].forEach((t=>{switch(t){case"dropi-tabs":customElements.get(a(t))||customElements.define(a(t),o);break;case"dropi-icon":customElements.get(a(t))||s()}}))}n();const c=o,b=n;export{c as DropiTabs,b as defineCustomElement}
+import{t as a,p as t,H as e,c as r,h as i}from"./index.js";import{d as s}from"./p-wO1yy0Zr.js";const o=t(class extends e{constructor(a){super(),!1!==a&&this.__registerHost(),this.__attachShadow(),this.dropiTabChange=r(this,"dropiTabChange",7)}tabs=[];activeTab=0;showIcon=!1;dropiTabChange;parsedTabs=[];tabsChanged(a){this.parsedTabs="string"==typeof a?JSON.parse(a):a??[]}componentWillLoad(){this.tabsChanged(this.tabs)}handleClick(a){a.disabled||(this.activeTab=a.id,this.dropiTabChange.emit(a))}render(){return i("div",{key:"9db1e2f4fdd15fc4ea4407d83fe33c562270acec",class:"tabs-container",role:"tablist"},this.parsedTabs.map((a=>{const t=a.id===this.activeTab;return i("div",{role:"tab","aria-selected":t+"",class:{"tab-item":!0,"tab-item--active":t&&!a.disabled,"tab-item--disabled":!!a.disabled},onClick:()=>this.handleClick(a)},i("span",{class:"tab-label-row"},i("span",{class:"tab-label"},a.label),null!=a.counter&&i("span",{class:{"tab-counter":!0,"tab-counter--active":t}},a.counter)),this.showIcon&&(a.completed?i("dropi-icon",{name:"Check-circle",width:"12px",height:"12px",color:"Success-Success-500"}):i("span",{class:"tab-status-dot"})))})))}static get watchers(){return{tabs:[{tabsChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.tabs-container{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;height:52px;scrollbar-width:none}.tabs-container::-webkit-scrollbar{width:0;height:0}.tab-item{padding:var(--Size-4,16px) var(--Size-5,20px);background:var(--Neutral-White,#fff);border-bottom:2px solid var(--Gray-Gray-100,#e6eaf2);cursor:pointer;display:flex;gap:16px;align-items:center;white-space:nowrap;flex-shrink:0;transition:border-color 0.15s ease;user-select:none}.tab-item:hover:not(.tab-item--disabled):not(.tab-item--active){border-color:var(--Gray-Gray-300,#a3abbf)}.tab-item--active{border-bottom:2px solid var(--Primary-Primary-500,#f49a3d)}.tab-item--disabled{background:rgba(223,228,237,0.22);cursor:not-allowed;opacity:0.7;pointer-events:none}.tab-label-row{display:flex;align-items:center;gap:8px}.tab-label{font-size:var(--font-size-m,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-400,#858ea6);line-height:20px}.tab-item--active .tab-label{color:var(--Gray-Gray-600,#475066)}.tab-item--disabled .tab-label{font-weight:300;color:var(--Gray-Gray-300,#a3abbf)}.tab-counter{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:20px;font-size:var(--font-size-xs,10px);font-weight:var(--font-weight-medium,500);background:var(--Gray-Gray-100,#e6eaf2);color:var(--Gray-Gray-500,#69738c)}.tab-counter--active{background:var(--Primary-Primary-100,#fde8d0);color:var(--Primary-Primary-500,#f49a3d)}.tab-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--Primary-Primary-500, #f49a3d);flex-shrink:0}"}},[513,"dropi-tabs",{tabs:[1],activeTab:[1544,"active-tab"],showIcon:[4,"show-icon"],parsedTabs:[32]},void 0,{tabs:[{tabsChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-tabs","dropi-icon"].forEach((t=>{switch(t){case"dropi-tabs":customElements.get(a(t))||customElements.define(a(t),o);break;case"dropi-icon":customElements.get(a(t))||s()}}))}n();const c=o,b=n;export{c as DropiTabs,b as defineCustomElement}

package/dist/components/dropi-tag-type-product.d.ts

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

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

@@ -0,0 +1 @@
+import{t,p as e,H as o,h as s}from"./index.js";const i=e(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}label="VARIABLE";render(){return s("div",{key:"7002748963348a2361665d0d307f4d8eb3a24e3a",class:"type-variation"},this.label)}static get style(){return":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}"}},[513,"dropi-tag-type-product",{label:[1]}]);function r(){"undefined"!=typeof customElements&&["dropi-tag-type-product"].forEach((e=>{"dropi-tag-type-product"===e&&(customElements.get(t(e))||customElements.define(t(e),i))}))}r();const n=i,a=r;export{n as DropiTagTypeProduct,a as defineCustomElement}

package/dist/components/dropi-tag.js

@@ -1 +1 @@
-import{t,p as e,H as i,h as s}from"./index.js";import{d as r}from"./p-ChOXWKmI.js";const o=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}type="primary";state="default";showIcon=!1;icon="";text="";colorMap={default:"Primary-Primary",success:"Success-Success",info:"Info-Info",warning:"Warning-Warning",error:"Error-Error",legacy:"Gray-Gray"};propsChanged(){}get bgColor(){const t=this.colorMap[this.state];return"primary"===this.type?`var(--${t}-500)`:`var(--${t}${"default"===this.state||"legacy"===this.state?"-100":"-50"})`}get textColor(){return"primary"===this.type?"var(--Neutral-White)":`var(--${this.colorMap[this.state]}${"default"===this.state?"-500":"-700"})`}get iconColor(){return"primary"===this.type?"Neutral-White":`${this.colorMap[this.state]}${"default"===this.state?"-500":"-700"}`}get hasContent(){return"string"==typeof this.text&&this.text.trim().length>0}render(){return s("div",{key:"d559f6c2ed27d543f018d3533d8d972bc47ceb9d",class:"container-chips"},s("div",{key:"d131a4626ead2d3d53d5c77875f8ebb19acc3b52",class:{tags:!0,"icon-only":this.showIcon&&!this.hasContent},style:{backgroundColor:this.bgColor,color:this.textColor}},this.showIcon&&this.icon&&s("dropi-icon",{key:"54775a2ca1bd87be3293b3d6417f4a26c6da0c85",class:"file-icon",name:this.icon,width:"16px",height:"16px",color:this.iconColor}),this.hasContent&&s("span",{key:"bce897f4094c33fd53dc98571cae60cd456e0706"},this.text)))}static get watchers(){return{type:[{propsChanged:0}],state:[{propsChanged:0}]}}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.container-chips{display:inline-block}.tags{display:inline-flex;padding:4px 8px;justify-content:center;align-items:center;gap:4px;border-radius:var(--Border-5, 9999px);overflow:hidden;text-align:center;text-overflow:ellipsis;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);line-height:var(--Size-5, 24px);animation:fade-in 200ms ease-out}.tags.icon-only{gap:0}.file-icon{display:flex;margin-right:4px}@keyframes fade-in{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}"}},[513,"dropi-tag",{type:[1],state:[1],showIcon:[4,"show-icon"],icon:[1],text:[1]},void 0,{type:[{propsChanged:0}],state:[{propsChanged:0}]}]);function a(){"undefined"!=typeof customElements&&["dropi-tag","dropi-icon"].forEach((e=>{switch(e){case"dropi-tag":customElements.get(t(e))||customElements.define(t(e),o);break;case"dropi-icon":customElements.get(t(e))||r()}}))}a();const n=o,c=a;export{n as DropiTag,c as defineCustomElement}
+import{t,p as e,H as i,h as s}from"./index.js";import{d as r}from"./p-wO1yy0Zr.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}type="primary";state="default";showIcon=!1;icon="";text="";colorMap={default:"Primary-Primary",success:"Success-Success",info:"Info-Info",warning:"Warning-Warning",error:"Error-Error",legacy:"Gray-Gray"};propsChanged(){}get bgColor(){const t=this.colorMap[this.state];return"primary"===this.type?`var(--${t}-500)`:`var(--${t}${"default"===this.state||"legacy"===this.state?"-100":"-50"})`}get textColor(){return"primary"===this.type?"var(--Neutral-White)":`var(--${this.colorMap[this.state]}${"default"===this.state?"-500":"-700"})`}get iconColor(){return"primary"===this.type?"Neutral-White":`${this.colorMap[this.state]}${"default"===this.state?"-500":"-700"}`}get hasContent(){return"string"==typeof this.text&&this.text.trim().length>0}render(){return s("div",{key:"ca7fdd40b3d059abe34a6c4ccfba5cbfbdb5c786",class:"container-chips"},s("div",{key:"897f4ab4a9d2d5ecb7088c6732f59c6cc3138c43",class:{tags:!0,"icon-only":this.showIcon&&!this.hasContent},style:{backgroundColor:this.bgColor,color:this.textColor}},this.showIcon&&this.icon&&s("dropi-icon",{key:"77b9315e4d1d4bd257331a4ce4cb3b82480430c0",class:"file-icon",name:this.icon,width:"16px",height:"16px",color:this.iconColor}),this.hasContent&&s("span",{key:"c55aede3070168989b8ebefa85480968f71eb08a"},this.text)))}static get watchers(){return{type:[{propsChanged:0}],state:[{propsChanged:0}]}}static get style(){return":host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.container-chips{display:inline-block}.tags{display:inline-flex;padding:4px 8px;justify-content:center;align-items:center;gap:4px;border-radius:var(--Border-5, 9999px);overflow:hidden;text-align:center;text-overflow:ellipsis;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);line-height:var(--Size-5, 24px);animation:fade-in 200ms ease-out}.tags.icon-only{gap:0}.file-icon{display:flex}@keyframes fade-in{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}"}},[513,"dropi-tag",{type:[1],state:[1],showIcon:[4,"show-icon"],icon:[1],text:[1]},void 0,{type:[{propsChanged:0}],state:[{propsChanged:0}]}]);function o(){"undefined"!=typeof customElements&&["dropi-tag","dropi-icon"].forEach((e=>{switch(e){case"dropi-tag":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||r()}}))}o();const n=a,c=o;export{n as DropiTag,c as defineCustomElement}

package/dist/components/dropi-text-area.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-ChOXWKmI.js";const s=e(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiInput=a(this,"dropiInput"),this.dropiChange=a(this,"dropiChange"),this.dropiFocus=a(this,"dropiFocus"),this.dropiBlur=a(this,"dropiBlur"),this.internals=this.attachInternals()}internals;inputId="";name="";label="";placeholder="";value="";maxlength;minlength=0;rows=4;resize="vertical";disabled=!1;required=!1;showAsterisk=!1;helperText="";invalid=!1;touched=!1;dropiInput;dropiChange;dropiFocus;dropiBlur;valueChanged(r){this.internals.setFormValue(r)}componentWillLoad(){this.internals.setFormValue(this.value??"")}handleInput(r){const e=r.target.value;this.value=e,this.internals.setFormValue(e),this.dropiInput.emit(e)}handleBlur(){this.touched=!0,this.dropiChange.emit(this.value),this.dropiBlur.emit()}get resolvedId(){return this.inputId||this.label}get isInvalid(){return this.invalid&&this.touched}get charCount(){return this.value?.length??0}render(){const r=this.helperText||this.isInvalid;return o("div",{key:"652b432e3f23f6ca383ca4c44ad3b0da599ecbfb",class:"textarea-wrapper"},this.label&&o("label",{key:"370698235edc4d8f8d449e66ee4ef90ea9e191d0",htmlFor:this.resolvedId,style:{color:this.disabled?"var(--Gray-Gray-400)":"var(--Gray-Gray-600)"}},this.label,this.required&&this.showAsterisk&&!this.disabled&&o("span",{key:"d7c90f3a45b987d7b3229410f141d7fa51fd003d",class:"asterisk"}," *")),o("div",{key:"579fadaf791012ab93ddcdff06d237dab27efc9a",class:"textarea-container"},o("textarea",{key:"d81a5f25b541e044f7f632512570f53966b156cf",id:this.resolvedId,class:{"form-control":!0,"Body-M-Regular":!0,"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:r=>this.handleInput(r),onFocus:()=>this.dropiFocus.emit(),onBlur:()=>this.handleBlur()},this.value),this.maxlength>0&&o("div",{key:"d6c80f4f693e12069a2b1147b489717d61e53e53",class:"char-counter"},this.charCount,"/",this.maxlength)),r&&o("div",{key:"af317619d37311746ceefa083bb44ceff6514f92",class:"form-control-helper"},this.isInvalid&&o("dropi-icon",{key:"2d92acfcb808a67319c8c1aa1a2c9c6c05affcef",name:"Warning-circle",width:"12px",height:"12px",color:"Error-Error-500"}),o("span",{key:"d2fad4506be938c8376d41ed41186a808364adbf",class:{"invalid-color":this.isInvalid},style:{color:this.disabled?"var(--Gray-Gray-400)":void 0}},this.helperText)))}static get formAssociated(){return!0}static get watchers(){return{value:[{valueChanged:0}]}}static get style(){return":host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.textarea-wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:4px}.textarea-wrapper label{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.asterisk{color:var(--Error-Error-500, #f46a6b)}.textarea-container{position:relative}textarea.form-control{box-sizing:border-box;width:100%;overflow:auto;padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:var(--Neutral-White, #fff);transition:border-color 0.3s ease-in-out;outline:none;appearance:none}textarea.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}textarea.form-control:focus::placeholder{color:var(--Gray-Gray-400, #858ea6)}textarea.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.char-counter{position:absolute;bottom:10px;right:16px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c);pointer-events:none}.form-control-helper{display:flex;gap:4px;align-items:center;margin-top:4px}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}"}},[577,"dropi-text-area",{inputId:[1,"input-id"],name:[1],label:[1],placeholder:[1],value:[1025],maxlength:[2],minlength:[2],rows:[2],resize:[1],disabled:[516],required:[516],showAsterisk:[4,"show-asterisk"],helperText:[1,"helper-text"],invalid:[4],touched:[32]},void 0,{value:[{valueChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-text-area","dropi-icon"].forEach((e=>{switch(e){case"dropi-text-area":customElements.get(r(e))||customElements.define(r(e),s);break;case"dropi-icon":customElements.get(r(e))||i()}}))}n();const l=s,d=n;export{l as DropiTextArea,d 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=e(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.dropiInput=a(this,"dropiInput",7),this.dropiChange=a(this,"dropiChange",7),this.dropiFocus=a(this,"dropiFocus",7),this.dropiBlur=a(this,"dropiBlur",7),this.internals=this.attachInternals()}internals;inputId="";name="";label="";placeholder="";value="";maxlength;minlength=0;rows=4;resize="vertical";disabled=!1;required=!1;showAsterisk=!1;helperText="";invalid=!1;touched=!1;dropiInput;dropiChange;dropiFocus;dropiBlur;valueChanged(r){this.internals.setFormValue(r)}componentWillLoad(){this.internals.setFormValue(this.value??"")}handleInput(r){const e=r.target.value;this.value=e,this.internals.setFormValue(e),this.dropiInput.emit(e)}handleBlur(){this.touched=!0,this.dropiChange.emit(this.value),this.dropiBlur.emit()}get resolvedId(){return this.inputId||this.label}get isInvalid(){return this.invalid&&this.touched}get charCount(){return this.value?.length??0}render(){const r=this.helperText||this.isInvalid;return o("div",{key:"ea3be8cb6a7316f6c7e7b41b51e14db24654db7a",class:"textarea-wrapper"},this.label&&o("label",{key:"d6b48ca844611e26ac378070863334a481179cd5",htmlFor:this.resolvedId,style:{color:this.disabled?"var(--Gray-Gray-400)":"var(--Gray-Gray-600)"}},this.label,this.required&&this.showAsterisk&&!this.disabled&&o("span",{key:"a3f28346716188fd46ae411e54a64242856c9ec1",class:"asterisk"}," *")),o("div",{key:"c0532ad518a267ff14884c687e49b005ff39c381",class:"textarea-container"},o("textarea",{key:"3bdd909fb0b1710bba23d348fe46058414a0f244",id:this.resolvedId,class:{"form-control":!0,"Body-M-Regular":!0,"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:r=>this.handleInput(r),onFocus:()=>this.dropiFocus.emit(),onBlur:()=>this.handleBlur()},this.value),this.maxlength>0&&o("div",{key:"7c4f136b776dd9d5d930d690401d422d856139d1",class:"char-counter"},this.charCount,"/",this.maxlength)),r&&o("div",{key:"e72f689564b1c58cb706b5ad607044ec7cc267e7",class:"form-control-helper"},this.isInvalid&&o("dropi-icon",{key:"93308a1c97c96da20dd246ecc23c10ed6fd656a8",name:"Warning-circle",width:"12px",height:"12px",color:"Error-Error-500"}),o("span",{key:"18df68d1cb37302d3bfeb5742432bf89806e0d98",class:{"invalid-color":this.isInvalid},style:{color:this.disabled?"var(--Gray-Gray-400)":void 0}},this.helperText)))}static get formAssociated(){return!0}static get watchers(){return{value:[{valueChanged:0}]}}static get style(){return":host{display:flex;flex-direction:column;width:100%}*,*::before,*::after{box-sizing:border-box}.textarea-wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:4px}.textarea-wrapper label{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.asterisk{color:var(--Error-Error-500, #f46a6b)}.textarea-container{position:relative}textarea.form-control{box-sizing:border-box;width:100%;overflow:auto;padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);font-size:var(--font-size-s, 12px);font-family:inherit;color:var(--Gray-Gray-700, #32394d);background:var(--Neutral-White, #fff);transition:border-color 0.3s ease-in-out;outline:none;appearance:none}textarea.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}textarea.form-control:focus::placeholder{color:var(--Gray-Gray-400, #858ea6)}textarea.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.char-counter{position:absolute;bottom:10px;right:16px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c);pointer-events:none}.form-control-helper{display:flex;gap:4px;align-items:center}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}"}},[577,"dropi-text-area",{inputId:[1,"input-id"],name:[1],label:[1],placeholder:[1],value:[1025],maxlength:[2],minlength:[2],rows:[2],resize:[1],disabled:[516],required:[516],showAsterisk:[4,"show-asterisk"],helperText:[1,"helper-text"],invalid:[4],touched:[32]},void 0,{value:[{valueChanged:0}]}]);function n(){"undefined"!=typeof customElements&&["dropi-text-area","dropi-icon"].forEach((e=>{switch(e){case"dropi-text-area":customElements.get(r(e))||customElements.define(r(e),s);break;case"dropi-icon":customElements.get(r(e))||i()}}))}n();const l=s,c=n;export{l as DropiTextArea,c as defineCustomElement}

package/dist/components/dropi-time-line.d.ts

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

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

@@ -0,0 +1 @@
+import{t,p as e,H as r,h as a}from"./index.js";import{d as s}from"./p-wO1yy0Zr.js";const i=e(class extends r{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}steps=[];get parsedSteps(){if("string"==typeof this.steps)try{return JSON.parse(this.steps)}catch{return[]}return this.steps||[]}render(){const t=this.parsedSteps;return a("div",{key:"b8a4dee055ec85242e2a62a497a6b13fcea29bbc",class:"timeline"},t.map(((e,r)=>{const s=r===t.length-1;return a("div",{class:{"tl-step":!0,["tl-step--"+e.status]:!0},key:e.id||r},a("div",{class:"tl-step__marker"},a("div",{class:"tl-step__icon"},e.icon?a("dropi-icon",{name:e.icon,width:"16px",height:"16px",color:"done"===e.status?"Neutral-White":"active"===e.status?"Primary-Primary-500":"Gray-Gray-400"}):a("span",{class:"tl-step__dot"})),!s&&a("div",{class:"tl-step__line"})),a("div",{class:"tl-step__content"},a("span",{class:"tl-step__label"},e.label),e.subtitle&&a("span",{class:"tl-step__subtitle"},e.subtitle)))})))}static get style(){return":host{display:block}*,*::before,*::after{box-sizing:border-box}.timeline{display:flex;flex-direction:column}.tl-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.tl-step__marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.tl-step__icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background 0.2s, border-color 0.2s}.tl-step--pending .tl-step__icon{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.tl-step--active .tl-step__icon{background:var(--Neutral-White, #fff);border:2px solid var(--Primary-Primary-500, #f49a3d);box-shadow:0 0 0 4px var(--Primary-Primary-100, #fde9d0)}.tl-step--done .tl-step__icon{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.tl-step__dot{width:8px;height:8px;border-radius:50%;display:block}.tl-step--pending .tl-step__dot{background:var(--Gray-Gray-300, #a3abbf)}.tl-step--active .tl-step__dot{background:var(--Primary-Primary-500, #f49a3d)}.tl-step--done .tl-step__dot{background:var(--Neutral-White, #fff)}.tl-step__line{flex:1;width:2px;min-height:24px;margin:4px 0;background:var(--Gray-Gray-200, #c3c9d9)}.tl-step--done+.tl-step .tl-step__line,.tl-step--done .tl-step__line{background:var(--Primary-Primary-500, #f49a3d)}.tl-step__content{display:flex;flex-direction:column;gap:2px;padding-top:6px;padding-bottom:var(--Size-4, 16px)}.tl-step__label{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.tl-step--pending .tl-step__label{color:var(--Gray-Gray-400, #858ea6);font-weight:var(--font-weight-regular, 400)}.tl-step__subtitle{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}"}},[513,"dropi-time-line",{steps:[1]}]);function l(){"undefined"!=typeof customElements&&["dropi-time-line","dropi-icon"].forEach((e=>{switch(e){case"dropi-time-line":customElements.get(t(e))||customElements.define(t(e),i);break;case"dropi-icon":customElements.get(t(e))||s()}}))}l();const o=i,n=l;export{o as DropiTimeLine,n as defineCustomElement}

package/dist/components/dropi-toast.js

@@ -1 +1 @@
-import{t,p as e,H as i,h as o}from"./index.js";import{d as s}from"./p-ChOXWKmI.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}position="top-right";life=4e3;items=[];idCounter=0;async show(t){const e=t.id??"t"+ ++this.idCounter,i={msg:{...t,id:e,closable:t.closable??!0},leaving:!1};this.items=[...this.items,i];const o=void 0!==t.life?t.life:this.life;o>0&&(i.timer=setTimeout((()=>this.remove(e)),o))}async clear(){this.items.forEach((t=>{t.timer&&clearTimeout(t.timer)})),this.items=[]}remove(t){this.items=this.items.map((e=>e.msg.id===t?{...e,leaving:!0}:e)),setTimeout((()=>{this.items=this.items.filter((e=>e.msg.id!==t))}),320)}lottieMap={success:"/assets/lottie-files/success.json",error:"/assets/lottie-files/failure.json",warn:"/assets/lottie-files/warning.json",info:"/assets/lottie-files/question.json"};getLottieHtml(t){return`<lottie-player src="${this.lottieMap[t]}" background="transparent" speed="1" loop autoplay></lottie-player>`}render(){return o("div",{key:"8cce9f62a0b8cac6415881be5f2e6d82bd35668e",class:"toast-container toast-container--"+this.position},this.items.map((t=>o("div",{key:t.msg.id,class:{"toast-wrapper":!0,"toast-wrapper--leaving":t.leaving}},o("div",{class:"toast toast--"+t.msg.severity},o("div",{class:"toast-content"},o("div",{class:"lottie-img"},o("div",{class:"lottie-player-container",innerHTML:this.getLottieHtml(t.msg.severity)})),o("div",{class:"info-container"},o("p",{class:"title"},t.msg.summary),t.msg.detail&&o("p",{class:"description"},t.msg.detail))),t.msg.closable&&o("button",{class:"toast-close",onClick:()=>this.remove(t.msg.id)},o("dropi-icon",{name:"Close-small",width:"20px",height:"20px",color:"Gray-Gray-400"})))))))}static get style(){return":host{display:contents}*,*::before,*::after{box-sizing:border-box}.toast-container{position:fixed;z-index:9999;display:flex;flex-direction:column;gap:8px;max-width:380px;width:100%;pointer-events:none}.toast-container--top-right{top:80px;right:0;padding:var(--Size-2, 8px)}.toast-container--top-left{top:80px;left:0;padding:var(--Size-2, 8px)}.toast-container--bottom-right{bottom:24px;right:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-container--bottom-left{bottom:24px;left:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-container--top-center{top:80px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px)}.toast-container--bottom-center{bottom:24px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-wrapper{pointer-events:auto;animation:toast-in 0.28s ease;transition:opacity 0.28s ease, transform 0.28s ease, max-height 0.32s ease;overflow:hidden;max-height:200px}.toast-wrapper--leaving{opacity:0;transform:translateX(20px);max-height:0;pointer-events:none}@keyframes toast-in{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.toast{position:relative;display:flex;align-items:flex-start;border-radius:var(--Border-2,8px);background:var(--Neutral-White,#fff);box-shadow:0.5px -1px 7px 0px rgba(0, 0, 0, 0.06);border-left:var(--Size-2, 8px) solid;overflow:hidden;min-width:300px}.toast--success{border-color:var(--Success-Success-500,#34c38f)}.toast--error{border-color:var(--Error-Error-500,#f46a6b)}.toast--warn{border-color:var(--Warning-Warning-500,#f1b44c)}.toast--info{border-color:var(--Info-Info-500,#50a5f1)}.toast-content{display:flex;flex-direction:row;align-items:flex-start;padding:var(--Size-5) var(--Size-5) var(--Size-5) calc(var(--Size-5) - var(--Size-2, 8px));gap:var(--Size-4, 16px)}.lottie-img{width:50px;height:50px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative}.lottie-player-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;display:flex;align-items:center;justify-content:center}lottie-player{width:100%;height:100%;display:block}.info-container{flex:1;min-width:0;align-self:center;display:flex;flex-direction:column;gap:var(--Size-1, 4px)}.title{margin:0;font-size:var(--font-size-l,18px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-700,#32394d);line-height:1.1;text-align:left;max-width:250px}.description{margin:0;font-size:var(--font-size-s,14px);color:var(--Gray-Gray-500,#6b7280);line-height:1.4;text-align:left;max-width:250px}.toast-close{position:absolute;top:18px;right:10px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0;display:flex;align-items:center;justify-content:center}.toast-close:hover{opacity:0.7}"}},[513,"dropi-toast",{position:[1],life:[2],items:[32],show:[64],clear:[64]}]);function r(){"undefined"!=typeof customElements&&["dropi-toast","dropi-icon"].forEach((e=>{switch(e){case"dropi-toast":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||s()}}))}r();const n=a,l=r;export{n as DropiToast,l as defineCustomElement}
+import{t,p as e,H as i,h as o}from"./index.js";import{d as s}from"./p-wO1yy0Zr.js";const a=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}position="top-right";life=4e3;items=[];idCounter=0;async show(t){const e=t.id??"t"+ ++this.idCounter,i={msg:{...t,id:e,closable:t.closable??!0},leaving:!1};this.items=[...this.items,i];const o=void 0!==t.life?t.life:this.life;o>0&&(i.timer=setTimeout((()=>this.remove(e)),o))}async clear(){this.items.forEach((t=>{t.timer&&clearTimeout(t.timer)})),this.items=[]}remove(t){this.items=this.items.map((e=>e.msg.id===t?{...e,leaving:!0}:e)),setTimeout((()=>{this.items=this.items.filter((e=>e.msg.id!==t))}),320)}lottieMap={success:"/assets/lottie-files/success.json",error:"/assets/lottie-files/failure.json",warn:"/assets/lottie-files/warning.json",info:"/assets/lottie-files/question.json"};getLottieHtml(t){return`<lottie-player src="${this.lottieMap[t]}" background="transparent" speed="1" loop autoplay></lottie-player>`}render(){return o("div",{key:"c29bfdfa90eb237f24a4d682ae05e7c29b754404",class:"toast-container toast-container--"+this.position},this.items.map((t=>o("div",{key:t.msg.id,class:{"toast-wrapper":!0,"toast-wrapper--leaving":t.leaving}},o("div",{class:"toast toast--"+t.msg.severity},o("div",{class:"toast-content"},o("div",{class:"lottie-img"},o("div",{class:"lottie-player-container",innerHTML:this.getLottieHtml(t.msg.severity)})),o("div",{class:"info-container"},o("p",{class:"title"},t.msg.summary),t.msg.detail&&o("p",{class:"description"},t.msg.detail))),t.msg.closable&&o("button",{class:"toast-close",onClick:()=>this.remove(t.msg.id)},o("dropi-icon",{name:"Close-small",width:"20px",height:"20px",color:"Gray-Gray-400"})))))))}static get style(){return":host{display:contents}*,*::before,*::after{box-sizing:border-box}.toast-container{position:fixed;z-index:9999;display:flex;flex-direction:column;gap:8px;max-width:380px;width:100%;pointer-events:none}.toast-container--top-right{top:80px;right:0;padding:var(--Size-2, 8px)}.toast-container--top-left{top:80px;left:0;padding:var(--Size-2, 8px)}.toast-container--bottom-right{bottom:24px;right:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-container--bottom-left{bottom:24px;left:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-container--top-center{top:80px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px)}.toast-container--bottom-center{bottom:24px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px);flex-direction:column-reverse}.toast-wrapper{pointer-events:auto;animation:toast-in 0.28s ease;transition:opacity 0.28s ease, transform 0.28s ease, max-height 0.32s ease;overflow:hidden;max-height:200px}.toast-wrapper--leaving{opacity:0;transform:translateX(20px);max-height:0;pointer-events:none}@keyframes toast-in{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.toast{position:relative;display:flex;align-items:flex-start;border-radius:var(--Border-2,8px);background:var(--Neutral-White,#fff);box-shadow:0.5px -1px 7px 0px rgba(0, 0, 0, 0.06);border-left:var(--Size-2, 8px) solid;overflow:hidden;min-width:300px}.toast--success{border-color:var(--Success-Success-500,#34c38f)}.toast--error{border-color:var(--Error-Error-500,#f46a6b)}.toast--warn{border-color:var(--Warning-Warning-500,#f1b44c)}.toast--info{border-color:var(--Info-Info-500,#50a5f1)}.toast-content{display:flex;flex-direction:row;align-items:flex-start;padding:var(--Size-5) var(--Size-5) var(--Size-5) calc(var(--Size-5) - var(--Size-2, 8px));gap:var(--Size-4, 16px)}.lottie-img{width:50px;height:50px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative}.lottie-player-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;display:flex;align-items:center;justify-content:center}lottie-player{width:100%;height:100%;display:block}.info-container{flex:1;min-width:0;align-self:center;display:flex;flex-direction:column;gap:var(--Size-1, 4px)}.title{margin:0;font-size:var(--font-size-l,18px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-700,#32394d);line-height:1.1;text-align:left;max-width:250px}.description{margin:0;font-size:var(--font-size-s,14px);color:var(--Gray-Gray-500,#6b7280);line-height:1.4;text-align:left;max-width:250px}.toast-close{position:absolute;top:18px;right:10px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0;display:flex;align-items:center;justify-content:center}.toast-close:hover{opacity:0.7}"}},[513,"dropi-toast",{position:[1],life:[2],items:[32],show:[64],clear:[64]}]);function r(){"undefined"!=typeof customElements&&["dropi-toast","dropi-icon"].forEach((e=>{switch(e){case"dropi-toast":customElements.get(t(e))||customElements.define(t(e),a);break;case"dropi-icon":customElements.get(t(e))||s()}}))}r();const n=a,l=r;export{n as DropiToast,l as defineCustomElement}

package/dist/components/dropi-tooltip.js

@@ -1 +1 @@
-import{t,p as o,H as e,h as r}from"./index.js";const i=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}text="";position="top";maxWidth="280px";showDelay=0;visible=!1;showTimer=null;show=()=>{this.showDelay>0?this.showTimer=setTimeout((()=>{this.visible=!0}),this.showDelay):this.visible=!0};hide=()=>{this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null),this.visible=!1};render(){return r("div",{key:"c6179d8dfb9f4c3cc2a6a4e79f2e1a9ff8bbd641",class:"tooltip-wrapper",onMouseEnter:this.show,onMouseLeave:this.hide,onFocusin:this.show,onFocusout:this.hide},r("slot",{key:"aee7bae9d384369faaa5b078e40f3a8763690bb3"}),this.text&&r("div",{key:"d00e75f536c5f88c7062ac6359dec3fe7d866cd0",class:{"tooltip-bubble":!0,["tooltip-bubble--"+this.position]:!0,"tooltip-bubble--visible":this.visible},style:{maxWidth:this.maxWidth},role:"tooltip"},this.text,r("span",{key:"aec6a936bbc6677b0e1abf3a18233d90d757cd96",class:"tooltip-arrow tooltip-arrow--"+this.position})))}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.tooltip-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.tooltip-bubble{position:absolute;z-index:9999;background:#1f2433;color:var(--Neutral-White,#fff);font-size:var(--font-size-s,14px);line-height:1.5;padding:8px 12px;border-radius:8px;white-space:normal;pointer-events:none;opacity:0;transition:opacity 0.15s ease, transform 0.15s ease;word-break:break-word;box-shadow:var(--Shadow-medium);text-align:left;width:max-content}.tooltip-bubble--visible{opacity:1}.tooltip-bubble--top{bottom:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--bottom{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--left{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-bubble--right{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-arrow{position:absolute;width:12px;height:6px}.tooltip-arrow::before{content:'';position:absolute;width:0;height:0}.tooltip-arrow--top{top:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--top::before{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #1f2433}.tooltip-arrow--bottom{bottom:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--bottom::before{border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #1f2433}.tooltip-arrow--left{left:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--left::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #1f2433}.tooltip-arrow--right{right:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--right::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid #1f2433}"}},[769,"dropi-tooltip",{text:[1],position:[1],maxWidth:[1,"max-width"],showDelay:[2,"show-delay"],visible:[32]}]);function s(){"undefined"!=typeof customElements&&["dropi-tooltip"].forEach((o=>{"dropi-tooltip"===o&&(customElements.get(t(o))||customElements.define(t(o),i))}))}s();const a=i,l=s;export{a as DropiTooltip,l as defineCustomElement}
+import{t,p as o,H as e,h as r}from"./index.js";const i=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}text="";position="top";maxWidth="280px";showDelay=0;visible=!1;showTimer=null;show=()=>{this.showDelay>0?this.showTimer=setTimeout((()=>{this.visible=!0}),this.showDelay):this.visible=!0};hide=()=>{this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null),this.visible=!1};render(){return r("div",{key:"9f328904e1954d08cf18d51ca765f07ec8b9d3c1",class:"tooltip-wrapper",onMouseEnter:this.show,onMouseLeave:this.hide,onFocusin:this.show,onFocusout:this.hide},r("slot",{key:"697ebc090a9b3d7db25666b6ae8726bc9c389d3c"}),this.text&&r("div",{key:"f82c4ad44cd13b3eb7fd3bbfa54bb598166fba1c",class:{"tooltip-bubble":!0,["tooltip-bubble--"+this.position]:!0,"tooltip-bubble--visible":this.visible},style:{maxWidth:this.maxWidth},role:"tooltip"},this.text,r("span",{key:"f850e6f1b5a66a686e9741b3d5e9df3bd5b81e95",class:"tooltip-arrow tooltip-arrow--"+this.position})))}static get style(){return":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.tooltip-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.tooltip-bubble{position:absolute;z-index:9999;background:#1f2433;color:var(--Neutral-White,#fff);font-size:var(--font-size-s,14px);line-height:1.5;padding:8px 12px;border-radius:8px;white-space:normal;pointer-events:none;opacity:0;transition:opacity 0.15s ease, transform 0.15s ease;word-break:break-word;box-shadow:var(--Shadow-medium);text-align:left;width:max-content}.tooltip-bubble--visible{opacity:1}.tooltip-bubble--top{bottom:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--bottom{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--left{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-bubble--right{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-arrow{position:absolute;width:12px;height:6px}.tooltip-arrow::before{content:'';position:absolute;width:0;height:0}.tooltip-arrow--top{top:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--top::before{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #1f2433}.tooltip-arrow--bottom{bottom:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--bottom::before{border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #1f2433}.tooltip-arrow--left{left:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--left::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #1f2433}.tooltip-arrow--right{right:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--right::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid #1f2433}"}},[769,"dropi-tooltip",{text:[1],position:[1],maxWidth:[1,"max-width"],showDelay:[2,"show-delay"],visible:[32]}]);function s(){"undefined"!=typeof customElements&&["dropi-tooltip"].forEach((o=>{"dropi-tooltip"===o&&(customElements.get(t(o))||customElements.define(t(o),i))}))}s();const a=i,l=s;export{a as DropiTooltip,l as defineCustomElement}

package/dist/components/dropi-vertical-steps.d.ts

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

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

@@ -0,0 +1 @@
+import{t as e,p as r,H as t,c as s,h as i}from"./index.js";import{d as c}from"./p-wO1yy0Zr.js";const a=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.dropiStepClick=s(this,"dropiStepClick",7)}steps=[];currentStep=1;clickable=!1;showCheckIcon=!0;dropiStepClick;get parsedSteps(){if("string"==typeof this.steps)try{return JSON.parse(this.steps)}catch{return[]}return this.steps||[]}resolveState(e,r){if(r.state)return r.state;const t=e+1;return t<this.currentStep?"completed":t===this.currentStep?"current":"pending"}render(){const e=this.parsedSteps;return i("div",{key:"ec06949df14eae6937921d930e37cf7638454263",class:"vertical-steps"},e.map(((r,t)=>{const s=this.resolveState(t,r),c=t===e.length-1,a=this.clickable&&"completed"===s;return i("div",{class:{"v-step":!0,"v-step--clickable":a},key:t,onClick:()=>a&&this.dropiStepClick.emit(t+1)},i("div",{class:"v-step__indicator"},i("div",{class:{"v-step__circle":!0,["v-step__circle--"+s]:!0}},"completed"===s&&this.showCheckIcon?i("dropi-icon",{name:"Check",width:"12px",height:"12px",color:"Neutral-White"}):i("span",{class:"v-step__number"},t+1)),!c&&i("div",{class:{"v-step__line":!0,"v-step__line--done":"completed"===s}})),i("span",{class:{"v-step__label":!0,["v-step__label--"+s]:!0}},r.label))})))}static get style(){return":host{display:block}*,*::before,*::after{box-sizing:border-box}.vertical-steps{display:flex;flex-direction:column}.v-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.v-step--clickable{cursor:pointer}.v-step__indicator{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.v-step__circle{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.v-step__circle--pending{background:var(--Neutral-White, #fff);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.v-step__circle--current{background:var(--Neutral-White, #fff);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-500, #69738c)}.v-step__circle--current .v-step__number{color:var(--Primary-Primary-500, #f49a3d)}.v-step__line{flex:1;width:2px;min-height:24px;background:var(--Gray-Gray-200, #c3c9d9);margin:4px 0;transition:background 0.2s}.v-step__line--done{background:var(--Primary-Primary-500, #f49a3d)}.v-step__label{padding-top:4px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066);line-height:1.4}.v-step__label--current{color:var(--Gray-Gray-800, #1a2033);font-weight:var(--font-weight-bold, 700)}.v-step__label--completed{color:var(--Gray-Gray-500, #69738c)}"}},[513,"dropi-vertical-steps",{steps:[1],currentStep:[2,"current-step"],clickable:[4],showCheckIcon:[4,"show-check-icon"]}]);function o(){"undefined"!=typeof customElements&&["dropi-vertical-steps","dropi-icon"].forEach((r=>{switch(r){case"dropi-vertical-steps":customElements.get(e(r))||customElements.define(e(r),a);break;case"dropi-icon":customElements.get(e(r))||c()}}))}o();const n=a,l=o;export{n as DropiVerticalSteps,l as defineCustomElement}

package/dist/components/dropi-youtube-lazy-video.d.ts

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

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

@@ -0,0 +1 @@
+import{t as e,p as t,H as i,h as o}from"./index.js";import{d as r}from"./p-wO1yy0Zr.js";const a=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}videoId="";thumbnailSrc="";videoTitle="";isPlaying=!1;get thumbnail(){return this.thumbnailSrc?`/assets/images/${this.thumbnailSrc}.png`:`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 o("div",{key:"df20b4b0098b3283f266b012d56d3a0377a46420",class:"video-wrapper"+(this.isPlaying?" playing":"")},!this.isPlaying&&o("div",{key:"43b76b1e6d85da93b97ec0441331b82d567d2abe",class:"thumbnail",onClick:()=>{this.isPlaying=!0}},o("img",{key:"3719d3c151b9242f32b313047ccee4fc9b83f990",src:this.thumbnail,alt:"Video thumbnail "+this.videoId}),o("button",{key:"81c578b338b65168920cf38fb4dbc4ef82e6a1a7",class:"play-button","aria-label":"Reproducir video"},o("dropi-icon",{key:"ce505abe0eae58cf7d24eda6527168267e3412ea",name:"Play",width:"17px",height:"21px",color:"Neutral-White"}))),this.isPlaying&&o("iframe",{key:"bf25278bda2376f3de5776057223a139e8112d33",src:this.videoUrl,title:this.videoTitle,frameborder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,loading:"lazy"}))}static get style(){return":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}}"}},[513,"dropi-youtube-lazy-video",{videoId:[1,"video-id"],thumbnailSrc:[1,"thumbnail-src"],videoTitle:[1,"video-title"],isPlaying:[32]}]);function d(){"undefined"!=typeof customElements&&["dropi-youtube-lazy-video","dropi-icon"].forEach((t=>{switch(t){case"dropi-youtube-lazy-video":customElements.get(e(t))||customElements.define(e(t),a);break;case"dropi-icon":customElements.get(e(t))||r()}}))}d();const s=a,n=d;export{s as DropiYoutubeLazyVideo,n as defineCustomElement}