@prolibu-suite/cobalt-core 0.9.6 → 0.10.0

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

@@ -0,0 +1,323 @@
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DH5lfRNj.js';
+import { g as getDateStrings } from './dateI18n-jYd9gu_c.js';
+
+const coTimeFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);letter-spacing:var(--co-font-letter-spacing-body)}.co-time-field{display:flex;align-items:center;justify-content:space-between;gap:var(--co-spacing-xs);min-height:32px;padding:3px var(--co-spacing-sm) 3px var(--co-spacing-sm2);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);box-sizing:border-box;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-time-field:focus-within{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-time-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;pointer-events:none}.co-time-field__segs{display:inline-flex;align-items:center;gap:1px}.co-time-field__seg{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:24px;padding:0 3px;border-radius:var(--co-border-radius-xxs);font-size:var(--co-font-size-14);font-variant-numeric:tabular-nums;color:var(--co-semantic-text-default);box-sizing:border-box;cursor:default;user-select:none;outline:none}.co-time-field__seg:focus{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);font-weight:600}.co-time-field__seg--period{margin-left:var(--co-spacing-xs);font-size:var(--co-font-size-13)}.co-time-field__seg--empty{color:var(--co-semantic-text-muted)}.co-time-field__sep{color:var(--co-semantic-text-muted)}.co-time-field__steppers{display:inline-flex;flex-direction:column}.co-time-field__steppers button{display:inline-flex;align-items:center;justify-content:center;width:20px;height:12px;padding:0;border:0;background:transparent;color:var(--co-semantic-text-muted);cursor:pointer}.co-time-field__steppers button:hover{color:var(--co-semantic-text-default)}:host([data-touch]) .co-time-field{min-height:44px;padding:var(--co-spacing-sm) var(--co-spacing-sm2)}:host([data-touch]) .co-time-field__seg{min-width:34px;height:32px;font-size:var(--co-font-size-16)}`;
+
+const PERIOD_LABEL_CACHE = new Map();
+/**
+ * Marcadores AM/PM localizados vía Intl (cacheados por locale a nivel de
+ * módulo — molde: `LABEL_FMT_CACHE` de co-date-time-picker.tsx). Nunca
+ * hardcodear "a. m./p. m.": en-US debe leer "AM"/"PM", no la forma es-CO.
+ */
+function dayPeriodLabels(locale) {
+    var _a, _b, _c, _d;
+    const hit = PERIOD_LABEL_CACHE.get(locale);
+    if (hit)
+        return hit;
+    const fmt = new Intl.DateTimeFormat(locale, { hour: 'numeric', hour12: true });
+    const am = (_b = (_a = fmt.formatToParts(new Date(2000, 0, 1, 9, 0)).find((p) => p.type === 'dayPeriod')) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : 'AM';
+    const pm = (_d = (_c = fmt.formatToParts(new Date(2000, 0, 1, 21, 0)).find((p) => p.type === 'dayPeriod')) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : 'PM';
+    const out = { am, pm };
+    PERIOD_LABEL_CACHE.set(locale, out);
+    return out;
+}
+const CoTimeField = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.coInput = createEvent(this, "coInput", 7);
+        this.coCommit = createEvent(this, "coCommit", 7);
+        this.coEscape = createEvent(this, "coEscape", 7);
+        /** Minutos del día (0–1439) o null (vacío). */
+        this.value = null;
+        /** Reloj de 12 h. `false` = 00–23 sin segmento de período. */
+        this.hour12 = true;
+        this.locale = 'es-CO';
+        this.disabled = false;
+        /** Paso de PageUp/PageDown sobre el minuto. */
+        this.pageStep = 15;
+        this.hour24 = null; // 0–23
+        this.minute = null; // 0–59
+        this.focused = null;
+        /** Buffer de dígitos del segmento en edición (se resetea al cambiar de foco). */
+        this.buffer = '';
+        this.onSegKeyDown = (seg) => (e) => {
+            var _a;
+            if (this.disabled)
+                return;
+            const k = e.key;
+            if (k === 'Enter') {
+                e.preventDefault();
+                const m = this.minutesOfDay();
+                if (m != null)
+                    this.coCommit.emit(m);
+                return;
+            }
+            if (k === 'Escape') {
+                // stopPropagation NO: el host (picker) también escucha Escape en su root;
+                // acá solo se anuncia la intención y el host decide.
+                e.preventDefault();
+                this.coEscape.emit();
+                return;
+            }
+            if (k === 'ArrowUp' || k === 'ArrowDown') {
+                e.preventDefault();
+                this.buffer = '';
+                this.stepSegment(seg, k === 'ArrowUp' ? 1 : -1);
+                return;
+            }
+            if (k === 'PageUp' || k === 'PageDown') {
+                e.preventDefault();
+                this.buffer = '';
+                const step = Math.max(1, Math.round(this.pageStep)) * (k === 'PageUp' ? 1 : -1);
+                const cur = (_a = this.minutesOfDay()) !== null && _a !== void 0 ? _a : 9 * 60;
+                const next = (cur + step + 1440) % 1440;
+                this.hour24 = Math.floor(next / 60);
+                this.minute = next % 60;
+                this.emitDraft();
+                return;
+            }
+            if (k === 'ArrowLeft' || k === 'ArrowRight') {
+                e.preventDefault();
+                this.buffer = '';
+                const order = this.hour12 ? ['hour', 'minute', 'period'] : ['hour', 'minute'];
+                const i = order.indexOf(seg) + (k === 'ArrowRight' ? 1 : -1);
+                const target = order[Math.max(0, Math.min(order.length - 1, i))];
+                if (target !== seg)
+                    this.focusSegment(target);
+                return;
+            }
+            if (k === 'Backspace' || k === 'Delete') {
+                e.preventDefault();
+                this.buffer = '';
+                if (seg === 'hour') {
+                    this.hour24 = null;
+                    this.coInput.emit(null);
+                }
+                else if (seg === 'minute') {
+                    this.minute = null;
+                    this.coInput.emit(null);
+                }
+                return;
+            }
+            if (seg === 'period' && this.hour12 && /^[ap]$/i.test(k)) {
+                e.preventDefault();
+                const wantPm = k.toLowerCase() === 'p';
+                if (this.hour24 == null)
+                    this.hour24 = wantPm ? 21 : 9;
+                else if (wantPm !== this.isPm)
+                    this.hour24 = (this.hour24 + 12) % 24;
+                if (this.minute == null)
+                    this.minute = 0;
+                this.emitDraft();
+                return;
+            }
+            if (/^\d$/.test(k) && seg !== 'period') {
+                e.preventDefault();
+                this.typeDigit(seg, Number(k));
+            }
+        };
+        this.onStepperClick = (delta) => (e) => {
+            var _a;
+            // No robar el foco del segmento en edición.
+            e.preventDefault();
+            if (this.disabled)
+                return;
+            this.buffer = '';
+            this.stepSegment((_a = this.focused) !== null && _a !== void 0 ? _a : 'hour', delta);
+        };
+    }
+    componentWillLoad() {
+        this.syncFromValue(this.value);
+    }
+    syncFromValue(v) {
+        if (v == null || !Number.isFinite(v)) {
+            // El host limpió el value: sí vacía el estado, así que también invalida
+            // cualquier dígito a medio teclear.
+            this.buffer = '';
+            this.hour24 = null;
+            this.minute = null;
+            return;
+        }
+        const m = Math.max(0, Math.min(1439, Math.round(v)));
+        // No pisar el estado si ya representa este valor (evita loops host↔campo:
+        // el host suele hacer eco de cada `coInput` de vuelta en `value`, y ese
+        // eco NO debe borrar un dígito a medio teclear — este guard protege el
+        // buffer tanto como el estado).
+        if (this.minutesOfDay() === m)
+            return;
+        // El value externo sí difiere del estado actual: invalida el buffer.
+        this.buffer = '';
+        this.hour24 = Math.floor(m / 60);
+        this.minute = m % 60;
+    }
+    async focusInput() {
+        var _a;
+        (_a = this.hourEl) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+    // ── Derivados ──────────────────────────────────────────────
+    minutesOfDay() {
+        if (this.hour24 == null || this.minute == null)
+            return null;
+        return this.hour24 * 60 + this.minute;
+    }
+    get isPm() {
+        var _a;
+        return ((_a = this.hour24) !== null && _a !== void 0 ? _a : 0) >= 12;
+    }
+    /** Hora mostrada: 1–12 en 12 h, 0–23 en 24 h. */
+    displayHour() {
+        if (this.hour24 == null)
+            return null;
+        if (!this.hour12)
+            return this.hour24;
+        return this.hour24 % 12 || 12;
+    }
+    emitDraft() {
+        const m = this.minutesOfDay();
+        if (m != null)
+            this.coInput.emit(m);
+    }
+    // ── Edición ────────────────────────────────────────────────
+    setDisplayHour(h12) {
+        if (!this.hour12) {
+            this.hour24 = Math.max(0, Math.min(23, h12));
+        }
+        else {
+            const base = h12 % 12; // 12 → 0
+            this.hour24 = this.isPm ? base + 12 : base;
+        }
+        if (this.minute == null)
+            this.minute = 0;
+        this.emitDraft();
+    }
+    stepSegment(seg, delta) {
+        var _a, _b, _c;
+        if (seg === 'hour') {
+            const cur = (_a = this.hour24) !== null && _a !== void 0 ? _a : 9; // vacío: arranca en el default del picker (09)
+            this.hour24 = (cur + delta + 24) % 24;
+            if (this.minute == null)
+                this.minute = 0;
+        }
+        else if (seg === 'minute') {
+            const cur = (_b = this.minute) !== null && _b !== void 0 ? _b : 0;
+            this.minute = (cur + delta + 60) % 60;
+            if (this.hour24 == null)
+                this.hour24 = 9;
+        }
+        else {
+            this.hour24 = (((_c = this.hour24) !== null && _c !== void 0 ? _c : 9) + 12) % 24;
+            if (this.minute == null)
+                this.minute = 0;
+        }
+        this.emitDraft();
+    }
+    typeDigit(seg, d) {
+        this.buffer += String(d);
+        const n = Number(this.buffer);
+        if (seg === 'hour') {
+            const max = this.hour12 ? 12 : 23;
+            if (n > max) {
+                // El buffer se pasó: el dígito arranca una hora nueva.
+                this.buffer = String(d);
+            }
+            const v = Number(this.buffer);
+            if (this.hour12) {
+                if (v >= 1)
+                    this.setDisplayHour(v);
+            }
+            else if (this.buffer.length === 2 || v > 2) {
+                this.hour24 = Math.min(23, v);
+                if (this.minute == null)
+                    this.minute = 0;
+                this.emitDraft();
+            }
+            else if (v > 0) {
+                this.hour24 = v;
+                if (this.minute == null)
+                    this.minute = 0;
+                this.emitDraft();
+            }
+            // Avance automático: 2 dígitos, o el próximo dígito ya no puede extender.
+            const done = this.buffer.length === 2 || (this.hour12 ? v * 10 > 12 : v * 10 > 23);
+            if (done)
+                this.advanceFrom('hour');
+        }
+        else if (seg === 'minute') {
+            if (n > 59)
+                this.buffer = String(d);
+            const v = Number(this.buffer);
+            this.minute = v;
+            if (this.hour24 == null)
+                this.hour24 = 9;
+            this.emitDraft();
+            if (this.buffer.length === 2 || v > 5)
+                this.advanceFrom('minute');
+        }
+    }
+    advanceFrom(seg) {
+        this.buffer = '';
+        const order = this.hour12 ? ['hour', 'minute', 'period'] : ['hour', 'minute'];
+        const i = order.indexOf(seg);
+        const next = order[i + 1];
+        if (next)
+            this.focusSegment(next);
+    }
+    focusSegment(seg) {
+        var _a;
+        (_a = this.el.shadowRoot.querySelector(`.co-time-field__seg--${seg}`)) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+    // ── Render ─────────────────────────────────────────────────
+    renderSeg(seg, t) {
+        const label = seg === 'hour' ? t.hourLabel : seg === 'minute' ? t.minuteLabel : t.dayPeriodLabel;
+        let text;
+        let now = null;
+        let min = 0;
+        let max = 59;
+        if (seg === 'hour') {
+            const dh = this.displayHour();
+            text = dh == null ? '––' : String(dh).padStart(2, '0');
+            now = dh;
+            min = this.hour12 ? 1 : 0;
+            max = this.hour12 ? 12 : 23;
+        }
+        else if (seg === 'minute') {
+            text = this.minute == null ? '––' : String(this.minute).padStart(2, '0');
+            now = this.minute;
+        }
+        else {
+            const empty = this.hour24 == null;
+            const { am, pm } = dayPeriodLabels(this.locale);
+            text = this.isPm ? pm : am;
+            now = empty ? null : this.isPm ? 1 : 0;
+            min = 0;
+            max = 1;
+        }
+        const isEmpty = (seg === 'hour' && this.hour24 == null) ||
+            (seg === 'minute' && this.minute == null) ||
+            (seg === 'period' && this.hour24 == null);
+        return (h("span", { ref: seg === 'hour' ? (el) => (this.hourEl = el) : undefined, class: {
+                'co-time-field__seg': true,
+                [`co-time-field__seg--${seg}`]: true,
+                'co-time-field__seg--empty': isEmpty,
+            }, role: "spinbutton", tabIndex: this.disabled ? -1 : 0, "aria-label": label, "aria-valuemin": String(min), "aria-valuemax": String(max), "aria-valuenow": now == null ? undefined : String(now), "aria-valuetext": isEmpty ? undefined : text, "aria-disabled": this.disabled ? 'true' : undefined, onKeyDown: this.onSegKeyDown(seg), onFocus: () => {
+                this.focused = seg;
+                this.buffer = '';
+            }, onBlur: () => {
+                if (this.focused === seg)
+                    this.focused = null;
+            } }, text));
+    }
+    render() {
+        const t = getDateStrings(this.locale);
+        return (h("div", { key: '81a230dc1e49e62e2aecd3b4ac73b8909475f3cb', class: { 'co-time-field': true, 'co-time-field--disabled': this.disabled }, role: "group", "aria-label": this.fieldLabel || t.timeFieldLabel }, h("span", { key: 'e9eb2d8f0db674ffaad0352288a251df27c0fcba', class: "co-time-field__segs" }, this.renderSeg('hour', t), h("span", { key: 'cc23898617970361ed16d14acc2626c6d3d59a0a', class: "co-time-field__sep", "aria-hidden": "true" }, ":"), this.renderSeg('minute', t), this.hour12 && this.renderSeg('period', t)), h("span", { key: '3ed62834befde05e6b5d13d4acdb6594aee7b8b2', class: "co-time-field__steppers" }, h("button", { key: 'bac654a419940ada7f321c9560f2445180024283', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(1) }, h("co-icon", { key: '62c6d9fe38fa737cec659774b90bf498ffe05088', name: "caret-up", size: 10 })), h("button", { key: '90de8aef9d1eef09f9c3cc0e2680bbea4fda883e', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(-1) }, h("co-icon", { key: 'b4a1cb6877b4e415d2d94c14b2ccc1bbafb70adb', name: "caret-down", size: 10 })))));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "value": [{
+                "syncFromValue": 0
+            }]
+    }; }
+};
+CoTimeField.style = coTimeFieldCss();
+
+export { CoTimeField as co_time_field };

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h } from './index-CrtiywTB.js';
+import { r as registerInstance, c as createEvent, h } from './index-DH5lfRNj.js';
 
-const coToastCss = () => `:host{display:block;--co-toast-bg:var(--co-semantic-surface-page);--co-toast-border:var(--co-semantic-border-subtle);--co-toast-text:var(--co-semantic-text-default);--co-toast-text-secondary:var(--co-semantic-text-secondary);--co-toast-icon:var(--co-semantic-text-default);--co-toast-dismiss-bg:var(--co-semantic-surface-disabled);--co-toast-dismiss-color:var(--co-semantic-text-default)}.co-toast{display:flex;align-items:center;gap:var(--co-spacing-md);padding:var(--co-spacing-lg);background:var(--co-toast-bg);border:1px solid var(--co-toast-border);border-radius:var(--co-border-radius-sm);font-family:var(--co-font-family-primary);box-sizing:border-box;width:100%;min-width:320px;max-width:458px}.co-toast--multiline,.co-toast--stacked,.co-toast--progress{align-items:flex-start}.co-toast__icon{display:inline-flex;flex-shrink:0;color:var(--co-toast-icon)}.co-toast--multiline .co-toast__icon,.co-toast--progress .co-toast__icon{padding-top:2px}.co-toast--progress .co-toast__icon{color:var(--co-color-primary-azul, #2563eb)}.co-toast__body{display:flex;flex-direction:column;flex:1;min-width:0;gap:var(--co-spacing-md)}.co-toast__content{display:flex;flex-direction:column;gap:var(--co-spacing-xs);min-width:0}.co-toast__message{font-size:var(--co-font-size-14);font-weight:400;line-height:1.25;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-toast-text)}.co-toast__description{font-size:var(--co-font-size-12);font-weight:400;line-height:1.4;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-toast-text-secondary)}.co-toast__actions{display:flex;align-items:center;gap:var(--co-spacing-sm2);flex-shrink:0}.co-toast__actions:empty{display:none}.co-toast--stacked .co-toast__actions{justify-content:flex-end;width:100%}.co-toast__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;margin:0;border:none;border-radius:var(--co-border-radius-full);background:var(--co-toast-dismiss-bg);color:var(--co-toast-dismiss-color);cursor:pointer;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);-webkit-font-smoothing:antialiased}.co-toast__dismiss:hover{opacity:0.88}.co-toast__dismiss:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-toast--success{--co-toast-bg:var(--co-color-status-bg-success);--co-toast-border:var(--co-color-status-bg-success);--co-toast-text:var(--co-color-status-success);--co-toast-text-secondary:var(--co-color-status-success);--co-toast-icon:var(--co-color-status-success);--co-toast-dismiss-bg:var(--co-color-status-success);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--error{--co-toast-bg:var(--co-color-status-bg-error);--co-toast-border:var(--co-color-status-bg-error);--co-toast-text:var(--co-color-status-error);--co-toast-text-secondary:var(--co-color-status-error);--co-toast-icon:var(--co-color-status-error);--co-toast-dismiss-bg:var(--co-color-status-error);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--warning{--co-toast-bg:var(--co-color-status-bg-review);--co-toast-border:var(--co-color-status-bg-review);--co-toast-text:var(--co-color-status-review);--co-toast-text-secondary:var(--co-color-status-review);--co-toast-icon:var(--co-color-status-review);--co-toast-dismiss-bg:var(--co-color-status-review);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--info{--co-toast-bg:var(--co-color-status-bg-progress);--co-toast-border:var(--co-color-status-bg-progress);--co-toast-text:var(--co-color-status-progress);--co-toast-text-secondary:var(--co-color-status-progress);--co-toast-icon:var(--co-color-status-progress);--co-toast-dismiss-bg:var(--co-color-status-progress);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast__progress{min-width:0}.co-toast__progress-header{display:flex;align-items:center;gap:var(--co-spacing-md);min-width:0}.co-toast__progress-header .co-toast__content{flex:1;min-width:0}.co-toast__percent{flex-shrink:0;font-size:var(--co-font-size-12, 12px);font-weight:400;line-height:1.25;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-color-gray-500, #888888);font-variant-numeric:tabular-nums}.co-toast__track{width:100%;height:6px;margin-top:9px;border-radius:9999px;background:var(--co-color-gray-100, #f6f6f6);overflow:hidden}.co-toast__fill{display:block;height:100%;border-radius:inherit;background:var(--co-color-primary-azul, #2563eb);transition:width 0.3s ease}.co-toast{opacity:0;transform:translateY(8px) scale(0.98)}.co-toast--in{opacity:1;transform:none;transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-out),     transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-toast--in.co-toast--success{transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-out),     transform var(--co-motion-duration-slow) var(--co-motion-ease-spring)}.co-toast__check path{stroke-dasharray:1;stroke-dashoffset:1}.co-toast--in .co-toast__check path{stroke-dashoffset:0;transition:stroke-dashoffset var(--co-motion-duration-slow)     var(--co-motion-ease-out) var(--co-motion-duration-fast)}`;
+const coToastCss = () => `:host{display:block;--co-toast-bg:var(--co-semantic-surface-page);--co-toast-border:var(--co-semantic-border-subtle);--co-toast-text:var(--co-semantic-text-default);--co-toast-text-secondary:var(--co-semantic-text-secondary);--co-toast-icon:var(--co-semantic-text-default);--co-toast-dismiss-bg:var(--co-semantic-surface-disabled);--co-toast-dismiss-color:var(--co-semantic-text-default)}.co-toast{display:flex;align-items:center;gap:var(--co-spacing-md);padding:var(--co-spacing-lg);background:var(--co-toast-bg);border:1px solid var(--co-toast-border);border-radius:var(--co-border-radius-sm);font-family:var(--co-font-family-primary);box-sizing:border-box;width:100%;min-width:320px;max-width:458px}.co-toast--multiline,.co-toast--stacked,.co-toast--progress{align-items:flex-start}.co-toast__icon{display:inline-flex;flex-shrink:0;color:var(--co-toast-icon)}.co-toast--multiline .co-toast__icon,.co-toast--progress .co-toast__icon{padding-top:2px}.co-toast--progress .co-toast__icon{color:var(--co-color-primary-azul, #2563eb)}.co-toast__body{display:flex;flex-direction:column;flex:1;min-width:0;gap:var(--co-spacing-md)}.co-toast__content{display:flex;flex-direction:column;gap:var(--co-spacing-xs);min-width:0}.co-toast__message{font-size:var(--co-font-size-14);font-weight:400;line-height:1.25;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-toast-text)}.co-toast__description{font-size:var(--co-font-size-12);font-weight:400;line-height:1.4;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-toast-text-secondary)}.co-toast__actions{display:flex;align-items:center;gap:var(--co-spacing-sm2);flex-shrink:0}.co-toast__actions:empty{display:none}.co-toast--stacked .co-toast__actions{justify-content:flex-end;width:100%}.co-toast__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;margin:0;border:none;border-radius:var(--co-border-radius-full);background:var(--co-toast-dismiss-bg);color:var(--co-toast-dismiss-color);cursor:pointer;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);-webkit-font-smoothing:antialiased}.co-toast__dismiss:hover{opacity:0.88}.co-toast__dismiss:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-toast--success{--co-toast-bg:var(--co-color-status-bg-success);--co-toast-border:var(--co-color-status-bg-success);--co-toast-text:var(--co-color-status-success);--co-toast-text-secondary:var(--co-color-status-success);--co-toast-icon:var(--co-color-status-success);--co-toast-dismiss-bg:var(--co-color-status-success);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--error{--co-toast-bg:var(--co-color-status-bg-error);--co-toast-border:var(--co-color-status-bg-error);--co-toast-text:var(--co-color-status-error);--co-toast-text-secondary:var(--co-color-status-error);--co-toast-icon:var(--co-color-status-error);--co-toast-dismiss-bg:var(--co-color-status-error);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--warning{--co-toast-bg:var(--co-color-status-bg-review);--co-toast-border:var(--co-color-status-bg-review);--co-toast-text:var(--co-color-status-review);--co-toast-text-secondary:var(--co-color-status-review);--co-toast-icon:var(--co-color-status-review);--co-toast-dismiss-bg:var(--co-color-status-review);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast--info{--co-toast-bg:var(--co-color-status-bg-progress);--co-toast-border:var(--co-color-status-bg-progress);--co-toast-text:var(--co-color-status-progress);--co-toast-text-secondary:var(--co-color-status-progress);--co-toast-icon:var(--co-color-status-progress);--co-toast-dismiss-bg:var(--co-color-status-progress);--co-toast-dismiss-color:var(--co-color-base-blanco)}.co-toast__progress{min-width:0}.co-toast__progress-header{display:flex;align-items:center;gap:var(--co-spacing-md);min-width:0}.co-toast__progress-header .co-toast__content{flex:1;min-width:0}.co-toast__percent{flex-shrink:0;font-size:var(--co-font-size-12, 12px);font-weight:400;line-height:1.25;letter-spacing:var(--co-font-letter-spacing-body);color:var(--co-color-gray-500, #888888);font-variant-numeric:tabular-nums}.co-toast__track{width:100%;height:6px;margin-top:9px;border-radius:9999px;background:var(--co-color-gray-100, #f6f6f6);overflow:hidden}.co-toast__fill{display:block;height:100%;border-radius:inherit;background:var(--co-color-primary-azul, #2563eb);transition:width 0.3s ease}.co-toast{opacity:0;transform:translateY(16px) scale(0.97);filter:blur(var(--co-motion-blur-sm))}.co-toast--in{opacity:1;transform:none;filter:none;transition:opacity var(--co-motion-duration-slow) var(--co-motion-ease-out),     transform var(--co-motion-duration-slow) var(--co-motion-ease-out),     filter var(--co-motion-duration-slow) var(--co-motion-ease-out)}.co-toast--in.co-toast--success{transition:opacity var(--co-motion-duration-slow) var(--co-motion-ease-out),     filter var(--co-motion-duration-slow) var(--co-motion-ease-out),     transform var(--co-motion-duration-slow) var(--co-motion-ease-spring)}.co-toast__check path{stroke-dasharray:1;stroke-dashoffset:1}.co-toast--in .co-toast__check path{stroke-dashoffset:0;transition:stroke-dashoffset var(--co-motion-duration-slow)     var(--co-motion-ease-out) var(--co-motion-duration-fast)}`;
 
 const DEFAULT_ICON = {
     success: 'info',

package/dist/esm/co-toggle-button-group.entry.js

@@ -1,6 +1,6 @@
-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 coToggleButtonGroupCss = () => `:host{display:inline-flex}.co-toggle-button-group{display:inline-flex;gap:0}.co-toggle-button-group--row{flex-direction:row}.co-toggle-button-group--column{flex-direction:column}:host([full-width]){display:flex;width:100%}.co-toggle-button-group--full{display:flex;width:100%}.co-toggle-button-group--full.co-toggle-button-group--row ::slotted(co-toggle-button){flex:1 1 0;--co-toggle-button-width:100%}.co-toggle-button-group--row ::slotted(co-toggle-button){--co-tbr-tl:0;--co-tbr-tr:0;--co-tbr-br:0;--co-tbr-bl:0}.co-toggle-button-group--row ::slotted(co-toggle-button:first-child){--co-tbr-tl:var(--co-toggle-button-radius);--co-tbr-bl:var(--co-toggle-button-radius)}.co-toggle-button-group--row ::slotted(co-toggle-button:last-child){--co-tbr-tr:var(--co-toggle-button-radius);--co-tbr-br:var(--co-toggle-button-radius)}.co-toggle-button-group--column ::slotted(co-toggle-button){--co-tbr-tl:0;--co-tbr-tr:0;--co-tbr-br:0;--co-tbr-bl:0;width:100%}.co-toggle-button-group--column ::slotted(co-toggle-button:first-child){--co-tbr-tl:var(--co-toggle-button-radius);--co-tbr-tr:var(--co-toggle-button-radius)}.co-toggle-button-group--column ::slotted(co-toggle-button:last-child){--co-tbr-bl:var(--co-toggle-button-radius);--co-tbr-br:var(--co-toggle-button-radius)}.co-toggle-button-group--row ::slotted(co-toggle-button:not(:first-child)){margin-left:-1px}.co-toggle-button-group--column ::slotted(co-toggle-button:not(:first-child)){margin-top:-1px}.co-toggle-button-group--disabled{opacity:0.4;pointer-events:none}.co-toggle-button-group--track{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--co-color-gray-100, #f6f6f6)}.co-toggle-button-group--track ::slotted(co-toggle-button){margin:0 !important}`;
+const coToggleButtonGroupCss = () => `:host{display:inline-flex}.co-toggle-button-group{display:inline-flex;gap:0}.co-toggle-button-group--row{flex-direction:row}.co-toggle-button-group--column{flex-direction:column}:host([full-width]){display:flex;width:100%}.co-toggle-button-group--full{display:flex;width:100%}.co-toggle-button-group--full.co-toggle-button-group--row ::slotted(co-toggle-button){flex:1 1 0;--co-toggle-button-width:100%}.co-toggle-button-group--row ::slotted(co-toggle-button){--co-tbr-tl:0;--co-tbr-tr:0;--co-tbr-br:0;--co-tbr-bl:0}.co-toggle-button-group--row ::slotted(co-toggle-button:first-child){--co-tbr-tl:var(--co-toggle-button-radius);--co-tbr-bl:var(--co-toggle-button-radius)}.co-toggle-button-group--row ::slotted(co-toggle-button:last-child){--co-tbr-tr:var(--co-toggle-button-radius);--co-tbr-br:var(--co-toggle-button-radius)}.co-toggle-button-group--column ::slotted(co-toggle-button){--co-tbr-tl:0;--co-tbr-tr:0;--co-tbr-br:0;--co-tbr-bl:0;width:100%}.co-toggle-button-group--column ::slotted(co-toggle-button:first-child){--co-tbr-tl:var(--co-toggle-button-radius);--co-tbr-tr:var(--co-toggle-button-radius)}.co-toggle-button-group--column ::slotted(co-toggle-button:last-child){--co-tbr-bl:var(--co-toggle-button-radius);--co-tbr-br:var(--co-toggle-button-radius)}.co-toggle-button-group--row ::slotted(co-toggle-button:not(:first-child)){margin-left:-1px}.co-toggle-button-group--column ::slotted(co-toggle-button:not(:first-child)){margin-top:-1px}.co-toggle-button-group--disabled{opacity:0.4;pointer-events:none}.co-toggle-button-group--track{display:inline-flex;gap:2px;padding:3px;box-sizing:border-box;border-radius:10px;background:var(--co-semantic-surface-muted);box-shadow:inset 0 0 0 1px var(--co-semantic-border-subtle)}.co-toggle-button-group--track ::slotted(co-toggle-button){margin:0 !important}`;
 
 const CoToggleButtonGroup = class {
     constructor(hostRef) {
@@ -70,13 +70,13 @@ const CoToggleButtonGroup = class {
         });
     }
     render() {
-        return (h("div", { key: '1b6e22dee9634178aea0d3dc3a0f411ec91cc5aa', class: {
+        return (h("div", { key: '791c8d809965eb0287cf8c4fd8d23787e7956932', class: {
                 'co-toggle-button-group': true,
                 [`co-toggle-button-group--${this.direction}`]: true,
                 [`co-toggle-button-group--${this.variant}`]: true,
                 'co-toggle-button-group--disabled': this.disabled,
                 'co-toggle-button-group--full': this.fullWidth,
-            }, role: "group" }, h("slot", { key: 'a86ecce7e4e3ade114cee1e6f023df88c0a6df4c' })));
+            }, role: "group" }, h("slot", { key: 'fa4b4b06eeac7b90e2fa8df41f9f1b6c7b34accc' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h } from './index-CrtiywTB.js';
+import { r as registerInstance, c as createEvent, h } from './index-DH5lfRNj.js';
 
-const coToggleButtonCss = () => `:host{display:inline-flex;--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='l']){--co-toggle-button-radius:var(--co-border-radius-lg)}:host([size='m']){--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='s']){--co-toggle-button-radius:var(--co-border-radius-xs)}:host([size='xs']){--co-toggle-button-radius:var(--co-border-radius-xs)}.co-toggle-button{display:inline-flex;width:var(--co-toggle-button-width, auto);align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:1px solid var(--co-semantic-border-subtle);border-top-left-radius:var(--co-tbr-tl, var(--co-toggle-button-radius));border-top-right-radius:var(--co-tbr-tr, var(--co-toggle-button-radius));border-bottom-right-radius:var(--co-tbr-br, var(--co-toggle-button-radius));border-bottom-left-radius:var(--co-tbr-bl, var(--co-toggle-button-radius));background:color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, 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));color:var(--co-semantic-text-default);font-family:var(--co-font-family-primary);font-weight:500;cursor:pointer;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), color var(--co-motion-duration-fast) var(--co-motion-ease-out);white-space:nowrap;box-sizing:border-box;line-height:1}.co-toggle-button--l{height:48px;padding:0 var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-toggle-button--m{height:40px;padding:0 var(--co-spacing-md);font-size:var(--co-font-size-14)}.co-toggle-button--s{height:32px;padding:0 var(--co-spacing-sm2);font-size:var(--co-font-size-14)}.co-toggle-button--xs{height:24px;padding:0 var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-toggle-button--icon-only.co-toggle-button--l{width:48px;padding:0}.co-toggle-button--icon-only.co-toggle-button--m{width:40px;padding:0}.co-toggle-button--icon-only.co-toggle-button--s{width:32px;padding:0}.co-toggle-button--icon-only.co-toggle-button--xs{width:24px;padding:0}.co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-toggle-button--selected{background:var(--co-color-base-negro, #1f1c1b);color:var(--co-color-base-blanco, #fff);border-color:var(--co-color-base-negro, #1f1c1b)}.co-toggle-button--selected:hover:not(:disabled){background:var(--co-color-gray-800, #0a0a0a);border-color:var(--co-color-gray-800, #0a0a0a)}.co-toggle-button--disabled{opacity:0.4;cursor:not-allowed}.co-toggle-button__label{line-height:1}@supports not (background: color-mix(in srgb, red, transparent)){.co-toggle-button{background:var(--co-semantic-surface-secondary)}}:host([variant='track']) .co-toggle-button{height:30px;border-radius:8px;border-color:transparent;background:transparent;color:var(--co-color-gray-500, #888888);box-shadow:none;padding:0 12px;-webkit-backdrop-filter:none;backdrop-filter:none}:host([variant='track']) .co-toggle-button.co-toggle-button--icon-only{width:34px;padding:0}:host([variant='track']) .co-toggle-button:hover:not(:disabled){background:transparent;color:var(--co-color-base-negro, #1f1c1b)}:host([variant='track']) .co-toggle-button--selected{background:var(--co-color-base-blanco, #fff);color:var(--co-color-base-negro, #1f1c1b);border-color:transparent;box-shadow:var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04))}:host([variant='track']) .co-toggle-button--selected:hover:not(:disabled){background:var(--co-color-base-blanco, #fff);border-color:transparent}`;
+const coToggleButtonCss = () => `:host{display:inline-flex;--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='l']){--co-toggle-button-radius:var(--co-border-radius-lg)}:host([size='m']){--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='s']){--co-toggle-button-radius:var(--co-border-radius-xs)}:host([size='xs']){--co-toggle-button-radius:var(--co-border-radius-xs)}.co-toggle-button{display:inline-flex;width:var(--co-toggle-button-width, auto);align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:1px solid var(--co-semantic-border-subtle);border-top-left-radius:var(--co-tbr-tl, var(--co-toggle-button-radius));border-top-right-radius:var(--co-tbr-tr, var(--co-toggle-button-radius));border-bottom-right-radius:var(--co-tbr-br, var(--co-toggle-button-radius));border-bottom-left-radius:var(--co-tbr-bl, var(--co-toggle-button-radius));background:color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);-webkit-backdrop-filter:var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));backdrop-filter:var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));color:var(--co-semantic-text-default);font-family:var(--co-font-family-primary);font-weight:500;cursor:pointer;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), color var(--co-motion-duration-fast) var(--co-motion-ease-out);white-space:nowrap;box-sizing:border-box;line-height:1}.co-toggle-button--l{height:48px;padding:0 var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-toggle-button--m{height:40px;padding:0 var(--co-spacing-md);font-size:var(--co-font-size-14)}.co-toggle-button--s{height:32px;padding:0 var(--co-spacing-sm2);font-size:var(--co-font-size-14)}.co-toggle-button--xs{height:24px;padding:0 var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-toggle-button--icon-only.co-toggle-button--l{width:48px;padding:0}.co-toggle-button--icon-only.co-toggle-button--m{width:40px;padding:0}.co-toggle-button--icon-only.co-toggle-button--s{width:32px;padding:0}.co-toggle-button--icon-only.co-toggle-button--xs{width:24px;padding:0}.co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-toggle-button--selected{background:var(--co-color-base-negro, #1f1c1b);color:var(--co-color-base-blanco, #fff);border-color:var(--co-color-base-negro, #1f1c1b)}.co-toggle-button--selected:hover:not(:disabled){background:var(--co-color-gray-800, #0a0a0a);border-color:var(--co-color-gray-800, #0a0a0a)}.co-toggle-button--disabled{opacity:0.4;cursor:not-allowed}.co-toggle-button__label{line-height:1}@supports not (background: color-mix(in srgb, red, transparent)){.co-toggle-button{background:var(--co-semantic-surface-secondary)}}:host([variant='track']) .co-toggle-button{height:30px;border-radius:8px;border-color:transparent;background:transparent;color:var(--co-semantic-text-secondary);box-shadow:none;padding:0 12px;-webkit-backdrop-filter:none;backdrop-filter:none}:host([variant='track']) .co-toggle-button.co-toggle-button--icon-only{width:34px;padding:0}:host([variant='track']) .co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-hover);color:var(--co-semantic-text-default)}:host([variant='track']) .co-toggle-button--selected{background:var(--co-semantic-surface-page);color:var(--co-semantic-text-default);border-color:var(--co-semantic-border-default);box-shadow:var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04))}:host([variant='track']) .co-toggle-button--selected:hover:not(:disabled){background:var(--co-semantic-surface-page);border-color:var(--co-semantic-border-default)}`;
 
 const CoToggleButton = class {
     constructor(hostRef) {
@@ -23,13 +23,13 @@ const CoToggleButton = class {
     render() {
         const iconSize = this.variant === 'track' ? 18 : this.size === 'l' ? 20 : this.size === 'xs' ? 14 : 16;
         const iconWeight = this.selected && this.selectedIconWeight ? this.selectedIconWeight : undefined;
-        return (h("button", { key: '01e466c86b14cbd508881c85a833e30281345a30', class: {
+        return (h("button", { key: 'fb4d5d58a3f0f1be3899a5c0ff5c6f3ce3b1385b', class: {
                 'co-toggle-button': true,
                 'co-toggle-button--selected': this.selected,
                 [`co-toggle-button--${this.size}`]: true,
                 'co-toggle-button--disabled': this.disabled,
                 'co-toggle-button--icon-only': !this.label && (!!this.iconLeft || !!this.iconRight),
-            }, type: "button", disabled: this.disabled, "aria-pressed": String(this.selected), onClick: this.handleClick }, h("slot", { key: '395d8fb745fbcc903ce45bc5bba9b13b06f2ff7f', name: "leading" }), this.iconLeft && h("co-icon", { key: '372b60a45fc545e525162ff3760896ab77da36eb', name: this.iconLeft, size: iconSize, weight: iconWeight }), this.label && h("span", { key: '6e37705d4e3911fc2333ba2929dbd0c06aeddbfa', class: "co-toggle-button__label" }, this.label), this.iconRight && h("co-icon", { key: 'a6390c8abc9d2e889485d9bf3a3f441af85fb13c', name: this.iconRight, size: iconSize, weight: iconWeight })));
+            }, type: "button", disabled: this.disabled, "aria-pressed": String(this.selected), onClick: this.handleClick }, h("slot", { key: '9a3704621b35a69806808d336afb182222bfadd1', name: "leading" }), this.iconLeft && h("co-icon", { key: '937ca1ccf6bd59a40bc2901cf4df51aa83a8db8d', name: this.iconLeft, size: iconSize, weight: iconWeight }), this.label && h("span", { key: 'fdd4c2240f8ded0b0486534f7ad9d1dc2a9a6673', class: "co-toggle-button__label" }, this.label), this.iconRight && h("co-icon", { key: 'af8ee769cb015d33b9bfa6f725360d662234da68', name: this.iconRight, size: iconSize, weight: iconWeight })));
     }
 };
 CoToggleButton.style = coToggleButtonCss();

package/dist/esm/co-transfer-list.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';
 import { i as initOverlayScroll } from './overlayScroll-Bpv882_z.js';
 import './overlayscrollbars-ox7HzCZn.js';
 

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-CrtiywTB.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-DH5lfRNj.js';
 
 const coVideoCss = () => `:host{display:block;font-family:var(--co-font-family-primary);--co-video-controls-bg:linear-gradient(transparent, rgba(0, 0, 0, 0.75));--co-video-controls-color:#fff;--co-video-progress-height:4px;--co-video-progress-height-hover:8px;--co-video-accent:var(--co-color-base-blanco);--co-video-buffered:rgba(255, 255, 255, 0.25);--co-video-btn-hover:rgba(255, 255, 255, 0.16)}.co-video{position:relative;width:100%;background:#000;overflow:hidden;outline:none;user-select:none;-webkit-user-select:none}.co-video:focus-visible{outline:2px solid var(--co-semantic-border-focus-ring);outline-offset:2px}.co-video--16-9{aspect-ratio:16 / 9}.co-video--4-3{aspect-ratio:4 / 3}.co-video--1-1{aspect-ratio:1 / 1}.co-video--21-9{aspect-ratio:21 / 9}.co-video--auto{height:100%}.co-video--rounded-none{border-radius:0}.co-video--rounded-sm{border-radius:var(--co-border-radius-xs)}.co-video--rounded-md{border-radius:var(--co-border-radius-sm)}.co-video--rounded-lg{border-radius:var(--co-border-radius-lg)}.co-video--rounded-xl{border-radius:var(--co-border-radius-xl)}:host(:fullscreen){width:100%;height:100%}:host(:fullscreen) .co-video{border-radius:0 !important;aspect-ratio:unset;width:100%;height:100%}.co-video--disabled{opacity:0.5;pointer-events:none}.co-video__native{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}.co-video__click-area{position:absolute;inset:0;z-index:1;cursor:pointer}.co-video__poster{position:absolute;inset:0;z-index:1;background-size:cover;background-position:center;background-repeat:no-repeat}.co-video__loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:3;pointer-events:none}.co-video__spinner{width:40px;height:40px;border:3px solid rgba(255, 255, 255, 0.15);border-top-color:#fff;border-radius:50%;animation:co-video-spin 0.7s linear infinite}@keyframes co-video-spin{to{transform:rotate(360deg)}}.co-video__big-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;cursor:pointer;background:transparent;border:none;padding:0;color:#fff}.co-video__big-play-circle{width:72px;height:72px;border-radius:var(--co-border-radius-full);background:rgba(0, 0, 0, 0.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out), background var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-video__big-play:hover .co-video__big-play-circle{transform:scale(1.1);background:rgba(0, 0, 0, 0.7)}.co-video__error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);z-index:4;background:rgba(0, 0, 0, 0.85);color:#fff}.co-video__error-text{font-size:var(--co-font-size-14);color:rgba(255, 255, 255, 0.7);margin:0;text-align:center;padding:0 var(--co-spacing-xl)}.co-video__error-retry{display:inline-flex;align-items:center;gap:var(--co-spacing-xs);padding:var(--co-spacing-sm2) var(--co-spacing-lg);border:1px solid rgba(255, 255, 255, 0.3);border-radius:var(--co-border-radius-full);background:transparent;color:#fff;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);cursor:pointer;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-video__error-retry:hover{background:rgba(255, 255, 255, 0.1);border-color:rgba(255, 255, 255, 0.5)}.co-video__controls{position:absolute;bottom:0;left:0;right:0;background:var(--co-video-controls-bg);padding:var(--co-spacing-3xl) var(--co-spacing-lg) var(--co-spacing-md);z-index:5;opacity:1;transition:opacity var(--co-motion-duration-slow) var(--co-motion-ease-out)}.co-video__controls--hidden{opacity:0;pointer-events:none}.co-video__progress{position:relative;width:100%;height:var(--co-video-progress-height);cursor:pointer;transition:height var(--co-motion-duration-fast) var(--co-motion-ease-out);margin-bottom:var(--co-spacing-sm);outline:none;touch-action:none}.co-video__progress:hover,.co-video__progress:focus-visible{height:var(--co-video-progress-height-hover)}.co-video__progress:focus-visible{outline:2px solid var(--co-semantic-border-focus-ring);outline-offset:4px;border-radius:var(--co-border-radius-full)}.co-video__progress-track{position:absolute;inset:0;background:rgba(255, 255, 255, 0.2);border-radius:var(--co-border-radius-full);overflow:hidden}.co-video__progress-buffered{position:absolute;top:0;left:0;height:100%;background:var(--co-video-buffered);border-radius:var(--co-border-radius-full);transition:width var(--co-motion-duration-slow) var(--co-motion-ease-out)}.co-video__progress-played{position:absolute;top:0;left:0;height:100%;background:var(--co-video-accent);border-radius:var(--co-border-radius-full)}.co-video__progress-thumb{position:absolute;top:50%;width:14px;height:14px;border-radius:var(--co-border-radius-full);background:var(--co-video-accent);transform:translate(-50%, -50%) scale(0);transition:transform var(--co-motion-duration-fast) var(--co-motion-ease-out);pointer-events:none}.co-video__progress:hover .co-video__progress-thumb{transform:translate(-50%, -50%) scale(1)}.co-video__toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--co-spacing-sm)}.co-video__toolbar-left,.co-video__toolbar-right{display:flex;align-items:center;gap:var(--co-spacing-sm)}.co-video__btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:transparent;color:var(--co-video-controls-color);cursor:pointer;border-radius:var(--co-border-radius-xs);padding:0;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-video__btn:hover{background:var(--co-video-btn-hover)}.co-video__btn:focus-visible{outline:2px solid #fff;outline-offset:2px}.co-video__btn--disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-video__time{font-size:var(--co-font-size-12);color:var(--co-video-controls-color);white-space:nowrap;padding:0 var(--co-spacing-xs);font-variant-numeric:tabular-nums}.co-video__volume{display:flex;align-items:center;position:relative}.co-video__volume-slider-wrap{width:0;overflow:hidden;transition:width var(--co-motion-duration-base) var(--co-motion-ease-out), opacity var(--co-motion-duration-base) var(--co-motion-ease-out);opacity:0}.co-video__volume-slider-wrap--visible{width:96px;opacity:1;overflow:visible}.co-video__volume-slider{width:96px;height:20px;display:flex;align-items:center;cursor:pointer;touch-action:none;padding:0 10px}.co-video__volume-track{position:relative;width:100%;height:4px;background:rgba(255, 255, 255, 0.2);border-radius:var(--co-border-radius-full)}.co-video__volume-fill{position:absolute;top:0;left:0;height:100%;background:var(--co-video-accent);border-radius:var(--co-border-radius-full)}.co-video__volume-thumb{position:absolute;top:50%;width:12px;height:12px;border-radius:var(--co-border-radius-full);background:var(--co-video-accent);transform:translate(-50%, -50%);pointer-events:none}.co-video__speed-wrap{position:relative}.co-video__btn--speed{width:auto;padding:0 var(--co-spacing-sm)}.co-video__speed-label{font-family:var(--co-font-family-primary);font-size:var(--co-font-size-13, 13px);font-weight:500;color:var(--co-video-controls-color)}.co-video__speed-menu{position:absolute;bottom:100%;right:0;margin-bottom:var(--co-spacing-xs);background:rgba(20, 20, 20, 0.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:var(--co-border-radius-sm);padding:var(--co-spacing-xs) 0;min-width:130px;box-shadow:var(--co-shadow-lg);z-index:10}.co-video__speed-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--co-spacing-sm) var(--co-spacing-lg);color:#fff;font-size:var(--co-font-size-14);font-family:var(--co-font-family-primary);cursor:pointer;background:transparent;border:none;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out);text-align:left}.co-video__speed-option:hover{background:rgba(255, 255, 255, 0.08)}.co-video__speed-option--active{font-weight:600}@media (max-width: 480px){.co-video__volume-slider-wrap{display:none}.co-video__toolbar{gap:var(--co-spacing-xxs)}.co-video__btn{width:32px;height:32px}.co-video__big-play-circle{width:56px;height:56px}.co-video__time{font-size:var(--co-font-size-11, 11px)}.co-video__controls{padding:var(--co-spacing-2xl) var(--co-spacing-sm2) var(--co-spacing-sm)}}`;
 
@@ -209,6 +209,12 @@ const CoVideo = class {
             }
         };
         this.handleContainerTouchStart = () => {
+            // `controlsAutoHide={false}` significa controles FIJOS: sin este guard un
+            // solo tap los apaga y ya no vuelven mientras siga reproduciendo (el resto
+            // de caminos que los reponen sí respetan el prop). En un visor que además
+            // atrapa el Tab, eso deja controles invisibles pero focusables.
+            if (!this.controlsAutoHide)
+                return;
             if (this.showControlBar && this.isPlaying) {
                 this.showControlBar = false;
             }
@@ -222,7 +228,11 @@ const CoVideo = class {
                 return;
             this.duration = this.videoEl.duration;
             this.hasError = false;
-            this.coReady.emit({ duration: this.duration });
+            this.coReady.emit({
+                duration: this.duration,
+                width: this.videoEl.videoWidth,
+                height: this.videoEl.videoHeight,
+            });
             if (this.currentTime > 0 && this.currentTime < this.duration) {
                 this.videoEl.currentTime = this.currentTime;
             }
@@ -580,10 +590,16 @@ const CoVideo = class {
     // LIFECYCLE
     // ═══════════════════════════════════════════════════
     componentWillLoad() {
+        var _a, _b;
         this.parseRates();
-        this.volumeLevel = Math.max(0, Math.min(1, this.volume));
-        this.isMuted = this.muted;
-        this.internalPlaybackRate = this.playbackRate;
+        // Los `?? default` no son paranoia: bajo el transform de @stencil/vitest
+        // los defaults de class-field (y por tanto de @Prop) no están aplicados
+        // todavía acá, así que `this.volume` llega undefined → NaN → jsdom tira
+        // al asignar `videoEl.volume` en componentDidLoad y ABORTA el resto del
+        // hook (bind de eventos ya hecho, pero autoplay y seeds no).
+        this.volumeLevel = Math.max(0, Math.min(1, (_a = this.volume) !== null && _a !== void 0 ? _a : 1));
+        this.isMuted = (_b = this.muted) !== null && _b !== void 0 ? _b : false;
+        this.internalPlaybackRate = this.playbackRate || 1;
     }
     componentDidLoad() {
         if (this.videoEl) {
@@ -591,6 +607,15 @@ const CoVideo = class {
             this.videoEl.volume = this.volumeLevel;
             this.videoEl.muted = this.isMuted;
             this.videoEl.playbackRate = this.internalPlaybackRate;
+            // Metadata (and even `canplay`) can land BEFORE these listeners bind —
+            // a cached or local file resolves inside the same task the vdom created
+            // the <video> in. The events that would have set duration / cleared the
+            // loader are already gone by now, so the player would sit forever on
+            // "0:00" with a dead seek bar. Seed from the element's own state.
+            if (this.videoEl.readyState >= 1)
+                this.onLoadedMetadata();
+            if (this.videoEl.readyState >= 3)
+                this.onCanPlay();
             if (this.autoplay && this.muted) {
                 this.videoEl.play().catch(() => { });
             }
@@ -801,14 +826,14 @@ const CoVideo = class {
     // ═══════════════════════════════════════════════════
     render() {
         const aspectClass = `co-video--${this.aspectRatio.replace(':', '-')}`;
-        return (h(Host, { key: '144618baaec004b7463e60aba02101b72b25aba2' }, h("div", { key: 'ea68f39191f31f9ee58537e24f0feac63b31fd9d', class: {
+        return (h(Host, { key: '57e64ad600356a7243a63db39a54ee20e45b3f81' }, h("div", { key: '4f76f20be1f9c0d6994c58fc41fc5a9cda08de20', class: {
                 'co-video': true,
                 [aspectClass]: true,
                 [`co-video--rounded-${this.rounded}`]: true,
                 'co-video--disabled': this.disabled,
                 'co-video--fullscreen': this.isFullscreen,
                 'co-video--playing': this.isPlaying,
-            }, part: "container", ref: el => (this.containerEl = el), role: "region", "aria-label": this.t.player, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseMove: this.handleContainerMouseMove, onMouseLeave: this.handleContainerMouseLeave, onTouchStart: this.handleContainerTouchStart }, h("video", { key: '548fab677d588d471e69ce2572990498085ed369', ref: el => (this.videoEl = el), class: "co-video__native", part: "video", src: this.src || undefined, poster: undefined, preload: this.preload, loop: this.loop, playsinline: true, tabindex: -1, controlsList: this.allowDownload ? undefined : 'nodownload' }), this.renderPoster(), this.renderLoader(), this.renderBigPlayButton(), this.renderError(), h("div", { key: 'cabe6a6d5b1c18cb92034fffd6464873eef25a7c', class: "co-video__click-area", onClick: this.handleVideoAreaClick }), this.renderControls())));
+            }, part: "container", ref: el => (this.containerEl = el), role: "region", "aria-label": this.t.player, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseMove: this.handleContainerMouseMove, onMouseLeave: this.handleContainerMouseLeave, onTouchStart: this.handleContainerTouchStart }, h("video", { key: '518abe8e649c46e5478f4f2d8b37f827fb1559c0', ref: el => (this.videoEl = el), class: "co-video__native", part: "video", src: this.src || undefined, poster: undefined, preload: this.preload, loop: this.loop, playsinline: true, tabindex: -1, controlsList: this.allowDownload ? undefined : 'nodownload' }), this.renderPoster(), this.renderLoader(), this.renderBigPlayButton(), this.renderError(), h("div", { key: '368f4a7857a0def28ebfe830fff8c38280c35900', class: "co-video__click-area", onClick: this.handleVideoAreaClick }), this.renderControls())));
     }
     get el() { return getElement(this); }
     static get watchers() { return {