@prolibu-suite/cobalt-core 0.11.6 → 0.11.7

package/dist/collection/components/co-calendar-timegrid/co-calendar-timegrid.css

@@ -28,7 +28,9 @@
   --co-cal-event-border: transparent;
   --co-cal-event-text: var(--co-color-base-blanco, #fff);
   --co-cal-event-text-light: var(--co-color-base-blanco, #fff);
-  --co-cal-event-text-dark: var(--co-semantic-text-default);
+  /* Tinta sobre un chip CLARO (amarillo, naranja): depende del chip, no del
+     tema — con text-default salía blanca en oscuro (~1,6:1 sobre amarillo). */
+  --co-cal-event-text-dark: var(--co-color-base-negro, #1f1c1b);
 }
 
 .tg {

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

@@ -97,7 +97,11 @@
 /* Check/dash glyphs: inline SVG for every appearance — see "GLYPH" below. */
 
 /* ─── INDETERMINATE ─────────────────────────────────────────── */
-.co-checkbox--indeterminate {
+/* Clase repetida a propósito: la caja sin marcar es `.co-checkbox:not(--checked)`
+   (0,2,0) y el indeterminado NO lleva --checked (ver .tsx), así que con una sola
+   clase (0,1,0) perdía: fondo translúcido + guion blanco encima = casilla vacía
+   (el «parcial» de una fila «todos» no se veía). 0,2,0 y declarada después → gana. */
+.co-checkbox.co-checkbox--indeterminate {
   background: var(--co-semantic-surface-primary);
   border: none;
 }

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

@@ -152,8 +152,11 @@
 }
 
 /* ── Error state ────────────────────────────────────────────── */
+/* Borde de error de CAMPO por --co-semantic-border-error: gira con el tema (status-error es
+   relleno fijo y como trazo en oscuro daba 2,94:1). En claro vale status-error (idéntico).
+   Fallback: la primitiva de hoy, hasta publicar tokens. */
 .co-checkbox-group--error .co-checkbox-group__box:not(.co-checkbox-group__box--checked) {
-  border-color: var(--co-semantic-status-error);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
 }
 
 /* ── Helper text ────────────────────────────────────────────── */
@@ -177,24 +180,26 @@
   line-height: 1;
 }
 
+/* Tinta de estado por --co-semantic-text-*: gira con el tema (status-* es relleno, no se
+   aclara, y como texto en oscuro daba <4,5). Fallback a la primitiva hasta publicar tokens. */
 .co-checkbox-group__helper--error .co-checkbox-group__helper-icon,
 .co-checkbox-group__helper--error .co-checkbox-group__helper-text {
-  color: var(--co-semantic-status-error);
+  color: var(--co-semantic-text-error, var(--co-semantic-status-error));
 }
 
 .co-checkbox-group__helper--success .co-checkbox-group__helper-icon,
 .co-checkbox-group__helper--success .co-checkbox-group__helper-text {
-  color: var(--co-semantic-status-success);
+  color: var(--co-semantic-text-success, var(--co-semantic-status-success));
 }
 
 .co-checkbox-group__helper--warning .co-checkbox-group__helper-icon,
 .co-checkbox-group__helper--warning .co-checkbox-group__helper-text {
-  color: var(--co-color-status-review);
+  color: var(--co-semantic-text-warning, var(--co-color-status-review));
 }
 
 .co-checkbox-group__helper--info .co-checkbox-group__helper-icon,
 .co-checkbox-group__helper--info .co-checkbox-group__helper-text {
-  color: var(--co-semantic-status-info);
+  color: var(--co-semantic-text-info, var(--co-semantic-status-info));
 }
 
 /* ── Horizontal layout: label left; control + helper stacked right ──

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

@@ -236,7 +236,7 @@ export class CoCheckboxGroup {
                     "references": {
                         "CheckboxOption": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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-chip/co-chip.css

@@ -5,8 +5,9 @@
  * @prop --co-chip-color: Color de texto de la variante `filled`.
  * @prop --co-chip-border: Color del borde de la variante `filled` (default transparente).
  * @prop --co-chip-max-width: Ancho máximo del chip; el texto se trunca con elipsis (default sin tope).
- * @prop --co-chip-value-color: Color del sufijo `valueLabel` (default gray-500).
+ * @prop --co-chip-value-color: Color del sufijo `valueLabel` (default text-muted).
  * @prop --co-chip-trailing-color: Color del ícono final `trailingIcon` (default: el del texto).
+ * @prop --co-chip-radius: Radio del chip (default según shape).
  */
 
 :host {
@@ -54,7 +55,8 @@ button.co-chip:focus-visible {
 /* Two-tone muted value suffix (": <value>"), sits inside the label so the
    flex gap never separates it from the base word. */
 .co-chip__value {
-  color: var(--co-chip-value-color, var(--co-color-gray-500, #888888));
+  /* text-muted en vez de gray-500 fijo: gira con el tema (y sigue el remapeo de text-muted). */
+  color: var(--co-chip-value-color, var(--co-semantic-text-muted, #888888));
 }
 
 /* ═══════════════════════════════════════════════════════════════
@@ -68,7 +70,8 @@ button.co-chip:focus-visible {
 }
 
 .co-chip--filled.co-chip--clickable:hover:not(.co-chip--disabled) {
-  background: var(--co-color-opacity-negro-8, rgba(0, 0, 0, 0.08));
+  /* surface-hover = negro 8 % en claro; en oscuro gira a blanco 8 % (el negro no se veía). */
+  background: var(--co-semantic-surface-hover);
 }
 
 .co-chip--filled.co-chip--clickable:active:not(.co-chip--disabled) {
@@ -145,23 +148,25 @@ button.co-chip:focus-visible {
   border-color: var(--co-semantic-surface-primary);
 }
 
+/* Tinta de estado por --co-semantic-text-*: gira con el tema (status-* es relleno, no se
+   aclara, y como texto en oscuro daba <4,5). Fallback a la primitiva hasta publicar tokens. */
 .co-chip--outlined.co-chip--success {
-  color: var(--co-semantic-status-success);
+  color: var(--co-semantic-text-success, var(--co-semantic-status-success));
   border-color: var(--co-semantic-status-success);
 }
 
 .co-chip--outlined.co-chip--error {
-  color: var(--co-semantic-status-error);
+  color: var(--co-semantic-text-error, var(--co-semantic-status-error));
   border-color: var(--co-semantic-status-error);
 }
 
 .co-chip--outlined.co-chip--warning {
-  color: var(--co-color-status-review);
+  color: var(--co-semantic-text-warning, var(--co-color-status-review));
   border-color: var(--co-color-status-review);
 }
 
 .co-chip--outlined.co-chip--info {
-  color: var(--co-semantic-status-info);
+  color: var(--co-semantic-text-info, var(--co-semantic-status-info));
   border-color: var(--co-semantic-status-info);
 }
 
@@ -255,8 +260,8 @@ button.co-chip--disabled {
 /* ═══════════════════════════════════════════════════════════════
    SHAPES
    ═══════════════════════════════════════════════════════════════ */
-.co-chip--rounded { border-radius: var(--co-border-radius-full); }
-.co-chip--square  { border-radius: var(--co-spacing-sm); } /* 6px */
+.co-chip--rounded { border-radius: var(--co-chip-radius, var(--co-border-radius-full)); }
+.co-chip--square  { border-radius: var(--co-chip-radius, var(--co-spacing-sm)); } /* 6px */
 
 /* ═══════════════════════════════════════════════════════════════
    ICON SLOTS & REMOVE BUTTON
@@ -352,10 +357,10 @@ button.co-chip--disabled {
   color: var(--co-semantic-text-muted, #888888);
 }
 
-/* Trailing caret is a subtle mid gray (reads on both themes; no semantic
-   token sits at gray-400). */
+/* Trailing caret en text-muted: es un control habilitado y gray-400 (= text-disabled) daba 2,6
+   sobre blanco (auditoría 2026-09-27, §5). */
 .co-chip--filter .co-chip__trailing {
-  color: var(--co-color-gray-400, #a0a0a0);
+  color: var(--co-semantic-text-muted, #888888);
 }
 
 .co-chip--filter.co-chip--clickable:hover:not(.co-chip--disabled) {

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

@@ -310,7 +310,7 @@ export class CoColorArea {
                     "references": {
                         "ColorAreaDetail": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-color-area/co-color-area.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-color-area/co-color-area.tsx",
                             "id": "src/components/co-color-area/co-color-area.tsx::ColorAreaDetail"
                         }
                     }
@@ -331,7 +331,7 @@ export class CoColorArea {
                     "references": {
                         "ColorAreaDetail": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-color-area/co-color-area.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-color-area/co-color-area.tsx",
                             "id": "src/components/co-color-area/co-color-area.tsx::ColorAreaDetail"
                         }
                     }

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

@@ -25,9 +25,11 @@
   padding: 0 var(--co-spacing-xs);
 }
 
+/* Tinta de estado por --co-semantic-text-*: gira con el tema (status-* es relleno, no se
+   aclara, y como texto en oscuro daba <4,5). Fallback a la primitiva hasta publicar tokens. */
 .co-field-required {
   margin-left: 2px;
-  color: var(--co-color-status-error);
+  color: var(--co-semantic-text-error, var(--co-color-status-error));
 }
 
 .co-field-required__caption {
@@ -107,8 +109,11 @@
   box-shadow: 0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 15%, transparent);
 }
 
+/* Borde de error de CAMPO por --co-semantic-border-error: gira con el tema (status-error es
+   relleno fijo y como trazo en oscuro daba 2,94:1). En claro vale status-error (idéntico).
+   Fallback: la primitiva de hoy, hasta publicar tokens. */
 .co-color-picker--error .co-color-picker__trigger {
-  border-color: var(--co-color-status-error);
+  border-color: var(--co-semantic-border-error, var(--co-color-status-error));
 }
 
 .co-color-picker__swatch {
@@ -146,6 +151,11 @@
   gap: var(--co-spacing-md);
 }
 
+/* En línea el panel vive dentro del contenedor del host (su popover ya tiene aire). */
+.co-color-picker--inline .co-color-picker__panel {
+  padding: 0;
+}
+
 /* ── Área saturación × brillo ─────────────────────────────
    El gradiente es CSS puro (sin canvas, sin dependencia nueva): el matiz llega
    por custom property desde el render y las dos rampas se pintan encima.
@@ -330,13 +340,15 @@
     0 0 0 4px var(--co-semantic-border-focus);
 }
 
-/* El check hereda contraste del propio swatch. */
+/* El check hereda contraste del propio swatch: su tinta depende del SWATCH, no del tema. Con
+   surface-page/text-default (que giran) en oscuro salía negro sobre swatch oscuro y blanco sobre
+   swatch claro. Primitivas fijas = los mismos valores que esos semánticos tienen en claro. */
 .co-color-picker__grid-check {
-  color: var(--co-semantic-surface-page);
+  color: var(--co-color-base-blanco);
 }
 
 .co-color-picker__grid-item--light .co-color-picker__grid-check {
-  color: var(--co-semantic-text-default);
+  color: var(--co-color-base-negro);
 }
 
 /* ── Hex row ─────────────────────────────────────────────── */
@@ -463,7 +475,7 @@
 }
 
 .co-color-picker__copy-btn--copied {
-  color: var(--co-color-status-success);
+  color: var(--co-semantic-text-success, var(--co-color-status-success));
 }
 
 /* ── Helper ──────────────────────────────────────────────── */
@@ -483,7 +495,7 @@
 }
 
 .co-color-picker--error .co-color-picker__helper {
-  color: var(--co-semantic-status-error);
+  color: var(--co-semantic-text-error, var(--co-semantic-status-error));
 }
 
 /* ── Horizontal layout: label left; control + helper stacked right ──

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

@@ -64,6 +64,13 @@ const flattenGroups = (groups) => groups.reduce((acc, g) => acc.concat(g.items),
  */
 export class CoColorPicker {
     constructor() {
+        /**
+         * Muestra el panel (área, tono, muestras y hex) siempre a la vista, sin el campo que lo
+         * abre. Para un host que ya tiene su propio disparador —un punto de color que abre un
+         * popover—: sin esto el usuario abría el popover y después, adentro, el campo con la paleta.
+         * Elegir una muestra no cierra nada; el host decide cuándo cerrar lo suyo.
+         */
+        this.inline = false;
         /** Current color value as hex string (e.g. "#0066FF"). */
         this.value = '';
         /** Placeholder text when no color is selected. */
@@ -545,6 +552,10 @@ export class CoColorPicker {
      * display; `value` sigue vacío y el trigger sigue mostrando el placeholder.
      */
     componentWillLoad() {
+        // En línea el panel nace abierto: mismo arranque que una apertura del popover (foco de
+        // teclado en el color elegido, sin gesto ni borrador colgados).
+        if (this.inline)
+            this.handlePopoverOpen();
         const parsed = hexToHsv(this.value || '');
         this.hsv = parsed !== null && parsed !== void 0 ? parsed : EMPTY_HSV;
         // Mismo motivo que `hsv`: el tab stop del área arranca en la saturación.
@@ -700,7 +711,9 @@ export class CoColorPicker {
         var _a;
         const active = document.activeElement;
         if (active === this.el || this.el.contains(active)) {
-            (_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.focus();
+            // Sin scroll: si el panel se cerró porque el campo salió de la vista de su scroller
+            // (co-popover), devolverle el foco llevaba al usuario de vuelta arriba del formulario.
+            (_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
         }
     }
     handleSwatchClick(hex) {
@@ -713,6 +726,9 @@ export class CoColorPicker {
         // 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).
         this.commit(hex);
+        // En línea no hay popover propio que cerrar ni trigger al que volver.
+        if (this.inline)
+            return;
         this.isOpen = false;
         this.restoreTriggerFocus();
     }
@@ -997,12 +1013,15 @@ export class CoColorPicker {
     render() {
         const hasValue = !!this.value;
         const statusClass = this.status !== 'default' ? `co-color-picker--${this.status}` : '';
-        return (h("div", { key: '6746d83ad6d123c58a88dd3a236f3288758eb507', 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: 'd37d7b2e7b457cc366006e18f5188dd76171c3bb', class: "co-color-picker__label" }, this.label, h(RequiredMark, { key: 'dbb125918398dc5d55f9083e88f0f1948281d5b0', required: this.required }))), h("co-popover", { key: '91b03300c502c85e068e28e235feadf06fbbb76c', open: this.isOpen, placement: "bottom-start",
+        if (this.inline) {
+            return (h("div", { class: `co-color-picker co-color-picker--${this.size} co-color-picker--inline ${statusClass} ${this.disabled ? 'co-color-picker--disabled' : ''}` }, this.label && (h("span", { class: "co-color-picker__label" }, this.label, h(RequiredMark, { required: this.required }))), h("div", { class: "co-color-picker__panel", id: CoColorPicker.PANEL_ID, role: "group", "aria-label": this.label || this.placeholder }, this.renderArea(), this.renderHue(), this.renderSwatches(), this.renderHexRow()), this.helperText && (h("div", { class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { class: "co-color-picker__helper-text" }, this.helperText)))));
+        }
+        return (h("div", { 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", { class: "co-color-picker__label" }, this.label, h(RequiredMark, { required: this.required }))), h("co-popover", { 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: 'fec8eb5f52f4a95c478cee49a1a05b8ca93a40b4', 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: '648331ab929d1874f09ebd59d722839312434bcd', class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { key: '07f235dfd673b4d31f9fb994eccc7e38d1f866ec', class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { key: 'e6ad5d5190d9341afde82de0c8897249e173463e', 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: '057dabe6f2fd8853f6a1df6d0c1c8d6574393f45', class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { key: '674e0cf71b0a2d1cc367c929196a7876c23c966c', name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { key: '001b3df1f014b0039bfe0cdd588aae91d92a78bd', class: "co-color-picker__helper-text" }, this.helperText)))));
+            offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { 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", { class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { 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", { class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { class: "co-color-picker__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-color-picker"; }
     static get encapsulation() { return "shadow"; }
@@ -1018,6 +1037,26 @@ export class CoColorPicker {
     }
     static get properties() {
         return {
+            "inline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Muestra el panel (\u00E1rea, tono, muestras y hex) siempre a la vista, sin el campo que lo\nabre. Para un host que ya tiene su propio disparador \u2014un punto de color que abre un\npopover\u2014: sin esto el usuario abr\u00EDa el popover y despu\u00E9s, adentro, el campo con la paleta.\nElegir una muestra no cierra nada; el host decide cu\u00E1ndo cerrar lo suyo."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "inline",
+                "defaultValue": "false"
+            },
             "value": {
                 "type": "string",
                 "mutable": true,

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

@@ -215,7 +215,7 @@ export class CoColorSlider {
                     "references": {
                         "ColorSliderChannel": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-color-slider/co-color-slider.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-color-slider/co-color-slider.tsx",
                             "id": "src/components/co-color-slider/co-color-slider.tsx::ColorSliderChannel"
                         }
                     }

package/dist/collection/components/co-column-picker/co-column-picker.css

@@ -75,7 +75,10 @@
   cursor: not-allowed;
 }
 
-.co-column-picker--error .co-column-picker__field { border-color: var(--co-semantic-status-error); }
+/* Borde de error de CAMPO por --co-semantic-border-error: gira con el tema (status-error es
+   relleno fijo y como trazo en oscuro daba 2,94:1). En claro vale status-error (idéntico).
+   Fallback: la primitiva de hoy, hasta publicar tokens. */
+.co-column-picker--error .co-column-picker__field { border-color: var(--co-semantic-border-error, var(--co-semantic-status-error)); }
 .co-column-picker--success .co-column-picker__field { border-color: var(--co-semantic-status-success); }
 .co-column-picker--warning .co-column-picker__field { border-color: var(--co-color-status-review); }
 .co-column-picker--info .co-column-picker__field { border-color: var(--co-semantic-status-info); }
@@ -480,11 +483,13 @@
   color: var(--co-semantic-text-muted);
 }
 
+/* Tinta de estado por --co-semantic-text-*: gira con el tema (status-* es relleno, no se
+   aclara, y como texto en oscuro daba <4,5). Fallback a la primitiva hasta publicar tokens. */
 .co-column-picker__helper--error .co-column-picker__helper-text,
-.co-column-picker__helper--error .co-column-picker__helper-icon { color: var(--co-semantic-status-error); }
+.co-column-picker__helper--error .co-column-picker__helper-icon { color: var(--co-semantic-text-error, var(--co-semantic-status-error)); }
 .co-column-picker__helper--success .co-column-picker__helper-text,
-.co-column-picker__helper--success .co-column-picker__helper-icon { color: var(--co-semantic-status-success); }
+.co-column-picker__helper--success .co-column-picker__helper-icon { color: var(--co-semantic-text-success, var(--co-semantic-status-success)); }
 .co-column-picker__helper--warning .co-column-picker__helper-text,
-.co-column-picker__helper--warning .co-column-picker__helper-icon { color: var(--co-color-status-review); }
+.co-column-picker__helper--warning .co-column-picker__helper-icon { color: var(--co-semantic-text-warning, var(--co-color-status-review)); }
 .co-column-picker__helper--info .co-column-picker__helper-text,
-.co-column-picker__helper--info .co-column-picker__helper-icon { color: var(--co-semantic-status-info); }
+.co-column-picker__helper--info .co-column-picker__helper-icon { color: var(--co-semantic-text-info, var(--co-semantic-status-info)); }

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

@@ -191,13 +191,13 @@ export class CoColumnPicker {
         return (h("div", { class: "co-column-picker__empty" }, h("co-icon", { name: "magnifying-glass", size: 40, class: "co-column-picker__empty-icon" }), h("span", null, this.emptyText)));
     }
     render() {
-        return (h("div", { key: 'ab2ad3bd249351f19e223ee8437d0f66ea368f84', class: {
+        return (h("div", { key: 'a2120bb77b510ce077e025616d9c6e72020bb3e6', class: {
                 'co-column-picker': true,
                 'co-column-picker--open': this.isOpen,
                 'co-column-picker--disabled': this.disabled,
                 'co-column-picker--focused': this.focused,
                 [`co-column-picker--${this.status}`]: this.status !== 'default',
-            } }, (this.label || this.secondaryLabel) && (h("div", { key: 'eef032ff9774ee1ac9c656a8413ebf099a7d4a42', class: "co-column-picker__labels" }, this.label && h("label", { key: '6638950f784fac9809d853945b87dd8ce26d86b8', class: "co-column-picker__label" }, this.label), this.secondaryLabel && h("span", { key: 'eeac25d27edddeabf25e7b62f9e7e550d9683f87', class: "co-column-picker__secondary-label" }, this.secondaryLabel))), this.renderField(), this.isOpen && (h("div", { key: '761ac25d7c97c1b5b51e24dde8e0bd98d1471649', class: "co-column-picker__dropdown" }, this.showSearch && (h("div", { key: 'e54ed5eee5f71cb30b3e09728b0e4d4987d98e99', class: "co-column-picker__search" }, h("co-icon", { key: '184a9b2193e53669fb10796bdd770a863fe642b7', name: "magnifying-glass", size: 14, class: "co-column-picker__search-icon" }), h("input", { key: '9f41b5adf0dfeec083a300ce743c3bbe78b95fe9', ref: el => (this.searchInputEl = el), class: "co-column-picker__search-input", type: "text", value: this.query, placeholder: this.placeholder, onInput: this.handleSearchInput, onClick: (e) => e.stopPropagation() }), this.query && (h("button", { key: '4dd69184260a2edead1737df4f2f07ecf6b10680', class: "co-column-picker__search-clear", type: "button", onClick: this.handleSearchClear }, h("co-icon", { key: '5cf2e640b64683b3802696ac66d6ecfabfffdb3a', name: "x", size: 14 }))))), this.showToolbar && this.multiple && (h("div", { key: 'd383004d0b209a93f11f7d070796b2944f3c6849', class: "co-column-picker__toolbar" }, h("button", { key: '22dd890b4c35c8cac632f2c90ce0d0a4f20a166a', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleSelectAll }, this.selectAllText), h("button", { key: '5a69e90720c2e3724656ca9a9a774f496faafcb1', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleDeselectAll }, this.clearText), h("span", { key: '4c9bc30f4429d7e54f4040ec874ea18423e7de77', class: "co-column-picker__toolbar-sep" }), h("button", { key: 'b3a106e5b4268f3ea6d6de8bdac162b247d43b91', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleExpandAll }, this.expandText), h("button", { key: 'a79d4b5ba8a481c2db958ba9d685712e24b95feb', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleCollapseAll }, this.collapseText), h("span", { key: '53439fb7eab725a7e11261aa440106c68dbf7865', style: { flex: '1' } }), this.selectedValues.length > 0 && h("span", { key: 'd34736ad6f2081228f7cb43a5d88b69e7fc33e15', class: "co-column-picker__toolbar-counter" }, this.selectedValues.length, " ", this.selectedText))), h("div", { key: '28226718a1270e859742fe754d4ea75a0c23a8e6', class: "co-column-picker__scroll", style: { maxHeight: `${this.maxHeight}px` } }, this.renderTree()))), this.helperText && (h("div", { key: 'e9a252deb5af1abd89d988bc354a8dbd6130a6cd', class: `co-column-picker__helper co-column-picker__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '051cd7eee2817ba288be2e8d38c2b92b0fc63cb8', name: this.statusIcon, size: 14, weight: "fill", class: "co-column-picker__helper-icon" }), h("span", { key: 'b496d726484740151c2830e1e4d2a85b1040d86f', class: "co-column-picker__helper-text" }, this.helperText)))));
+            } }, (this.label || this.secondaryLabel) && (h("div", { key: '0cfdbab1ed5a8181736a31f568c86159f347c454', class: "co-column-picker__labels" }, this.label && h("label", { key: '3116d113241914cdf8d4292d8b06f9581f7a04ea', class: "co-column-picker__label" }, this.label), this.secondaryLabel && h("span", { key: 'a7036062b6079277d1c2c58364d050a81f261241', class: "co-column-picker__secondary-label" }, this.secondaryLabel))), this.renderField(), this.isOpen && (h("div", { key: '6a01e60a472887b24cc18cb60dad6009027117fe', class: "co-column-picker__dropdown" }, this.showSearch && (h("div", { key: 'f9096d8e0cd1af02697aa12f9d3086d8acf3daeb', class: "co-column-picker__search" }, h("co-icon", { key: 'b344002c06c67b48d1627eec562fdd29ca3235d4', name: "magnifying-glass", size: 14, class: "co-column-picker__search-icon" }), h("input", { key: '222cecfbb918816a9f503d59f616f35d668626bb', ref: el => (this.searchInputEl = el), class: "co-column-picker__search-input", type: "text", value: this.query, placeholder: this.placeholder, onInput: this.handleSearchInput, onClick: (e) => e.stopPropagation() }), this.query && (h("button", { key: 'b2a4a5032d41610e27dd1200ddeef4fe6420b38b', class: "co-column-picker__search-clear", type: "button", onClick: this.handleSearchClear }, h("co-icon", { key: 'd7506c21412eb5d4e9fb0f2ffd2e53994fb654af', name: "x", size: 14 }))))), this.showToolbar && this.multiple && (h("div", { key: '0a9fa0cb6a4acefee7b198794551fcf667989c0e', class: "co-column-picker__toolbar" }, h("button", { key: '5e8bb88650636a8906961fe6fd9e41fb966f91ad', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleSelectAll }, this.selectAllText), h("button", { key: '87778b94a713d8bc9d2ce2a4fc409bbdc1306f8f', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleDeselectAll }, this.clearText), h("span", { key: '1b9df7a39d0454d05bb61c3a0490ce9a81ee3048', class: "co-column-picker__toolbar-sep" }), h("button", { key: 'a42b5776bd3fe35578b78915c2b46679af83ddf6', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleExpandAll }, this.expandText), h("button", { key: 'f44b9093b4d02ac0f5196c90947eb23f64c93353', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleCollapseAll }, this.collapseText), h("span", { key: '46081f18d3023dd5b377462a3459c56bb4c33e77', style: { flex: '1' } }), this.selectedValues.length > 0 && h("span", { key: '26c7311ea78e0b81965a6b8930eba3e0a1febb8c', class: "co-column-picker__toolbar-counter" }, this.selectedValues.length, " ", this.selectedText))), h("div", { key: 'ca89343db1df2062175c9a71ded6d5b804ef8dcd', class: "co-column-picker__scroll", style: { maxHeight: `${this.maxHeight}px` } }, this.renderTree()))), this.helperText && (h("div", { key: 'f0edd823f2ea2c75ca54d267bb54638ddc3cf6f2', class: `co-column-picker__helper co-column-picker__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '3f32eb32a7fd4a3ca440b7b1c4f74b0bdb0cc83f', name: this.statusIcon, size: 14, weight: "fill", class: "co-column-picker__helper-icon" }), h("span", { key: '2c671fea48759d468e57f2440f30a60f872716b9', class: "co-column-picker__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-column-picker"; }
     static get encapsulation() { return "shadow"; }

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

@@ -244,17 +244,19 @@
   line-height: 1;
 }
 
+/* Tinta de estado por --co-semantic-text-*: gira con el tema (status-* es relleno, no se
+   aclara, y como texto en oscuro daba <4,5). Fallback a la primitiva hasta publicar tokens. */
 .co-combobox__helper--error .co-combobox__helper-icon,
-.co-combobox__helper--error .co-combobox__helper-text { color: var(--co-semantic-status-error); }
+.co-combobox__helper--error .co-combobox__helper-text { color: var(--co-semantic-text-error, var(--co-semantic-status-error)); }
 
 .co-combobox__helper--success .co-combobox__helper-icon,
-.co-combobox__helper--success .co-combobox__helper-text { color: var(--co-semantic-status-success); }
+.co-combobox__helper--success .co-combobox__helper-text { color: var(--co-semantic-text-success, var(--co-semantic-status-success)); }
 
 .co-combobox__helper--warning .co-combobox__helper-icon,
-.co-combobox__helper--warning .co-combobox__helper-text { color: var(--co-color-status-review); }
+.co-combobox__helper--warning .co-combobox__helper-text { color: var(--co-semantic-text-warning, var(--co-color-status-review)); }
 
 .co-combobox__helper--info .co-combobox__helper-icon,
-.co-combobox__helper--info .co-combobox__helper-text { color: var(--co-semantic-status-info); }
+.co-combobox__helper--info .co-combobox__helper-text { color: var(--co-semantic-text-info, var(--co-semantic-status-info)); }
 
 /* ── Horizontal layout: label left; control + helper stacked right ──
    Set --co-field-label-width on a container to align labels across fields. */
@@ -282,9 +284,10 @@
   min-width: 0;
 }
 
+/* Asterisco de requerido: tinta --co-semantic-text-error (gira con el tema). */
 .co-field-required {
   margin-left: 2px;
-  color: var(--co-color-status-error);
+  color: var(--co-semantic-text-error, var(--co-color-status-error));
 }
 
 .co-field-required__caption {

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

@@ -271,19 +271,21 @@ export class CoCombobox {
         var _a;
         const active = document.activeElement;
         if (active === this.el || this.el.contains(active)) {
-            (_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.focus();
+            // Sin scroll: si el panel se cerró porque el campo salió de la vista de su scroller
+            // (co-popover), devolverle el foco llevaba al usuario de vuelta arriba del formulario.
+            (_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
         }
     }
     render() {
-        return (h("div", { key: '8b0ff4418cd4ef8313fb18f597423938668e7c4c', class: {
+        return (h("div", { key: 'f99c5d0c64f2b663d0cd553a26e5d64b66610571', class: {
                 'co-combobox': true,
                 'co-combobox--open': this.isOpen,
                 'co-combobox--disabled': this.disabled,
                 [`co-combobox--${this.size}`]: true,
-            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: 'e54542e22563eafd57909405254d85a8b4df3e4f', class: "co-combobox__labels" }, this.label && h("label", { key: '3f54d1ba25400dd89b1e3a59c564f68e8a3785df', class: "co-combobox__label", part: "label" }, this.label, h(RequiredMark, { key: '4b0c64794195101ef3dfac1b656cd393eb19012a', required: this.required })), this.secondaryLabel && (h("span", { key: '51f2ed8dcd890fa162011ccf1fe9e3f96afcc6b9', class: "co-combobox__secondary-label", part: "secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: 'c071e11ad27db937caa615b63d32e056b099ea4a', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: 'c4b215350ab75d791e9f0181f43af320e32506a9', slot: "trigger", class: "co-combobox__trigger", part: "trigger", role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-controls": this.isOpen ? CoCombobox.LIST_ID : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.iconLeft && (h("co-icon", { key: '595cfc20ba148cd99e487002d4ce186feaf4b590', name: this.iconLeft, size: 16, class: "co-combobox__icon" })), h("div", { key: '04a932c116df074d9a9e293d7dc3fead24f85e84', class: "co-combobox__input-wrapper", ref: (el) => (this.chipContainerEl = el) }, this.multiple && this.hasValue ? (this.selectedOptions.map(opt => (h("co-chip", { size: "small", "icon-mode": "both", label: opt.label }, h("co-icon", { slot: "icon-left", name: opt.icon || 'circle', size: 10 }), h("co-icon", { slot: "icon-right", name: "x-circle", size: 10, weight: "fill", onClick: (e) => { e.stopPropagation(); this.handleListRemove(opt.value); } }))))) : (h("span", { class: {
+            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: '0e779933aa8d138ff765440ac2bd42ec6a3d13d7', class: "co-combobox__labels" }, this.label && h("label", { key: '463b2a9b0adaa41cc94ae6fa4f4010518294d210', class: "co-combobox__label", part: "label" }, this.label, h(RequiredMark, { key: '516ffb77b7e7a76ea8a37bd2afcb1e7089af83cd', required: this.required })), this.secondaryLabel && (h("span", { key: '43c140bbd96c4008d972d3692899cef6521b2f7f', class: "co-combobox__secondary-label", part: "secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: '74e786d471d4a0d0c496cf2e0ff943b0041737ab', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '302aae50470ebdba2a60d35372e9403724632d0c', slot: "trigger", class: "co-combobox__trigger", part: "trigger", role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-controls": this.isOpen ? CoCombobox.LIST_ID : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.iconLeft && (h("co-icon", { key: 'dc3e6cf2d6b0e43bc51ee9176c2b820717fb7bef', name: this.iconLeft, size: 16, class: "co-combobox__icon" })), h("div", { key: 'fa07a4fc78beb89a0528eb5ca860aafbf97b5e78', class: "co-combobox__input-wrapper", ref: (el) => (this.chipContainerEl = el) }, this.multiple && this.hasValue ? (this.selectedOptions.map(opt => (h("co-chip", { size: "small", "icon-mode": "both", label: opt.label }, h("co-icon", { slot: "icon-left", name: opt.icon || 'circle', size: 10 }), h("co-icon", { slot: "icon-right", name: "x-circle", size: 10, weight: "fill", onClick: (e) => { e.stopPropagation(); this.handleListRemove(opt.value); } }))))) : (h("span", { class: {
                 'co-combobox__text': true,
                 'co-combobox__text--placeholder': !this.hasValue,
-            } }, this.hasValue ? this.displayText : this.placeholder))), this.multiple && this.overflowCount > 0 && (h("span", { key: '3717ddeb6a6cbfb50992f060a94466637d641848', class: "co-combobox__overflow-badge" }, this.overflowCount)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '3bd22162de7163e761f4deec4813c7bbd2dc7ab3', class: "co-combobox__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear selection", part: "clear" }, h("co-icon", { key: '466f7859e45f36d572e2736f8c67bb028be00e90', name: "x-circle", size: 16, weight: "fill" }))), h("co-icon", { key: '6631ac9f8053225d79b4ec3e70733de96044a5fa', name: this.isOpen ? 'caret-up' : 'caret-down', size: 16, class: "co-combobox__caret" })), h("div", { key: '3d3cf9b043e50c161f48575e625dfa167c0efefd', class: "co-combobox__dropdown", part: "dropdown" }, this.isOpen && (h("co-option-list", { key: '74eb44b2f32b30f5965a24d3d46fd99dba6b05b3', id: CoCombobox.LIST_ID, ref: (el) => (this.optionListEl = el), items: this.listItemsJson, value: this.multiple ? JSON.stringify(this.selectedValues) : (this.selectedValues[0] || ''), multiple: this.multiple, selectedAffordance: "check", removableItems: this.multiple, virtual: true, searchable: this.searchable, searchPlaceholder: this.searchPlaceholder, searchDebounce: 0, highlightMatches: true, emptyMessage: this.emptyMessage, onCoSearch: (e) => { this.searchQuery = e.detail; }, onCoChange: (e) => this.handleListChange(e.detail), onCoRemoveItem: (e) => this.handleListRemove(e.detail) }, this.showFooter && (h("co-list-footer", { key: '00861de6c0f6cd87a9a21d88d9f4fe1dd31afc6c', slot: "footer", secondaryLabel: this.footerSecondaryLabel, primaryLabel: this.footerPrimaryLabel, onCoSecondary: this.handleFooterSecondary, onCoPrimary: this.handleFooterPrimary })))))), this.helperText && (h("div", { key: 'ac1eaf079ae327e76df9723972404a375903689e', class: `co-combobox__helper co-combobox__helper--${this.status}`, part: "helper" }, this.statusIcon && h("co-icon", { key: 'be90b01fda8c51b11bbc73b8ab76085e160492b1', name: this.statusIcon, size: 14, weight: "fill", class: "co-combobox__helper-icon" }), h("span", { key: 'c3921ff5a264d24bbba07358085d92675aadbe9b', class: "co-combobox__helper-text" }, this.helperText)))));
+            } }, this.hasValue ? this.displayText : this.placeholder))), this.multiple && this.overflowCount > 0 && (h("span", { key: '157baffb4927145da44cd6fc722ae1732cf20f13', class: "co-combobox__overflow-badge" }, this.overflowCount)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '1788b18dbd71a4f4e3c8c579d8394d69edda11ab', class: "co-combobox__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear selection", part: "clear" }, h("co-icon", { key: 'e37b3b32b59958dda1c0f9d33e59c9e9ebf48cbb', name: "x-circle", size: 16, weight: "fill" }))), h("co-icon", { key: '9686ea04af76add029c292936f393f059c85ad8d', name: this.isOpen ? 'caret-up' : 'caret-down', size: 16, class: "co-combobox__caret" })), h("div", { key: '7b1ffa794b02e14594990d86ae4032b41b536854', class: "co-combobox__dropdown", part: "dropdown" }, this.isOpen && (h("co-option-list", { key: '33c1d95d4ea218b7707ddc0665db826bb8f86028', id: CoCombobox.LIST_ID, ref: (el) => (this.optionListEl = el), items: this.listItemsJson, value: this.multiple ? JSON.stringify(this.selectedValues) : (this.selectedValues[0] || ''), multiple: this.multiple, selectedAffordance: "check", removableItems: this.multiple, virtual: true, searchable: this.searchable, searchPlaceholder: this.searchPlaceholder, searchDebounce: 0, highlightMatches: true, emptyMessage: this.emptyMessage, onCoSearch: (e) => { this.searchQuery = e.detail; }, onCoChange: (e) => this.handleListChange(e.detail), onCoRemoveItem: (e) => this.handleListRemove(e.detail) }, this.showFooter && (h("co-list-footer", { key: '933855b46314034c639869b4aafd9e5e577a3e1b', slot: "footer", secondaryLabel: this.footerSecondaryLabel, primaryLabel: this.footerPrimaryLabel, onCoSecondary: this.handleFooterSecondary, onCoPrimary: this.handleFooterPrimary })))))), this.helperText && (h("div", { key: '876426c2eae453d0bd8cc5bbbfd704970d8eb243', class: `co-combobox__helper co-combobox__helper--${this.status}`, part: "helper" }, this.statusIcon && h("co-icon", { key: '53cb106c5cddb0ba6a29bc9cc73aae8fd21c8913', name: this.statusIcon, size: 14, weight: "fill", class: "co-combobox__helper-icon" }), h("span", { key: '0f9a22080d190fa2cbd4f68d28838a42a6ab2761', class: "co-combobox__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-combobox"; }
     static get encapsulation() { return "shadow"; }
@@ -545,7 +547,7 @@ export class CoCombobox {
                     "references": {
                         "ComboboxOption": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-combobox/co-combobox.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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.css

@@ -16,6 +16,7 @@ co-overlay { --co-overlay-bg: rgba(0, 0, 0, 0.16); }
   max-width: 560px;
   max-height: 420px;
   background: var(--co-semantic-surface-page);
+  color: var(--co-semantic-text-default); /* tinta pareja con el fondo (top layer) */
   border-radius: var(--co-border-radius-lg);
   box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
   overflow: hidden;
@@ -56,10 +57,12 @@ co-overlay { --co-overlay-bg: rgba(0, 0, 0, 0.16); }
   color: var(--co-semantic-text-muted);
 }
 
+/* ESC: text-muted sobre surface-muted daba 2,0:1 en oscuro y 2,8:1 en claro;
+   text-secondary sobre surface-control da ~6,5:1 en ambos (cambia el claro). */
 .co-command-search__shortcut {
   font-size: var(--co-font-size-10);
-  color: var(--co-semantic-text-muted);
-  background: var(--co-semantic-surface-muted);
+  color: var(--co-semantic-text-secondary);
+  background: var(--co-semantic-surface-control);
   padding: 2px var(--co-spacing-xs);
   border-radius: var(--co-border-radius-xxs);
   font-weight: 500;

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

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