@prolibu-suite/cobalt-core 0.2.0 → 0.3.0

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

@@ -0,0 +1,316 @@
+import { r as registerInstance, c as createEvent, h } from './index-CYsftTKf.js';
+import { g as getDateStrings } from './dateI18n-C1DCLOEl.js';
+import { a as todayYMD, d as addDays, p as parseISO, g as getMonthMatrix, b as addMonths, e as getMonthLabel } from './dates-tPYikBRJ.js';
+import { t as toEpoch, a as toUtcISO, g as getLocalTimeZone } from './tz-B6JZk8fL.js';
+
+/**
+ * model.ts — the calendar event model and its normalization.
+ *
+ * Hosts feed loosely-shaped events (`CoCalendarEvent`); the engine works on a
+ * strict `NormalizedEvent`. Normalization happens ONCE here so every gotcha that
+ * bit V1 is fixed in a single place:
+ *   - `allDay` is an EXPLICIT field — never inferred from a ≥24h duration.
+ *   - `end` is END-EXCLUSIVE (the instant the event stops); a missing end is
+ *     filled from a default duration, not a "+1s inclusive" hack.
+ *   - status→color is NOT hardcoded to any product palette; the host either sets
+ *     colors directly or passes a `statusColors` map. The engine stays generic.
+ *
+ * Instants for timed events are ISO-8601 strings WITH an offset/Z. All-day
+ * events use bare "YYYY-MM-DD" date strings (timezone-independent by definition).
+ */
+const DATE_ONLY_RE = /^\d{4}-\d{2}-\d{2}$/;
+const MS_PER_DAY = 86400000;
+/** Parse a bare "YYYY-MM-DD" to the UTC-midnight epoch (safe integer arithmetic). */
+function dateOnlyToUtcMs(ymd) {
+    const m = DATE_ONLY_RE.exec(ymd);
+    if (!m)
+        return null;
+    const [y, mo, d] = ymd.split('-').map(Number);
+    if (mo < 1 || mo > 12 || d < 1 || d > 31)
+        return null;
+    return Date.UTC(y, mo - 1, d);
+}
+/** Format a UTC-midnight epoch back to "YYYY-MM-DD". */
+function utcMsToDateOnly(ms) {
+    return toUtcISO(ms).slice(0, 10);
+}
+/**
+ * Normalize a single loose event. Returns `null` when the event is unusable
+ * (invalid/missing start), so callers can filter without throwing.
+ */
+function normalizeEvent(raw, options = {}) {
+    if (!raw || !raw.id || !raw.start)
+        return null;
+    const defaultDuration = options.defaultDurationMinutes ?? 60;
+    const allDay = raw.allDay === true;
+    let startMs;
+    let endMs;
+    let startStr;
+    let endStr;
+    if (allDay) {
+        const sMs = dateOnlyToUtcMs(raw.start.slice(0, 10));
+        if (sMs === null)
+            return null;
+        startMs = sMs;
+        startStr = utcMsToDateOnly(sMs);
+        if (raw.end) {
+            const eMs = dateOnlyToUtcMs(raw.end.slice(0, 10));
+            // End-exclusive: an end <= start collapses to a single day.
+            endMs = eMs !== null && eMs > sMs ? eMs : sMs + MS_PER_DAY;
+        }
+        else {
+            endMs = sMs + MS_PER_DAY;
+        }
+        endStr = utcMsToDateOnly(endMs);
+    }
+    else {
+        let sMs;
+        try {
+            sMs = toEpoch(raw.start);
+        }
+        catch {
+            return null;
+        }
+        startMs = sMs;
+        startStr = raw.start;
+        if (raw.end) {
+            let eMs;
+            try {
+                eMs = toEpoch(raw.end);
+            }
+            catch {
+                return null;
+            }
+            endMs = eMs > sMs ? eMs : sMs + defaultDuration * 60000;
+        }
+        else {
+            endMs = sMs + defaultDuration * 60000;
+        }
+        endStr = toUtcISO(endMs);
+    }
+    // Color resolution: explicit wins; else status map; else undefined (themed by CSS).
+    const statusStyle = raw.status ? options.statusColors?.[raw.status] : undefined;
+    const backgroundColor = raw.backgroundColor ?? raw.color ?? statusStyle?.backgroundColor;
+    const borderColor = raw.borderColor ?? statusStyle?.borderColor;
+    const editable = raw.editable ?? true;
+    return {
+        id: raw.id,
+        title: raw.title ?? '',
+        allDay,
+        start: startStr,
+        end: endStr,
+        startMs,
+        endMs,
+        status: raw.status,
+        backgroundColor,
+        borderColor,
+        className: raw.className,
+        editable,
+        startEditable: raw.startEditable ?? editable,
+        durationEditable: raw.durationEditable ?? editable,
+        display: raw.display ?? 'block',
+        extendedProps: raw.extendedProps ?? {},
+    };
+}
+/** Normalize a list, dropping unusable events. */
+function normalizeEvents(raw, options = {}) {
+    if (!Array.isArray(raw))
+        return [];
+    const out = [];
+    for (const e of raw) {
+        const n = normalizeEvent(e, options);
+        if (n)
+            out.push(n);
+    }
+    return out;
+}
+
+const coEventCalendarCss = () => `:host{display:flex;flex-direction:column;gap:var(--co-spacing-md);font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);block-size:100%;min-block-size:0}.cal{display:flex;flex-direction:column;gap:var(--co-spacing-md);block-size:100%;min-block-size:0}.cal__toolbar{display:flex;align-items:center;gap:var(--co-spacing-md)}.cal__nav-group{display:inline-flex;align-items:center;gap:var(--co-spacing-xs)}.cal__title{flex:1 1 auto;margin:0;text-align:center;font-size:var(--co-font-size-16, 16px);font-weight:600;text-transform:capitalize;color:var(--co-semantic-text-default)}.cal__views-spacer{flex:0 0 auto;inline-size:1px}.cal__btn{height:32px;padding:0 var(--co-spacing-md);background:none;border:1px solid var(--co-semantic-border-default);border-radius:var(--co-border-radius-xs);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__btn:hover{background:var(--co-semantic-surface-hover)}.cal__btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__icon-btn{height:32px;width:32px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;border-radius:var(--co-border-radius-xs);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__icon-btn:hover{background:var(--co-semantic-surface-hover)}.cal__icon-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__views{display:inline-flex;gap:2px;padding:2px;background:var(--co-semantic-surface-hover);border-radius:var(--co-border-radius-xs)}.cal__view-btn{height:28px;padding:0 var(--co-spacing-md);background:none;border:0;border-radius:var(--co-border-radius-xxs);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-secondary);cursor:pointer;text-transform:capitalize}.cal__view-btn--active{background:var(--co-semantic-surface-page);color:var(--co-semantic-text-default);font-weight:600;box-shadow:0 1px 2px rgba(0, 0, 0, 0.08)}.cal__view-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__body{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column}.cal__body co-calendar-month{flex:1 1 auto;min-block-size:0}.cal__placeholder{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm);color:var(--co-semantic-text-muted);text-transform:capitalize}`;
+
+const CoEventCalendar = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.coEventClick = createEvent(this, "coEventClick", 3);
+        this.coDateSelect = createEvent(this, "coDateSelect", 3);
+        this.coEventDrop = createEvent(this, "coEventDrop", 3);
+        this.coDatesSet = createEvent(this, "coDatesSet", 3);
+        this.coViewChange = createEvent(this, "coViewChange", 3);
+        this.coMoreClick = createEvent(this, "coMoreClick", 3);
+        /** Active view. Phase 1 ships `month`; week/day/agenda land in later phases. */
+        this.view = 'month';
+        /** Events: an array or a JSON string (raw-HTML use). */
+        this.events = [];
+        /** BCP-47 locale for labels. */
+        this.locale = 'es-CO';
+        /** Master interaction gate (per-event `editable` can still lock individuals). */
+        this.editable = true;
+        /** Allow empty-day selection to request a create. */
+        this.selectable = true;
+        /** Max event lanes per day before "+N more". */
+        this.dayMaxEvents = 3;
+        /** First day of week, 0=Sun..6=Sat. */
+        this.firstDayOfWeek = 1;
+        /** Views offered in the switcher. Defaults to the implemented set. */
+        this.availableViews = ['month'];
+        /** Default minutes for a timed event missing an end. */
+        this.defaultDurationMinutes = 60;
+        this.goToday = () => this.setAnchor(todayYMD());
+        this.goPrev = () => this.step(-1);
+        this.goNext = () => this.step(1);
+        // ── Month delegation handlers ───────────────────────────────────────────
+        this.handleDaySelect = (e) => {
+            const date = e.detail.date;
+            this.coDateSelect.emit({ start: date, end: addDays(date, 1), allDay: true });
+        };
+        this.handleEventClick = (e) => {
+            const ev = this.normalized.find((x) => x.id === e.detail.id);
+            if (ev)
+                this.coEventClick.emit({ event: ev });
+        };
+        this.handleEventDrop = (e) => {
+            const ev = this.normalized.find((x) => x.id === e.detail.id);
+            if (!ev)
+                return;
+            this.coEventDrop.emit({
+                event: ev,
+                start: e.detail.start,
+                end: e.detail.end,
+                oldStart: e.detail.oldStart,
+                oldEnd: e.detail.oldEnd,
+                allDay: e.detail.allDay,
+                revert: () => {
+                    /* controlled mode: host reverts by not updating `events` */
+                },
+            });
+        };
+        this.handleMoreClick = (e) => {
+            const date = e.detail.date;
+            const tz = this.tz;
+            const events = this.normalized.filter((ev) => {
+                const day = ev.allDay ? ev.start.slice(0, 10) : zonedDay(ev.startMs, tz);
+                return day === date;
+            });
+            this.coMoreClick.emit({ date, events });
+        };
+    }
+    componentWillLoad() {
+        this.anchor = this.date && parseISO(this.date) ? this.date : todayYMD();
+    }
+    componentDidLoad() {
+        this.emitDatesSet();
+    }
+    onDateChange(value) {
+        if (value && parseISO(value) && value !== this.anchor) {
+            this.anchor = value;
+            this.emitDatesSet();
+        }
+    }
+    get tz() {
+        return this.timeZone || getLocalTimeZone();
+    }
+    get normalized() {
+        const raw = parseEventsProp(this.events);
+        const opts = {
+            defaultDurationMinutes: this.defaultDurationMinutes,
+            statusColors: parseStatusColors(this.statusColors),
+        };
+        return normalizeEvents(raw, opts);
+    }
+    get viewsList() {
+        return Array.isArray(this.availableViews)
+            ? this.availableViews
+            : String(this.availableViews).split(',').map((s) => s.trim()).filter(Boolean);
+    }
+    /** Visible [start, end) of the current month view, as date strings. */
+    visibleRange() {
+        const a = parseISO(this.anchor);
+        const matrix = getMonthMatrix(a.year, a.month, this.firstDayOfWeek);
+        const start = matrix[0][0].value;
+        const last = matrix[matrix.length - 1][6].value;
+        return { start, end: addDays(last, 1) };
+    }
+    emitDatesSet() {
+        const { start, end } = this.visibleRange();
+        this.coDatesSet.emit({ view: this.view, start, end, activeDate: this.anchor });
+    }
+    setAnchor(next) {
+        this.anchor = next;
+        this.date = next;
+        this.emitDatesSet();
+    }
+    step(dir) {
+        if (this.view === 'month') {
+            this.setAnchor(addMonths(this.anchor, dir));
+        }
+        else {
+            this.setAnchor(addDays(this.anchor, dir * 7));
+        }
+    }
+    switchView(next) {
+        if (next === this.view)
+            return;
+        this.view = next;
+        this.coViewChange.emit({ view: next });
+        this.emitDatesSet();
+    }
+    title() {
+        const a = parseISO(this.anchor);
+        return getMonthLabel(a.year, a.month, this.locale, 'long');
+    }
+    render() {
+        var _a;
+        const t = getDateStrings(this.locale);
+        const views = this.viewsList;
+        const a = parseISO(this.anchor);
+        return (h("div", { key: 'dca7d290407d0815ed127e9ea85bd9581ca1238d', class: "cal" }, h("div", { key: '739c0374461233ea08fb1d7ba9dd9104194d4348', class: "cal__toolbar", part: "toolbar" }, h("div", { key: '70bc5571180aba131a52a6a46041f0a3a8227819', class: "cal__nav-group" }, h("button", { key: 'f0308bd1a9eb83b98aaabc9fcc7e08536f34e630', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("button", { key: '8979b382c37384f59f00f566afb9ade636944811', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: 'cb83fb82be3f902315c6d1072a3706dc0716fb9a', name: "caret-left", size: 16 })), h("button", { key: '4505ac7e1fdbe452349f36a696bde9a2f6a8b63e', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: 'fee0a868c53fc92ac1e31f8a6e582e3c651a727c', name: "caret-right", size: 16 }))), h("h2", { key: '4641c225889d32834236e4ff22d60b4777e1625d', class: "cal__title", "aria-live": "polite" }, this.title()), 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: '152eacc1320a7b3d0e33c31e9c6cbf04cd756855', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { 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, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : (h("div", { class: "cal__placeholder" }, h("co-icon", { name: "calendar-dots", size: 32 }), h("p", null, `${this.view} view — coming soon`))))));
+    }
+    static get watchers() { return {
+        "date": [{
+                "onDateChange": 0
+            }]
+    }; }
+};
+// ── helpers ─────────────────────────────────────────────────────────────────
+function parseEventsProp(value) {
+    if (Array.isArray(value))
+        return value;
+    if (typeof value === 'string' && value.trim()) {
+        try {
+            const parsed = JSON.parse(value);
+            return Array.isArray(parsed) ? parsed : [];
+        }
+        catch (_a) {
+            return [];
+        }
+    }
+    return [];
+}
+function parseStatusColors(value) {
+    if (!value)
+        return undefined;
+    if (typeof value === 'string') {
+        try {
+            return JSON.parse(value);
+        }
+        catch (_a) {
+            return undefined;
+        }
+    }
+    return value;
+}
+/** Local import-free wall-clock day; mirrors engine zonedDateKey to avoid a dep here. */
+function zonedDay(ms, timeZone) {
+    const parts = new Intl.DateTimeFormat('en-CA', {
+        timeZone,
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+    }).format(new Date(ms));
+    return parts; // en-CA → "YYYY-MM-DD"
+}
+CoEventCalendar.style = coEventCalendarCss();
+
+export { CoEventCalendar as co_event_calendar };

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BKmfyPZK.js';
+import { r as registerInstance, c as createEvent, h } from './index-CYsftTKf.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 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;box-shadow:0 4px 12px rgba(31, 28, 27, 0.15)}.co-fab--l{width:56px;height:56px;font-size:var(--co-font-size-16)}.co-fab--m{width:48px;height:48px;font-size:var(--co-font-size-14)}.co-fab--s{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--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--primary{background:var(--co-semantic-surface-primary);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:24px;right:24px;z-index:1000}.co-fab--bottom-left{position:fixed;bottom:24px;left:24px;z-index:1000}.co-fab--top-right{position:fixed;top:24px;right:24px;z-index:1000}.co-fab--top-left{position:fixed;top:24px;left:24px;z-index:1000}.co-fab__label{line-height:1}`;
 
@@ -20,14 +20,14 @@ const CoFab = class {
     render() {
         const iconSize = this.size === 'l' ? 24 : this.size === 's' ? 18 : 20;
         const isExtended = !!this.label;
-        return (h("button", { key: '90ffc7d273a4aca5bbe3214d9f6ba3a8c5d063da', class: {
+        return (h("button", { key: '4e5be05c3e525fa2de4930300f562d2da993cd60', class: {
                 'co-fab': true,
                 [`co-fab--${this.variant}`]: true,
                 [`co-fab--${this.size}`]: true,
                 'co-fab--extended': isExtended,
                 'co-fab--disabled': this.disabled,
                 [`co-fab--${this.position}`]: this.position !== 'none',
-            }, type: "button", disabled: this.disabled, onClick: this.handleClick, "aria-label": this.label || this.icon }, h("co-icon", { key: '29745cdc0f20d21d4d5a130d523f7a6839a9927c', name: this.icon, size: iconSize }), this.label && h("span", { key: '9314aa4e634e2bb3280bc9015e6a60b265afca43', class: "co-fab__label" }, this.label)));
+            }, type: "button", disabled: this.disabled, onClick: this.handleClick, "aria-label": this.label || this.icon }, h("co-icon", { key: 'a827e3c5bfc7fdd162c8618443eb6696a4659709', name: this.icon, size: iconSize }), this.label && h("span", { key: '879b3be3bc35fc7b2eeeebc9263e2d9a10e3f5ba', class: "co-fab__label" }, this.label)));
     }
 };
 CoFab.style = coFabCss();

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

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
-import { R as RequiredMark } from './requiredMark-DFvtYtkE.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-CYsftTKf.js';
+import { R as RequiredMark } from './requiredMark-CEbXKHcU.js';
 
 /**
  * Built-in UI string dictionary for co-file-field.
@@ -126,7 +126,7 @@ function previewSrc(item) {
     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:var(--co-semantic-surface-hover);border:1px dashed var(--co-semantic-border-default);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color 0.15s ease, background 0.15s ease}.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 0.15s ease, transform 0.15s ease}.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(240px, 282px));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 0.2s ease}.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-border-focus);transition:width 0.2s ease}.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;color:var(--co-semantic-text-secondary);transition:color 0.15s ease}.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}`;
+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-default);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color 0.15s ease, background 0.15s ease}.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 0.15s ease, transform 0.15s ease}.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(240px, 282px));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 0.2s ease}.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-border-focus);transition:width 0.2s ease}.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;color:var(--co-semantic-text-secondary);transition:color 0.15s ease}.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) {
@@ -450,12 +450,12 @@ const CoFileField = class {
         const previews = items.filter((it) => isImage(it) && !this.failedPreviews.has(this.keyFor(it)));
         const canReorder = this.reorderable && this.multiple && !this.disabled && !this.readonly && items.length > 1;
         const capacity = this.capacityHint(s);
-        return (h("div", { key: 'ec349a2beeea1fb9195d9e117056270c125dce4c', class: {
+        return (h("div", { key: 'a4bc53a3deccc7ef04de56356583a8fbcbe39649', 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: 'e89a935967628ef58775a1449a44b19dea35bfe4', class: "co-file-field__labels" }, h("label", { key: 'e24cccf041b29fc39706dacb8d3eb3c06fd8ee9d', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'ae32e17c9411158e0f69cd508f12e56bd56ed7a4', required: this.required })))), showDropzone && (h("div", { key: '6216f8858dc7195dfe3999a8ac636409ef12eb3d', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '4d4c418ff76f72ac7b491dc5173078ebcecdfbb7', class: "co-file-field__labels" }, h("label", { key: 'afe9d0d47d50178270a4a4a7f9a90af4f8472958', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'e4879bd87853fcbb0552d9e6835fb3934916c29f', required: this.required })))), showDropzone && (h("div", { key: 'f60920fe11c3d1020ffb6043f20f3a82e6905cb2', 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) => {
@@ -463,7 +463,7 @@ const CoFileField = class {
                     e.preventDefault();
                     this.handleBrowse();
                 }
-            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: 'ee667570d661b19a8fbd43f8673fc4817c95c6db', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '8f6663547642c9005f706e8f7289ffe58f6226c5', name: "file-arrow-up", size: 18 }), h("span", { key: '39e1d8c2a875b9e6249138d4b4b9ce0d2dbf4ad4' }, this.uploadButtonText || s.uploadButton)), h("span", { key: '2f317b69e38a99ec24d661145efbdb9d77ff2f67', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: 'ba3c34747e83aa42e3eb0a821ed49dd4b27457b1', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: 'b44d49306d37ec6569ee85047b57298dbf97bf96', class: "co-file-field__actions", part: "actions" }, h("slot", { key: '36a17ecbc89b70cc140045ce1b2c6b251d5363e7', name: "actions" })), h("input", { key: '07d10d77c3673fd8f92b5eacadf342469400c1cb', 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: '5fb766f14920218f0cc3cfa80256af8542dbc44e', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: 'a133328f198a7d7947cbfb1e77b822f70310ec1a', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: 'cef939986d1f70d907dcb6f3f048b4fb1fe5156d', 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: 'db43db11520f245328ee76de839112d7a4c766e5', class: "co-file-field__list", part: "list" }, items.map((item) => {
+            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: 'f9152f578e99a926a3b81996917f2a592b8d14cd', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '93a116c81906b5daaac81feb6d671d942d085bd8', name: "file-arrow-up", size: 18 }), h("span", { key: 'fb09b9218d6185d116d75368591b6b7e2be399b6' }, this.uploadButtonText || s.uploadButton)), h("span", { key: 'd4287e8a0070536125f09dfdd73925476a6cebcf', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: '5626df4c28f2f5c4967abeb839db53a39bc547d8', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: '40ec0e991be663ffe5f55618ed97de44221e9780', class: "co-file-field__actions", part: "actions" }, h("slot", { key: '2037922c65407155a051533050bab4bbaa908633', name: "actions" })), h("input", { key: '74e2fd73161811ef41eec79786598f3bc86075d8', 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: 'cff78c1550847e20bcfe5b24fd6d14a5e80033d9', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: 'fa99dad43c4982f14bc330598d27d99d44e6516c', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '83cc2ebec6af1b1baa66a74eb620c82a8eff5569', 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: 'acc3232ccadc13f72a84cc4e3dd2281499a583b7', 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: {
@@ -484,10 +484,10 @@ const CoFileField = class {
                     'co-file-field__action': true,
                     'co-file-field__action--copied': this.copiedKey === key,
                 }, type: "button", tabIndex: -1, title: this.copiedKey === key ? s.copied : s.copyUrl, "aria-label": s.copyUrl, onClick: () => this.handleCopy(item) }, h("co-icon", { name: this.copiedKey === key ? 'check' : 'copy', size: 18 }))), !this.disabled && !this.readonly && (h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, title: s.removeFile, "aria-label": s.removeFile, onClick: () => this.coRemove.emit(key) }, h("co-icon", { name: "trash", size: 18 })))));
-        })))), helper && (h("div", { key: 'ce339d27da1fd8a224bebd1a7d7ed16a3571cfec', class: {
+        })))), helper && (h("div", { key: 'ef2efaa2264b229e372679c00a554a88fed804a0', class: {
                 'co-file-field__helper': true,
                 'co-file-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '691ff2e82d45ee55e8087dd86c4389f05ecee268', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '0f35c1734cbfd2bae2be1d85948fcca8ad92e5c2', class: "co-file-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '7b9ddbcc88296ddb30cf6fe3d651afba544ef991', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '1090e1cd4508413ebda4ed649df1852be46f5fb5', class: "co-file-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
 };

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h } from './index-BKmfyPZK.js';
+import { r as registerInstance, h } from './index-CYsftTKf.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: '730e2f2657f5656ea6992bff86be3903615c51d1', class: {
+        return (h("div", { key: 'fb1894ff2656d74d2c892a6c857d98269604b04e', class: {
                 'co-helper-text': true,
                 [`co-helper-text--${this.status}`]: true,
-            }, part: "helper-text" }, h("co-icon", { key: '8612481e2e111104047506dc8ca93980723ed6b2', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: '9842f85b0f184f4d5e05c989535add23d4c423cc', class: "co-helper-text__message" }, h("slot", { key: '940cf28c1c0f5033c16970ac469029d1ebb1e5e4' }, this.message))));
+            }, part: "helper-text" }, h("co-icon", { key: 'd56c274e9f44ae16b13a02ec262d0d14b109fc5b', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: '5e776db146922fc1271bff50b1b45245baf088b3', class: "co-helper-text__message" }, h("slot", { key: 'c3f93747e7b903296d24f60f87c9e3c29c2cb1cd' }, this.message))));
     }
 };
 CoHelperText.style = coHelperTextCss();

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-BKmfyPZK.js';
+import { r as registerInstance, h } from './index-CYsftTKf.js';
 
-const coIconButtonCss = () => `:host{display:inline-flex}.co-icon-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:none;outline:none;padding:0;flex-shrink:0;transition:opacity 0.15s ease;box-sizing:border-box;-webkit-font-smoothing:antialiased;backdrop-filter:var(--co-icon-button-backdrop-filter, none);-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, none)}.co-icon-button--filled{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary)}.co-icon-button--outlined{background:var(--co-icon-button-bg, var(--co-semantic-surface-secondary));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}.co-icon-button--ghost:hover:not(:disabled){background:var(--co-semantic-surface-hover, rgba(0, 0, 0, 0.04))}.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}`;
+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 CoIconButton = class {
     constructor(hostRef) {
@@ -25,12 +25,12 @@ const CoIconButton = class {
         this.iconWeight = 'regular';
     }
     render() {
-        var _a;
+        var _a, _b;
         const iconSizeMap = {
             xl: 32, lg: 28, md: 24, sm: 20, xs: 16, xxs: 16,
         };
-        const iconSize = (_a = iconSizeMap[this.size]) !== null && _a !== void 0 ? _a : 24;
-        return (h("button", { key: 'd21f938003cb69f4747b94566a2054e4e2af4a04', class: {
+        const iconSize = (_b = (_a = this.iconSize) !== null && _a !== void 0 ? _a : iconSizeMap[this.size]) !== null && _b !== void 0 ? _b : 24;
+        return (h("button", { key: '3e53ed7dbb6d68bfecd22f29b16bb792bcc9c565', class: {
                 'co-icon-button': true,
                 [`co-icon-button--${this.variant}`]: true,
                 [`co-icon-button--${this.shape}`]: true,

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

@@ -1,39 +1,47 @@
-import { r as registerInstance, h, H as Host } from './index-BKmfyPZK.js';
+import { r as registerInstance, h, H as Host } from './index-CYsftTKf.js';
 
-const coIconCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;color:inherit;line-height:1;flex-shrink:0}span{display:contents}svg{display:block;width:100%;height:100%;fill:currentColor}`;
-
-/** Module-level cache shared across all instances */
-const iconCache = new Map();
 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). */
+const iconCache = new Map();
 function getBasePath() {
     return globalThis.__cobaltIconBasePath || CDN_BASE;
 }
 /**
- * File naming convention in @phosphor-icons/core:
- *   regular → "plus.svg"
- *   bold/thin/light/fill/duotone → "plus-bold.svg", "plus-fill.svg", etc.
+ * Convención de nombres en @phosphor-icons/core:
+ *   regular → "plus.svg" | otros → "plus-bold.svg", "plus-fill.svg", …
  */
 function toFilename(kebab, weight) {
     return weight === 'regular' ? `${kebab}.svg` : `${kebab}-${weight}.svg`;
 }
-async function loadSvg(name, weight) {
+/**
+ * Devuelve (y cachea) la PROMESA del SVG para `(weight, name)`. Las llamadas
+ * concurrentes para el mismo icono comparten un único fetch.
+ */
+function loadSvg(name, weight) {
     const key = `${weight}/${name}`;
-    if (iconCache.has(key))
-        return iconCache.get(key);
-    const filename = toFilename(name, weight);
-    const url = `${getBasePath()}/${weight}/${filename}`;
-    try {
-        const res = await fetch(url);
-        if (!res.ok)
-            return '';
-        const svg = await res.text();
-        iconCache.set(key, svg);
-        return svg;
-    }
-    catch (_a) {
+    const cached = iconCache.get(key);
+    if (cached)
+        return cached; // hit incluso si el fetch sigue en vuelo
+    // Cache-bust opcional: ?v=<version> (ver setIconVersion). Permite Cache-Control
+    // immutable/largo en los SVG sin servir iconos stale al subir de versión de Phosphor.
+    const version = globalThis.__cobaltIconVersion;
+    const base = `${getBasePath()}/${weight}/${toFilename(name, weight)}`;
+    const url = version ? `${base}?v=${version}` : base;
+    // priority:'low' → los iconos ceden ante JS/CSS/datos críticos del boot
+    // (Fetch Priority API; ignorado sin daño donde no se soporta).
+    const p = fetch(url, { priority: 'low' })
+        .then((res) => (res.ok ? res.text() : '')) // 404 → '' (queda cacheado, no reintenta)
+        .catch(() => {
+        // Error de red: no envenenar el caché — permitir reintento futuro.
+        iconCache.delete(key);
         return '';
-    }
+    });
+    iconCache.set(key, p); // se guarda ANTES del await
+    return p;
 }
+
+const coIconCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;color:inherit;line-height:1;flex-shrink:0}span{display:contents}svg{display:block;width:100%;height:100%;fill:currentColor}`;
+
 const CoIcon = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -59,12 +67,12 @@ const CoIcon = class {
         this.svgContent = await loadSvg(this.name, this.weight);
     }
     render() {
-        return (h(Host, { key: '0fad4d5acc013ca70b12384477cb5413615c23d2', "aria-hidden": "true", style: {
+        return (h(Host, { key: '65fc20ae25aff18456c778d69454259755477cc8', "aria-hidden": "true", style: {
                 display: 'inline-flex',
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 flexShrink: '0',
-            } }, h("span", { key: '7e5199c496bb07aade0400b61415260f5fd2ee2a', part: "svg", innerHTML: this.svgContent })));
+            } }, h("span", { key: '867d361c4cd66611a38ccca0910ac93e9b41ed18', part: "svg", innerHTML: this.svgContent })));
     }
     static get watchers() { return {
         "name": [{