@prolibu-suite/cobalt-core 0.9.6 → 0.10.1

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

@@ -0,0 +1,325 @@
+'use strict';
+
+var index = require('./index-MDAnKsze.js');
+var dateI18n = require('./dateI18n-BK2qHqoC.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) {
+        index.registerInstance(this, hostRef);
+        this.coInput = index.createEvent(this, "coInput", 7);
+        this.coCommit = index.createEvent(this, "coCommit", 7);
+        this.coEscape = index.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 (index.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 = dateI18n.getDateStrings(this.locale);
+        return (index.h("div", { key: 'e9feeca94b48ef78597c8a8aeb56e147cc639cac', class: { 'co-time-field': true, 'co-time-field--disabled': this.disabled }, role: "group", "aria-label": this.fieldLabel || t.timeFieldLabel }, index.h("span", { key: 'a1b992c5bbb5dfd2dfec4aedadf7f432a218a36c', class: "co-time-field__segs" }, this.renderSeg('hour', t), index.h("span", { key: 'dbc63905e7c40a17e01dd2a7e69b914c9d5359e3', class: "co-time-field__sep", "aria-hidden": "true" }, ":"), this.renderSeg('minute', t), this.hour12 && this.renderSeg('period', t)), index.h("span", { key: 'b48347646ac193984b5d247709280ef00569c5d8', class: "co-time-field__steppers" }, index.h("button", { key: '594b11fc3e26a3a6f72becbb6eed0896304dd773', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(1) }, index.h("co-icon", { key: 'd7467c53e0e863633c5efc0ce1574e43f2f317ad', name: "caret-up", size: 10 })), index.h("button", { key: 'c8a0e2aeeb202d09d7f6b96fadc10c96d2cd5b7c', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(-1) }, index.h("co-icon", { key: '4358757b857d4011f0b05dcb14b82f35057c7e64', name: "caret-down", size: 10 })))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "value": [{
+                "syncFromValue": 0
+            }]
+    }; }
+};
+CoTimeField.style = coTimeFieldCss();
+
+exports.co_time_field = CoTimeField;

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-DK-2Lzmf.js');
+var index = require('./index-MDAnKsze.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/cjs/co-toggle-button-group.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-DK-2Lzmf.js');
+var index = require('./index-MDAnKsze.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:var(--co-toggle-track-gap, 2px);padding:var(--co-toggle-track-padding, 3px);box-sizing:border-box;border-radius:var(--co-toggle-track-radius, 10px);background:var(--co-toggle-track-bg, var(--co-semantic-surface-muted));box-shadow:var(--co-toggle-track-ring, 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) {
@@ -72,13 +72,13 @@ const CoToggleButtonGroup = class {
         });
     }
     render() {
-        return (index.h("div", { key: '1b6e22dee9634178aea0d3dc3a0f411ec91cc5aa', class: {
+        return (index.h("div", { key: '96c8d3f028dba5afbfb0ea1ca636a60133e389b5', 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" }, index.h("slot", { key: 'a86ecce7e4e3ade114cee1e6f023df88c0a6df4c' })));
+            }, role: "group" }, index.h("slot", { key: '58f5d4374160b3dd8befd75e8dc1b78b741927c0' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-DK-2Lzmf.js');
+var index = require('./index-MDAnKsze.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:var(--co-toggle-pill-height, 30px);border-radius:var(--co-toggle-pill-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-toggle-pill-border, var(--co-semantic-border-default));box-shadow:var(--co-toggle-pill-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-toggle-pill-border, var(--co-semantic-border-default))}`;
 
 const CoToggleButton = class {
     constructor(hostRef) {
@@ -25,13 +25,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 (index.h("button", { key: '01e466c86b14cbd508881c85a833e30281345a30', class: {
+        return (index.h("button", { key: '9f8e5b8b74b68e3682acf0b395474e1d9a8016d7', 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 }, index.h("slot", { key: '395d8fb745fbcc903ce45bc5bba9b13b06f2ff7f', name: "leading" }), this.iconLeft && index.h("co-icon", { key: '372b60a45fc545e525162ff3760896ab77da36eb', name: this.iconLeft, size: iconSize, weight: iconWeight }), this.label && index.h("span", { key: '6e37705d4e3911fc2333ba2929dbd0c06aeddbfa', class: "co-toggle-button__label" }, this.label), this.iconRight && index.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 }, index.h("slot", { key: 'f955045a685046231355cb38bd4760022a68d726', name: "leading" }), this.iconLeft && index.h("co-icon", { key: '5b3d98920f33d46ab969c28adb94cf538cc1c0cb', name: this.iconLeft, size: iconSize, weight: iconWeight }), this.label && index.h("span", { key: '05baa968d95fe2a2d573a290f453eadc86640417', class: "co-toggle-button__label" }, this.label), this.iconRight && index.h("co-icon", { key: '8ed550925d947d56563c9dd9534b4e9941abb31a', name: this.iconRight, size: iconSize, weight: iconWeight })));
     }
 };
 CoToggleButton.style = coToggleButtonCss();