@prolibu-suite/cobalt-core 0.3.0 → 0.5.0

package/dist/cjs/co-file-type-tile.cjs.entry.js

@@ -0,0 +1,78 @@
+'use strict';
+
+var index = require('./index-DxEFsH_t.js');
+
+const coFileTypeTileCss = () => `:host{display:inline-flex}.co-file-type-tile{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box}`;
+
+/** Extension → type bucket. Unknown extensions fall back to `file`. */
+const EXT_TO_TYPE = {
+    pdf: 'pdf',
+    doc: 'doc',
+    docx: 'doc',
+    txt: 'txt',
+    md: 'txt',
+    xls: 'sheet',
+    xlsx: 'sheet',
+    csv: 'sheet',
+    png: 'image',
+    jpg: 'image',
+    jpeg: 'image',
+    gif: 'image',
+    svg: 'image',
+    webp: 'image',
+    mp4: 'video',
+    mov: 'video',
+    webm: 'video',
+    fig: 'design',
+    ai: 'design',
+    psd: 'design',
+    sketch: 'design',
+    zip: 'zip',
+    rar: 'zip',
+};
+/** Type → { icon, accent (foreground), tint (background) }. Exact values per design spec (audit 1.6). */
+const TYPE_META = {
+    pdf: { icon: 'file-pdf', accent: 'var(--co-color-secondary-rojo-100)', tint: 'rgb(255,236,236)' },
+    doc: { icon: 'file-text', accent: 'var(--co-color-primary-azul)', tint: 'var(--co-color-azul-100)' },
+    sheet: { icon: 'table', accent: 'var(--co-color-status-success)', tint: 'var(--co-color-verde-100)' },
+    image: { icon: 'image', accent: 'var(--co-color-secondary-violeta-100)', tint: 'rgb(233,232,255)' },
+    video: { icon: 'broadcast', accent: 'var(--co-color-secondary-naranja-100)', tint: 'rgb(255,236,220)' },
+    txt: { icon: 'text-align-left', accent: 'var(--co-color-gray-600)', tint: 'var(--co-color-gray-100)' },
+    design: { icon: 'sparkle', accent: 'var(--co-color-primary-rosado)', tint: 'var(--co-color-rosado-100)' },
+    zip: { icon: 'package', accent: 'var(--co-color-status-pending)', tint: 'var(--co-color-status-bg-pending)' },
+    file: { icon: 'file', accent: 'var(--co-color-gray-600)', tint: 'var(--co-color-gray-100)' },
+};
+const CoFileTypeTile = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /** Tile edge length in px (React uses 44 / 34 / 26). */
+        this.size = 44;
+        /** Corner radius in px (React uses 11 / 9 / 7). */
+        this.radius = 11;
+        /** When true, use the type's tint/accent colors; when false, neutral gray-100 / gray-600. */
+        this.colorTags = true;
+    }
+    render() {
+        var _a, _b;
+        const key = ((_a = this.ext) !== null && _a !== void 0 ? _a : '').trim().toLowerCase().replace(/^\./, '');
+        const type = (_b = EXT_TO_TYPE[key]) !== null && _b !== void 0 ? _b : 'file';
+        const meta = TYPE_META[type];
+        const iconSize = Math.round(this.size * 0.5);
+        const background = this.colorTags ? meta.tint : 'var(--co-color-gray-100)';
+        const color = this.colorTags ? meta.accent : 'var(--co-color-gray-600)';
+        return (index.h("span", { key: 'e894b848be911777d8a91388050c10a678bdaa1c', class: {
+                'co-file-type-tile': true,
+                [`co-file-type-tile--${type}`]: true,
+                'co-file-type-tile--mono': !this.colorTags,
+            }, part: "tile", style: {
+                width: `${this.size}px`,
+                height: `${this.size}px`,
+                borderRadius: `${this.radius}px`,
+                background,
+                color,
+            } }, index.h("co-icon", { key: 'd7dd6f61ba7155b4e2c0f38cc59a93ea647217b1', name: meta.icon, size: iconSize, weight: "fill" })));
+    }
+};
+CoFileTypeTile.style = coFileTypeTileCss();
+
+exports.co_file_type_tile = CoFileTypeTile;

package/dist/cjs/co-helper-text.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
 const coHelperTextCss = () => `:host{display:block}.co-helper-text{display:flex;align-items:center;gap:var(--co-spacing-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);line-height:1.4}.co-helper-text__icon{flex-shrink:0}.co-helper-text--default{color:var(--co-semantic-text-muted)}.co-helper-text--error{color:var(--co-semantic-status-error)}.co-helper-text--success{color:var(--co-semantic-status-success)}.co-helper-text--warning{color:var(--co-semantic-status-warning)}.co-helper-text--info{color:var(--co-semantic-status-info)}`;
 
@@ -18,10 +18,10 @@ const CoHelperText = class {
         };
     }
     render() {
-        return (index.h("div", { key: 'fb1894ff2656d74d2c892a6c857d98269604b04e', class: {
+        return (index.h("div", { key: 'edb5f0cdd150dcaa06230b90d3385d18684e2261', class: {
                 'co-helper-text': true,
                 [`co-helper-text--${this.status}`]: true,
-            }, part: "helper-text" }, index.h("co-icon", { key: 'd56c274e9f44ae16b13a02ec262d0d14b109fc5b', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), index.h("span", { key: '5e776db146922fc1271bff50b1b45245baf088b3', class: "co-helper-text__message" }, index.h("slot", { key: 'c3f93747e7b903296d24f60f87c9e3c29c2cb1cd' }, this.message))));
+            }, part: "helper-text" }, index.h("co-icon", { key: '7f9cce7182cd39893e0f6abfab2d1a27c266ea17', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), index.h("span", { key: '38757c70aca1891bfd43b505d57d7455b22512b3', class: "co-helper-text__message" }, index.h("slot", { key: '9382e95880c71e3da4eed22ed6c14589c4890252' }, this.message))));
     }
 };
 CoHelperText.style = coHelperTextCss();

package/dist/cjs/co-icon-button.cjs.entry.js

@@ -1,17 +1,23 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
-const coIconButtonCss = () => `:host{display:inline-flex}.co-icon-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;padding:0;flex-shrink:0;transition:opacity 0.15s ease, background 0.15s ease;box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));backdrop-filter:var(--co-icon-button-backdrop-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)))}.co-icon-button--filled{background:color-mix(in srgb, var(--co-semantic-surface-primary) 78%, transparent);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-icon-button--outlined{background:color-mix(in srgb, var(--co-icon-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);color:var(--co-icon-button-color, var(--co-semantic-on-secondary));border:1px solid var(--co-icon-button-border, var(--co-semantic-border-subtle))}.co-icon-button--ghost{background:transparent;color:var(--co-icon-button-color, var(--co-semantic-text-default));border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--ghost:hover:not(:disabled){background:color-mix(in srgb, var(--co-semantic-surface-hover, rgba(0, 0, 0, 0.04)) 60%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))}.co-icon-button--rounded.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-border-radius-full)}.co-icon-button--square.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-border-radius-xl);}.co-icon-button--square.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-border-radius-lg);}.co-icon-button--square.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-border-radius-lg);}.co-icon-button--square.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-border-radius-sm);}.co-icon-button--square.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-border-radius-xs);}.co-icon-button--square.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-spacing-sm);}.co-icon-button--xl ::slotted(*){width:32px;height:32px}.co-icon-button--lg ::slotted(*){width:24px;height:24px}.co-icon-button--md ::slotted(*){width:20px;height:20px}.co-icon-button--sm ::slotted(*){width:18px;height:18px}.co-icon-button--xs ::slotted(*){width:16px;height:16px}.co-icon-button--xxs ::slotted(*){width:12px;height:12px}.co-icon-button--disabled,.co-icon-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-icon-button:hover:not(:disabled){opacity:0.88}@supports not (background: color-mix(in srgb, red, transparent)){.co-icon-button--filled{background:var(--co-semantic-surface-primary)}.co-icon-button--outlined{background:var(--co-icon-button-bg, var(--co-semantic-surface-secondary))}}`;
+const coIconButtonCss = () => `:host{display:inline-flex}.co-icon-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;padding:0;flex-shrink:0;transition:opacity 0.15s ease, background 0.15s ease;box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));backdrop-filter:var(--co-icon-button-backdrop-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)))}.co-icon-button--filled{background:color-mix(in srgb, var(--co-semantic-surface-primary) 78%, transparent);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-icon-button--outlined{background:color-mix(in srgb, var(--co-icon-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);color:var(--co-icon-button-color, var(--co-semantic-on-secondary));border:1px solid var(--co-icon-button-border, var(--co-semantic-border-subtle))}.co-icon-button--ghost{background:transparent;color:var(--co-icon-button-color, var(--co-semantic-text-default));border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--ghost:hover:not(:disabled){background:var(--co-color-opacity-negro-8, rgba(31, 28, 27, 0.08))}.co-icon-button--dark{color:var(--co-icon-button-color, var(--co-color-base-blanco, #fff))}.co-icon-button--dark.co-icon-button--ghost:hover:not(:disabled){background:var(--co-color-opacity-blanco-16, rgba(255, 255, 255, 0.16))}.co-icon-button--rounded.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-border-radius-full)}.co-icon-button--rounded.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-border-radius-full)}.co-icon-button--square.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-border-radius-xl);}.co-icon-button--square.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-border-radius-lg);}.co-icon-button--square.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-border-radius-lg);}.co-icon-button--square.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-border-radius-sm);}.co-icon-button--square.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-border-radius-xs);}.co-icon-button--square.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-spacing-sm);}.co-icon-button--xl ::slotted(*){width:32px;height:32px}.co-icon-button--lg ::slotted(*){width:24px;height:24px}.co-icon-button--md ::slotted(*){width:20px;height:20px}.co-icon-button--sm ::slotted(*){width:18px;height:18px}.co-icon-button--xs ::slotted(*){width:16px;height:16px}.co-icon-button--xxs ::slotted(*){width:12px;height:12px}.co-icon-button--disabled,.co-icon-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-icon-button:hover:not(:disabled){opacity:0.88}@supports not (background: color-mix(in srgb, red, transparent)){.co-icon-button--filled{background:var(--co-semantic-surface-primary)}.co-icon-button--outlined{background:var(--co-icon-button-bg, var(--co-semantic-surface-secondary))}}`;
 
 const CoIconButton = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         /**
-         * filled = dark background (negro), outlined = light background (blanco + border)
+         * filled = dark background (negro), outlined = light background (blanco + border),
+         * ghost = transparent background, no border, tinted hover (negro-8 on light / blanco-16 on dark).
          * Matches Figma: Secundario → filled, Primario → outlined
          */
         this.variant = 'filled';
+        /**
+         * Surface the button sits on. `dark` → white icon + blanco-16 hover (on-dark theming).
+         * Defaults to `light` (no extra class → identical to previous behavior).
+         */
+        this.surface = 'light';
         /** Shape: pill or straight corners */
         this.shape = 'rounded';
         /**
@@ -31,15 +37,25 @@ const CoIconButton = class {
         const iconSizeMap = {
             xl: 32, lg: 28, md: 24, sm: 20, xs: 16, xxs: 16,
         };
-        const iconSize = (_b = (_a = this.iconSize) !== null && _a !== void 0 ? _a : iconSizeMap[this.size]) !== null && _b !== void 0 ? _b : 24;
-        return (index.h("button", { key: '3e53ed7dbb6d68bfecd22f29b16bb792bcc9c565', class: {
+        const resolvedIconSize = (_a = this.iconSize) !== null && _a !== void 0 ? _a : ((_b = iconSizeMap[this.size]) !== null && _b !== void 0 ? _b : 24);
+        const boxStyle = this.boxSize != null
+            ? {
+                width: `${this.boxSize}px`,
+                height: `${this.boxSize}px`,
+                borderRadius: this.shape === 'square'
+                    ? 'var(--co-border-radius-xs, 8px)'
+                    : 'var(--co-border-radius-full)',
+            }
+            : undefined;
+        return (index.h("button", { key: 'bf9aad13fe7360a7135da123ba555b64ee90cadc', class: {
                 'co-icon-button': true,
                 [`co-icon-button--${this.variant}`]: true,
                 [`co-icon-button--${this.shape}`]: true,
                 [`co-icon-button--${this.size}`]: true,
+                'co-icon-button--dark': this.surface === 'dark',
                 'co-icon-button--disabled': this.disabled,
-            }, disabled: this.disabled, "aria-label": this.label || this.icon, part: "button" }, this.icon
-            ? index.h("co-icon", { name: this.icon, weight: this.iconWeight, size: iconSize })
+            }, style: boxStyle, disabled: this.disabled, "aria-label": this.label || this.icon, part: "button" }, this.icon
+            ? index.h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize })
             : null));
     }
 };

package/dist/cjs/co-icon.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
 const CDN_BASE = 'https://cdn.jsdelivr.net/npm/@phosphor-icons/core@2.1.1/assets';
 /** Caché compartido a nivel de módulo: clave → PROMESA del SVG (en vuelo o resuelta). */
@@ -69,12 +69,12 @@ const CoIcon = class {
         this.svgContent = await loadSvg(this.name, this.weight);
     }
     render() {
-        return (index.h(index.Host, { key: '65fc20ae25aff18456c778d69454259755477cc8', "aria-hidden": "true", style: {
+        return (index.h(index.Host, { key: 'abc90edf4c13e2de7d28f88f99b694dd8aecbdc9', "aria-hidden": "true", style: {
                 display: 'inline-flex',
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 flexShrink: '0',
-            } }, index.h("span", { key: '867d361c4cd66611a38ccca0910ac93e9b41ed18', part: "svg", innerHTML: this.svgContent })));
+            } }, index.h("span", { key: 'c0248eb38058439bbd5213df838ced7d7cc62bc0', part: "svg", innerHTML: this.svgContent })));
     }
     static get watchers() { return {
         "name": [{

package/dist/cjs/co-input.cjs.entry.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
-var requiredMark = require('./requiredMark-CqMGt1H1.js');
+var index = require('./index-DxEFsH_t.js');
+var requiredMark = require('./requiredMark-B3pKyqYI.js');
 
-const coInputCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-input{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-input__label{white-space:normal}:host([layout='horizontal']) .co-input>:not(.co-input__labels){grid-column:2;min-width:0}.co-input__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-input__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-input__secondary-label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;text-align:right}.co-input__field-row{display:flex;align-items:stretch}.co-input__field{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xs);transition:border-color 0.15s ease, box-shadow 0.15s ease;min-height:40px;box-sizing:border-box;overflow:hidden;flex:1;min-width:0}.co-input--s .co-input__field{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-input--sm .co-input__field{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-input--lg .co-input__field{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-input--has-action .co-input__field{border-radius:var(--co-border-radius-xs) 0 0 var(--co-border-radius-xs);border-right:none}.co-input__field ::slotted([slot="action"]){margin-left:auto;margin-right:calc(-1 * var(--co-spacing-md));margin-top:calc(-1 * var(--co-spacing-sm2));margin-bottom:calc(-1 * var(--co-spacing-sm2));border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;flex-shrink:0}.co-input__field ::slotted([slot="chips"]){display:flex;gap:var(--co-spacing-xxs);align-items:center;flex-wrap:wrap;min-width:0}.co-input__input-wrapper{flex:1;display:flex;align-items:center;min-width:0;min-height:24px;padding:var(--co-spacing-xxs) 0}.co-input__native{width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:inherit;font-weight:400;letter-spacing:inherit;line-height:1;color:var(--co-semantic-text-default);padding:0;margin:0}.co-input__native::placeholder{color:var(--co-semantic-text-muted)}.co-input__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color 0.15s ease}.co-input__clear--hidden{visibility:hidden;pointer-events:none}.co-input__clear:hover{color:var(--co-semantic-text-default)}.co-input__action{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md) var(--co-spacing-sm2) var(--co-spacing-sm2);background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none;border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;cursor:pointer;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;flex-shrink:0;transition:opacity 0.15s ease;box-sizing:border-box}.co-input__action:hover{opacity:0.85}.co-input__action:disabled{opacity:0.4;cursor:not-allowed}.co-input__action-icon{display:flex;align-items:center;flex-shrink:0}.co-input__action-label{display:flex;align-items:center}.co-input__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-input__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-input--focused .co-input__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-input--disabled .co-input__labels .co-input__label,.co-input--disabled .co-input__labels .co-input__secondary-label{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__field{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-input--disabled .co-input__native{color:var(--co-semantic-text-disabled);cursor:not-allowed}.co-input--disabled .co-input__native::placeholder{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__icon{color:var(--co-semantic-text-disabled)}.co-input__status-icon{flex-shrink:0;display:flex;align-items:center}.co-input--success .co-input__status-icon{color:var(--co-semantic-status-success)}.co-input--error .co-input__status-icon{color:var(--co-semantic-status-error)}.co-input--warning .co-input__status-icon{color:var(--co-color-status-review)}.co-input--info .co-input__status-icon{color:var(--co-semantic-status-info)}.co-input--error .co-input__field{border-color:var(--co-semantic-status-error)}.co-input--error.co-input--focused .co-input__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-input__helper--error .co-input__helper-icon,.co-input__helper--error .co-input__helper-text{color:var(--co-semantic-status-error)}.co-input--success .co-input__field{border-color:var(--co-semantic-status-success)}.co-input--success.co-input--focused .co-input__field{border-color:var(--co-semantic-status-success);box-shadow:0 0 0 2px rgba(10, 119, 36, 0.12)}.co-input__helper--success .co-input__helper-icon,.co-input__helper--success .co-input__helper-text{color:var(--co-semantic-status-success)}.co-input--warning .co-input__field{border-color:var(--co-color-status-review)}.co-input--warning.co-input--focused .co-input__field{border-color:var(--co-color-status-review);box-shadow:0 0 0 2px rgba(133, 87, 31, 0.12)}.co-input__helper--warning .co-input__helper-icon,.co-input__helper--warning .co-input__helper-text{color:var(--co-color-status-review)}.co-input--info .co-input__field{border-color:var(--co-semantic-status-info)}.co-input--info.co-input--focused .co-input__field{border-color:var(--co-semantic-status-info);box-shadow:0 0 0 2px rgba(45, 108, 197, 0.12)}.co-input__helper--info .co-input__helper-icon,.co-input__helper--info .co-input__helper-text{color:var(--co-semantic-status-info)}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}@supports not (background: color-mix(in srgb, red, transparent)){.co-input__field{background:var(--co-semantic-surface-secondary)}}`;
+const coInputCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-input{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-input__label{white-space:normal}:host([layout='horizontal']) .co-input>:not(.co-input__labels){grid-column:2;min-width:0}.co-input__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-input__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-input__secondary-label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;text-align:right}.co-input__field-row{display:flex;align-items:stretch}.co-input__field{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-color-opacity-negro-25, rgba(31, 28, 27, 0.25));border-radius:var(--co-border-radius-xs);transition:border-color 0.15s ease, box-shadow 0.15s ease;min-height:40px;box-sizing:border-box;overflow:hidden;flex:1;min-width:0}.co-input--s .co-input__field{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-input--sm .co-input__field{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-input--lg .co-input__field{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-input--has-action .co-input__field{border-radius:var(--co-border-radius-xs) 0 0 var(--co-border-radius-xs);border-right:none}.co-input__field ::slotted([slot="action"]){margin-left:auto;margin-right:calc(-1 * var(--co-spacing-md));margin-top:calc(-1 * var(--co-spacing-sm2));margin-bottom:calc(-1 * var(--co-spacing-sm2));border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;flex-shrink:0}.co-input__field ::slotted([slot="chips"]){display:flex;gap:var(--co-spacing-xxs);align-items:center;flex-wrap:wrap;min-width:0}.co-input__input-wrapper{flex:1;display:flex;align-items:center;min-width:0;min-height:22px;padding:0}.co-input__native{width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:inherit;font-weight:400;letter-spacing:inherit;line-height:1;color:var(--co-semantic-text-default);padding:0;margin:0}.co-input__native::placeholder{color:var(--co-semantic-text-muted)}.co-input__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color 0.15s ease}.co-input__clear--hidden{visibility:hidden;pointer-events:none}.co-input__clear:hover{color:var(--co-semantic-text-default)}.co-input__action{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md) var(--co-spacing-sm2) var(--co-spacing-sm2);background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none;border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;cursor:pointer;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;flex-shrink:0;transition:opacity 0.15s ease;box-sizing:border-box}.co-input__action:hover{opacity:0.85}.co-input__action:disabled{opacity:0.4;cursor:not-allowed}.co-input__action-icon{display:flex;align-items:center;flex-shrink:0}.co-input__action-label{display:flex;align-items:center}.co-input__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-input__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-input--focused .co-input__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-input--disabled .co-input__labels .co-input__label,.co-input--disabled .co-input__labels .co-input__secondary-label{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__field{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-input--disabled .co-input__native{color:var(--co-semantic-text-disabled);cursor:not-allowed}.co-input--disabled .co-input__native::placeholder{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__icon{color:var(--co-semantic-text-disabled)}.co-input__status-icon{flex-shrink:0;display:flex;align-items:center}.co-input--success .co-input__status-icon{color:var(--co-semantic-status-success)}.co-input--error .co-input__status-icon{color:var(--co-semantic-status-error)}.co-input--warning .co-input__status-icon{color:var(--co-color-status-review)}.co-input--info .co-input__status-icon{color:var(--co-semantic-status-info)}.co-input--error .co-input__field{border-color:var(--co-semantic-status-error)}.co-input--error.co-input--focused .co-input__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-input__helper--error .co-input__helper-icon,.co-input__helper--error .co-input__helper-text{color:var(--co-semantic-status-error)}.co-input--success .co-input__field{border-color:var(--co-semantic-status-success)}.co-input--success.co-input--focused .co-input__field{border-color:var(--co-semantic-status-success);box-shadow:0 0 0 2px rgba(10, 119, 36, 0.12)}.co-input__helper--success .co-input__helper-icon,.co-input__helper--success .co-input__helper-text{color:var(--co-semantic-status-success)}.co-input--warning .co-input__field{border-color:var(--co-color-status-review)}.co-input--warning.co-input--focused .co-input__field{border-color:var(--co-color-status-review);box-shadow:0 0 0 2px rgba(133, 87, 31, 0.12)}.co-input__helper--warning .co-input__helper-icon,.co-input__helper--warning .co-input__helper-text{color:var(--co-color-status-review)}.co-input--info .co-input__field{border-color:var(--co-semantic-status-info)}.co-input--info.co-input--focused .co-input__field{border-color:var(--co-semantic-status-info);box-shadow:0 0 0 2px rgba(45, 108, 197, 0.12)}.co-input__helper--info .co-input__helper-icon,.co-input__helper--info .co-input__helper-text{color:var(--co-semantic-status-info)}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}@supports not (background: color-mix(in srgb, red, transparent)){.co-input__field{background:var(--co-semantic-surface-secondary)}}.co-input--fill .co-input__field{background:var(--co-color-gray-100, #f6f6f6);border:none;box-shadow:none;border-radius:10px;padding:0 12px;gap:var(--co-spacing-sm2);min-height:46px;font-size:13.5px;-webkit-backdrop-filter:none;backdrop-filter:none}.co-input--fill.co-input--s .co-input__field{min-height:38px}.co-input--fill.co-input--sm .co-input__field{min-height:42px}.co-input--fill.co-input--lg .co-input__field{min-height:52px}.co-input--fill .co-input__native{font-size:13.5px;font-family:var(--co-font-family-primary);letter-spacing:var(--co-font-letter-spacing-body)}.co-input--fill .co-input__native::placeholder{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__icon{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__clear{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__clear:hover{color:var(--co-color-gray-600, #585858)}.co-input--fill.co-input--focused .co-input__field{border-color:transparent;box-shadow:none}`;
 
 const CoInput = class {
     constructor(hostRef) {
@@ -33,8 +33,16 @@ const CoInput = class {
         this.required = false;
         /** Validation status */
         this.status = 'default';
-        /** Size variant: s (28px), sm (32px), md (40px, default), lg (48px) */
+        /** Size variant: s (28px), sm (32px), md (40px, default), lg (48px).
+         *  In the filled search-pill variant (`fill`) this drives the pill height
+         *  instead (s ≈ 38px). */
         this.size = 'md';
+        /** Filled search-pill variant. When true the field renders as a minimal gray
+         *  pill (background gray-100, no border/box-shadow, 10px radius) with a search
+         *  glyph on the left and a plain-`x` clear — the floating label, helper text and
+         *  status chrome are suppressed. When false (default) the field renders
+         *  IDENTICALLY to the standard text field. */
+        this.fill = false;
         this.hasFocus = false;
         this.handleInput = (e) => {
             const target = e.target;
@@ -94,9 +102,30 @@ const CoInput = class {
             default: return null;
         }
     }
+    /** Filled search-pill variant (fill=true). Minimal chrome: icon-left + native
+     *  input + plain-x clear. No labels, helper text, status icons, chips or action.
+     *  The default field render path is left untouched. */
+    renderFill() {
+        const showClear = this.clearable && this.hasValue && !this.disabled && !this.readonly;
+        const leftIcon = this.iconLeft || 'magnifying-glass';
+        return (index.h("div", { class: {
+                'co-input': true,
+                'co-input--fill': true,
+                [`co-input--${this.size}`]: true,
+                'co-input--disabled': this.disabled,
+                'co-input--focused': this.hasFocus,
+                'co-input--filled': this.hasValue,
+            }, part: "wrapper" }, index.h("div", { class: "co-input__field-row" }, index.h("div", { class: "co-input__field", part: "field" }, index.h("co-icon", { name: leftIcon, size: 17, class: "co-input__icon co-input__icon--left" }), index.h("div", { class: "co-input__input-wrapper" }, index.h("input", { ref: (el) => (this.inputEl = el), class: "co-input__native", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, autoComplete: this.autocomplete, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" })), this.clearable && (index.h("button", { class: {
+                'co-input__clear': true,
+                'co-input__clear--hidden': !showClear,
+            }, type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear input", part: "clear" }, index.h("co-icon", { name: "x", size: 14 })))))));
+    }
     render() {
+        if (this.fill) {
+            return this.renderFill();
+        }
         const showClear = this.clearable && this.hasValue && !this.disabled && !this.readonly;
-        return (index.h("div", { key: '3c628ddcc708f39637038f25118918fbe0f9cff2', class: {
+        return (index.h("div", { class: {
                 'co-input': true,
                 [`co-input--${this.layout}`]: true,
                 [`co-input--${this.size}`]: true,
@@ -105,10 +134,10 @@ const CoInput = class {
                 'co-input--filled': this.hasValue,
                 [`co-input--${this.status}`]: this.status !== 'default',
                 'co-input--has-action': this.hasAction,
-            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (index.h("div", { key: '89513c64c7d590c77159f6a983ed4973289be0d2', class: "co-input__labels" }, this.label && index.h("label", { key: '4a0874ec1828c5a19ef87c23878d2317f3d441df', class: "co-input__label", part: "label" }, this.label, index.h(requiredMark.RequiredMark, { key: 'e7a72a5c861923f43968ad95a6c47b46ae13b9ed', required: this.required })), this.secondaryLabel && (index.h("span", { key: '87911501ccb15a2bd4ef4e58e3537bc968e0f0d2', class: "co-input__secondary-label", part: "secondary-label" }, this.secondaryLabel)))), index.h("div", { key: '0c1a530d1a687798f0803564be36409b23d5a1fd', class: "co-input__field-row" }, index.h("div", { key: 'bb731973f9406d649c3aff55071bd50fd7ebc991', class: "co-input__field", part: "field" }, this.iconLeft && (index.h("co-icon", { key: '4d244ba725651414653c531e3017f8d3a6ccbfd4', name: this.iconLeft, size: 16, class: "co-input__icon co-input__icon--left" })), index.h("slot", { key: '9c2c242a1887a05c4fcc88dbbb99c86ce0b5113f', name: "chips" }), index.h("div", { key: '8568e8abdc2c37b565b2446126638b43a649d721', class: "co-input__input-wrapper" }, index.h("input", { key: '6f311f448b23a936e1da7fe547e7510e236bcf99', ref: (el) => (this.inputEl = el), class: "co-input__native", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, autoComplete: this.autocomplete, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" })), this.clearable && (index.h("button", { key: '5826d5d68a03b1cec942a004578f969920a13609', class: {
+            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (index.h("div", { class: "co-input__labels" }, this.label && index.h("label", { class: "co-input__label", part: "label" }, this.label, index.h(requiredMark.RequiredMark, { required: this.required })), this.secondaryLabel && (index.h("span", { class: "co-input__secondary-label", part: "secondary-label" }, this.secondaryLabel)))), index.h("div", { class: "co-input__field-row" }, index.h("div", { class: "co-input__field", part: "field" }, this.iconLeft && (index.h("co-icon", { name: this.iconLeft, size: 16, class: "co-input__icon co-input__icon--left" })), index.h("slot", { name: "chips" }), index.h("div", { class: "co-input__input-wrapper" }, index.h("input", { ref: (el) => (this.inputEl = el), class: "co-input__native", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, autoComplete: this.autocomplete, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" })), this.clearable && (index.h("button", { class: {
                 'co-input__clear': true,
                 'co-input__clear--hidden': !showClear,
-            }, type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear input", part: "clear" }, index.h("co-icon", { key: 'b987c7ceeb51c7a2bde1a53b6e80484b1fe2ff90', name: "x-circle", size: 16, weight: "fill" }))), this.iconRight && (index.h("co-icon", { key: '07e2d8f0ffca417ed82d95b97cf42efaf24212e9', name: this.iconRight, size: 16, class: "co-input__icon co-input__icon--right" })), this.statusFieldIcon && (index.h("co-icon", { key: '7f1ce796c3d8fda6e3d5b5f63ffa819c6925daef', name: this.statusFieldIcon, size: 16, class: "co-input__status-icon" })), index.h("slot", { key: '7294036e68f6f2ff1efe57c957765415691b7d21', name: "suffix" }), index.h("slot", { key: 'ca865d10565b3b1f140b5d23c52781ea71f5f0ae' }), index.h("slot", { key: '2422fd84d5ce0f4d1c4eacedeaa72ea259cb1580', name: "action" })), this.hasAction && (index.h("button", { key: '5dd232fc1a449cf73ddda1e06d28c9d8a9dc4a0d', class: "co-input__action", type: "button", onClick: this.handleAction, disabled: this.disabled, part: "action" }, this.actionIcon && (index.h("co-icon", { key: '7cada4fa70ea0ec79754c5a46a59367ea8c66fad', name: this.actionIcon, size: 16, class: "co-input__action-icon" })), this.actionLabel && (index.h("span", { key: 'f27e5c1ea7ff1f83714ae5f542558518dc00a937', class: "co-input__action-label" }, this.actionLabel))))), this.helperText && (index.h("div", { key: 'd806c9e918ac1edac3eb703926c0c405019190e1', class: `co-input__helper co-input__helper--${this.status}`, part: "helper" }, this.helperIcon && (index.h("co-icon", { key: '80f6b84d4354ccf965596cb9546a531cbbc932e0', name: this.helperIcon, size: 14, class: "co-input__helper-icon" })), index.h("span", { key: '8f01456c3cfec988ffc6f7c6a03c1ecc43ee4c2c', class: "co-input__helper-text" }, this.helperText)))));
+            }, type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear input", part: "clear" }, index.h("co-icon", { name: "x-circle", size: 16, weight: "fill" }))), this.iconRight && (index.h("co-icon", { name: this.iconRight, size: 16, class: "co-input__icon co-input__icon--right" })), this.statusFieldIcon && (index.h("co-icon", { name: this.statusFieldIcon, size: 16, class: "co-input__status-icon" })), index.h("slot", { name: "suffix" }), index.h("slot", null), index.h("slot", { name: "action" })), this.hasAction && (index.h("button", { class: "co-input__action", type: "button", onClick: this.handleAction, disabled: this.disabled, part: "action" }, this.actionIcon && (index.h("co-icon", { name: this.actionIcon, size: 16, class: "co-input__action-icon" })), this.actionLabel && (index.h("span", { class: "co-input__action-label" }, this.actionLabel))))), this.helperText && (index.h("div", { class: `co-input__helper co-input__helper--${this.status}`, part: "helper" }, this.helperIcon && (index.h("co-icon", { name: this.helperIcon, size: 14, class: "co-input__helper-icon" })), index.h("span", { class: "co-input__helper-text" }, this.helperText)))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/co-json-field.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
-var requiredMark = require('./requiredMark-CqMGt1H1.js');
+var index = require('./index-DxEFsH_t.js');
+var requiredMark = require('./requiredMark-B3pKyqYI.js');
 
 const coJsonFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-json-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-json-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-json-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-json-field__field{display:flex;background:color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xs);transition:border-color 0.15s ease, box-shadow 0.15s ease;box-sizing:border-box;overflow:hidden}.co-json-field__native{width:100%;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--co-font-family-mono, monospace);font-size:var(--co-font-size-13, 13px);font-weight:400;line-height:1.5;color:var(--co-semantic-text-default);padding:var(--co-spacing-sm2) var(--co-spacing-md);margin:0;box-sizing:border-box;tab-size:2}.co-json-field__native::placeholder{color:var(--co-semantic-text-muted)}.co-json-field--s .co-json-field__native{padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12, 12px)}.co-json-field--sm .co-json-field__native{padding:var(--co-spacing-xs) var(--co-spacing-sm)}.co-json-field--lg .co-json-field__native{padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-14)}.co-json-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-json-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-json-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-json-field--disabled{opacity:0.6;pointer-events:none}.co-json-field--disabled .co-json-field__field{background:var(--co-semantic-surface-disabled);border-color:transparent}.co-json-field--invalid .co-json-field__field,.co-json-field--error .co-json-field__field{border-color:var(--co-semantic-status-error)}.co-json-field--invalid.co-json-field--focused .co-json-field__field,.co-json-field--error.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-json-field__helper--error .co-json-field__helper-icon,.co-json-field__helper--error .co-json-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-json-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-json-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-json-field__label{white-space:normal}:host([layout='horizontal']) .co-json-field>:not(.co-json-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-json-field__field{background:var(--co-semantic-surface-secondary)}}`;
 
@@ -89,17 +89,17 @@ const CoJsonField = class {
     render() {
         const helper = this.internalInvalid ? this.invalidMessage : this.helperText;
         const statusClass = this.status !== 'default' ? `co-json-field--${this.status}` : '';
-        return (index.h("div", { key: '0f1319b6cd930e576dbba45dfb3bbb9050c8a4c0', class: {
+        return (index.h("div", { key: '6b5f24ad2f616fa1b4e9d2fcf8c6e9dddc85b5e7', class: {
                 'co-json-field': true,
                 'co-json-field--disabled': this.disabled,
                 'co-json-field--focused': this.hasFocus,
                 'co-json-field--invalid': this.isInvalid,
                 [`co-json-field--${this.size}`]: true,
                 [statusClass]: !!statusClass,
-            }, part: "wrapper" }, this.label && (index.h("div", { key: '50cfffd0dedb3b091cebadf7b908594d855c1e92', class: "co-json-field__labels" }, index.h("label", { key: '77410a04bc4ca4f61dd8be107acb159a918f811c', class: "co-json-field__label", part: "label" }, this.label, index.h(requiredMark.RequiredMark, { key: '21f0c872f95b39e38e16388a0935aebe333640ad', required: this.required })))), index.h("div", { key: 'f7da7b3e56bc9bb1bfe1759f4e6ea260bd45b19e', class: "co-json-field__field", part: "field" }, index.h("textarea", { key: '8f5413bb82906a15d83130ca963b771e6539d7f6', class: "co-json-field__native", rows: this.rows, spellcheck: false, autocomplete: "off", value: this.draft, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? 'JSON' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" })), this.name && index.h("input", { key: '5c844c980cafec58d64ff473022ace4b11f10b26', type: "hidden", name: this.name, value: this.draft }), helper && (index.h("div", { key: 'af8b770be33f336be652e0b6b567a602a59d8e63', class: {
+            }, part: "wrapper" }, this.label && (index.h("div", { key: 'df075fb85235c8c607580a2f2825047252998ec3', class: "co-json-field__labels" }, index.h("label", { key: '77f9b5da9f1667331242b601ba5941818408e866', class: "co-json-field__label", part: "label" }, this.label, index.h(requiredMark.RequiredMark, { key: '25bfbe4ecd2c97938cc8b36f915f8219396935f6', required: this.required })))), index.h("div", { key: 'bf06e69915f1705a310cb0c115d0ee3c8e5ee3f8', class: "co-json-field__field", part: "field" }, index.h("textarea", { key: 'c317495385581e32f779e4a243794a5493ebc28a', class: "co-json-field__native", rows: this.rows, spellcheck: false, autocomplete: "off", value: this.draft, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? 'JSON' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" })), this.name && index.h("input", { key: 'd68efdf098beb43710572d10517159597181b2f5', type: "hidden", name: this.name, value: this.draft }), helper && (index.h("div", { key: 'd5aa71be869d4731e5807f43abb47ae84c3eb0cb', class: {
                 'co-json-field__helper': true,
                 'co-json-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (index.h("co-icon", { key: '8ed6b6f2444fbf408818b1ac9911f4513c963dee', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), index.h("span", { key: '9282196dfd8f2662c073d7589dd7fd93447101f8', class: "co-json-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (index.h("co-icon", { key: '2612ac57f2f0593a2f7438f26a99e78cd841ed35', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), index.h("span", { key: 'bdee3108962929c93b67551636f0d8514cbc2979', class: "co-json-field__helper-text" }, helper)))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/co-lightbox.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 var dateI18n = require('./dateI18n-BdiNAl0_.js');
 
 /**
@@ -45,7 +45,7 @@ function getLightboxStrings(locale) {
     return DICT[dateI18n.langFromLocale(locale)];
 }
 
-const coLightboxCss = () => `:host{display:contents;font-family:var(--co-font-family-primary)}.co-lightbox{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;background:var(--co-color-opacity-negro-80);opacity:0;pointer-events:none;transition:opacity 0.2s ease}.co-lightbox--open{opacity:1;pointer-events:auto}.co-lightbox__toolbar{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-lg);background:linear-gradient(var(--co-color-opacity-negro-50), transparent)}.co-lightbox__caption{flex:1;min-width:0;color:var(--co-color-base-blanco);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-lightbox__zoom{display:flex;align-items:center;gap:var(--co-spacing-xxs);padding:0 var(--co-spacing-xs);border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8)}.co-lightbox__btn{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 var(--co-spacing-xs);border:none;border-radius:var(--co-border-radius-full);background:transparent;color:var(--co-color-base-blanco);font-family:inherit;font-size:var(--co-font-size-13);cursor:pointer;transition:background 0.15s ease}.co-lightbox__btn:hover{background:var(--co-color-opacity-blanco-16)}.co-lightbox__zoom-value{min-width:48px;font-variant-numeric:tabular-nums}.co-lightbox__stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}.co-lightbox__img{max-width:calc(100vw - var(--co-spacing-5xl) * 2);max-height:calc(100vh - var(--co-spacing-5xl) * 2);border-radius:var(--co-border-radius-xs);user-select:none;transition:transform 0.18s ease}.co-lightbox__img--zoomed{cursor:grab}.co-lightbox__img--dragging{cursor:grabbing;transition:none}.co-lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:none;border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8);color:var(--co-color-base-blanco);cursor:pointer;transition:background 0.15s ease}.co-lightbox__nav:hover{background:var(--co-color-opacity-blanco-25)}.co-lightbox__nav--prev{left:var(--co-spacing-lg)}.co-lightbox__nav--next{right:var(--co-spacing-lg)}.co-lightbox__counter{position:absolute;bottom:var(--co-spacing-lg);left:50%;transform:translateX(-50%);z-index:2;padding:var(--co-spacing-xs) var(--co-spacing-md);border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8);color:var(--co-color-base-blanco);font-size:var(--co-font-size-13);font-variant-numeric:tabular-nums}`;
+const coLightboxCss = () => `:host{display:contents;font-family:var(--co-font-family-primary)}.co-lightbox{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;background:var(--co-color-opacity-negro-80);opacity:0;pointer-events:none;transition:opacity 0.2s ease}.co-lightbox--open{opacity:1;pointer-events:auto}.co-lightbox__toolbar{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-lg);background:linear-gradient(var(--co-color-opacity-negro-50), transparent)}.co-lightbox__caption{flex:1;min-width:0;color:var(--co-color-base-blanco);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-lightbox__zoom{display:flex;align-items:center;gap:var(--co-spacing-xxs);padding:0 var(--co-spacing-xs);border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8)}.co-lightbox__btn{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 var(--co-spacing-xs);border:none;border-radius:var(--co-border-radius-full);background:transparent;color:var(--co-color-base-blanco);font-family:inherit;font-size:var(--co-font-size-13, 13px);cursor:pointer;transition:background 0.15s ease}.co-lightbox__btn:hover{background:var(--co-color-opacity-blanco-16)}.co-lightbox__zoom-value{min-width:48px;font-variant-numeric:tabular-nums}.co-lightbox__stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}.co-lightbox__img{max-width:calc(100vw - var(--co-spacing-5xl) * 2);max-height:calc(100vh - var(--co-spacing-5xl) * 2);border-radius:var(--co-border-radius-xs);user-select:none;transition:transform 0.18s ease}.co-lightbox__img--zoomed{cursor:grab}.co-lightbox__img--dragging{cursor:grabbing;transition:none}.co-lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:none;border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8);color:var(--co-color-base-blanco);cursor:pointer;transition:background 0.15s ease}.co-lightbox__nav:hover{background:var(--co-color-opacity-blanco-25)}.co-lightbox__nav--prev{left:var(--co-spacing-lg)}.co-lightbox__nav--next{right:var(--co-spacing-lg)}.co-lightbox__counter{position:absolute;bottom:var(--co-spacing-lg);left:50%;transform:translateX(-50%);z-index:2;padding:var(--co-spacing-xs) var(--co-spacing-md);border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-blanco-8);color:var(--co-color-base-blanco);font-size:var(--co-font-size-13, 13px);font-variant-numeric:tabular-nums}`;
 
 const MIN_SCALE = 1;
 const MAX_SCALE = 8;
@@ -314,17 +314,17 @@ const CoLightbox = class {
         const counter = s.counter
             .replace('{i}', String(this.index + 1))
             .replace('{n}', String(imgs.length));
-        return (index.h("div", { key: 'bfffaae28680b214a562aa3c3ec52aaf16a61571', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, onClick: this.requestClose }, img && (index.h("div", { key: 'e1bed6448e4878d0e459bdda89d1da98712d8207', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, index.h("span", { key: '7ff4d35aaa6c4207c2b623951f14802278e1c631', class: "co-lightbox__caption", title: img.alt }, img.alt), index.h("div", { key: 'bf369f9204faf17c9047c339d893933159078714', class: "co-lightbox__zoom" }, index.h("button", { key: '94aa9ab08f21bf7d9e77e4ad31325cd13a80bb4d', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, index.h("co-icon", { key: 'd04c038ec26081190c67eedcccf8e4c61c8cf6d7', name: "minus", size: 16 })), index.h("button", { key: 'd4333d0c970e71012786915be49be6c0efada12f', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), index.h("button", { key: 'b9efbf3e3912fb557eba59cce0300468a8e86861', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, index.h("co-icon", { key: '1d56f6fca5858ba8413f378bc6ac63870663143a', name: "plus", size: 16 }))), index.h("button", { key: '0fc6adbb0b1c80cb2e8da9eb09dfe107349a59cf', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, index.h("co-icon", { key: 'b1151b279b700caa0712ff74b09c0440d4b37dd4', name: "arrow-square-out", size: 16 })), index.h("button", { key: '984f9d2b9498d9715dabff254d2f3da9a42d9172', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, index.h("co-icon", { key: '054e307f9116c8dca66412ae54dfee8e3a86da9b', name: "x", size: 16 })))), img && (index.h("div", { key: 'cd21ae63400375474fca02ebf77c35d4b4fd8b55', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, index.h("img", { key: 'b33b767ba92e4a1ed685409b1a96acc98767c4f7', class: {
+        return (index.h("div", { key: 'd48b05f652170cd961637700458eea0d56ded15a', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, onClick: this.requestClose }, img && (index.h("div", { key: '0c158b9cca8743480d189ee6abb1445d6892ebc1', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, index.h("span", { key: 'c26684772cfd9ae9dd5c2393e54bc8366d3cc470', class: "co-lightbox__caption", title: img.alt }, img.alt), index.h("div", { key: '393614be92d88b31cab04cd8a5f21cb021fe6cda', class: "co-lightbox__zoom" }, index.h("button", { key: '5e4d5a1fc24a7aaeee4d11927c0ddb208b08fe71', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, index.h("co-icon", { key: '3caea68581b64d395d31d0ed2cd27d255ed9d402', name: "minus", size: 16 })), index.h("button", { key: '28df86fa8703245818fb60c4ee9e2d05dc19b1dd', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), index.h("button", { key: '3e6307614505a720cba72214cc8e2f8c89d7be68', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, index.h("co-icon", { key: '80f4f47e8768815d158d30e8ce29ad074d56bec6', name: "plus", size: 16 }))), index.h("button", { key: '97acb23668d83caae3923fde3dfaa6b2232ced0a', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, index.h("co-icon", { key: 'b69d3de0a9912c71e2803272575d03d76d4d1d77', name: "arrow-square-out", size: 16 })), index.h("button", { key: '6a1cd64d3b5852d2707c0f01a8f16306b6cfd150', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, index.h("co-icon", { key: '22b97a92c4d3651d0fadcbdbbdbda9581eee721b', name: "x", size: 16 })))), img && (index.h("div", { key: '41fce41bf57c1c4a0a765134f7cf4a1d57677e67', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, index.h("img", { key: '9b96e949be261813af8c44802e7a85c9892696c7', class: {
                 'co-lightbox__img': true,
                 'co-lightbox__img--zoomed': this.scale > MIN_SCALE,
                 'co-lightbox__img--dragging': this.dragging,
-            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (index.h("button", { key: '0b35f47557bf3e05db3c98e0df2c6e8d6f5cef94', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
+            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (index.h("button", { key: '605186deca28fb6455e5f72ae0d0fd1380482947', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(-1);
-            } }, index.h("co-icon", { key: 'f84159324fe97c957f0e8b2f0b92f865f180f7ed', name: "caret-left", size: 24 }))), img && multi && (index.h("button", { key: '7c1a9f250bb4b881112a57a2f3455b3c82fc77cc', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
+            } }, index.h("co-icon", { key: '5a782d3e4ae8578b2e3579db2a9b710f0219ce51', name: "caret-left", size: 24 }))), img && multi && (index.h("button", { key: '3695eb0397a9a13a48c66c3f502746ae86b1ffbe', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(1);
-            } }, index.h("co-icon", { key: '00efc2dd2e09c2dc1df35b6317e5bc42a63b2c20', name: "caret-right", size: 24 }))), img && multi && (index.h("div", { key: '7b148b3a2a1c3032c037439293b2b4c6e0100c52', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
+            } }, index.h("co-icon", { key: 'd39568adf357c46fd7445c070b9fcdcd6bbab845', name: "caret-right", size: 24 }))), img && multi && (index.h("div", { key: '8b1acaa692c196615f6f00641ba86c14687f6a2b', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/co-list-footer.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
 const coListFooterCss = () => `:host{display:block}.co-list-footer{display:flex;gap:var(--co-spacing-sm2);padding-top:var(--co-spacing-sm2)}.co-list-footer__btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity 0.15s ease;box-sizing:border-box;min-height:32px}.co-list-footer__btn:hover{opacity:0.85}.co-list-footer__btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-list-footer__btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-list-footer__btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}`;
 
@@ -17,7 +17,7 @@ const CoListFooter = class {
         this.handleSecondary = () => this.coSecondary.emit();
     }
     render() {
-        return (index.h("div", { key: '408e27a26e9d2d1802ba336690c84c745a79a22d', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (index.h("button", { key: '9a597df6466ebf5c5720b50d0d4d2993ba3af9ab', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && index.h("co-icon", { key: 'c743c1399b14d175c51ea553d508110e8bcaef05', name: this.secondaryIcon, size: 16 }), index.h("span", { key: '3c32ad1ea326da99debeb716980b38cf9777b168' }, this.secondaryLabel))), this.primaryLabel && (index.h("button", { key: 'ce57a3fe3456d4cd3959d556304de9de7558ec40', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && index.h("co-icon", { key: '584416793ecbf91a960b2b55f54e703ba1d0ca5c', name: this.primaryIcon, size: 16 }), index.h("span", { key: 'f227d58236ab0f4d31b398cfc9bf7419efd57d02' }, this.primaryLabel))), index.h("slot", { key: '601ef71ed5374dab62a79ad875da9b6f7a0fcfed' })));
+        return (index.h("div", { key: 'f2b6a2b71a038b5a2077d5bb4cb8f4b57aa85ebb', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (index.h("button", { key: 'cfb849d4e483b104dd0d20c7241126bf2151c1cb', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && index.h("co-icon", { key: '6edb490a4a7864056b07bb18b156e3674d785dfc', name: this.secondaryIcon, size: 16 }), index.h("span", { key: 'ac7501438e06aa52e215e6b8aea549aaf098d0b6' }, this.secondaryLabel))), this.primaryLabel && (index.h("button", { key: '6589a1a226b25f8393578ae11209c3388ea637b8', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && index.h("co-icon", { key: '6665e17ca3bb9d439ef89f05973086d0a7bd7a8d', name: this.primaryIcon, size: 16 }), index.h("span", { key: '205c5f6653c264881a010a3def5ae65239b5333c' }, this.primaryLabel))), index.h("slot", { key: '48a894d428459f179161a1eb3fcbd5463ca760a6' })));
     }
 };
 CoListFooter.style = coListFooterCss();

package/dist/cjs/co-list-item.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
 const coListItemCss = () => `:host{display:block}.co-list-item{display:flex;align-items:center;gap:var(--co-spacing-md);padding:var(--co-spacing-md) var(--co-spacing-lg);font-family:var(--co-font-family-primary);cursor:pointer;border-radius:var(--co-border-radius-sm);transition:background 0.1s ease;box-sizing:border-box;min-height:40px}.co-list-item--dense{gap:var(--co-spacing-sm);padding:6px var(--co-spacing-sm);border-radius:var(--co-border-radius-xxs);min-height:32px}.co-list-item--dense .co-list-item__label{font-size:var(--co-font-size-14)}.co-list-item:hover:not(.co-list-item--disabled){background:var(--co-semantic-surface-hover)}.co-list-item:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus)}.co-list-item--selected{background:var(--co-semantic-surface-muted)}.co-list-item--disabled{opacity:0.4;cursor:not-allowed}.co-list-item__prefix,.co-list-item__suffix{display:flex;align-items:center;gap:var(--co-spacing-sm);flex-shrink:0;color:var(--co-semantic-text-muted)}.co-list-item__prefix:empty,.co-list-item__suffix:empty{display:none}.co-list-item__content{display:flex;flex-direction:column;flex:1;min-width:0}.co-list-item__content>.co-list-item__tip{min-width:0;max-width:100%}.co-list-item__label{display:block;font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-default);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-list-item__description{display:block;font-size:var(--co-font-size-12);color:var(--co-semantic-text-muted);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}`;
 
@@ -71,21 +71,21 @@ const CoListItem = class {
         requestAnimationFrame(this.measureTruncation);
     }
     render() {
-        return (index.h("div", { key: '984e2c7fcb5f4124c871dda103e450b858143c0f', class: {
+        return (index.h("div", { key: '9e287e86942493229ae39c750c8d53056795d844', class: {
                 'co-list-item': true,
                 'co-list-item--selected': this.selected,
                 'co-list-item--disabled': this.disabled,
                 'co-list-item--dense': this.dense,
                 'co-list-item--has-description': !!this.description,
-            }, part: "item", role: "option", tabindex: this.disabled ? -1 : 0, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, index.h("span", { key: 'd1a3466d6ecc565435d3918a596bc7620cce2197', class: "co-list-item__prefix" }, this.icon && index.h("co-icon", { key: '2374265eac83fb8d86ee26ab3317da2c2c9d2998', name: this.icon, size: 18 }), index.h("slot", { key: '6bb538d2212c2bd25d61c54a59120295ff55692b', name: "prefix" })), index.h("div", { key: '052ed53fb59580780a0d1c2b1dbdff7711fbb585', class: "co-list-item__content" }, this.label && (index.h("co-tooltip", { key: '027cb3026c0ac2efdfb76f7eeb9600d21899e865', block: true, class: "co-list-item__tip", content: this.label, placement: "top", disabled: !this.labelTruncated }, index.h("span", { key: '3b27db5590486bab2c4b8819548dbb13c332a13b', class: "co-list-item__label", ref: (el) => {
+            }, part: "item", role: "option", tabindex: this.disabled ? -1 : 0, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, index.h("span", { key: 'da8fd1370809682631096a21da839a4092314a1b', class: "co-list-item__prefix" }, this.icon && index.h("co-icon", { key: '74c1a4cd94f272ff08f2236b130e60420e39aaf5', name: this.icon, size: 18 }), index.h("slot", { key: 'e70c4aa6c6498b410e2a4e88e5ab31b833d1ed81', name: "prefix" })), index.h("div", { key: 'b3e358b51214013373dc0b357ca9456ce96e23d3', class: "co-list-item__content" }, this.label && (index.h("co-tooltip", { key: '4fe172f4d48b26883edc4455f06a7b6f2127314d', block: true, class: "co-list-item__tip", content: this.label, placement: "top", disabled: !this.labelTruncated }, index.h("span", { key: '3885043ecaa5b3a302b2c1d34bce6c50546deaf0', class: "co-list-item__label", ref: (el) => {
                 this.labelEl = el;
                 if (el && this.ro)
                     this.ro.observe(el);
-            } }, this.label))), this.description && (index.h("co-tooltip", { key: '220243aafd77d681315f0847cb3db72110330b7e', block: true, class: "co-list-item__tip", content: this.description, placement: "top", disabled: !this.descTruncated }, index.h("span", { key: 'fb8543457be7e67c7eca8461f207dad833503462', class: "co-list-item__description", ref: (el) => {
+            } }, this.label))), this.description && (index.h("co-tooltip", { key: 'b57c867bd1e925fb1778caf8d7bd27ad31ede8f4', block: true, class: "co-list-item__tip", content: this.description, placement: "top", disabled: !this.descTruncated }, index.h("span", { key: '40b8331ec57e572bad8e774b51e251a2671fc3b1', class: "co-list-item__description", ref: (el) => {
                 this.descEl = el;
                 if (el && this.ro)
                     this.ro.observe(el);
-            } }, this.description))), index.h("slot", { key: 'ed7e997155bec808ef01c6300109f435a5e698b1' })), index.h("span", { key: '1601e81a0d25f685b69ebea30a13b1dac9337866', class: "co-list-item__suffix" }, index.h("slot", { key: 'f23ac07bc12c9a02810574bcb30b2a323b07b3ee', name: "suffix" }))));
+            } }, this.description))), index.h("slot", { key: '61914fe8d8701e99d6a6f8b5e596c410d90544c7' })), index.h("span", { key: 'dbf531af497bf9f191351288894c4284582cc384', class: "co-list-item__suffix" }, index.h("slot", { key: '1a3c7df388d987a3b9835220bb847f3952c838d7', name: "suffix" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/co-loader.cjs.entry.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var index = require('./index-DxEFsH_t.js');
+
+const coLoaderCss = () => `:host{display:contents;--co-loader-ball:15px;--co-loader-step:25px;--co-loader-text:var(--co-font-size-14);--co-loader-gap:10px}:host([size="sm"]){--co-loader-ball:8px;--co-loader-step:14px;--co-loader-text:var(--co-font-size-12);--co-loader-gap:6px}:host([size="lg"]){--co-loader-ball:20px;--co-loader-step:33px;--co-loader-gap:12px}.co-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-loader-gap)}.co-loader--overlay{position:absolute;inset:0;background:rgba(255, 255, 255, 0.72);z-index:10}.co-loader__balls{position:relative;width:calc(var(--co-loader-step) * 3);height:var(--co-loader-ball)}.co-loader__ball{position:absolute;width:var(--co-loader-ball);height:var(--co-loader-ball);border-radius:50%;animation:co-loader-bounce 2s infinite cubic-bezier(0.28, 0.84, 0.42, 1)}.co-loader__ball--blue{background-color:#4285f4}.co-loader__ball--yellow{background-color:#fdbd00;animation-delay:0.4s}.co-loader__ball--red{background-color:#d4145a;animation-delay:0.8s}.co-loader__text{margin:0;font-family:var(--co-font-family-primary);font-size:var(--co-loader-text);color:var(--co-semantic-text-secondary);text-align:center;white-space:pre-line}@keyframes co-loader-bounce{0%,100%{transform:translateX(0) scale(1)}25%{transform:translateX(var(--co-loader-step)) scale(1.2)}50%{transform:translateX(calc(var(--co-loader-step) * 2)) scale(0.8)}75%{transform:translateX(var(--co-loader-step)) scale(1.2)}}@media (prefers-reduced-motion: reduce){.co-loader__ball{animation:none}.co-loader__ball--blue{transform:translateX(0)}.co-loader__ball--yellow{transform:translateX(var(--co-loader-step))}.co-loader__ball--red{transform:translateX(calc(var(--co-loader-step) * 2))}}`;
+
+const CoLoader = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /** Show the loader. When false the component renders nothing so it doesn't
+         *  hold layout space or run animations while hidden. */
+        this.visible = true;
+        /** Render as an absolute-positioned overlay over the nearest positioned
+         *  ancestor. When false (default) the loader is inline. */
+        this.overlay = false;
+        /** Size of the ball animation. `sm` ~42px wide for tight UI like dropdown
+         *  bodies; `md` (default) ~75px for drawers/boot; `lg` ~100px for big
+         *  empty screens. */
+        this.size = 'md';
+        /** Optional text label below the balls. Multi-line is supported. */
+        this.text = '';
+        /** CSS color for the overlay backdrop. Only applied when `overlay=true`. */
+        this.background = '';
+    }
+    render() {
+        if (!this.visible)
+            return null;
+        const style = this.overlay && this.background ? { background: this.background } : undefined;
+        return (index.h("div", { class: { 'co-loader': true, 'co-loader--overlay': this.overlay }, style: style, part: "root", role: "status", "aria-live": "polite" }, index.h("div", { class: "co-loader__balls", part: "balls" }, index.h("span", { class: "co-loader__ball co-loader__ball--blue" }), index.h("span", { class: "co-loader__ball co-loader__ball--yellow" }), index.h("span", { class: "co-loader__ball co-loader__ball--red" })), this.text && index.h("p", { class: "co-loader__text", part: "text" }, this.text)));
+    }
+};
+CoLoader.style = coLoaderCss();
+
+exports.co_loader = CoLoader;

package/dist/cjs/co-media-thumb.cjs.entry.js

@@ -0,0 +1,36 @@
+'use strict';
+
+var index = require('./index-DxEFsH_t.js');
+
+const coMediaThumbCss = () => `:host{display:block}.co-media-thumb{position:relative;overflow:hidden;width:100%;background:var(--co-color-gray-100, #f6f6f6);box-sizing:border-box}.co-media-thumb__img{width:100%;height:100%;object-fit:cover;display:block}.co-media-thumb__scrim{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(31, 28, 27, 0.28)}.co-media-thumb__play{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:rgba(255, 255, 255, 0.92)}.co-media-thumb__play-icon{display:block;margin-left:2px;}`;
+
+const CoMediaThumb = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /** Show the video overlay (dark scrim + centered play button). */
+        this.video = false;
+        /** Height of the region. Accepts a CSS length or a bare number (→ px). */
+        this.height = '132px';
+        /** Corner radius in px. */
+        this.radius = 10;
+    }
+    toCss(value) {
+        if (typeof value === 'number')
+            return `${value}px`;
+        const v = String(value).trim();
+        return /^-?\d*\.?\d+$/.test(v) ? `${v}px` : v;
+    }
+    render() {
+        var _a;
+        return (index.h("div", { key: 'daac4e719cbee00b1561e1c177e1c10c41c9b176', class: {
+                'co-media-thumb': true,
+                'co-media-thumb--video': this.video,
+            }, part: "thumb", style: {
+                height: this.toCss(this.height),
+                borderRadius: `${this.radius}px`,
+            } }, this.src ? (index.h("img", { class: "co-media-thumb__img", src: this.src, alt: (_a = this.alt) !== null && _a !== void 0 ? _a : '', part: "img" })) : (index.h("slot", null)), this.video && (index.h("div", { key: 'eb18d3023fe5d0ed32157f29b9237ad817ddb9ba', class: "co-media-thumb__scrim", part: "scrim" }, index.h("div", { key: '17746010acbdae2dfb6e6493ea283a8213bbfc66', class: "co-media-thumb__play", part: "play" }, index.h("svg", { key: 'ba88d6ce47d207c74982da22130f7d3df5f2b989', class: "co-media-thumb__play-icon", width: "16", height: "18", viewBox: "0 0 16 18", fill: "none", "aria-hidden": "true" }, index.h("path", { key: '6b92c3bfa258ec5937d1c649d379a0f79a4fd8d6', d: "M2 2l12 7-12 7z", fill: "var(--co-color-base-negro, #1f1c1b)" })))))));
+    }
+};
+CoMediaThumb.style = coMediaThumbCss();
+
+exports.co_media_thumb = CoMediaThumb;

package/dist/cjs/co-menu-divider.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BumlM92r.js');
+var index = require('./index-DxEFsH_t.js');
 
 const coMenuDividerCss = () => `:host{display:block}.co-menu-divider{border:0;border-top:1px solid var(--co-semantic-border-subtle, rgba(31, 28, 27, 0.08));margin:var(--co-spacing-xs, 4px) 0}`;
 
@@ -9,7 +9,7 @@ const CoMenuDivider = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return index.h("hr", { key: '08549f09b4a76d1bc2cd572a8f09ed9289551175', class: "co-menu-divider", role: "separator" });
+        return index.h("hr", { key: '9e29bc7905c4b9d83846ea9e85021ae0f1e34fc3', class: "co-menu-divider", role: "separator" });
     }
 };
 CoMenuDivider.style = coMenuDividerCss();