@prolibu-suite/cobalt-core 0.9.6 → 0.10.0

package/dist/esm/co-drop-zone.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-CrtiywTB.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-DH5lfRNj.js';
 
 const coDropZoneCss = () => `:host{position:relative;display:block}.co-drop-zone__overlay{position:absolute;inset:12px;z-index:70;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border-radius:16px;border:2px dashed var(--co-drop-zone-accent, var(--co-color-primary-azul, #2563eb));background:color-mix(     in srgb,     var(--co-drop-zone-accent, var(--co-color-primary-azul, #2563eb)) 8%,     rgba(255, 255, 255, 0.85)   );-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none}.co-drop-zone__badge{display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:20px;background:var(--co-color-base-blanco, #fff);color:var(--co-drop-zone-accent, var(--co-color-primary-azul, #2563eb));box-shadow:var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04))}.co-drop-zone__label{font-family:var(--co-font-family-primary);letter-spacing:var(--co-font-letter-spacing-body, -0.03em);font-size:18px;font-weight:500;color:var(--co-color-base-negro, #1f1c1b)}`;
 
@@ -53,7 +53,7 @@ const CoDropZone = class {
         this.coDragStateChange.emit(next);
     }
     render() {
-        return (h(Host, { key: '95256dff45bfd8c003a8c4e81aa221873b850df3', class: { 'co-drop-zone': true, 'co-drop-zone--active': this.active }, part: "host", style: { '--co-drop-zone-accent': this.accent }, onDragEnter: this.handleDragEnter, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("slot", { key: '4a5841592fdb7cba17a51eb49bf617f1c5c88a03' }), this.active && (h("div", { key: '80d179ef44a5c5fd6294c1252fd17c35ac1e6f28', class: "co-drop-zone__overlay", part: "overlay" }, h("div", { key: '32fcd18641cd0d766273ce2390d83460347cb358', class: "co-drop-zone__badge", part: "badge" }, h("co-icon", { key: 'c193069fd16d3935c037f6ce69606bc9342d9ad8', name: this.icon, size: 34 })), h("span", { key: 'c6827e6f837f3707778c3b6b330b29907840e46c', class: "co-drop-zone__label", part: "label" }, this.label)))));
+        return (h(Host, { key: '8c054ca976730d2a6d31026a7da431e38fb61d9d', class: { 'co-drop-zone': true, 'co-drop-zone--active': this.active }, part: "host", style: { '--co-drop-zone-accent': this.accent }, onDragEnter: this.handleDragEnter, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("slot", { key: '478ff353fc8c88d719a054bdd302ffeeec06a238' }), this.active && (h("div", { key: '64310825f2556838d525541f6dba33af521f1c2f', class: "co-drop-zone__overlay", part: "overlay" }, h("div", { key: '5567646e887cfd23a4c5e987cc0f9b7cbcda247e', class: "co-drop-zone__badge", part: "badge" }, h("co-icon", { key: '8b50b8e1615d13efaad52ef03ede3afdc4dd7869', name: this.icon, size: 34 })), h("span", { key: '10209ab792204eff4ddc86c08aac950cfae50ec1', class: "co-drop-zone__label", part: "label" }, this.label)))));
     }
 };
 CoDropZone.style = coDropZoneCss();

package/dist/esm/co-emoji-picker.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-CrtiywTB.js';
-import { l as langFromLocale } from './dateI18n-CnNpoKwg.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DH5lfRNj.js';
+import { l as langFromLocale } from './dateI18n-jYd9gu_c.js';
 import { r as rankByMatch } from './normalizeText-CQY6Ul7q.js';
 
 /**
@@ -2776,14 +2776,14 @@ const CoEmojiPicker = class {
         const stripCategories = hasRecent
             ? [RECENT_CATEGORY, ...EMOJI_CATEGORIES]
             : [...EMOJI_CATEGORIES];
-        return (h("div", { key: '7f3da124283afb57ac05c388746d07a7f63a0eca', class: "co-emoji-picker", part: "panel", role: "group", "aria-label": this.label || s.pickerLabel, style: { '--co-emoji-picker-columns': String(Math.max(1, this.columns)) }, onKeyDown: this.handleKeyDown }, this.searchable && (h("div", { key: 'eb4efeeed738dc094f155bc7bdc907e3075c2dad', class: "co-emoji-picker__search", part: "search" }, h("co-icon", { key: '042c32db076e3628e9459304f12304c7c3d85ae9', name: "magnifying-glass", size: 16 }), h("input", { key: '21c74e3a55e9b332061e73812cff512807afaabc', class: "co-emoji-picker__input", part: "input", type: "text", value: this.term, placeholder: this.searchPlaceholder || s.searchPlaceholder, onInput: this.handleInput, ref: (el) => (this.inputEl = el), role: "combobox", "aria-expanded": "true", "aria-autocomplete": "list", "aria-controls": CoEmojiPicker.GRID_ID, "aria-activedescendant": activeCellId }), this.renderTones())), this.showCategories && (h("div", { key: '7b08cac53699f975e7f331e91700f6182d208cab', class: "co-emoji-picker__categories", part: "categories", "aria-label": s.categoriesLabel }, !this.searchable && this.renderTones(), stripCategories.map((category) => {
+        return (h("div", { key: '7c7dfc4be7b8f8ea44df0f6c988cd2462b5fbdab', class: "co-emoji-picker", part: "panel", role: "group", "aria-label": this.label || s.pickerLabel, style: { '--co-emoji-picker-columns': String(Math.max(1, this.columns)) }, onKeyDown: this.handleKeyDown }, this.searchable && (h("div", { key: 'd25a0e16ced7efd0bc92b2dd104e60ea926ae042', class: "co-emoji-picker__search", part: "search" }, h("co-icon", { key: '72d9381c9e5375e2a1f7c8a01ca4d5e9d9c69b5c', name: "magnifying-glass", size: 16 }), h("input", { key: '5dc6d956f35f8497e35915faf1eb6bec424e0978', class: "co-emoji-picker__input", part: "input", type: "text", value: this.term, placeholder: this.searchPlaceholder || s.searchPlaceholder, onInput: this.handleInput, ref: (el) => (this.inputEl = el), role: "combobox", "aria-expanded": "true", "aria-autocomplete": "list", "aria-controls": CoEmojiPicker.GRID_ID, "aria-activedescendant": activeCellId }), this.renderTones())), this.showCategories && (h("div", { key: 'f590a30901ad79dffe872381ac7d19f3bb8e4185', class: "co-emoji-picker__categories", part: "categories", "aria-label": s.categoriesLabel }, !this.searchable && this.renderTones(), stripCategories.map((category) => {
             var _a, _b;
             const name = (_a = s.categories[category]) !== null && _a !== void 0 ? _a : category;
             return (h("button", { type: "button", key: category, class: {
                     'co-emoji-picker__category': true,
                     'co-emoji-picker__category--active': category === activeCategory,
                 }, "aria-label": name, "aria-current": category === activeCategory ? 'true' : undefined, title: name, onClick: () => this.jumpToCategory(category) }, h("co-icon", { name: (_b = EMOJI_CATEGORY_ICONS[category]) !== null && _b !== void 0 ? _b : 'circle', size: 16 })));
-        }))), h("div", { key: '349078ee46f1833797620c5c97da23807b7db384', class: "co-emoji-picker__scroll", part: "grid", id: CoEmojiPicker.GRID_ID, role: "listbox", "aria-label": s.gridLabel, ref: (el) => (this.scrollEl = el), onScroll: this.handleScroll }, isEmpty ? (h("div", { class: "co-emoji-picker__empty" }, h("co-icon", { name: "magnifying-glass", size: 20 }), h("span", null, this.emptyMessage || s.emptyMessage))) : (this.renderRows(rows)))));
+        }))), h("div", { key: 'e2d0322703aef9efdf8b0aeec6b5021fbfaa15f8', class: "co-emoji-picker__scroll", part: "grid", id: CoEmojiPicker.GRID_ID, role: "listbox", "aria-label": s.gridLabel, ref: (el) => (this.scrollEl = el), onScroll: this.handleScroll }, isEmpty ? (h("div", { class: "co-emoji-picker__empty" }, h("co-icon", { name: "magnifying-glass", size: 20 }), h("span", null, this.emptyMessage || s.emptyMessage))) : (this.renderRows(rows)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-empty-state.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-CrtiywTB.js';
+import { r as registerInstance, h } from './index-DH5lfRNj.js';
 
-const coEmptyStateCss = () => `:host{display:block}.co-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--co-spacing-2xl) var(--co-spacing-xl);font-family:var(--co-font-family-primary);max-width:492px;margin:0 auto}.co-empty-state__icon{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-semantic-text-muted);margin-bottom:var(--co-spacing-xl)}.co-empty-state__heading{font-size:var(--co-font-size-20);font-weight:600;color:var(--co-semantic-text-default);margin-bottom:var(--co-spacing-sm)}.co-empty-state__description{font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);line-height:1.5;margin-bottom:var(--co-spacing-xl)}.co-empty-state__actions{display:flex;gap:var(--co-spacing-md);flex-wrap:wrap;justify-content:center}.co-empty-state__actions:empty{display:none}.co-empty-state--card{gap:var(--co-spacing-3xl, 32px);padding:var(--co-spacing-5xl, 48px) var(--co-spacing-3xl, 32px);background:var(--co-color-base-blanco, #fff);box-shadow:inset 0 0 0 1px var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-lg, 16px)}.co-empty-state--card .co-empty-state__icon{margin-bottom:0;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-color-gray-600, #585858)}.co-empty-state--card .co-empty-state__heading{margin-bottom:0}.co-empty-state--card .co-empty-state__description{margin-bottom:0;line-height:1.35;color:var(--co-color-gray-600, #585858);max-width:366px}.co-empty-state--l .co-empty-state__icon{width:98px;height:98px}.co-empty-state--l .co-empty-state__heading{font-size:var(--co-font-size-24, 24px);font-weight:500;line-height:1.25}`;
+const coEmptyStateCss = () => `:host{display:block}.co-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--co-spacing-2xl) var(--co-spacing-xl);font-family:var(--co-font-family-primary);max-width:492px;margin:0 auto}.co-empty-state__icon{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-semantic-text-muted);margin-bottom:var(--co-spacing-xl)}.co-empty-state__heading{font-size:var(--co-font-size-20);font-weight:600;color:var(--co-semantic-text-default);margin-bottom:var(--co-spacing-sm)}.co-empty-state__description{font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);line-height:1.5;margin-bottom:var(--co-spacing-xl)}.co-empty-state__actions{display:flex;gap:var(--co-spacing-md);flex-wrap:wrap;justify-content:center}.co-empty-state__actions:empty{display:none}.co-empty-state--card{gap:var(--co-spacing-3xl, 32px);padding:var(--co-spacing-5xl, 48px) var(--co-spacing-3xl, 32px);background:var(--co-color-base-blanco, #fff);box-shadow:inset 0 0 0 1px var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-lg, 16px)}.co-empty-state--card .co-empty-state__icon{margin-bottom:0;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-color-gray-600, #585858)}.co-empty-state--card .co-empty-state__heading{margin-bottom:0}.co-empty-state--card .co-empty-state__description{margin-bottom:0;line-height:1.35;color:var(--co-color-gray-600, #585858);max-width:366px}.co-empty-state--l .co-empty-state__icon{width:98px;height:98px}.co-empty-state--l .co-empty-state__heading{font-size:var(--co-font-size-24, 24px);font-weight:500;line-height:1.25}.co-empty-state__icon,.co-empty-state__heading,.co-empty-state__description,.co-empty-state__actions{animation:co-empty-reveal var(--co-motion-duration-slower) var(--co-motion-ease-out) both}.co-empty-state__heading{animation-delay:var(--co-motion-duration-instant)}.co-empty-state__description{animation-delay:calc(var(--co-motion-duration-instant) * 2)}.co-empty-state__actions{animation-delay:calc(var(--co-motion-duration-instant) * 3)}@keyframes co-empty-reveal{from{opacity:0;transform:translateY(12px);filter:blur(var(--co-motion-blur-md))}to{opacity:1;transform:translateY(0);filter:none}}`;
 
 const CoEmptyState = class {
     constructor(hostRef) {
@@ -13,11 +13,11 @@ const CoEmptyState = class {
     render() {
         var _a;
         const iconWeight = (_a = this.iconWeight) !== null && _a !== void 0 ? _a : (this.variant === 'card' ? 'regular' : 'light');
-        return (h("div", { key: 'e113826d18559a68ffae18ccf6529eea99d1e3e1', class: {
+        return (h("div", { key: '4011b99b59671ad38cf5c90b5adc1b42a0353817', class: {
                 'co-empty-state': true,
                 [`co-empty-state--${this.variant}`]: true,
                 [`co-empty-state--${this.size}`]: true,
-            }, part: "empty-state" }, this.icon && (h("div", { key: 'ada3644ee8b42e431b7d433f2240a3500caa2876', class: "co-empty-state__icon" }, h("co-icon", { key: 'ecfbb6c8ffefa7e919859a960bc56390f0c1403d', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: '3473ab221979388c12fb4f5c9dd4a0816f0a9eea', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: '55065da69e04e5ac3d6859b28ecdb452320b9263', class: "co-empty-state__description" }, this.description)), h("div", { key: '2842e7935653e51f42fb389827abf7db433a00a4', class: "co-empty-state__actions" }, h("slot", { key: 'ed90d3aaced375020cfb4af1c1d44077fbba0f17' }))));
+            }, part: "empty-state" }, this.icon && (h("div", { key: 'a6899c6690bb8b9fcdd858fb63a30644b7094672', class: "co-empty-state__icon" }, h("co-icon", { key: '312945448815ae5be78074e03840909b04e5f3c4', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: '7fd7fdb5fc4922bf2c7d6aab5200bc80947c20ba', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: 'da5cddc1aa7afc32ee30f59293f66f1e30507614', class: "co-empty-state__description" }, this.description)), h("div", { key: '940a1b9ffa4022a3ee2623b7a6892000c63abfd4', class: "co-empty-state__actions" }, h("slot", { key: 'b6b9fbd93e79890193500d5c3bbbe72d32fa1e20' }))));
     }
 };
 CoEmptyState.style = coEmptyStateCss();

package/dist/esm/co-event-calendar.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-CrtiywTB.js';
-import { g as getDateStrings } from './dateI18n-CnNpoKwg.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DH5lfRNj.js';
+import { g as getDateStrings } from './dateI18n-jYd9gu_c.js';
 import { a as todayYMD, d as addDays, p as parseISO, g as getMonthMatrix, b as addMonths, e as getMonthLabel } from './dates-BU7SQCje.js';
 import { b as toEpoch, t as toUtcISO, g as getLocalTimeZone } from './tz-1EK-COrb.js';
 
@@ -357,10 +357,10 @@ const CoEventCalendar = class {
         const t = getDateStrings(this.locale);
         const views = this.viewsList;
         const a = parseISO(this.anchor);
-        return (h("div", { key: 'd0a147fee3fa5ad01d40dacbbc2a0b1adf8f3808', class: "cal" }, h("div", { key: '35feaa81dc6f139fcced1ee691864b1587b19931', class: "cal__toolbar", part: "toolbar" }, h("button", { key: 'd05cf866772e81bacd7c904ff31d7f5032431672', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("div", { key: 'b3c1389ec39de8121d807c8eec944751245b2324', class: "cal__title-group" }, h("button", { key: '17224b09c008cf0d5bae8e585f3ffc7981bf63bb', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: '2bf18c14b972a6a2b0136e67279b743b69074060', name: "caret-left", size: 16 })), h("h2", { key: '7ad21c7a35e45355870f699ecbbe79099de7e7e6', class: "cal__title", "aria-live": "polite" }, this.title()), h("button", { key: '4bb0d0287b41b4f100d09c9627afeb91bc5b57d7', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: '9bf5ab51b1d31e4d5c8274be1ca5b71ef96335a1', name: "caret-right", size: 16 }))), views.length > 1 ? (h("div", { class: "cal__views", role: "tablist" }, views.map((v) => {
+        return (h("div", { key: 'eb07a859a28ba0d09a3880a77a5b122c1ae063fb', class: "cal" }, h("div", { key: '693683cddfad9a1aed4be0bf3651cfff8b2ba1c7', class: "cal__toolbar", part: "toolbar" }, h("button", { key: '48f8fc44179b2950ea0498205f8f8a5d91d33e04', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("div", { key: '387a1cee67da85bf72e791ca2adc67f7482eb629', class: "cal__title-group" }, h("button", { key: '24d316422fb98f7d7c66ed6154a90f54a56cab12', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: 'd0c575fce693943e91de8c578bb3371bfdb6425a', name: "caret-left", size: 16 })), h("h2", { key: '1bc26dd2c49d67854a1fc922cffc519485437f6a', class: "cal__title", "aria-live": "polite" }, this.title()), h("button", { key: '0e152157ed337011d00699b450b6a5cd10016b97', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: 'c821a72abc278e325cadfeae54b4d2b05984d3ba', name: "caret-right", size: 16 }))), views.length > 1 ? (h("div", { class: "cal__views", role: "tablist" }, views.map((v) => {
             var _a;
             return (h("button", { type: "button", role: "tab", "aria-selected": this.view === v ? 'true' : 'false', class: { 'cal__view-btn': true, 'cal__view-btn--active': this.view === v }, onClick: () => this.switchView(v) }, (_a = t[v]) !== null && _a !== void 0 ? _a : v));
-        }))) : (h("span", { class: "cal__views-spacer" }))), h("div", { key: '468dd7e859c0f9cbbe7d9e48e0c4cd55fdea2ddf', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { loading: this.loading, events: this.normalized, year: a.year, month: a.month, locale: this.locale, firstDayOfWeek: this.firstDayOfWeek, timeZone: this.tz, minDate: this.minDate, maxDate: this.maxDate, editable: this.editable, selectable: this.selectable, maxLanes: this.dayMaxEvents, onCoDaySelect: this.handleDaySelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : this.view === 'week' || this.view === 'day' ? (h("co-calendar-timegrid", { loading: this.loading, events: this.normalized, dates: this.visibleDates, locale: this.locale, timeZone: this.tz, editable: this.editable, selectable: this.selectable, minDate: this.minDate, maxDate: this.maxDate, onCoRangeSelect: this.handleRangeSelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, defaultDurationMinutes: this.defaultDurationMinutes, allDaySlot: this.allDaySlot, minTime: this.minTime, maxTime: this.maxTime, slotMinutes: this.slotMinutes, snapMinutes: this.snapMinutes, scrollTime: this.scrollTime, nowIndicator: this.nowIndicator })) : (h("div", { class: "cal__placeholder" }, h("co-icon", { name: "calendar-dots", size: 32 }), h("p", null, `${this.view} view — coming soon`))))));
+        }))) : (h("span", { class: "cal__views-spacer" }))), h("div", { key: '2472ed0d314a489f41f2f46dc7988ce8860a64c2', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { loading: this.loading, events: this.normalized, year: a.year, month: a.month, locale: this.locale, firstDayOfWeek: this.firstDayOfWeek, timeZone: this.tz, minDate: this.minDate, maxDate: this.maxDate, editable: this.editable, selectable: this.selectable, maxLanes: this.dayMaxEvents, onCoDaySelect: this.handleDaySelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : this.view === 'week' || this.view === 'day' ? (h("co-calendar-timegrid", { loading: this.loading, events: this.normalized, dates: this.visibleDates, locale: this.locale, timeZone: this.tz, editable: this.editable, selectable: this.selectable, minDate: this.minDate, maxDate: this.maxDate, onCoRangeSelect: this.handleRangeSelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, defaultDurationMinutes: this.defaultDurationMinutes, allDaySlot: this.allDaySlot, minTime: this.minTime, maxTime: this.maxTime, slotMinutes: this.slotMinutes, snapMinutes: this.snapMinutes, scrollTime: this.scrollTime, nowIndicator: this.nowIndicator })) : (h("div", { class: "cal__placeholder" }, h("co-icon", { name: "calendar-dots", size: 32 }), h("p", null, `${this.view} view — coming soon`))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-event-popover.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-CrtiywTB.js';
-import { c as computePosition } from './positioning-BMdapAL8.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-DH5lfRNj.js';
+import { c as computePosition } from './positioning-DFHRS9cJ.js';
 
 const coEventPopoverCss = () => `:host{display:contents}.pop{position:fixed;margin:0;inset:auto;width:400px;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);overflow:auto;background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-default);border-radius:var(--co-border-radius-md, 14px);box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));padding:0;z-index:1000;font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);animation:co-pop-in var(--co-motion-duration-fast) var(--co-motion-ease-out);outline:none}@keyframes co-pop-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}.pop__actions{display:flex;justify-content:flex-end;gap:var(--co-spacing-xxs);padding:var(--co-spacing-sm2) var(--co-spacing-sm2) 0}.pop__head{display:flex;gap:var(--co-spacing-md);padding:var(--co-spacing-xs) var(--co-spacing-xl) var(--co-spacing-xl)}.pop__dot{flex:0 0 auto;width:14px;height:14px;border-radius:var(--co-border-radius-xxs);margin-top:5px;background:var(--co-color-primary-azul)}.pop__body{min-width:0;flex:1 1 auto}`;
 
@@ -116,7 +116,7 @@ const CoEventPopover = class {
         this.coClose.emit();
     }
     render() {
-        return (h(Host, { key: '4a80f76492bda89a6082b4794f0c924ec929dc85' }, h("div", { key: 'e8ede438958439ae0e9f2689da9fcc88419b9837', class: "pop", popover: "manual", role: "dialog", "aria-modal": "false", "aria-label": this.popoverLabel, tabIndex: -1, ref: (el) => (this.panelEl = el) }, h("div", { key: 'f09ced9c1d8e312df3218929b267e976c64207e8', class: "pop__actions", part: "actions" }, h("slot", { key: '6cfe39bfca0783530950a4e9c482b17f2104157d', name: "actions" })), h("div", { key: '1f3938226f5767fd39d1e80c28f01f2daf023540', class: "pop__head" }, this.dot && h("span", { key: '729486152ea2ab84a72270deeef917ae89ddcdba', class: "pop__dot", style: this.color ? { background: this.color } : {} }), h("div", { key: '2b9f20c48495de4327ae9e27cf1fd305a860dc39', class: "pop__body", part: "body" }, h("slot", { key: '675ce278c7de391af91e8c9235a35aa85964726d' }))))));
+        return (h(Host, { key: '8febb91e9c26e67bdd8edde9bd95e24b9a6f4b04' }, h("div", { key: '1311c574b0bae76fb85952da3b5e8531d77e1b25', class: "pop", popover: "manual", role: "dialog", "aria-modal": "false", "aria-label": this.popoverLabel, tabIndex: -1, ref: (el) => (this.panelEl = el) }, h("div", { key: '9d275e1b245f0bd4f95ba13743d6a9080b3d581a', class: "pop__actions", part: "actions" }, h("slot", { key: '322fefefddfe8ba575185fa093a980197f267311', name: "actions" })), h("div", { key: '22243bc4a6d4723843c490b9fa41796f31f401f8', class: "pop__head" }, this.dot && h("span", { key: '09d3e746f133432f0946e023e93aa92bcf5f9952', class: "pop__dot", style: this.color ? { background: this.color } : {} }), h("div", { key: '27d6f3ca1896ea02e08515db3fc8a7a58a51daeb', class: "pop__body", part: "body" }, h("slot", { key: 'd098bfca183fe303f6cb85f496f7ed1914b5e26b' }))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-fab.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-CrtiywTB.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DH5lfRNj.js';
 
 const coFabCss = () => `:host{display:inline-flex;font-family:var(--co-font-family-primary);line-height:1}.co-fab{display:inline-flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:none;border-radius:var(--co-border-radius-full);cursor:pointer;font-family:inherit;font-weight:500;white-space:nowrap;box-sizing:border-box;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-shadow:0 4px 12px rgba(31, 28, 27, 0.15)}.co-fab--xl{--co-fab-size:64px;width:64px;height:64px;font-size:var(--co-font-size-16)}.co-fab--l{--co-fab-size:56px;width:56px;height:56px;font-size:var(--co-font-size-16)}.co-fab--m{--co-fab-size:48px;width:48px;height:48px;font-size:var(--co-font-size-14)}.co-fab--s{--co-fab-size:40px;width:40px;height:40px;font-size:var(--co-font-size-14)}.co-fab--extended{width:auto;border-radius:var(--co-border-radius-lg)}.co-fab--extended.co-fab--xl{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--l{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--m{padding:0 var(--co-spacing-lg)}.co-fab--extended.co-fab--s{padding:0 var(--co-spacing-md)}.co-fab--hover-expand{justify-content:flex-start;overflow:hidden;transition:width var(--co-motion-duration-slow) var(--co-motion-ease-in-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand.co-fab--xl{padding:0 20px}.co-fab--hover-expand.co-fab--l{padding:0 16px}.co-fab--hover-expand.co-fab--m{padding:0 14px}.co-fab--hover-expand.co-fab--s{padding:0 11px}.co-fab--hover-expand:hover:not(:disabled),.co-fab--hover-expand:focus-visible{width:calc(var(--co-fab-size) + var(--co-spacing-sm2) + var(--co-fab-label-w, 0px));transition:width var(--co-motion-duration-slower) var(--co-motion-ease-spring), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand co-icon{flex-shrink:0;transition:transform var(--co-motion-duration-slower) var(--co-motion-ease-spring)}.co-fab--hover-expand:hover:not(:disabled) co-icon,.co-fab--hover-expand:focus-visible co-icon{transform:rotate(90deg)}.co-fab--hover-expand .co-fab__label{flex-shrink:0;opacity:0;transform:translateX(-6px);transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{opacity:1;transform:translateX(0);transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-out) 0.1s, transform var(--co-motion-duration-slow) var(--co-motion-ease-spring) 0.1s}@media (prefers-reduced-motion: reduce){.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{transition-delay:0s}}.co-fab--primary{background:var(--co-fab-bg, var(--co-color-base-negro, #1f1c1b));color:var(--co-semantic-on-primary)}.co-fab--primary:hover:not(:disabled){box-shadow:0 6px 20px rgba(31, 28, 27, 0.2);transform:translateY(-1px)}.co-fab--secondary{background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-subtle)}.co-fab--secondary:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab--stroke{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-fab--stroke:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab:active:not(:disabled){transform:translateY(0) scale(0.96)}.co-fab--disabled{opacity:0.4;cursor:not-allowed;box-shadow:none}.co-fab--bottom-right{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--bottom-left{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab--top-right{position:fixed;top:var(--co-fab-offset-top, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--top-left{position:fixed;top:var(--co-fab-offset-top, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab__label{line-height:1}`;
 
@@ -33,7 +33,7 @@ const CoFab = class {
         const iconSize = this.size === 'xl' ? 24 : this.size === 'l' ? 24 : this.size === 's' ? 18 : 20;
         const hasLabel = !!this.label;
         const hoverExpand = hasLabel && this.expandOnHover;
-        return (h("button", { key: '33b456dcff41cacf4783c6aacdd8d99e6b699eff', class: {
+        return (h("button", { key: 'f0d1612601922430df403628c5349b322ee8e88d', class: {
                 'co-fab': true,
                 [`co-fab--${this.variant}`]: true,
                 [`co-fab--${this.size}`]: true,
@@ -41,7 +41,7 @@ const CoFab = class {
                 'co-fab--hover-expand': hoverExpand,
                 'co-fab--disabled': this.disabled,
                 [`co-fab--${this.position}`]: this.position !== 'none',
-            }, type: "button", disabled: this.disabled, onClick: this.handleClick, onPointerEnter: this.handleExpandMeasure, onFocusin: this.handleExpandMeasure, "aria-label": this.ariaLabelText || this.label || this.icon }, h("co-icon", { key: '4d7ab37bc111369fc17277ece2e397b4207ec3f4', name: this.icon, size: iconSize }), this.label && (h("span", { key: '7de41d3f16a27dc3ce66c6b1d2731f5774046630', class: "co-fab__label", ref: (el) => (this.labelEl = el) }, this.label))));
+            }, type: "button", disabled: this.disabled, onClick: this.handleClick, onPointerEnter: this.handleExpandMeasure, onFocusin: this.handleExpandMeasure, "aria-label": this.ariaLabelText || this.label || this.icon }, h("co-icon", { key: 'fc53d94af9263b20cfce36656608962158d480ab', name: this.icon, size: iconSize }), this.label && (h("span", { key: '5a16cdace79b8fb7b6ead260d14ee4ae018ed02b', class: "co-fab__label", ref: (el) => (this.labelEl = el) }, this.label))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/co-file-field.entry.js

@@ -1,85 +1,6 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-CrtiywTB.js';
-import { R as RequiredMark } from './requiredMark-DCD-ZA51.js';
-
-/**
- * Built-in UI string dictionary for co-file-field.
- *
- * Strategy mirrors dateI18n: the component ships es/en/pt strings keyed by the
- * `locale` prop, with per-string prop overrides (uploadButtonText, dropText,
- * uploadedTitle, helperText) for full host control. Templates use `{n}` (max
- * files) and `{x}` (formatted max size) placeholders.
- */
-const DICT = {
-    es: {
-        uploadButton: 'Cargar archivo',
-        dropHint: 'Arrastra y suelta archivos aquí',
-        helperBoth: 'Puedes subir hasta {n} archivos, cada uno hasta {x}',
-        helperFiles: 'Puedes subir hasta {n} archivos',
-        helperBytes: 'Cada archivo hasta {x}',
-        uploadedTitle: 'Archivos subidos',
-        removeFile: 'Eliminar archivo',
-        copyUrl: 'Copiar enlace',
-        downloadFile: 'Descargar',
-        copied: 'Copiado',
-        dragToReorder: 'Arrastra para reordenar',
-        openPreview: 'Abrir vista previa',
-        errInvalidFormat: 'Formato no permitido: .{x}',
-        errTooLarge: 'Archivo demasiado grande: {x}',
-        errMaxFiles: 'Puedes subir hasta {n} archivos',
-    },
-    en: {
-        uploadButton: 'Upload file',
-        dropHint: 'Drag and drop files here',
-        helperBoth: 'You can upload up to {n} files, each up to {x}',
-        helperFiles: 'You can upload up to {n} files',
-        helperBytes: 'Each file up to {x}',
-        uploadedTitle: 'Uploaded files',
-        removeFile: 'Remove file',
-        copyUrl: 'Copy link',
-        downloadFile: 'Download',
-        copied: 'Copied',
-        dragToReorder: 'Drag to reorder',
-        openPreview: 'Open preview',
-        errInvalidFormat: 'Invalid format: .{x}',
-        errTooLarge: 'File too large: {x}',
-        errMaxFiles: 'You can upload up to {n} files',
-    },
-    pt: {
-        uploadButton: 'Carregar arquivo',
-        dropHint: 'Arraste e solte arquivos aqui',
-        helperBoth: 'Você pode enviar até {n} arquivos, cada um até {x}',
-        helperFiles: 'Você pode enviar até {n} arquivos',
-        helperBytes: 'Cada arquivo até {x}',
-        uploadedTitle: 'Arquivos enviados',
-        removeFile: 'Remover arquivo',
-        copyUrl: 'Copiar link',
-        downloadFile: 'Baixar',
-        copied: 'Copiado',
-        dragToReorder: 'Arraste para reordenar',
-        openPreview: 'Abrir pré-visualização',
-        errInvalidFormat: 'Formato inválido: .{x}',
-        errTooLarge: 'Arquivo muito grande: {x}',
-        errMaxFiles: 'Você pode enviar até {n} arquivos',
-    },
-};
-/** Map any BCP-47 locale (e.g. "es-CO") to a supported language; fallback 'en'. */
-function langFromLocale(locale) {
-    const l = (locale || '').toLowerCase();
-    if (l.startsWith('es'))
-        return 'es';
-    if (l.startsWith('pt'))
-        return 'pt';
-    return 'en';
-}
-/** Resolve the built-in UI strings for a locale. */
-function getFileStrings(locale) {
-    return DICT[langFromLocale(locale)];
-}
-/** Fill the `{n}` / `{x}` placeholders of a template string. */
-function fillTemplate(tpl, vars) {
-    var _a, _b;
-    return tpl.replace('{n}', String((_a = vars.n) !== null && _a !== void 0 ? _a : '')).replace('{x}', (_b = vars.x) !== null && _b !== void 0 ? _b : '');
-}
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DH5lfRNj.js';
+import { R as RequiredMark } from './requiredMark-BCJUuZvC.js';
+import { g as getFileStrings, f as fillTemplate } from './fileI18n-gKnOhsd2.js';
 
 /** Format bytes like the Figma spec: "59.25 KB" (base 1024, up to 2 decimals). */
 function formatBytes(bytes) {
@@ -104,15 +25,55 @@ function truncateLeft(name, max = 35) {
     return `...${name.slice(-max)}`;
 }
 const IMAGE_EXTS = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'svg', 'avif', 'bmp']);
-function hasImageExtension(item) {
-    const base = (item.name || item.url || '').split('?')[0];
+/** Containers a `<video>` can at least attempt to play. Kept in sync with the
+ *  `video` bucket of co-file-type-tile (mp4/mov/webm) plus the two extra
+ *  containers the browser handles natively. Whether the CODEC inside decodes
+ *  is a runtime question — co-video reports that through its error state. */
+const VIDEO_EXTS = new Set(['mp4', 'mov', 'webm', 'm4v', 'ogv']);
+function extOf(source) {
+    const base = (source || '').split('?')[0];
     const i = base.lastIndexOf('.');
-    return i >= 0 && IMAGE_EXTS.has(base.slice(i + 1).toLowerCase());
+    return i >= 0 ? base.slice(i + 1).toLowerCase() : '';
+}
+/**
+ * Lower-cased extension of an item — from its name, falling back to its url.
+ * The fallback is not decoration: hosts derive `name` from whatever the record
+ * gives them (form-vue: `fileName || name || originalName || id`), so a File
+ * populated without `fileName` arrives named after its id, extensionless, with
+ * the only ".mov" in sight sitting in the url.
+ */
+function fileExtension(item) {
+    return extOf(item.name) || extOf(item.url);
+}
+function hasImageExtension(item) {
+    return IMAGE_EXTS.has(fileExtension(item));
+}
+function hasVideoExtension(item) {
+    return VIDEO_EXTS.has(fileExtension(item));
+}
+/**
+ * A stored video we can hand to a player. `url` is required on purpose: the
+ * thumbnail is a poster frame, not the media — an item with only a poster has
+ * nothing to play.
+ */
+function isVideo(item) {
+    if (item.status !== 'done')
+        return false;
+    if (!item.url)
+        return false;
+    return hasVideoExtension(item);
 }
 /** An item renders in the previews grid when it's a stored image we can show. */
 function isImage(item) {
     if (item.status !== 'done')
         return false;
+    // A video ships with a server-generated poster; that thumbnail must NOT
+    // promote it to "image", or clicking the card opens a still frame in an
+    // <img> and the file looks unplayable. Only a PLAYABLE video is excluded
+    // though: one whose url never came through has nothing but its poster, and
+    // showing that (as this field always did) beats dropping the card.
+    if (isVideo(item))
+        return false;
     const src = item.thumbnail || item.url;
     if (!src)
         return false;
@@ -120,16 +81,23 @@ function isImage(item) {
         return true;
     return hasImageExtension(item);
 }
+/** Items that earn a card in the previews grid: images and videos alike. */
+function isPreviewable(item) {
+    return isImage(item) || isVideo(item);
+}
 /**
  * Best lightbox source: the original `url` only when it is itself an image —
  * a PDF that entered the grid via its server-generated thumbnail must open
- * the thumbnail (an `<img>` can't render the PDF).
+ * the thumbnail (an `<img>` can't render the PDF). A video always resolves to
+ * the media itself; its poster travels separately as the player's `poster`.
  */
 function previewSrc(item) {
+    if (hasVideoExtension(item))
+        return item.url || item.thumbnail;
     return hasImageExtension(item) ? item.url || item.thumbnail : item.thumbnail || item.url;
 }
 
-const coFileFieldCss = () => `: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-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;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-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 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 dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-status-error)}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-status-error)}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-status-error);font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;text-decoration:none;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-status-error)}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-file-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-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
+const coFileFieldCss = () => `: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-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;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-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 55%, transparent);border:1px dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__preview--video{position:relative;background:var(--co-color-base-negro)}.co-file-field__preview-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);color:var(--co-color-base-blanco);pointer-events:none}.co-file-field__preview-play-badge{display:flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-negro-80);box-shadow:inset 0 0 0 1px var(--co-color-opacity-blanco-25);transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview--video:hover .co-file-field__preview-play-badge{transform:scale(1.08)}.co-file-field__preview-play-badge co-icon{transform:translateX(1px)}.co-file-field__preview-ext{font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);font-weight:var(--co-font-weight-medium);letter-spacing:var(--co-font-letter-spacing-overline);color:var(--co-color-opacity-blanco-80)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-status-error)}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-status-error)}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-status-error);font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;text-decoration:none;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-status-error)}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-file-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-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
 
 const CoFileField = class {
     constructor(hostRef) {
@@ -213,6 +181,14 @@ const CoFileField = class {
             this.resetDragState();
         };
     }
+    /** Seeding `@State` here and not on the class field: the @stencil/vitest
+     *  transform doesn't apply field defaults before the first render, so a
+     *  `failedPreviews.has(...)` in render() would blow up on a bare Set
+     *  (precedente co-data-table / co-audio-player). */
+    componentWillLoad() {
+        if (!this.failedPreviews)
+            this.failedPreviews = new Set();
+    }
     connectedCallback() {
         window.addEventListener('mouseup', this.disarmDrag);
     }
@@ -353,6 +329,17 @@ const CoFileField = class {
         }
     }
     // ── Preview (in-app lightbox) ─────────────────────────────────
+    /**
+     * The previews grid and the lightbox gallery MUST agree on what they show,
+     * or the index the viewer opens on points at the wrong file. One factory,
+     * two call sites.
+     *
+     * A video stays in the grid even when its poster fails to load (the card
+     * falls back to the type tile) — dropping it would leave no way to play it.
+     */
+    previewItems() {
+        return this.parsedFiles.filter((it) => isPreviewable(it) && (isVideo(it) || !this.failedPreviews.has(this.keyFor(it))));
+    }
     /**
      * Opens the clicked image in a co-lightbox with the SAME gallery the
      * previews grid shows. The lightbox is created imperatively on
@@ -364,12 +351,10 @@ const CoFileField = class {
         if (!url)
             return;
         this.coPreviewOpen.emit({ id: this.keyFor(item), url });
-        const gallery = this.parsedFiles.filter((it) => isImage(it) && !this.failedPreviews.has(this.keyFor(it)));
-        const images = gallery.map((it) => ({
-            src: previewSrc(it),
-            thumbnail: it.thumbnail,
-            alt: it.name,
-        }));
+        const gallery = this.previewItems();
+        const images = gallery.map((it) => isVideo(it)
+            ? { src: previewSrc(it), thumbnail: it.thumbnail, alt: it.name, kind: 'video', poster: it.thumbnail }
+            : { src: previewSrc(it), thumbnail: it.thumbnail, alt: it.name });
         const startIndex = Math.max(0, gallery.findIndex((it) => this.keyFor(it) === this.keyFor(item)));
         this.closeLightbox();
         const lb = document.createElement('co-lightbox');
@@ -450,15 +435,15 @@ const CoFileField = class {
         const atCapacity = this.multiple && items.length >= this.maxFiles;
         const showDropzone = !this.readonly && (this.multiple ? !atCapacity : items.length === 0);
         const statusClass = this.status !== 'default' ? `co-file-field--${this.status}` : '';
-        const previews = items.filter((it) => isImage(it) && !this.failedPreviews.has(this.keyFor(it)));
+        const previews = this.previewItems();
         const canReorder = this.reorderable && this.multiple && !this.disabled && !this.readonly && items.length > 1;
         const capacity = this.capacityHint(s);
-        return (h("div", { key: '615291bd9c075d4f26f264602da03427e13bf35b', class: {
+        return (h("div", { key: '47a8258c141901fcb3621a24d638f0849946172e', class: {
                 'co-file-field': true,
                 'co-file-field--disabled': this.disabled,
                 'co-file-field--invalid': this.isInvalid,
                 [statusClass]: !!statusClass,
-            }, part: "wrapper" }, this.label && (h("div", { key: '0c4fbdb6c5824824bbe39a96c568f06f442955ef', class: "co-file-field__labels" }, h("label", { key: '4f8767b17adcd04d553c2cf6668c60c30a780783', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '82fb4a69b136fcdcdd3b3e81ea8d2deb8ca64e10', required: this.required })))), showDropzone && (h("div", { key: 'bce9efbedf17d917ae4bf00ae839409f63e4cccd', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '603d04815a5730f45a2462d6c2904de4c7aa83af', class: "co-file-field__labels" }, h("label", { key: 'e280970feef1f6fad7c9ce336a5002746231a7c6', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '075b35392df1a5be556dcc9dcbd2130d0a3c91a1', required: this.required })))), showDropzone && (h("div", { key: 'd9dec9f08bc063239bd7b75acc43813ab3f9aebb', class: {
                 'co-file-field__dropzone': true,
                 'co-file-field__dropzone--drag': this.dragOver,
             }, part: "dropzone", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleBrowse, onKeyDown: (e) => {
@@ -466,7 +451,18 @@ const CoFileField = class {
                     e.preventDefault();
                     this.handleBrowse();
                 }
-            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: '82c82cf57f9692bc560d4c82e0bc22a539e25e08', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: 'e2dc567ce78647717c894c877334e2eecab6b80e', name: "file-arrow-up", size: 18 }), h("span", { key: '9c0082e62f13a53d5d598623e35678db84df52b3' }, this.uploadButtonText || s.uploadButton)), h("span", { key: '3f43f21c3fb54f1d21143aa7cdf9a485ee89cf69', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: 'd4b2a12ffde1a17c5f1cdded7fb50f035ffb6f0c', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: '38e36894d82bb094d4dbd37fb10b915607bf3f13', class: "co-file-field__actions", part: "actions" }, h("slot", { key: '993f64d18baed0474f29e50418bd5883ac6bc90c', name: "actions" })), h("input", { key: '33dcec562a9c266ca3920537297ddbff2688a0a3', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: 'a78a747ee890c15d082c99770c0a8487405301ee', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: '08336c691f85e1c39216779a850e1c4eb4ad92eb', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '374c52cbaf91ab19d1781c6f4faaed809146aea5', class: "co-file-field__previews", part: "previews" }, previews.map((item) => (h("button", { class: "co-file-field__preview", part: "preview", type: "button", key: `prev-${this.keyFor(item)}`, title: item.name, "aria-label": s.openPreview, onClick: () => this.handlePreviewOpen(item) }, h("img", { src: item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })))))), h("ul", { key: '93ab31f0a3567287db8de9b5b00f4e3772988c82', class: "co-file-field__list", part: "list" }, items.map((item) => {
+            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: '61afb508be3e46257e2ffdb2bdc62d66e37055ed', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '96bb8ef3107abbee44fb5bd7c80ff2cbf39915ec', name: "file-arrow-up", size: 18 }), h("span", { key: '53950664f09064e29d1427530058e0634b287a92' }, this.uploadButtonText || s.uploadButton)), h("span", { key: 'de085f9dac492ea1b7db278a34e25ec2a8baa1d3', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: '1617a52c9773a31ff8617e7310401a95911ecc2f', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: 'f6f07691b5ec339f2ae0fa302415dd3dba04fe69', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'b5332b03438a34a82ffb565b1d2901a69729af61', name: "actions" })), h("input", { key: '5d0089ebcd857f1fa97bedcd743ab0530e75715a', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: 'cec19c438ec510dbae564c33dd3e6b739e156294', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: 'e97f2fe09fb30521d5b22238d2714d8f1002a2ed', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '569f37799d34182ff00996dd011232daf7f141a8', class: "co-file-field__previews", part: "previews" }, previews.map((item) => {
+            const key = this.keyFor(item);
+            const video = isVideo(item);
+            // A video without a usable poster still gets a card — the
+            // type tile stands in for the frame we don't have.
+            const poster = this.failedPreviews.has(key) ? '' : item.thumbnail;
+            const showImg = !video || !!poster;
+            return (h("button", { class: {
+                    'co-file-field__preview': true,
+                    'co-file-field__preview--video': video,
+                }, part: "preview", type: "button", key: `prev-${key}`, title: item.name, "aria-label": `${video ? s.playVideo : s.openPreview}: ${item.name}`, onClick: () => this.handlePreviewOpen(item) }, showImg && (h("img", { src: video ? poster : item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })), video && (h("span", { class: "co-file-field__preview-play", "aria-hidden": "true" }, h("span", { class: "co-file-field__preview-play-badge" }, h("co-icon", { name: "play", size: 20, weight: "fill" })), !poster && (h("span", { class: "co-file-field__preview-ext" }, fileExtension(item).toUpperCase()))))));
+        }))), h("ul", { key: '2de5c71b79f82cd50c5aea5818d9848956eeb1eb', class: "co-file-field__list", part: "list" }, items.map((item) => {
             const key = this.keyFor(item);
             const draggable = canReorder && item.status === 'done';
             return (h("li", { class: {
@@ -490,10 +486,10 @@ const CoFileField = class {
                     'co-file-field__action': true,
                     'co-file-field__action--copied': this.copiedKey === key,
                 }, type: "button", tabIndex: -1, "aria-label": s.copyUrl, onClick: () => this.handleCopy(item) }, h("co-icon", { name: this.copiedKey === key ? 'check' : 'copy', size: 18 })))), !this.disabled && !this.readonly && (h("co-tooltip", { content: s.removeFile }, h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, "aria-label": s.removeFile, onClick: () => this.coRemove.emit(key) }, h("co-icon", { name: "trash", size: 18 }))))));
-        })))), helper && (h("div", { key: 'd05514a8115362aa08a872baaf1293a55048ad79', class: {
+        })))), helper && (h("div", { key: 'a6a14de91f12490b54717153520e3f59b9c9ef10', class: {
                 'co-file-field__helper': true,
                 'co-file-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '0e5f2c0feb7dff2da1d549b498ed1e7ae6051448', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '716ea5cc929a44f1da1984952da2bb5a9ce0a791', class: "co-file-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '500ff53b0e1b4f894891bfc3f442ca170a2da2d0', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: 'c723bcbf23a6bcecb9f781aede09120f78fe9b55', class: "co-file-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-CrtiywTB.js';
+import { r as registerInstance, h } from './index-DH5lfRNj.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}`;
 
@@ -58,7 +58,7 @@ const CoFileTypeTile = class {
         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 (h("span", { key: 'adb6141d2b0d587d289d0d1c8f3887963a33261a', class: {
+        return (h("span", { key: '1df6dee1c0f729279f36463be6df9137bcbf4af0', class: {
                 'co-file-type-tile': true,
                 [`co-file-type-tile--${type}`]: true,
                 'co-file-type-tile--mono': !this.colorTags,
@@ -68,7 +68,7 @@ const CoFileTypeTile = class {
                 borderRadius: `${this.radius}px`,
                 background,
                 color,
-            } }, h("co-icon", { key: 'e409cbb4d9c2d08f9417058ec843a6466d875f04', name: meta.icon, size: iconSize, weight: "fill" })));
+            } }, h("co-icon", { key: '566163b957b853911e3eef15cd38c7573cf749b4', name: meta.icon, size: iconSize, weight: "fill" })));
     }
 };
 CoFileTypeTile.style = coFileTypeTileCss();

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-CrtiywTB.js';
+import { r as registerInstance, h } from './index-DH5lfRNj.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)}`;
 
@@ -16,10 +16,10 @@ const CoHelperText = class {
         };
     }
     render() {
-        return (h("div", { key: '09ca6f7214d2c25432ffb9e9fa90036d81c48200', class: {
+        return (h("div", { key: '2c4ae2b671b16dfda50eea3dd33b92c5661812fb', class: {
                 'co-helper-text': true,
                 [`co-helper-text--${this.status}`]: true,
-            }, part: "helper-text" }, h("co-icon", { key: 'd3757438d31d6a14d4c52157197818846ac3fd11', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: '7ae8d75fa07b8a6046e02d36c05b73676a68425e', class: "co-helper-text__message" }, h("slot", { key: 'd13a404f19f6b04d0b63aa2a4f68caf84d33e619' }, this.message))));
+            }, part: "helper-text" }, h("co-icon", { key: '18a15852e651204d06279be5a685c79ed927c6d0', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: '62c3d084abd1b62f90b2631953f51306293b23b7', class: "co-helper-text__message" }, h("slot", { key: '06604123763ac0f84fe1bc2ec1dd840d6ee2756d' }, this.message))));
     }
 };
 CoHelperText.style = coHelperTextCss();

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-CrtiywTB.js';
+import { r as registerInstance, h } from './index-DH5lfRNj.js';
 
-const coIconButtonCss = () => `:host{display:inline-flex}:host([disabled]){pointer-events:none}.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 var(--co-motion-duration-fast) var(--co-motion-ease-out),     background var(--co-motion-duration-fast) var(--co-motion-ease-out),     transform var(--co-motion-duration-fast) var(--co-motion-ease-out);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}.co-icon-button:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus)}.co-icon-button--dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-color-base-blanco, #fff) 45%, transparent)}.co-icon-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}@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}:host([disabled]){pointer-events:none}.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 var(--co-motion-duration-fast) var(--co-motion-ease-out),     background var(--co-motion-duration-fast) var(--co-motion-ease-out),     transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))));backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-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}.co-icon-button:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus)}.co-icon-button--dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-color-base-blanco, #fff) 45%, transparent)}.co-icon-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}@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))}}.co-icon-button__swap{display:inline-grid}.co-icon-button__swap>co-icon{grid-area:1 / 1;transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-in-out),     transform var(--co-motion-duration-base) var(--co-motion-ease-in-out),     filter var(--co-motion-duration-base) var(--co-motion-ease-in-out)}.co-icon-button__swap>co-icon:last-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:first-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:last-child{opacity:1;transform:scale(1);filter:blur(0)}`;
 
 const CoIconButton = class {
     constructor(hostRef) {
@@ -30,6 +30,8 @@ const CoIconButton = class {
         this.disabled = false;
         /** Accessible label */
         this.label = '';
+        /** Swap state: false → `icon`, true → `toggleIcon`. */
+        this.toggled = false;
         /** Icon weight */
         this.iconWeight = 'regular';
     }
@@ -48,16 +50,14 @@ const CoIconButton = class {
                     : 'var(--co-border-radius-full)',
             }
             : undefined;
-        return (h("button", { key: 'f562372b80c9bc181be338a2a8572ea5ba7071a8', class: {
+        return (h("button", { key: '0dc2858366d546995a30d0dac2ed6db5d80943c9', 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,
-            }, style: boxStyle, disabled: this.disabled, "aria-label": this.label || this.icon, part: "button" }, this.icon
-            ? h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize })
-            : null));
+            }, style: boxStyle, disabled: this.disabled, "aria-label": this.label || (this.toggled && this.toggleIcon ? this.toggleIcon : this.icon), part: "button" }, this.icon && this.toggleIcon ? (h("span", { class: { 'co-icon-button__swap': true, 'co-icon-button__swap--toggled': this.toggled }, "aria-hidden": "true" }, h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize }), h("co-icon", { name: this.toggleIcon, weight: this.iconWeight, size: resolvedIconSize }))) : this.icon ? (h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize })) : null));
     }
 };
 CoIconButton.style = coIconButtonCss();