@prolibu-suite/cobalt-core 0.10.0 → 0.10.1

package/dist/collection/components/co-accordion/co-accordion.js

@@ -38,11 +38,11 @@ export class CoAccordion {
         return !!(this.subheading && this.subheading.trim()) || this.hasSubheadingSlot;
     }
     render() {
-        return (h("div", { key: '4e2089349432ce39bb797397aacaebd022fcbcee', class: {
+        return (h("div", { key: '96b5b0f97642972b0505d038125f9e225ee1ab2d', class: {
                 'co-accordion': true,
                 'co-accordion--open': this.open,
                 'co-accordion--disabled': this.disabled,
-            }, part: "accordion" }, h("div", { key: '4337878858bd31822201a925010f3150568fa056', class: "co-accordion__header", part: "header" }, h("span", { key: 'cf69c69cc786981ca6bd54bd0f6a6c38a3baa0b6', class: "co-accordion__heading-group" }, h("span", { key: '0e7efd52e6d48c35ce0270485e8ce6099c6a3302', class: "co-accordion__heading", part: "heading" }, h("slot", { key: 'b575ce7ae5611007490724f430819f083781f84d', name: "header" }, this.heading)), this.showSubheading && (h("span", { key: '996a58f3f3b5cd656849b413b0f998675452cc2f', class: "co-accordion__subheading", part: "subheading" }, h("slot", { key: 'a9029aa67f51162ad54c010d23bf20545883ef45', name: "subheading" }, this.subheading)))), h("button", { key: '757286aaf2914fe7d32fc14ab0f5de57ffeab48c', class: "co-accordion__caret", type: "button", "aria-expanded": this.open ? 'true' : 'false', "aria-label": this.heading || 'Toggle section', disabled: this.disabled, onClick: this.handleToggle, part: "caret" }, h("co-icon", { key: 'b4c3c96489a30607727a44955dbff2d504ef2b6e', name: "caret-up", size: 20 }))), h("div", { key: 'bd56b12cbd7484f61fec140740312800536d7b18', class: "co-accordion__body", part: "body" }, h("div", { key: '1f2ff56e7bd7a49f8484c988ecdf434d108ef4ed', class: "co-accordion__body-inner", part: "body-inner" }, h("slot", { key: '25ef25609ccece786a05709d90a32e7e135fec72' })))));
+            }, part: "accordion" }, h("div", { key: '91f8d47d2f342a48b7d88fd6385fe532f969a636', class: "co-accordion__header", part: "header" }, h("span", { key: 'b55915f1078d0b7f46ff08b7f5d78383050a8df1', class: "co-accordion__heading-group" }, h("span", { key: '99a08344b195983609dfd5d4054af8f96547ae1f', class: "co-accordion__heading", part: "heading" }, h("slot", { key: '330134f4fdbb831253bcec63bfd43968171e7c44', name: "header" }, this.heading)), this.showSubheading && (h("span", { key: '5b8fcb450d266843ff722cf9ec97d6e600cff12d', class: "co-accordion__subheading", part: "subheading" }, h("slot", { key: '51a98c7f68bd7e4d6d0705c21feb288389af5d4e', name: "subheading" }, this.subheading)))), h("button", { key: '8eea6b6fdfc04dfaf5561527dcc8d40be1069da4', class: "co-accordion__caret", type: "button", "aria-expanded": this.open ? 'true' : 'false', "aria-label": this.heading || 'Toggle section', disabled: this.disabled, onClick: this.handleToggle, part: "caret" }, h("co-icon", { key: 'a0343d006eafb7cb895584c05427d590e9c820a7', name: "caret-up", size: 20 }))), h("div", { key: '24edd828c5e12ebfcf5dce6eb99d0755e04ebe68', class: "co-accordion__body", part: "body" }, h("div", { key: '29e4e7514802a8f7269e135d4e4112def33663fa', class: "co-accordion__body-inner", part: "body-inner" }, h("slot", { key: '38e1e269578c9e949c8434c839b291e60612e538' })))));
     }
     static get is() { return "co-accordion"; }
     static get encapsulation() { return "shadow"; }
@@ -149,12 +149,12 @@ export class CoAccordion {
         return [{
                 "method": "coToggle",
                 "name": "coToggle",
-                "bubbles": true,
+                "bubbles": false,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Emitted when the user toggles the section."
+                    "text": "Nuevo estado tras el click en el caret. `bubbles: false`: es un evento de\nESTADO del propio acorde\u00F3n y todo consumidor lo escucha en su host \u2014 si\nburbujeara, colapsar un fieldset anidado (FieldObject dentro de otra\nsecci\u00F3n) colapsaba tambi\u00E9n al padre, cuyo handler hace `open = e.detail`."
                 },
                 "complexType": {
                     "original": "boolean",

package/dist/collection/components/co-action-bar/co-action-bar.css

@@ -28,14 +28,21 @@
    perdía 2×92px=184px de ancho disponible sin querer, y la barra desbordaba
    con varias acciones. Ahora el offset vertical solo mueve `bottom`; el
    margen horizontal se configura aparte (mismo default 24px si el consumidor
-   no lo toca). */
+   no lo toca).
+
+   `100%` y NO `100vw`: un fixed se ancla al ancestro más cercano con
+   contain/transform/filter (el `div.main` del co-app-shell lleva
+   `contain: layout`), y ahí el viewport miente — con `100vw` el pill
+   desbordaba el card y la última acción quedaba recortada. Un porcentaje en
+   un fixed resuelve contra SU bloque contenedor: viewport si nadie lo ancla,
+   el card si el shell lo ancla. */
 :host([position='bottom-center']) {
   position: fixed;
   left: 50%;
   transform: translateX(-50%);
   bottom: var(--co-action-bar-offset, 24px);
   z-index: var(--co-action-bar-z, 1000);
-  max-width: calc(100vw - 2 * var(--co-action-bar-inline-margin, 24px));
+  max-width: calc(100% - 2 * var(--co-action-bar-inline-margin, 24px));
 }
 
 /* ── Pill ───────────────────────────────────────────────────── */

package/dist/collection/components/co-audio-player/co-audio-player.js

@@ -38,10 +38,22 @@ export class CoAudioPlayer {
         // Bumped by every init(); an in-flight extractPeaks whose token no longer matches
         // belongs to a superseded `src` and must not write peaks/duration.
         this.loadToken = 0;
-        this.onMeta = () => { this.syncDuration(); };
-        this.onCanPlay = () => { this.isLoading = false; };
+        this.onMeta = () => { this.syncDuration(); this.applyPendingSeek(); };
+        /**
+         * A seek asked for before the media had data. `<audio>` DROPS a `currentTime`
+         * write while `readyState` is HAVE_NOTHING, silently: with `preload="metadata"`
+         * and a clip never played, the very first jump (clicking a transcript line on
+         * a recording nobody opened yet) went nowhere. Kept here and applied as soon
+         * as the element can take it.
+         */
+        this.pendingSeek = null;
+        this.onCanPlay = () => { this.isLoading = false; this.applyPendingSeek(); };
         this.onWaiting = () => { this.isLoading = true; };
-        this.onTime = () => { var _a; this.currentTime = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.currentTime) || 0; };
+        this.onTime = () => {
+            var _a;
+            this.currentTime = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.currentTime) || 0;
+            this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: this.knownDuration });
+        };
         this.onEnded = () => { this.isPlaying = false; this.currentTime = 0; this.coEnded.emit(); };
         this.onErr = (e) => { this.isLoading = false; this.hasError = true; this.coError.emit(e); };
         this.toggle = () => {
@@ -198,12 +210,26 @@ export class CoAudioPlayer {
         this.isPlaying = false;
     }
     async extractPeaks(url, token) {
+        var _a;
         let ctx;
         try {
+            /**
+             * `OfflineAudioContext` FIRST, and a live `AudioContext` only as the
+             * fallback: decoding a waveform needs no audio OUTPUT, and a live context
+             * created before the user has interacted trips the browser's autoplay
+             * policy — "The AudioContext was not allowed to start. It must be resumed
+             * (or created) after a user gesture on the page", once per player. A page
+             * with 15 recordings logged it 15 times. The offline one has no output
+             * device, so the policy does not apply to it.
+             *
+             * Its arguments are placeholders: nothing is ever rendered through this
+             * context, it is only the host for `decodeAudioData`.
+             */
+            const OfflineCtx = window.OfflineAudioContext || window.webkitOfflineAudioContext;
             const Ctx = window.AudioContext || window.webkitAudioContext;
-            if (!Ctx || typeof fetch === 'undefined')
+            if ((!OfflineCtx && !Ctx) || typeof fetch === 'undefined')
                 return; // keep fallback
-            ctx = new Ctx();
+            ctx = OfflineCtx ? new OfflineCtx(1, 1, 44100) : new Ctx();
             const buf = await (await fetch(url)).arrayBuffer();
             const audioBuf = await ctx.decodeAudioData(buf);
             if (token !== this.loadToken)
@@ -212,7 +238,7 @@ export class CoAudioPlayer {
             this.decodedDuration = audioBuf.duration;
             this.peaks = resamplePeaks(this.rawChannelData, this.effectiveBars);
         }
-        catch (_a) {
+        catch (_b) {
             if (token !== this.loadToken)
                 return;
             // Undecodable (codec WebAudio can't handle, CORS, network): keep the
@@ -225,11 +251,13 @@ export class CoAudioPlayer {
         finally {
             // Always release the context. Chrome caps concurrent AudioContexts per
             // document, so leaking one per failed decode would eventually stop every
-            // later player on the page from decoding at all.
+            // later player on the page from decoding at all. `close()` lives on
+            // AudioContext, not on every BaseAudioContext (an OfflineAudioContext
+            // needs no closing and may not implement it): optional call, not a cast.
             try {
-                await (ctx === null || ctx === void 0 ? void 0 : ctx.close());
+                await ((_a = ctx === null || ctx === void 0 ? void 0 : ctx.close) === null || _a === void 0 ? void 0 : _a.call(ctx));
             }
-            catch ( /* already closed */_b) { /* already closed */ }
+            catch ( /* already closed */_c) { /* already closed */ }
         }
         if (token === this.loadToken)
             this.syncDuration();
@@ -244,6 +272,47 @@ export class CoAudioPlayer {
         if (!Object.is(next, this.duration))
             this.duration = next;
     }
+    applyPendingSeek() {
+        if (this.pendingSeek == null || !this.audio)
+            return;
+        const target = this.pendingSeek;
+        this.pendingSeek = null;
+        this.audio.currentTime = target;
+        this.currentTime = this.audio.currentTime;
+        this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: this.knownDuration });
+    }
+    /**
+     * Move the playhead. Clamped to `[0, duration]`: `audio.currentTime` takes a
+     * restricted double and THROWS on a non-finite value, and a duration that is
+     * not known yet reads as 0 (see `knownDuration`).
+     */
+    async seek(seconds) {
+        var _a;
+        if (!this.audio || !Number.isFinite(seconds))
+            return;
+        const total = this.knownDuration;
+        const target = total ? Math.max(0, Math.min(total, seconds)) : Math.max(0, seconds);
+        this.audio.currentTime = target;
+        // The element could not take it yet (no data): keep it for `loadedmetadata`.
+        // The readback is the only way to tell — the write throws nothing.
+        if (Math.abs(((_a = this.audio.currentTime) !== null && _a !== void 0 ? _a : 0) - target) > 0.05)
+            this.pendingSeek = target;
+        // Optimistic either way: the UI shows where playback is GOING, and the
+        // pending write lands on its own.
+        this.currentTime = target;
+        this.coTimeUpdate.emit({ currentTime: this.currentTime, duration: total });
+    }
+    /** Start playback if it is not already running (no-op on a failed load). */
+    async play() {
+        if (!this.audio || this.isPlaying || this.hasError)
+            return;
+        try {
+            await this.audio.play();
+            this.isPlaying = true;
+            this.coPlay.emit();
+        }
+        catch ( /* autoplay blocked or source not ready: the button still works */_a) { /* autoplay blocked or source not ready: the button still works */ }
+    }
     async download() {
         if (!this.src || typeof fetch === 'undefined')
             return;
@@ -270,13 +339,13 @@ export class CoAudioPlayer {
         // below `aria-valuenow` the moment playback advances. ARIA 1.2 makes valuemax
         // optional for `slider`, so leaving it off while unknown is well-formed.
         const ariaMax = total ? Math.floor(total) : undefined;
-        const bar = (hFrac, i, played = false) => (h("rect", { key: '997dcefc32f5188c41afa0a7b5135c70cceeed1d', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
-        return (h("div", { key: '8ac91ab3f8eb417df5e7cf4d1e016d6ca7eb45a3', class: {
+        const bar = (hFrac, i, played = false) => (h("rect", { key: '7cbeb92ef52ffc865077340d72bae11139ced551', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
+        return (h("div", { key: '34078ed0540dc72c87644c3ae830b3a2ff43a99e', class: {
                 'co-audio-player': true,
                 'co-audio-player--compact': this.compact,
                 'co-audio-player--error': this.hasError,
                 'co-audio-player--playing': this.isPlaying,
-            }, part: "player" }, h("button", { key: '0e5897dc64c91ee67432f17d7b0d57a27f44cd0e', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: '4843751a2a3709942a49ae03ff9ba0eb08ab7d97', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: 'b7aebd0e0c5197b0dec6257bbec7c9dd8dd55d6f', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": ariaMax, "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'a504d058a27bb33dd57733ec32db306eb0ed87e9', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: '9cfa69ba28801893baf62c8f66b18a31319fdebe', id: "co-ap-clip" }, h("rect", { key: '6e5cb34baeb2b7dddd6ef7e94f8585ef912e0315', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: '4b78a29dde762cabc85d7921aacbcd261d8fa6b5', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '9067d22b0e2994e46ef49c60356292ec59f61a21', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: 'f6149a9996e6ce15230221c2f6fcec95fec5f485', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: '73d291d31d92bcb0e18e230fe0ac35d3ab4077b2', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: '9ab09f5d6b975f4f5544019f70bd2ca1ee521068', name: "download-simple", size: 14 })))));
+            }, part: "player" }, h("button", { key: '7f692d951704a6e101f77512967d4b206f985e18', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: 'fdc0a0a0703189efe10bbc1b1182572d1120a347', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: '6842ce24993895bf70461a28eb837a0558d277d7', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": ariaMax, "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'e75c5e1f78633194608758f43a47987bc28c2081', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: 'c4136dddad555e8b5ef09a81c38433cd2bf39d7c', id: "co-ap-clip" }, h("rect", { key: 'edb79083fbc7d225bd5668443fb6541fe77c8f9d', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: 'c91b8b285f53b9dc4f6110f9cb73b7f3f892fad6', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '26af75ef91f36d432add06bb636c4d3194902b0a', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: 'a2093fc2d9c9a9c120e97e59f5e8b91467e1c20c', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: '327336de6ad09adac5f8cba6e048b58bbef0008e', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: '787738fea40ab74531c943f876e20acf6ceb54df', name: "download-simple", size: 14 })))));
     }
     static get is() { return "co-audio-player"; }
     static get encapsulation() { return "shadow"; }
@@ -506,8 +575,65 @@ export class CoAudioPlayer {
                     "resolved": "unknown",
                     "references": {}
                 }
+            }, {
+                "method": "coTimeUpdate",
+                "name": "coTimeUpdate",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Playback position, on the `<audio>` element's own `timeupdate` cadence\n(~4\u00D7/s while playing, plus every seek). Exists so a host can follow the\nplayhead \u2014 a transcript highlighting the line being spoken, for one \u2014\nwithout reaching into this component's shadow DOM for its `<audio>`."
+                },
+                "complexType": {
+                    "original": "{ currentTime: number; duration: number }",
+                    "resolved": "{ currentTime: number; duration: number; }",
+                    "references": {}
+                }
             }];
     }
+    static get methods() {
+        return {
+            "seek": {
+                "complexType": {
+                    "signature": "(seconds: number) => Promise<void>",
+                    "parameters": [{
+                            "name": "seconds",
+                            "type": "number",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Move the playhead. Clamped to `[0, duration]`: `audio.currentTime` takes a\nrestricted double and THROWS on a non-finite value, and a duration that is\nnot known yet reads as 0 (see `knownDuration`).",
+                    "tags": []
+                }
+            },
+            "play": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Start playback if it is not already running (no-op on a failed load).",
+                    "tags": []
+                }
+            }
+        };
+    }
     static get watchers() {
         return [{
                 "propName": "src",

package/dist/collection/components/co-autocomplete/co-autocomplete.js

@@ -418,7 +418,7 @@ export class CoAutocomplete {
                     "references": {
                         "AutocompleteOption": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-autocomplete/co-autocomplete.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-autocomplete/co-autocomplete.tsx",
                             "id": "src/components/co-autocomplete/co-autocomplete.tsx::AutocompleteOption"
                         }
                     }

package/dist/collection/components/co-avatar-group/co-avatar-group.js

@@ -87,7 +87,7 @@ export class CoAvatarGroup {
                     "references": {
                         "CoAvatarGroupItem": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-avatar-group/co-avatar-group.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-avatar-group/co-avatar-group.tsx",
                             "id": "src/components/co-avatar-group/co-avatar-group.tsx::CoAvatarGroupItem"
                         }
                     }

package/dist/collection/components/co-button/co-button.css

@@ -41,10 +41,13 @@
   color: var(--co-semantic-on-primary);
   border-color: color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent);
 }
+/* Knobs (heredan a través del shadow, mismo mecanismo y nombres que
+   --co-icon-button-bg/-color/-border): un consumidor con spec propia cambia la
+   superficie de la variante clara SIN un ::part de color. Defaults = look del DS. */
 .co-button--secondary {
-  background: color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);
-  color: var(--co-semantic-on-secondary);
-  border-color: var(--co-semantic-border-subtle);
+  background: color-mix(in srgb, var(--co-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);
+  color: var(--co-button-color, var(--co-semantic-on-secondary));
+  border-color: var(--co-button-border, var(--co-semantic-border-subtle));
 }
 .co-button--stroke {
   background: color-mix(in srgb, var(--co-semantic-surface-secondary) 25%, transparent);

package/dist/collection/components/co-checkbox/co-checkbox.js

@@ -43,17 +43,17 @@ export class CoCheckbox {
         // Only override the fill when a custom color is provided AND the box is "on".
         // Leaving this undefined keeps the default appearance byte-identical to before.
         const boxStyle = this.checkedColor && isOn ? { background: this.checkedColor } : undefined;
-        return (h("div", { key: 'ba8053a262557bdfc35e16d743158b26e1783932', class: {
+        return (h("div", { key: 'cfcbd567066331d7751064f857407a8f9d56d386', class: {
                 'co-checkbox-row': true,
                 'co-checkbox-row--disabled': this.disabled,
-            }, onClick: this.handleClick }, h("span", { key: 'fa4f7cddb61bce3636c949bba3b3cd0b681d3744', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || '', "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, class: {
+            }, onClick: this.handleClick }, h("span", { key: '21c39833a43324e47718cc83ba74253f00e67e82', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || this.ariaLabelText || '', "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, class: {
                 'co-checkbox': true,
                 [`co-checkbox--${this.size}`]: true,
                 'co-checkbox--overlay': isOverlay,
                 'co-checkbox--checked': this.checked && !this.indeterminate,
                 'co-checkbox--indeterminate': this.indeterminate,
                 'co-checkbox--disabled': this.disabled,
-            }, style: boxStyle, part: "box" }, h("svg", { key: '3eb81bcb492a7ef932538542ddb37cb0143596e4', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: '1affb22b56c8a907d5c98bd4bba88dc52d19fb76', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'ad29a5205bc73f358333f648847e34ceedcb9800', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: '09b729390669959e52c78a54b426b56c22267bde', class: "co-checkbox__label", part: "label" }, this.label))));
+            }, style: boxStyle, part: "box" }, h("svg", { key: '6e49dd81e78da092340b1cbdb5c45ee6e345fb3c', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'dbcadf848fb8cb64acea875fb03186258210c43f', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '0b58a11353c3d8b8249e5852933f290cd63f0705', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: 'e1a4beabf2b472aeff1fe5ecd5bcb458e949ee11', class: "co-checkbox__label", part: "label" }, this.label))));
     }
     static get is() { return "co-checkbox"; }
     static get encapsulation() { return "shadow"; }
@@ -168,6 +168,25 @@ export class CoCheckbox {
                 "reflect": false,
                 "attribute": "label"
             },
+            "ariaLabelText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible name when there is NO visible `label` (icon-less row toggles).\nSame `ariaLabelText` precedent as co-button; `label` wins when present.\nAn `aria-label` on the host never reaches the inner role=\"checkbox\"."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "aria-label-text"
+            },
             "value": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/co-checkbox-group/co-checkbox-group.js

@@ -231,7 +231,7 @@ export class CoCheckboxGroup {
                     "references": {
                         "CheckboxOption": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
                             "id": "src/components/co-checkbox-group/co-checkbox-group.tsx::CheckboxOption"
                         }
                     }

package/dist/collection/components/co-color-picker/co-color-picker.js

@@ -306,6 +306,12 @@ export class CoColorPicker {
         };
         this.handleGridKeyDown = (e) => {
             var _a;
+            // La grilla es el único control del panel que es un `<div>`: no hereda
+            // `disabled` del DOM como el range o el input, así que el guard tiene que
+            // ser explícito. Sin él, deshabilitar con el panel abierto dejaba la
+            // navegación por flechas viva y Enter commiteando sobre un campo apagado.
+            if (this.disabled)
+                return;
             // `presetGroups` re-parsea el JSON de `presets` y remapea en CADA lectura, y
             // todos los consumidores reales pasan presets custom por prop: se resuelve
             // UNA vez por tecla y se pasa por parámetro, no dos veces por getter.
@@ -531,8 +537,10 @@ export class CoColorPicker {
      *    que `this.hsv` llega `undefined` al primer render y el destructuring de
      *    `renderArea` tira). Los otros @State del componente lo toleraban porque
      *    `undefined` es falsy justo donde se usan.
-     * Sin hex válido el estado arranca en negro, que es lo que pinta el área
-     * mientras no hay color elegido.
+     * Sin hex válido el estado arranca en `EMPTY_HSV` —rojo puro, el vértice
+     * VIVO—, no en negro: ver su docstring, que explica por qué el vértice negro
+     * dejaría dos de los tres controles sin poder producir color. Es un seed de
+     * display; `value` sigue vacío y el trigger sigue mostrando el placeholder.
      */
     componentWillLoad() {
         const parsed = hexToHsv(this.value || '');
@@ -694,6 +702,11 @@ export class CoColorPicker {
         }
     }
     handleSwatchClick(hex) {
+        // Mismo guard que el resto de los controles del panel: el host puede
+        // deshabilitar el campo CON EL PANEL ABIERTO, y un swatch deshabilitado no
+        // commitea. El `pointer-events:none` del CSS tapa el mouse, no el teclado.
+        if (this.disabled)
+            return;
         // Elegir un preset es un commit como cualquier otro: la asignación y el
         // emit viven en `commit`, no duplicados acá (si no, el swatch dejaría el
         // HSV del color anterior y el área abriría en el color equivocado).
@@ -799,7 +812,16 @@ export class CoColorPicker {
         h("div", { class: "co-color-picker__grid-group", key: g.from, role: g.label ? 'group' : 'presentation', "aria-label": g.label }, g.items.map((preset, j) => {
             const i = g.from + j;
             const selected = preset.value.toUpperCase() === (this.value || '').toUpperCase();
-            return (h("div", { key: preset.value, role: "option", "aria-selected": selected ? 'true' : 'false', "aria-label": preset.name, tabIndex: i === this.focusedIndex ? 0 : -1, class: {
+            return (h("div", { key: preset.value, role: "option", "aria-selected": selected ? 'true' : 'false', "aria-label": preset.name,
+                // El `aria-label` cubre al lector de pantalla; al usuario con
+                // mouse no le dice nada. Sin el `title`, la paleta por default
+                // deja dos grises contiguos ("Humo" y "Hueso") indistinguibles
+                // salvo por el pixel de color. El tooltip nativo es la
+                // convención de este design system para celdas de grilla
+                // —co-emoji-picker:419 hace exactamente esto, y el propio
+                // panel ya lo usa en gotero y copiar—; la regla que lo prohíbe
+                // es de suite-v2, no de cobalt core.
+                title: preset.name, tabIndex: i === this.focusedIndex ? 0 : -1, class: {
                     'co-color-picker__grid-item': true,
                     'co-color-picker__grid-item--selected': selected,
                     // Un swatch claro se pierde contra el panel: se decide por
@@ -922,12 +944,20 @@ export class CoColorPicker {
             this.hsv = EMPTY_HSV;
         if ((this.value || '').toUpperCase() === (target || '').toUpperCase())
             return;
-        // SIN sellar: acá el @Watch sí tiene que re-derivar el HSV, para que el área
-        // vuelva al color commiteado y no se quede en el que se abandonó.
+        // SIN sellar a mano: el @Watch re-deriva el HSV —que es lo que hace volver
+        // el área al color commiteado en vez de quedarse en el abandonado— y sella
+        // `emitted` él mismo, ANTES del guard de parseo, así que también cubre el
+        // caso en que `target` no es un hex (nunca se commiteó nada y el campo
+        // vuelve a vacío).
+        //
+        // Acá vivía un `this.emitted = target` con un comentario que describía el
+        // orden VIEJO de `syncFromValue` (sellado gateado por el parseo). Desde que
+        // el sellado subió, la línea era muerta por dos vías: o el @Watch ya la
+        // dejó idéntica, o entró por su guard de eco —que compara contra `emitted`—
+        // y entonces `emitted` ya era `target` salvo por mayúsculas, que es el único
+        // lector que tiene. Medido: una sonda en esa línea sobre la suite entera la
+        // alcanza cuatro veces y las cuatro con `emitted === target` estricto.
         this.value = target;
-        // El @Watch no sella cuando `target` no es un hex (nunca se commiteó nada y
-        // el campo vuelve a vacío), así que se sella acá.
-        this.emitted = target;
         // El preview se anunció por `coInput`; retirarlo también. Un host que
         // previsualiza en vivo se quedaría si no con el color que nadie eligió.
         this.coInput.emit(target);
@@ -965,12 +995,12 @@ export class CoColorPicker {
     render() {
         const hasValue = !!this.value;
         const statusClass = this.status !== 'default' ? `co-color-picker--${this.status}` : '';
-        return (h("div", { key: 'd0069249895cc3cf148c963f149ff7b3a15ab939', class: `co-color-picker co-color-picker--${this.size} ${statusClass} ${this.isOpen ? 'co-color-picker--open' : ''} ${this.disabled ? 'co-color-picker--disabled' : ''}` }, this.label && (h("label", { key: 'e28d265aefc19f7e86ed36bfbfe6b6ec537d1ca2', class: "co-color-picker__label" }, this.label, h(RequiredMark, { key: '0aff2dde3002e1c9a79f2c3a385b64d33dc3418c', required: this.required }))), h("co-popover", { key: 'edac2d09e0d15c2f09dfff2ea0a2b95f5384d8de', open: this.isOpen, placement: "bottom-start",
+        return (h("div", { key: '5e4239ff9ef0dc3f15004898d2d891f8d231e95d', class: `co-color-picker co-color-picker--${this.size} ${statusClass} ${this.isOpen ? 'co-color-picker--open' : ''} ${this.disabled ? 'co-color-picker--disabled' : ''}` }, this.label && (h("label", { key: '003a893c3c840cd03d87c4291795499ac80b8b73', class: "co-color-picker__label" }, this.label, h(RequiredMark, { key: '4c14eaf668b0677b91b23a00f001ffaa4c21f5c5', required: this.required }))), h("co-popover", { key: 'f4a489f77c2d629ea1d9b69786cfad0f95d5422b', open: this.isOpen, placement: "bottom-start",
             // Sin `matchWidth`: el panel tiene ancho INTRÍNSECO (grilla de 8
             // swatches fijos de 32px). Copiar el ancho del trigger achica los
             // tracks bajo 32px con un campo angosto (media columna de un modal) y
             // los swatches desbordan el card — guard: panel-width.spec.
-            offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '98c2e3c5ed50f8cc869c1cf791ddce85e8887b8e', slot: "trigger", class: "co-color-picker__trigger", role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "dialog", "aria-controls": this.isOpen ? CoColorPicker.PANEL_ID : undefined, "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onKeyDown: this.handleTriggerKeyDown }, h("span", { key: '65e49a6246c71b6366f7907c715c64259c30be46', class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { key: 'd8e6e852383ec925c4336f9b49a69e73d88e2234', class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { key: '2893b57d82d7ac2edc4e3bd8eac266fdc6cbfba0', class: "co-color-picker__panel", id: CoColorPicker.PANEL_ID, role: "dialog", "aria-label": this.label || this.placeholder }, this.renderArea(), this.renderHue(), this.renderSwatches(), this.renderHexRow()))), this.helperText && (h("div", { key: 'ca583c8033afaafa5bdd59ccd63e711eaf02e6df', class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { key: 'aca2fd8186658e7d4e13ab67dc7a6e93c2fd8b89', name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { key: 'e8e3cdf72353a1f5fb8b53fe725389386c7d75ea', class: "co-color-picker__helper-text" }, this.helperText)))));
+            offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '229e0095d6b6a723e77cf0d001d780cf51116851', slot: "trigger", class: "co-color-picker__trigger", role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "dialog", "aria-controls": this.isOpen ? CoColorPicker.PANEL_ID : undefined, "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onKeyDown: this.handleTriggerKeyDown }, h("span", { key: '9267f104b7f0542653038ef381fb81a7f7f0188e', class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { key: '64efb900a60576022b3f487db56380973d2934c9', class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { key: '22abcb6c79531f41a6655fc48320e4c108a33049', class: "co-color-picker__panel", id: CoColorPicker.PANEL_ID, role: "dialog", "aria-label": this.label || this.placeholder }, this.renderArea(), this.renderHue(), this.renderSwatches(), this.renderHexRow()))), this.helperText && (h("div", { key: '901b7094f7da8c09ea25cad568eda8d5fcaf2d6e', class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { key: 'fb341f791466f133f6a6c4bd04a8dd71c519c7c0', name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { key: '0ecfc7d46a07c741d42b59660979559fb78117df', class: "co-color-picker__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-color-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-combobox/co-combobox.js

@@ -531,7 +531,7 @@ export class CoCombobox {
                     "references": {
                         "ComboboxOption": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-combobox/co-combobox.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-combobox/co-combobox.tsx",
                             "id": "src/components/co-combobox/co-combobox.tsx::ComboboxOption"
                         }
                     }

package/dist/collection/components/co-command-search/co-command-search.js

@@ -246,7 +246,7 @@ export class CoCommandSearch {
                     "references": {
                         "CommandItem": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-command-search/co-command-search.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-command-search/co-command-search.tsx",
                             "id": "src/components/co-command-search/co-command-search.tsx::CommandItem"
                         }
                     }

package/dist/collection/components/co-data-table/co-data-table.css

@@ -153,8 +153,18 @@ co-data-table {
   color: var(--co-semantic-text-muted);
 }
 
-.co-data-table__th-label {
+/* Wrapper co-tooltip[block] del label: toma el track flex que antes ocupaba el
+   label (min-width:0 = deja truncar; sus hermanos pin/sort/funnel llevan
+   flex-shrink:0). El tooltip sale del host (tsx), gateado por truncado. */
+.co-data-table__th-tip {
   flex: 1;
+  min-width: 0;
+}
+
+/* Dentro del trigger del tooltip el label ya no es flex item: block explícito
+   o el ellipsis (overflow/text-overflow solo aplican a cajas block) no engancha. */
+.co-data-table__th-label {
+  display: block;
   overflow: hidden;
   text-overflow: ellipsis;
 }
@@ -208,6 +218,16 @@ co-data-table {
   line-height: 0; /* el co-checkbox inline mete baseline-gap y estira el header a 43 */
 }
 
+/* Sin separador entre la casilla y la primera columna: la selección no es una
+   columna de datos y su borde derecho dibujaba un recuadro alrededor del check
+   (pedido de diseño 2026-09-16). Doble clase para ganarle al `border-right` de
+   las reglas base .co-data-table__th / .co-data-table__td, que van DESPUÉS en
+   este archivo. */
+.co-data-table__th.co-data-table__th--checkbox,
+.co-data-table__td.co-data-table__td--checkbox {
+  border-right: none;
+}
+
 /* ─── STICKY COLUMNS ───────────────────────────────────────── */
 .co-data-table__th--sticky,
 .co-data-table__td--sticky {
@@ -268,6 +288,42 @@ co-data-table {
   transition: opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
+/* Tinte de hover/selected de las celdas sticky: un overlay ANIMABLE.
+   La fila pinta su tinte translúcido en el <tr> y lo transiciona
+   (background-color, duration-fast). Una celda sticky lleva base opaca —no
+   puede dejar ver lo que scrollea debajo—, así que el tinte va compuesto
+   ENCIMA de esa base. Componerlo con `background-image` (gradiente) no es
+   animable: la columna fijada prendía y apagaba de golpe mientras el resto de
+   la fila se desvanecía (2026-09-07). `::before` con opacity/background-color
+   y la MISMA transición que la fila. z-index -1 dentro del stacking context
+   de la celda (position:sticky + z-index) = encima de su base opaca, debajo
+   de su contenido. Los tokens espejan los de .co-data-table__row de abajo. */
+.co-data-table__td--sticky::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  pointer-events: none;
+  background-color: var(--co-semantic-surface-hover);
+  opacity: 0;
+  transition:
+    opacity var(--co-motion-duration-fast) var(--co-motion-ease-out),
+    background-color var(--co-motion-duration-fast) var(--co-motion-ease-out);
+}
+
+.co-data-table__row:hover .co-data-table__td--sticky::before {
+  opacity: 1;
+}
+
+.co-data-table__row--selected .co-data-table__td--sticky::before {
+  opacity: 1;
+  background-color: var(--co-color-opacity-negro-4);
+}
+
+.co-data-table__row--selected:hover .co-data-table__td--sticky::before {
+  background-color: var(--co-color-opacity-negro-8);
+}
+
 /* ─── RESIZE HANDLE ─────────────────────────────────────────── */
 .co-data-table__resize-handle {
   position: absolute;
@@ -319,7 +375,12 @@ co-data-table {
      wrapper, never on the cell itself. */
   height: 48px;
   padding: 0 var(--co-spacing-md);
-  background: inherit;
+  /* Transparente, NUNCA `inherit`: el hover/selected es un tinte translúcido
+     pintado en el <tr>. Con `inherit` cada celda normal lo repintaba encima
+     (doble tinte, ~15%) mientras las sticky —base opaca + un gradiente del
+     mismo tinte— quedaban al 8%: la columna fijada se veía más clara que el
+     resto de la fila en hover. Guard: co-data-table-cell-background-guard.test.ts */
+  background: transparent;
   border-bottom: 1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent);
   border-right: 1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent);
   vertical-align: middle;