@dropi/ui 0.1.16 → 0.1.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dropi/ui",
-  "version": "0.1.16",
+  "version": "0.1.18",
   "description": "Dropi Design System — Web Components for Angular, React and Vue",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/readme.md

@@ -3,7 +3,7 @@
 Librería de Web Components del Design System de Dropi, construida con **Stencil.js v4**.
 Genera componentes reutilizables para Angular, React y Vue desde una única base de código.
 
-- **Paquete npm:** `@dropi/ui` (v0.1.15)
+- **Paquete npm:** `@dropi/ui` (v0.1.17)
 - **React wrappers:** `@dropi/ui-react`
 
 ---
@@ -21,7 +21,7 @@ Ejecuta el siguiente comando en la raíz de tu proyecto:
 ```bash
 npx @dropi/ui setup
 ```
-*Este comando detectará tu framework (Angular, React o Vue), instalará las dependencias necesarias y configurará estilos e iconos automáticamente.*
+*Este comando detectará tu framework (Angular, React o Vue), instalará las dependencias necesarias y configurará estilos, iconos, animaciones Lottie y scripts automáticamente.*
 
 ---
 
@@ -79,6 +79,23 @@ onDropiChange={(e) => console.log(e.detail)}
 
 ---
 
+## Uso en React (Métodos Imperativos)
+
+Componentes como `DropiModal` y `DropiToast` tienen métodos que deben llamarse vía `ref`. Dado que los wrappers son generados, a veces es necesario castear a `any` para acceder a `show()` o `hide()`.
+
+```tsx
+const modalRef = useRef<any>(null);
+const Modal = DropiModal as any; // Cast opcional para mejor DX
+
+<Modal ref={modalRef} header="Título">
+  <p>Contenido</p>
+</Modal>
+
+<button onClick={() => modalRef.current?.show()}>Abrir</button>
+```
+
+---
+
 ## Componentes
 
 ---
@@ -301,6 +318,7 @@ interface SelectOption {
   shortLabel?: string      // para showCountryFlags
   secondLabel?: string     // subtítulo en radioOptions
   countryCode?: string     // código de país para flags
+  countryId?: string       // id de país para flags
   imageUrl?: string        // imagen en radioOptions
   preIcon?: string         // ícono izquierdo
   disabled?: boolean
@@ -477,6 +495,175 @@ Renderiza íconos SVG desde el sprite de Dropi. Sin eventos.
 
 ---
 
+### `<dropi-tabs>`
+
+Sistema de pestañas con contadores y estados.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `tabs` | `TabItem[]` | `[]` | Lista de tabs `{ id, label, counter, active, disabled, completed }` |
+| `showIcon` | `boolean` | `false` | Mostrar check si `completed` |
+
+**Ejemplo React**
+```tsx
+<DropiTabs 
+  tabs={[{ id: 1, label: 'Activos', counter: 5 }]} 
+  onDropiTabChange={(e) => console.log(e.detail)} 
+/>
+```
+
+---
+
+### `<dropi-accordion>`
+
+Contenedor colapsable.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `header` | `string` | `''` | Título del acordeón |
+| `preIcon` | `string` | `''` | Ícono izquierdo |
+| `disabled` | `boolean` | `false` | Deshabilitar |
+
+**Ejemplo React**
+```tsx
+<DropiAccordion header="¿Cómo funciona?">
+  <p>Contenido interno</p>
+</DropiAccordion>
+```
+
+---
+
+### `<dropi-skeleton>`
+
+Indicadores de carga.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `variant` | `'text' \| 'circle' \| 'rect'` | `'text'` | Forma |
+| `width` | `string` | `'100%'` | Ancho CSS |
+| `height` | `string` | `'16px'` | Alto CSS |
+
+---
+
+### `<dropi-paginator>`
+
+Control de paginación.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `total` | `number` | `0` | Total de registros |
+| `rows` | `number` | `10` | Registros por página |
+| `showPageSizeSelector` | `boolean` | `false` | Selector de cantidad por página |
+
+**Ejemplo React**
+```tsx
+<DropiPaginator 
+  total={100} 
+  onDropiPageChange={(e) => console.log(e.detail.page)} 
+/>
+```
+
+---
+
+### `<dropi-empty-state>`
+
+Pantalla de "no hay datos".
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `header` | `string` | `''` | Título principal |
+| `description` | `string` | `''` | Subtítulo descriptivo |
+| `actionLabel` | `string` | `''` | Texto botón principal |
+| `secondaryLabel` | `string` | `''` | Texto botón secundario |
+
+---
+
+### `<dropi-tooltip>` (V2)
+
+Burbuja de información al hover.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `text` | `string` | `''` | Mensaje del tooltip |
+| `position` | `'top' \| 'bottom' \| 'left' \| 'right'` | `'top'` | Posición |
+| `maxWidth` | `string` | `'280px'` | Ancho máximo |
+
+**Ejemplo React**
+```tsx
+<DropiTooltip text="Guardar cambios" position="bottom">
+  <DropiButton text="Hover me" />
+</DropiTooltip>
+```
+
+---
+
+### `<dropi-modal>`
+
+Ventana de diálogo con overlays.
+
+**Props**
+
+| Prop | Tipo | Default | Descripción |
+|---|---|---|---|
+| `header` | `string` | `''` | Título del modal |
+| `size` | `'s' \| 'm' \| 'l' \| 'full' ...` | `'m'` | Tamaño |
+| `visible` | `boolean` | `false` | Controlar visibilidad vía prop |
+
+**Ejemplo React (Imperativo)**
+```tsx
+const modalRef = useRef<any>(null);
+const Modal = DropiModal as any;
+
+<Modal ref={modalRef} header="Mi Modal">
+  <p>Contenido</p>
+  <div slot="footer">
+     <DropiButton text="Cerrar" onDropiClick={() => modalRef.current.hide()} />
+  </div>
+</Modal>
+```
+
+---
+
+### `<dropi-toast>`
+
+Notificaciones tipo push con animaciones Lottie.
+
+**Mapeo de Severidad a Lottie:**
+- `success` -> `success.json`
+- `error` -> `failure.json`
+- `warn` -> `warning.json`
+- `info` -> `question.json`
+
+**Ejemplo React**
+```tsx
+const toastRef = useRef<any>(null);
+const Toast = DropiToast as any;
+ 
+<Toast ref={toastRef} position="top-right" />
+ 
+<button onClick={() => toastRef.current.show({ 
+  severity: 'success', 
+  summary: '¡Éxito!', 
+  detail: 'Usuario creado.' 
+})}>
+  Lanzar Toast
+</button>
+```
+
+---
+
 ## Build (desarrollo)
 
 ```bash

package/scripts/setup.js

@@ -115,31 +115,60 @@ async function run() {
     }
   }
 
-  // 5. Iconos (Symlink)
+  // 5. Iconos y Lottie (Symlink/Copia de assets)
   const publicDir = isAngular ? 'src/assets' : 'public';
-  const iconDestDir = path.join(projectRoot, publicDir, 'assets', 'icons', 'symbol', 'svg');
-  const spriteName = 'sprite.css.svg';
-  const spriteDest = path.join(iconDestDir, spriteName);
   
-  // Encontrar origen del sprite dentro de node_modules
-  const spriteSrc = path.join(projectRoot, 'node_modules', '@dropi/ui', 'assets', 'icons', 'symbol', 'svg', spriteName);
+  const setupAsset = (srcRelativePath, destRelativePath) => {
+    const src = path.join(projectRoot, 'node_modules', '@dropi/ui', srcRelativePath);
+    const dest = path.join(projectRoot, publicDir, destRelativePath);
+    const destDir = path.dirname(dest);
+
+    if (fs.existsSync(src)) {
+      if (!fs.existsSync(destDir)) fs.mkdirSync(destDir, { recursive: true });
+      try {
+        if (fs.existsSync(dest)) {
+          // Si es un directorio y existe, no hacemos symlink directo, pero aquí tratamos archivos o carpetas simples
+          if (fs.lstatSync(dest).isSymbolicLink() || fs.existsSync(dest)) fs.unlinkSync(dest);
+        }
+        fs.symlinkSync(src, dest, fs.lstatSync(src).isDirectory() ? 'dir' : 'file');
+        log(`Assets configurados: ${destRelativePath} (Symlink ✅)`, 'ok');
+      } catch (e) {
+        // Fallback a copia recursiva
+        if (fs.lstatSync(src).isDirectory()) {
+          fs.cpSync ? fs.cpSync(src, dest, { recursive: true }) : execSync(`cp -R "${src}" "${dest}"`);
+        } else {
+          fs.copyFileSync(src, dest);
+        }
+        log(`Assets copiados: ${destRelativePath} (Copia ✅)`, 'ok');
+      }
+    }
+  };
 
-  if (fs.existsSync(spriteSrc)) {
-    if (!fs.existsSync(iconDestDir)) fs.mkdirSync(iconDestDir, { recursive: true });
-    
-    try {
-      if (fs.existsSync(spriteDest)) fs.unlinkSync(spriteDest);
-      // Usar symlink para mantenerlo actualizado
-      fs.symlinkSync(spriteSrc, spriteDest, 'file');
-      log(`Portal de iconos configurado en ${publicDir}/assets/... (Symlink ✅)`, 'ok');
-    } catch (e) {
-      // Fallback a copia si falla el symlink (ej. en Windows sin permisos)
-      fs.copyFileSync(spriteSrc, spriteDest);
-      log(`Sprite de iconos copiado a ${publicDir}/assets/... (Copia ✅)`, 'ok');
+  // Sprite de iconos
+  setupAsset('assets/icons/symbol/svg/sprite.css.svg', 'assets/icons/symbol/svg/sprite.css.svg');
+  // Archivos Lottie
+  setupAsset('assets/lottie-files', 'assets/lottie-files');
+
+  // 6. Lottie Player Script (index.html)
+  const lottieScript = '<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>';
+  const htmlFiles = ['index.html', 'src/index.html', 'public/index.html'];
+  const htmlFile = htmlFiles.find(f => fs.existsSync(path.join(projectRoot, f)));
+  
+  if (htmlFile) {
+    const htmlPath = path.join(projectRoot, htmlFile);
+    let content = fs.readFileSync(htmlPath, 'utf8');
+    if (!content.includes('lottie-player.js')) {
+      if (content.includes('</body>')) {
+        content = content.replace('</body>', `  ${lottieScript}\n</body>`);
+      } else {
+        content += `\n${lottieScript}`;
+      }
+      fs.writeFileSync(htmlPath, content);
+      log(`Lottie: Script agregado a ${htmlFile}`, 'ok');
     }
   }
 
-  // 6. Vite Patch (optimizeDeps)
+  // 7. Vite Patch (optimizeDeps)
   const viteFiles = ['vite.config.ts', 'vite.config.js'];
   const viteFile = viteFiles.find(f => fs.existsSync(path.join(projectRoot, f)));
   if (viteFile) {

package/dist/dropi-ui/p-21abf91a.entry.js

@@ -1 +0,0 @@
-import{r,c as a,h as o}from"./p-DFz-gwFP.js";const e=class{constructor(o){r(this,o),this.dropiClick=a(this,"dropiClick")}type="default";severity="primary";size="normal";state="default";preIcon="";postIcon="";text="";dropiClick;colorMap={default:"Primary-Primary-",success:"Success-Success-",error:"Error-Error-",info:"Info-Info-",legacy:"Secondary-Secondary-",warning:"Warning-Warning-",dropdown:"Gray-Gray-"};get iconSize(){return"large"===this.size?"24px":"small"===this.size?"16px":"18px"}get color(){return(this.colorMap[this.type]??"Primary-Primary-")+("disabled"===this.state?"300":"500")}get fontColor(){return"tertiary"===this.severity?"default"===this.type||"legacy"===this.type?"Gray-Gray-500":this.color:"secondary"===this.severity?this.color:"Neutral-White"}handleClick(r){"disabled"!==this.state&&"loading"!==this.state&&this.dropiClick.emit(r)}renderLoadingSpinner(){return o("svg",{class:"spin",width:this.iconSize,height:this.iconSize,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},o("path",{d:"M22.8 12C23.4627 12 24.0062 11.4614 23.9401 10.802C23.8232 9.6371 23.5362 8.49339 23.0866 7.4078C22.4835 5.95189 21.5996 4.62902 20.4853 3.51472C19.371 2.40042 18.0481 1.5165 16.5922 0.913445C15.5066 0.463778 14.3629 0.17683 13.198 0.0599502C12.5386 -0.00621439 12 0.537258 12 1.2C12 1.86274 12.5393 2.39227 13.1969 2.4749C14.0463 2.58164 14.8795 2.80176 15.6738 3.13076C16.8385 3.6132 17.8968 4.32033 18.7882 5.21177C19.6797 6.10322 20.3868 7.16151 20.8692 8.32624C21.1982 9.12051 21.4184 9.95367 21.5251 10.8031C21.6077 11.4607 22.1373 12 22.8 12Z",fill:`var(--${this.fontColor})`}))}render(){const r="disabled"===this.state||"loading"===this.state,a=""!==this.text,e=""!==this.postIcon||"dropdown"===this.type,n="dropdown"===this.type?"Dropdown-down":this.postIcon;return o("button",{key:"6cde7f2616d1cff9e3304481f2a0c38aabc34192",class:{btn:!0,"without-text":!a,[this.severity]:!0,[this.type]:!0,[this.size]:!0,[this.state]:!0},disabled:r,onClick:r=>this.handleClick(r)},this.preIcon&&o("dropi-icon",{key:"769cea8fce2947552462aa2cbbb09d64df952c76",name:this.preIcon,width:this.iconSize,height:this.iconSize,color:this.fontColor}),a&&o("span",{key:"f66ad80283d54f643cf37ea702145127b90d4ce4",class:"text"},this.text),e&&o("dropi-icon",{key:"4fd9c7d7d029c3316bc0492576cda0cca74fa460",name:n,width:this.iconSize,height:this.iconSize,color:this.fontColor}),"loading"===this.state&&this.renderLoadingSpinner(),o("slot",{key:"3280c56a28ea40016d35e186b9997635b8ba881b"}))}};e.style=":host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);border-radius:var(--Border-2, 8px);font-weight:700;min-width:33px;line-height:110%;cursor:pointer;white-space:nowrap;transition:background 0.25s ease,     color 0.25s ease,     border-color 0.25s ease,     transform 0.25s ease}.btn:active{transition:transform 0.01s ease-out;transform:scale(0.98)}.btn:hover:not(:active){transform:scale(1.01)}.btn.without-text{gap:0}.btn.large{padding:var(--Size-4, 16px);font-size:var(--Size-4, 16px);height:48px}.btn.normal{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);height:40px}.btn.small{padding:var(--Size-2, 8px);font-size:var(--Size-3, 12px);height:29px}.btn.disabled,.btn.loading{cursor:not-allowed;pointer-events:none}.btn.primary.default{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #fff)}.btn.primary.default:hover{background:var(--Primary-Primary-600, #e58017)}.btn.primary.success{background:var(--Success-Success-500, #0abb87);color:var(--Neutral-White, #fff)}.btn.primary.success:hover{background:var(--Success-Success-600, #09aa7b)}.btn.primary.info{background:var(--Info-Info-500, #50a5f1);color:var(--Neutral-White, #fff)}.btn.primary.info:hover{background:var(--Info-Info-600, #4996db)}.btn.primary.error{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #fff)}.btn.primary.error:hover{background:var(--Error-Error-600, #de6061)}.btn.primary.warning{background:var(--Warning-Warning-500, #f1b44c);color:var(--Neutral-White, #fff)}.btn.primary.warning:hover{background:var(--Warning-Warning-600, #dba445)}.btn.primary.legacy{background:var(--Secondary-Secondary-500, #008dbf);color:var(--Neutral-White, #fff)}.btn.primary.legacy:hover{background:var(--Secondary-Secondary-600, #007199)}.btn.primary.disabled.default{background:var(--Primary-Primary-300, #f2bc85);color:var(--Neutral-White, #fff)}.btn.primary.disabled.success{background:var(--Success-Success-300, #5bd1af);color:var(--Neutral-White, #fff)}.btn.primary.disabled.info{background:var(--Info-Info-300, #8ac3f6);color:var(--Neutral-White, #fff)}.btn.primary.disabled.error{background:var(--Error-Error-300, #f89b9c);color:var(--Neutral-White, #fff)}.btn.primary.disabled.warning{background:var(--Warning-Warning-300, #f6cd87);color:var(--Neutral-White, #fff)}.btn.primary.disabled.legacy{background:var(--Secondary-Secondary-300, #62bad9);color:var(--Neutral-White, #fff)}.btn.secondary{background:var(--Neutral-White, #fff);border:1px solid}.btn.secondary.default{border-color:var(--Primary-Primary-500, #f49a3d);color:var(--Primary-Primary-500, #f49a3d)}.btn.secondary.default:hover{color:var(--Primary-Primary-600, #e58017);border-color:var(--Primary-Primary-600, #e58017)}.btn.secondary.success{border-color:var(--Success-Success-500, #0abb87);color:var(--Success-Success-500, #0abb87)}.btn.secondary.success:hover{color:var(--Success-Success-600, #09aa7b);border-color:var(--Success-Success-600, #09aa7b)}.btn.secondary.info{border-color:var(--Info-Info-500, #50a5f1);color:var(--Info-Info-500, #50a5f1)}.btn.secondary.info:hover{color:var(--Info-Info-600, #4996db);border-color:var(--Info-Info-600, #4996db)}.btn.secondary.error{border-color:var(--Error-Error-500, #f46a6b);color:var(--Error-Error-500, #f46a6b)}.btn.secondary.error:hover{color:var(--Error-Error-600, #de6061);border-color:var(--Error-Error-600, #de6061)}.btn.secondary.warning{border-color:var(--Warning-Warning-500, #f1b44c);color:var(--Warning-Warning-500, #f1b44c)}.btn.secondary.warning:hover{color:var(--Warning-Warning-600, #dba445);border-color:var(--Warning-Warning-600, #dba445)}.btn.secondary.legacy{border-color:var(--Secondary-Secondary-500, #008dbf);color:var(--Secondary-Secondary-500, #008dbf)}.btn.secondary.legacy:hover{color:var(--Secondary-Secondary-600, #007199);border-color:var(--Secondary-Secondary-600, #007199)}.btn.secondary.disabled.default{border-color:var(--Primary-Primary-300, #f2bc85);color:var(--Primary-Primary-300, #f2bc85)}.btn.secondary.disabled.success{border-color:var(--Success-Success-300, #5bd1af);color:var(--Success-Success-300, #5bd1af)}.btn.secondary.disabled.info{border-color:var(--Info-Info-300, #8ac3f6);color:var(--Info-Info-300, #8ac3f6)}.btn.secondary.disabled.error{border-color:var(--Error-Error-300, #f89b9c);color:var(--Error-Error-300, #f89b9c)}.btn.secondary.disabled.warning{border-color:var(--Warning-Warning-300, #f6cd87);color:var(--Warning-Warning-300, #f6cd87)}.btn.secondary.disabled.legacy{border-color:var(--Secondary-Secondary-300, #62bad9);color:var(--Secondary-Secondary-300, #62bad9)}.btn.tertiary{background:none;border:none}.btn.tertiary.default,.btn.tertiary.legacy{border:1px solid var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-500, #69738c)}.btn.tertiary.default:hover,.btn.tertiary.legacy:hover{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.btn.tertiary.success{color:var(--Success-Success-500, #0abb87)}.btn.tertiary.success:hover{background:var(--Success-Success-50, #e7f8f3)}.btn.tertiary.info{color:var(--Info-Info-500, #50a5f1)}.btn.tertiary.info:hover{background:var(--Info-Info-50, #eef6fe)}.btn.tertiary.error{color:var(--Error-Error-500, #f46a6b)}.btn.tertiary.error:hover{background:var(--Error-Error-50, #fef0f0)}.btn.tertiary.warning{color:var(--Warning-Warning-500, #f1b44c)}.btn.tertiary.warning:hover{background:var(--Warning-Warning-50, #fef8ed)}.btn.tertiary.dropdown{color:var(--Gray-Gray-500, #69738c);font-weight:400;font-size:14px;background:transparent}.btn.tertiary.disabled.default,.btn.tertiary.disabled.legacy{border:1px solid var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6)}.btn.tertiary.disabled.success{color:var(--Success-Success-300, #5bd1af)}.btn.tertiary.disabled.info{color:var(--Info-Info-300, #8ac3f6)}.btn.tertiary.disabled.error{color:var(--Error-Error-300, #f89b9c)}.btn.tertiary.disabled.warning{color:var(--Warning-Warning-300, #f6cd87)}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}";export{e as dropi_button}

package/dist/dropi-ui/p-6f0aa619.entry.js

@@ -1 +0,0 @@
-import{r as t,a as r,h as e}from"./p-DFz-gwFP.js";const i=class{constructor(r){t(this,r)}get el(){return r(this)}name="";width="24px";height="24px";color="currentColor";colorChanged(){this.applyColor()}componentDidLoad(){this.applyColor()}applyColor(){const t=this.color.startsWith("#")?this.color:"currentColor"===this.color?"currentColor":`var(--${this.color})`;this.el.style.setProperty("--icon-fill",t)}render(){return e("svg",{key:"e71bfb0be9f68882bbd7314d0f6f3fd877fccf07",width:this.width,height:this.height,class:{spin:"Spinner"===this.name},"aria-hidden":"true"},e("use",{key:"e6905c3ba9c68f463db62cde2cd64ce51093c2c0",href:`/assets/icons/symbol/svg/sprite.css.svg#${this.name}`}))}static get watchers(){return{color:[{colorChanged:0}]}}};i.style=":host{display:inline-flex;align-items:center;justify-content:center;fill:var(--icon-fill, currentColor)}svg{fill:inherit}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}";export{i as dropi_icon}

package/dist/dropi-ui/p-DFz-gwFP.js

@@ -1,2 +0,0 @@
-const e=()=>{},n=":root{--Primary-Primary-50:#fef8f2;--Primary-Primary-100:#ffecda;--Primary-Primary-200:#fcddbd;--Primary-Primary-300:#f2bc85;--Primary-Primary-400:#f7b46f;--Primary-Primary-500:#f49a3d;--Primary-Primary-600:#e58017;--Primary-Primary-700:#99540f;--Primary-Primary-800:#66380a;--Primary-Primary-900:#331c05;--Secondary-Secondary-50:#f0fafc;--Secondary-Secondary-100:#cee8f2;--Secondary-Secondary-200:#95d0e5;--Secondary-Secondary-300:#62bad9;--Secondary-Secondary-400:#33a4cc;--Secondary-Secondary-500:#008dbf;--Secondary-Secondary-600:#007199;--Secondary-Secondary-700:#005573;--Secondary-Secondary-800:#00384d;--Secondary-Secondary-900:#001c26;--Neutral-White:#ffffff;--Neutral-Black:#000000;--Gray-Gray-50:#f7f8fa;--Gray-Gray-100:#e6eaf2;--Gray-Gray-200:#c3c9d9;--Gray-Gray-300:#a3abbf;--Gray-Gray-400:#858ea6;--Gray-Gray-500:#69738c;--Gray-Gray-600:#475066;--Gray-Gray-700:#32394d;--Gray-Gray-800:#1f2433;--Gray-Gray-900:#0e111a;--Success-Success-50:#e7f8f3;--Success-Success-100:#b3eada;--Success-Success-200:#8ee0c8;--Success-Success-300:#5bd1af;--Success-Success-400:#3bc99f;--Success-Success-500:#0abb87;--Success-Success-600:#09aa7b;--Success-Success-700:#078560;--Success-Success-800:#06674a;--Success-Success-900:#044f39;--Error-Error-50:#fef0f0;--Error-Error-100:#fcd1d1;--Error-Error-200:#fababb;--Error-Error-300:#f89b9c;--Error-Error-400:#f68889;--Error-Error-500:#f46a6b;--Error-Error-600:#de6061;--Error-Error-700:#ad4b4c;--Error-Error-800:#863a3b;--Error-Error-900:#662d2d;--Info-Info-50:#eef6fe;--Info-Info-100:#c9e3fb;--Info-Info-200:#afd6f9;--Info-Info-300:#8ac3f6;--Info-Info-400:#73b7f4;--Info-Info-500:#50a5f1;--Info-Info-600:#4996db;--Info-Info-700:#3975ab;--Info-Info-800:#2c5b85;--Info-Info-900:#224565;--Warning-Warning-50:#fef8ed;--Warning-Warning-100:#fbe8c8;--Warning-Warning-200:#f9ddad;--Warning-Warning-300:#f6cd87;--Warning-Warning-400:#f4c370;--Warning-Warning-500:#f1b44c;--Warning-Warning-600:#dba445;--Warning-Warning-700:#ab8036;--Warning-Warning-800:#85632a;--Warning-Warning-900:#654c20;--Orange-orange-50:#fef5ec;--Orange-orange-500:#f49a3d;--Size-1:4px;--Size-2:8px;--Size-3:12px;--Size-4:16px;--Size-5:24px;--Size-6:32px;--Size-7:40px;--Size-8:48px;--Size-9:56px;--Size-10:64px;--Border-1:4px;--Border-2:8px;--Border-3:12px;--Border-4:24px;--Border-5:32px;--Border-full:9999px;--font-size-xxxxl:36px;--font-size-xxxl:30px;--font-size-xxl:24px;--font-size-xl:20px;--font-size-l:18px;--font-size-m:16px;--font-size-s:14px;--font-size-xs:12px;--font-size-xxs:10px;--lineheight-simple:110%;--lineheight-large:150%;--font-weight-bold:700;--font-weight-semibold:600;--font-weight-medium:500;--font-weight-regular:400;--font-weight-light:300;--font-family-01:'Inter', sans-serif;--breakpoint-extra-small:576px;--breakpoint-small:600px;--breakpoint-medium:1000px;--breakpoint-large:1200px;--breakpoint-extra-large:1536px;--breakpoint-full-width:1920px;--Shadow-small:0px 0px 12px rgba(0, 0, 0, 0.04);--Shadow-medium:0.5px 4px 8px rgba(0, 0, 0, 0.08);--Shadow-large:0px 4px 16px rgba(0, 0, 0, 0.16);--Shadow-icon:0px 0px 4px rgba(0, 0, 0, 0.16);--Interrapidisimo:#383637;--Domina:#464ffe;--Coordinadora:#2686c5;--Servientrega:#1ba558;--99-minutos:#9cd453;--TCC:#f8dd49;--Veloces:#dc2e76;--Envia:#e7484e;--Restlogix:#90dd92;--Tiui:#0596a5;--Fedex:#4d148c;--Laarcourier:#faf063;--Gintracom:#ff3939;--Blue-express:#1542a3;--Lulu:#f03a3e;--Urbano:#e53237;--Tipsa:#1d3681}@media (max-width: 600px){:root{--font-size-xxxxl:32px;--font-size-xxxl:26px;--font-size-xxl:20px;--font-size-xl:18px;--font-size-l:16px;--font-size-m:16px;--font-size-s:14px;--font-size-xs:12px;--font-size-xxs:10px}}*{font-family:var(--font-family-01);box-sizing:border-box}h1{color:var(--Gray-Gray-700);font-size:var(--font-size-xxxxl);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}h2{color:var(--Gray-Gray-700);font-size:var(--font-size-xxxl);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}h3{color:var(--Gray-Gray-700);font-size:var(--font-size-xxl);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}h4{color:var(--Gray-Gray-700);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}h5{color:var(--Gray-Gray-700);font-size:var(--font-size-l);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}.Body-L-Medium{color:var(--Gray-Gray-700);font-size:var(--font-size-m);font-weight:var(--font-weight-medium);line-height:var(--lineheight-large)}.Body-L-Regular{color:var(--Gray-Gray-600);font-size:var(--font-size-m);font-weight:var(--font-weight-regular);line-height:var(--lineheight-large)}.Body-M-Medium{color:var(--Gray-Gray-700);font-size:var(--font-size-s);font-weight:var(--font-weight-medium);line-height:var(--lineheight-large)}.Body-M-Regular{color:var(--Gray-Gray-600);font-size:var(--font-size-s);font-weight:var(--font-weight-regular);line-height:var(--lineheight-large)}.Body-S-Medium{color:var(--Gray-Gray-700);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:var(--lineheight-large)}.Body-S-Regular{color:var(--Gray-Gray-600);font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);line-height:var(--lineheight-large)}.Caption-M{color:var(--Gray-Gray-700);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}.Caption-S{color:var(--Gray-Gray-700);font-size:var(--font-size-xxs);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}.Label-L{color:var(--Gray-Gray-700);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}.Label-M{color:var(--Gray-Gray-700);font-size:var(--font-size-s);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}.Label-S{color:var(--Gray-Gray-700);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple)}";function t(e,n,t){const r="undefined"!=typeof HTMLElement?HTMLElement.prototype:null;for(;e&&e!==r;){const r=Object.getOwnPropertyDescriptor(e,n);if(r&&(!t||r.get))return r;e=Object.getPrototypeOf(e)}}var r,o=(e,n)=>{var r;Object.entries(null!=(r=n.o.t)?r:{}).map((([r,[o]])=>{if(31&o||32&o){const o=e[r],i=t(Object.getPrototypeOf(e),r,!0)||Object.getOwnPropertyDescriptor(e,r);i&&Object.defineProperty(e,r,{get(){return i.get.call(this)},set(e){i.set.call(this,e)},configurable:!0,enumerable:!0}),n.i.has(r)?e[r]=n.i.get(r):void 0!==o&&(e[r]=o)}}))},i=e=>{if(e.__stencil__getHostRef)return e.__stencil__getHostRef()},l=(e,n)=>{n&&(e.__stencil__getHostRef=()=>n,n.l=e,512&n.o.u&&o(e,n))},a=(e,n)=>n in e,s=(e,n)=>(0,console.error)(e,n),c=new Map,f=new Map,u=["formAssociatedCallback","formResetCallback","formDisabledCallback","formStateRestoreCallback"],d="undefined"!=typeof window?window:{},h={u:0,h:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,n,t,r)=>e.addEventListener(n,t,r),rel:(e,n,t,r)=>e.removeEventListener(n,t,r),ce:(e,n)=>new CustomEvent(e,n)},p=e=>Promise.resolve(e),y=(()=>{try{return!!d.document.adoptedStyleSheets&&(new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync)}catch(e){}return!1})(),g=!!y&&(()=>!!d.document&&Object.getOwnPropertyDescriptor(d.document.adoptedStyleSheets,"length").writable)(),v=!1,m=[],b=[],x=(e,n)=>t=>{e.push(t),v||(v=!0,n&&4&h.u?z(S):h.raf(S))},w=e=>{for(let n=0;n<e.length;n++)try{e[n](performance.now())}catch(e){s(e)}e.length=0},S=()=>{w(m),w(b),(v=m.length>0)&&h.raf(S)},z=e=>p().then(e),G=x(b,!0);function $(){var e;const t=this.attachShadow({mode:"open"});if(void 0===r&&(r=null!=(e=function(e){if(!y)return;const n=new CSSStyleSheet;return n.replaceSync(e),n}(n))?e:null),r)g?t.adoptedStyleSheets.push(r):t.adoptedStyleSheets=[...t.adoptedStyleSheets,r];else if(!y){const e=document.createElement("style");e.innerHTML=n,t.prepend(e)}}function E(e){var n,t,r;return null!=(r=null==(t=null==(n=e.head)?void 0:n.querySelector('meta[name="csp-nonce"]'))?void 0:t.getAttribute("content"))?r:void 0}var j,O=new WeakMap,P=e=>"sc-"+e.p,k=e=>"object"==(e=typeof e)||"function"===e,W=(e,n,...t)=>{let r=null,o=null,i=!1,l=!1;const a=[],s=n=>{for(let t=0;t<n.length;t++)r=n[t],Array.isArray(r)?s(r):null!=r&&"boolean"!=typeof r&&((i="function"!=typeof e&&!k(r))&&(r+=""),i&&l?a[a.length-1].v+=r:a.push(i?C(null,r):r),l=i)};if(s(t),n){n.key&&(o=n.key);{const e=n.className||n.class;e&&(n.class="object"!=typeof e?e:Object.keys(e).filter((n=>e[n])).join(" "))}}const c=C(e,null);return c.m=n,a.length>0&&(c.S=a),c.G=o,c},C=(e,n)=>({u:0,$:e,v:null!=n?n:null,j:null,S:null,m:null,G:null}),I={},M=(e,n,t)=>null==e||k(e)?e:4&n?(t&&"string"==typeof e||"false"!==e)&&(""===e||!!e):2&n?"string"==typeof e?parseFloat(e):"number"==typeof e?e:NaN:1&n?e+"":e,L=e=>{var n;return null==(n=i(e))?void 0:n.$hostElement$},B=(e,n)=>{const t=L(e);return{emit:e=>R(t,n,{bubbles:!0,composed:!0,cancelable:!0,detail:e})}},R=(e,n,t)=>{const r=h.ce(n,t);return e.dispatchEvent(r),r},N=(e,n,t,r,o,l)=>{if(t===r)return;let s=a(e,n),c=n.toLowerCase();if("class"===n){const n=e.classList,o=A(t);let i=A(r);n.remove(...o.filter((e=>e&&!i.includes(e)))),n.add(...i.filter((e=>e&&!o.includes(e))))}else if("style"===n){for(const n in t)r&&null!=r[n]||(n.includes("-")?e.style.removeProperty(n):e.style[n]="");for(const n in r)t&&r[n]===t[n]||(n.includes("-")?e.style.setProperty(n,r[n]):e.style[n]=r[n])}else if("key"===n);else if("ref"===n)r&&ne(r,e);else if(s||"o"!==n[0]||"n"!==n[1]){if("a"===n[0]&&n.startsWith("attr:")){const t=n.slice(5);let o;{const n=i(e);if(n&&n.o&&n.o.t){const e=n.o.t[t];e&&e[1]&&(o=e[1])}}return o||(o=t.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()),void(null==r||!1===r?!1===r&&""!==e.getAttribute(o)||e.removeAttribute(o):e.setAttribute(o,!0===r?"":r))}if("p"===n[0]&&n.startsWith("prop:")){const t=n.slice(5);try{e[t]=r}catch(e){}return}{const i=k(r);if((s||i&&null!==r)&&!o)try{if(e.tagName.includes("-"))e[n]!==r&&(e[n]=r);else{const o=null==r?"":r;"list"===n?s=!1:null!=t&&e[n]===o||("function"==typeof e.__lookupSetter__(n)?e[n]=o:e.setAttribute(n,o))}}catch(e){}null==r||!1===r?!1===r&&""!==e.getAttribute(n)||e.removeAttribute(n):(!s||4&l||o)&&!i&&1===e.nodeType&&e.setAttribute(n,r=!0===r?"":r)}}else if(n="-"===n[2]?n.slice(3):a(d,c)?c.slice(2):c[2]+n.slice(3),t||r){const o=n.endsWith(D);n=n.replace(U,""),t&&h.rel(e,n,t,o),r&&h.ael(e,n,r,o)}},T=/\s/,A=e=>("object"==typeof e&&e&&"baseVal"in e&&(e=e.baseVal),e&&"string"==typeof e?e.split(T):[]),D="Capture",U=RegExp(D+"$"),H=(e,n,t)=>{const r=11===n.j.nodeType&&n.j.host?n.j.host:n.j,o=e&&e.m||{},i=n.m||{};for(const e of F(Object.keys(o)))e in i||N(r,e,o[e],void 0,t,n.u);for(const e of F(Object.keys(i)))N(r,e,o[e],i[e],t,n.u)};function F(e){return e.includes("ref")?[...e.filter((e=>"ref"!==e)),"ref"]:e}var V=!1,q=!1,Y=[],Z=[],_=(e,n,t)=>{const r=n.S[t];let o,i,l=0;if(null!=r.v)o=r.j=d.document.createTextNode(r.v);else{if(q||(q="svg"===r.$),!d.document)throw Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");if(o=r.j=d.document.createElementNS(q?"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",r.$),q&&"foreignObject"===r.$&&(q=!1),H(null,r,q),r.S){const n="template"===r.$?o.content:o;for(l=0;l<r.S.length;++l)i=_(e,r,l),i&&n.appendChild(i)}"svg"===r.$?q=!1:"foreignObject"===o.tagName&&(q=!0)}return o["s-hn"]=j,o},J=(e,n,t,r,o,i)=>{let l,a=e;for(a.shadowRoot&&a.tagName===j&&(a=a.shadowRoot),"template"===t.$&&(a=a.content);o<=i;++o)r[o]&&(l=_(null,t,o),l&&(r[o].j=l,te(a,l,n)))},K=(e,n,t)=>{for(let r=n;r<=t;++r){const n=e[r];if(n){const e=n.j;ee(n),e&&e.remove()}}},Q=(e,n,t=!1)=>e.$===n.$&&(t?(t&&!e.G&&n.G&&(e.G=n.G),!0):e.G===n.G),X=(e,n,t=!1)=>{const r=n.j=e.j,o=e.S,i=n.S,l=n.$,a=n.v;null==a?(q="svg"===l||"foreignObject"!==l&&q,"slot"!==l||V||e.O!==n.O&&(n.j["s-sn"]=n.O||"",(e=>{h.u|=1;const n=e.closest(j.toLowerCase());if(null!=n){const t=Array.from(n.__childNodes||n.childNodes).find((e=>e["s-cr"])),r=Array.from(e.__childNodes||e.childNodes);for(const e of t?r.reverse():r)null!=e["s-sh"]&&(te(n,e,null!=t?t:null),e["s-sh"]=void 0)}h.u&=-2})(n.j.parentElement)),H(e,n,q),null!==o&&null!==i?((e,n,t,r,o=!1)=>{let i,l,a=0,s=0,c=0,f=0,u=n.length-1,d=n[0],h=n[u],p=r.length-1,y=r[0],g=r[p];const v="template"===t.$?e.content:e;for(;a<=u&&s<=p;)if(null==d)d=n[++a];else if(null==h)h=n[--u];else if(null==y)y=r[++s];else if(null==g)g=r[--p];else if(Q(d,y,o))X(d,y,o),d=n[++a],y=r[++s];else if(Q(h,g,o))X(h,g,o),h=n[--u],g=r[--p];else if(Q(d,g,o))X(d,g,o),te(v,d.j,h.j.nextSibling),d=n[++a],g=r[--p];else if(Q(h,y,o))X(h,y,o),te(v,h.j,d.j),h=n[--u],y=r[++s];else{for(c=-1,f=a;f<=u;++f)if(n[f]&&null!==n[f].G&&n[f].G===y.G){c=f;break}c>=0?(l=n[c],l.$!==y.$?i=_(n&&n[s],t,c):(X(l,y,o),n[c]=void 0,i=l.j),y=r[++s]):(i=_(n&&n[s],t,s),y=r[++s]),i&&te(d.j.parentNode,i,d.j)}a>u?J(e,null==r[p+1]?null:r[p+1].j,t,r,s,p):s>p&&K(n,a,u)})(r,o,n,i,t):null!==i?(null!==e.v&&(r.textContent=""),J(r,null,n,i,0,i.length-1)):!t&&null!==o&&K(o,0,o.length-1),q&&"svg"===l&&(q=!1)):e.v!==a&&(r.data=a)},ee=e=>{e.m&&e.m.ref&&Y.push((()=>e.m.ref(null))),e.S&&e.S.map(ee)},ne=(e,n)=>{Z.push((()=>e(n)))},te=(e,n,t)=>e.__insertBefore?e.__insertBefore(n,t):null==e?void 0:e.insertBefore(n,t),re=(e,n)=>{if(n&&!e.P&&n["s-p"]){const t=n["s-p"].push(new Promise((r=>e.P=()=>{n["s-p"].splice(t-1,1),r()})))}},oe=(e,n)=>{if(e.u|=16,4&e.u)return void(e.u|=512);re(e,e.k);const t=()=>ie(e,n);if(!n)return G(t);queueMicrotask((()=>{t()}))},ie=(e,n)=>{const t=e.$hostElement$,r=e.l;if(!r)throw Error(`Can't render component <${t.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let o;return n?(e.u|=256,e.W&&(e.W.map((([e,n])=>de(r,e,n,t))),e.W=void 0),e.C.length&&e.C.forEach((e=>e(t))),o=de(r,"componentWillLoad",void 0,t)):o=de(r,"componentWillUpdate",void 0,t),o=le(o,(()=>de(r,"componentWillRender",void 0,t))),le(o,(()=>se(e,r,n)))},le=(e,n)=>ae(e)?e.then(n).catch((e=>{console.error(e),n()})):n(),ae=e=>e instanceof Promise||e&&e.then&&"function"==typeof e.then,se=async(e,n,t)=>{var r;const o=e.$hostElement$,i=o["s-rc"];t&&(e=>{const n=e.o,t=e.$hostElement$,r=n.u,o=((e,n)=>{var t,r,o;const i=P(n),l=f.get(i);if(!d.document)return i;if(e=11===e.nodeType?e:d.document,l)if("string"==typeof l){let o,a=O.get(e=e.head||e);if(a||O.set(e,a=new Set),!a.has(i)){o=d.document.createElement("style"),o.textContent=l;const s=null!=(t=h.I)?t:E(d.document);if(null!=s&&o.setAttribute("nonce",s),!(1&n.u))if("HEAD"===e.nodeName){const n=e.querySelectorAll("link[rel=preconnect]"),t=n.length>0?n[n.length-1].nextSibling:e.querySelector("style");e.insertBefore(o,(null==t?void 0:t.parentNode)===e?t:null)}else if("host"in e)if(y){const n=new(null!=(r=e.defaultView)?r:e.ownerDocument.defaultView).CSSStyleSheet;n.replaceSync(l),g?e.adoptedStyleSheets.unshift(n):e.adoptedStyleSheets=[n,...e.adoptedStyleSheets]}else{const n=e.querySelector("style");n?n.textContent=l+n.textContent:e.prepend(o)}else e.append(o);1&n.u&&e.insertBefore(o,null),4&n.u&&(o.textContent+="slot-fb{display:contents}slot-fb[hidden]{display:none}"),a&&a.add(i)}}else{let n=O.get(e);if(n||O.set(e,n=new Set),!n.has(i)){const t=null!=(o=e.defaultView)?o:e.ownerDocument.defaultView;let r;if(l.constructor===t.CSSStyleSheet)r=l;else{r=new t.CSSStyleSheet;for(let e=0;e<l.cssRules.length;e++)r.insertRule(l.cssRules[e].cssText,e)}g?e.adoptedStyleSheets.push(r):e.adoptedStyleSheets=[...e.adoptedStyleSheets,r],n.add(i)}}return i})(t.shadowRoot?t.shadowRoot:t.getRootNode(),n);10&r&&(t["s-sc"]=o,t.classList.add(o+"-h"))})(e);ce(e,n,o,t),i&&(i.map((e=>e())),o["s-rc"]=void 0);{const n=null!=(r=o["s-p"])?r:[],t=()=>fe(e);0===n.length?t():(Promise.all(n).then(t).catch(t),e.u|=4,n.length=0)}},ce=(e,n,t,r)=>{try{n=n.render(),e.u&=-17,e.u|=2,((e,n,t=!1)=>{const r=e.$hostElement$,o=e.o,i=e.M||C(null,null),l=(e=>e&&e.$===I)(n)?n:W(null,null,n);if(j=r.tagName,o.L&&(l.m=l.m||{},o.L.forEach((([e,n])=>{l.m[n]=r[e]}))),t&&l.m)for(const e of Object.keys(l.m))r.hasAttribute(e)&&!["key","ref","style","class"].includes(e)&&(l.m[e]=r[e]);l.$=null,l.u|=4,e.M=l,l.j=i.j=r.shadowRoot||r,V=!(!(1&o.u)||128&o.u),X(i,l,t),Y.forEach((e=>e())),Y.length=0,Z.forEach((e=>e())),Z.length=0})(e,n,r)}catch(n){s(n,e.$hostElement$)}return null},fe=e=>{const n=e.$hostElement$,t=e.l,r=e.k;de(t,"componentDidRender",void 0,n),64&e.u?de(t,"componentDidUpdate",void 0,n):(e.u|=64,he(n),de(t,"componentDidLoad",void 0,n),e.B(n),r||ue()),e.R(n),e.P&&(e.P(),e.P=void 0),512&e.u&&z((()=>oe(e,!1))),e.u&=-517},ue=()=>{z((()=>R(d,"appload",{detail:{namespace:"dropi-ui"}})))},de=(e,n,t,r)=>{if(e&&e[n])try{return e[n](t)}catch(e){s(e,r)}},he=e=>e.classList.add("hydrated"),pe=(e,n,t,r)=>{const o=i(e);if(!o)return;if(!o)throw Error(`Couldn't find host element for "${r.p}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`);const l=o.$hostElement$,a=o.i.get(n),c=o.u,f=o.l;if(t=M(t,r.t[n][0],!!(64&r.u)),!(8&c&&void 0!==a||t===a||Number.isNaN(a)&&Number.isNaN(t))){if(o.i.set(n,t),r.N){const e=r.N[n];e&&e.map((e=>{try{const[[r,i]]=Object.entries(e);(128&c||1&i)&&(f?f[r](t,a,n):o.C.push((()=>{o.l[r](t,a,n)})))}catch(e){s(e,l)}}))}if(2&c){if(f.componentShouldUpdate&&!1===f.componentShouldUpdate(t,a,n)&&!(16&c))return;16&c||oe(o,!1)}}},ye=(e,n,r)=>{var o,l;const a=e.prototype;64&n.u&&1&r&&u.forEach((e=>{Object.defineProperty(a,e,{value(...n){var t;const r=i(this),o=null==r?void 0:r.l;if(o){const t=o[e];"function"==typeof t&&t.call(o,...n)}else null==(t=null==r?void 0:r.T)||t.then((t=>{const r=t[e];"function"==typeof r&&r.call(t,...n)}))}})}));{e.watchers&&!n.N&&(n.N=e.watchers),e.deserializers&&!n.A&&(n.A=e.deserializers),e.serializers&&!n.D&&(n.D=e.serializers);const s=Object.entries(null!=(o=n.t)?o:{});if(s.map((([e,[o]])=>{if(31&o||2&r&&32&o){const{get:l,set:s}=t(a,e)||{};l&&(n.t[e][0]|=2048),s&&(n.t[e][0]|=4096),(1&r||!l)&&Object.defineProperty(a,e,{get(){{if(!(2048&n.t[e][0]))return((e,n)=>i(this).i.get(n))(0,e);const t=i(this),r=t?t.l:a;if(!r)return;return r[e]}},configurable:!0,enumerable:!0}),Object.defineProperty(a,e,{set(t){const l=i(this);if(l){if(s)return void 0===(32&o?this[e]:l.$hostElement$[e])&&l.i.get(e)&&(t=l.i.get(e)),s.call(this,M(t,o,!!(64&n.u))),void pe(this,e,t=32&o?this[e]:l.$hostElement$[e],n);{if(!(1&r&&4096&n.t[e][0]))return pe(this,e,t,n),void(1&r&&!l.l&&l.C.push((()=>{4096&n.t[e][0]&&l.l[e]!==l.i.get(e)&&(l.l[e]=t)})));const i=()=>{const r=l.l[e];!l.i.get(e)&&r&&l.i.set(e,r),l.l[e]=M(t,o,!!(64&n.u)),pe(this,e,l.l[e],n)};l.l?i():l.C.push((()=>{i()}))}}}})}else 1&r&&64&o&&Object.defineProperty(a,e,{value(...n){var t;const r=i(this);return null==(t=null==r?void 0:r.U)?void 0:t.then((()=>{var t;return null==(t=r.l)?void 0:t[e](...n)}))}})})),1&r){const t=new Map;a.attributeChangedCallback=function(e,r,o){h.jmp((()=>{var l;const c=t.get(e),f=i(this);if(this.hasOwnProperty(c)&&(o=this[c],delete this[c]),a.hasOwnProperty(c)&&"number"==typeof this[c]&&this[c]==o)return;if(null==c){const t=null==f?void 0:f.u;if(f&&t&&!(8&t)&&o!==r){const i=f.l,a=null==(l=n.N)?void 0:l[e];null==a||a.forEach((n=>{const[[l,a]]=Object.entries(n);null!=i[l]&&(128&t||1&a)&&i[l].call(i,o,r,e)}))}return}const u=s.find((([e])=>e===c));u&&4&u[1][0]&&(o=null!==o&&"false"!==o);const d=Object.getOwnPropertyDescriptor(a,c);o==this[c]||d.get&&!d.set||(this[c]=o)}))},e.observedAttributes=Array.from(new Set([...Object.keys(null!=(l=n.N)?l:{}),...s.filter((([e,n])=>31&n[0])).map((([e,r])=>{var o;const i=r[1]||e;return t.set(i,e),512&r[0]&&(null==(o=n.L)||o.push([e,i])),i}))]))}}return e},ge=(e,n)=>{de(e,"connectedCallback",void 0,n)},ve=(e,n)=>{de(e,"disconnectedCallback",void 0,n||e)},me=(e,n={})=>{var t;if(!d.document)return void console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");const r=[],o=n.exclude||[],l=d.customElements,a=d.document.head,u=a.querySelector("meta[charset]"),p=d.document.createElement("style"),g=[];let v,m=!0;if(Object.assign(h,n),h.h=new URL(n.resourcesUrl||"./",d.document.baseURI).href,e.map((e=>{e[1].map((n=>{var t,a,u;const d={u:n[0],p:n[1],t:n[2],H:n[3]};d.t=n[2],d.H=n[3],d.L=[],d.N=null!=(t=n[4])?t:{},d.D=null!=(a=n[5])?a:{},d.A=null!=(u=n[6])?u:{};const p=d.p,b=class extends HTMLElement{"s-p";"s-rc";hasRegisteredEventListeners=!1;constructor(e){if(super(e),((e,n)=>{const t={u:0,$hostElement$:e,o:n,i:new Map,F:new Map};t.U=new Promise((e=>t.R=e)),t.T=new Promise((e=>t.B=e)),e["s-p"]=[],e["s-rc"]=[],t.C=[];const r=t;e.__stencil__getHostRef=()=>r})(e=this,d),1&d.u)if(e.shadowRoot){if("open"!==e.shadowRoot.mode)throw Error(`Unable to re-use existing shadow root for ${d.p}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else $.call(e,d)}connectedCallback(){const e=i(this);e&&(this.hasRegisteredEventListeners||(this.hasRegisteredEventListeners=!0,be(this,e,d.H)),v&&(clearTimeout(v),v=null),m?g.push(this):h.jmp((()=>(e=>{if(!(1&h.u)){const n=i(e);if(!n)return;const t=n.o,r=()=>{};if(1&n.u)be(e,n,t.H),(null==n?void 0:n.l)?ge(n.l,e):(null==n?void 0:n.T)&&n.T.then((()=>ge(n.l,e)));else{n.u|=1;{let t=e;for(;t=t.parentNode||t.host;)if(t["s-p"]){re(n,n.k=t);break}}t.t&&Object.entries(t.t).map((([n,[t]])=>{if(31&t&&Object.prototype.hasOwnProperty.call(e,n)){const t=e[n];delete e[n],e[n]=t}})),(async(e,n,t)=>{let r;try{if(!(32&n.u)){if(n.u|=32,t.V){const o=((e,n)=>{const t=e.p.replace(/-/g,"_"),r=e.V;if(!r)return;const o=c.get(r);return o?o[t]:import(`./${r}.entry.js`).then((e=>(c.set(r,e),e[t])),(e=>{s(e,n.$hostElement$)}))
-/*!__STENCIL_STATIC_IMPORT_SWITCH__*/})(t,n);if(o&&"then"in o){const e=()=>{};r=await o,e()}else r=o;if(!r)throw Error(`Constructor for "${t.p}#${n.q}" was not found`);r.isProxied||(t.N=r.watchers,t.D=r.serializers,t.A=r.deserializers,ye(r,t,2),r.isProxied=!0);const i=()=>{};n.u|=8;try{new r(n)}catch(n){s(n,e)}n.u&=-9,n.u|=128,i(),ge(n.l,e)}else r=e.constructor,customElements.whenDefined(e.localName).then((()=>n.u|=128));if(r&&r.style){let e;"string"==typeof r.style&&(e=r.style);const n=P(t);if(!f.has(n)){const r=()=>{};((e,n,t)=>{let r=f.get(e);y&&t?(r=r||new CSSStyleSheet,"string"==typeof r?r=n:r.replaceSync(n)):r=n,f.set(e,r)})(n,e,!!(1&t.u)),r()}}}const o=n.k,i=()=>oe(n,!0);o&&o["s-rc"]?o["s-rc"].push(i):i()}catch(t){s(t,e),n.P&&(n.P(),n.P=void 0),n.B&&n.B(e)}})(e,n,t)}r()}})(this))))}disconnectedCallback(){h.jmp((()=>(async e=>{if(!(1&h.u)){const n=i(e);(null==n?void 0:n.Y)&&(n.Y.map((e=>e())),n.Y=void 0),(null==n?void 0:n.l)?ve(n.l,e):(null==n?void 0:n.T)&&n.T.then((()=>ve(n.l,e)))}O.has(e)&&O.delete(e),e.shadowRoot&&O.has(e.shadowRoot)&&O.delete(e.shadowRoot)})(this))),h.raf((()=>{var e;const n=i(this);if(!n)return;const t=g.findIndex((e=>e===this));t>-1&&g.splice(t,1),(null==(e=null==n?void 0:n.M)?void 0:e.j)instanceof Node&&!n.M.j.isConnected&&delete n.M.j}))}componentOnReady(){var e;return null==(e=i(this))?void 0:e.T}};64&d.u&&(b.formAssociated=!0),d.V=e[0],o.includes(p)||l.get(p)||(r.push(p),l.define(p,ye(b,d,1)))}))})),r.length>0&&(p.textContent+=r.sort()+"{visibility:hidden}.hydrated{visibility:inherit}",p.innerHTML.length)){p.setAttribute("data-styles","");const e=null!=(t=h.I)?t:E(d.document);null!=e&&p.setAttribute("nonce",e),a.insertBefore(p,u?u.nextSibling:a.firstChild)}m=!1,g.length?g.map((e=>e.connectedCallback())):h.jmp((()=>v=setTimeout(ue,30)))},be=(e,n,t)=>{t&&d.document&&t.map((([t,r,o])=>{const i=we(d.document,e,t),l=xe(n,o),a=Se(t);h.ael(i,r,l,a),(n.Y=n.Y||[]).push((()=>h.rel(i,r,l,a)))}))},xe=(e,n)=>t=>{var r;try{256&e.u?null==(r=e.l)||r[n](t):(e.W=e.W||[]).push([n,t])}catch(n){s(n,e.$hostElement$)}},we=(e,n,t)=>4&t?e:n,Se=e=>({passive:!!(1&e),capture:!!(2&e)}),ze=e=>h.I=e;export{L as a,me as b,B as c,e as g,W as h,p,l as r,ze as s}