@prolibu-suite/cobalt-core 0.11.6 → 0.11.8

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"
                         }
                     }

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

@@ -19,7 +19,7 @@ co-data-table {
 .co-data-table {
   position: relative;
   font-family: var(--co-font-family-primary);
-  background: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-page);
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -61,7 +61,7 @@ co-data-table {
   position: relative;
   height: 40px; /* Figma header 40 — altura dura, centrado por flex/vertical-align */
   padding: 0 var(--co-spacing-md);
-  background: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-page);
   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);
   text-align: left;
@@ -145,7 +145,8 @@ co-data-table {
 
 .co-data-table__filter-icon--active {
   opacity: 1;
-  color: var(--co-color-primary-azul);
+  /* Tinta de enlace/activo: text-link gira con el tema (azul primitivo = 3,8:1 sobre gray-800). */
+  color: var(--co-semantic-text-link, var(--co-color-primary-azul));
 }
 
 .co-data-table__filter-icon--indirect {
@@ -173,7 +174,9 @@ co-data-table {
   display: flex;
   align-items: center;
   flex-shrink: 0;
-  color: var(--co-color-gray-400);
+  /* text-muted, no gray-400 (= text-disabled): el icono de orden es un control HABILITADO y
+     gray-400 daba 2,6 sobre blanco (auditoría 2026-09-27, §5). */
+  color: var(--co-semantic-text-muted);
   transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
@@ -233,7 +236,7 @@ co-data-table {
 .co-data-table__td--sticky {
   position: sticky;
   z-index: 1;
-  background: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-page);
 }
 
 .co-data-table__th--sticky {
@@ -284,7 +287,7 @@ co-data-table {
   width: 4px;
   pointer-events: none;
   opacity: 0;
-  background: linear-gradient(to right, var(--co-color-opacity-negro-8), transparent);
+  background: linear-gradient(to right, var(--co-semantic-border-subtle), transparent);
   transition: opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
@@ -317,11 +320,11 @@ co-data-table {
 
 .co-data-table__row--selected .co-data-table__td--sticky::before {
   opacity: 1;
-  background-color: var(--co-color-opacity-negro-4);
+  background-color: var(--co-semantic-border-hairline);
 }
 
 .co-data-table__row--selected:hover .co-data-table__td--sticky::before {
-  background-color: var(--co-color-opacity-negro-8);
+  background-color: var(--co-semantic-surface-hover);
 }
 
 /* ─── RESIZE HANDLE ─────────────────────────────────────────── */
@@ -359,11 +362,11 @@ co-data-table {
 }
 
 .co-data-table__row--selected {
-  background: var(--co-color-opacity-negro-4);
+  background: var(--co-semantic-border-hairline);
 }
 
 .co-data-table__row--selected:hover {
-  background: var(--co-color-opacity-negro-8);
+  background: var(--co-semantic-surface-hover);
 }
 
 .co-data-table__td {

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

@@ -509,7 +509,7 @@ export class CoDataTable {
                     "references": {
                         "CoDataTableColumn": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-data-table/co-data-table.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-data-table/co-data-table.tsx",
                             "id": "src/components/co-data-table/co-data-table.tsx::CoDataTableColumn"
                         }
                     }

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

@@ -14,8 +14,8 @@
   align-items: center;
   gap: var(--co-spacing-lg);
   padding: var(--co-spacing-md) var(--co-spacing-lg);
-  border-top: 1px solid var(--co-color-opacity-negro-8);
-  background: var(--co-color-base-blanco);
+  border-top: 1px solid var(--co-semantic-border-subtle);
+  background: var(--co-semantic-surface-page);
   font-size: var(--co-font-size-12);
   color: var(--co-semantic-text-secondary);
   letter-spacing: var(--co-font-letter-spacing-body);
@@ -48,9 +48,9 @@
 .co-pagination__jump-input {
   width: 32px;
   height: 28px;
-  border: 1px solid var(--co-color-opacity-negro-8);
+  border: 1px solid var(--co-semantic-border-subtle);
   border-radius: var(--co-border-radius-xxs);
-  background: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-page);
   font-family: var(--co-font-family-primary);
   font-size: var(--co-font-size-12);
   color: var(--co-semantic-text-default);
@@ -93,8 +93,8 @@
   bottom: calc(100% + 4px);
   left: 0;
   min-width: 72px;
-  background: var(--co-color-base-blanco);
-  border: 1px solid var(--co-color-opacity-negro-8);
+  background: var(--co-semantic-surface-page);
+  border: 1px solid var(--co-semantic-border-subtle);
   border-radius: var(--co-border-radius-xs);
   box-shadow: 0 4px 12px var(--co-color-opacity-negro-8);
   padding: var(--co-spacing-xs) 0;
@@ -121,7 +121,8 @@
 
 .co-pagination__page-size-option--active {
   font-weight: 500;
-  color: var(--co-color-primary-azul);
+  /* Tinta de enlace/activo: text-link gira con el tema (azul primitivo = 3,8:1 sobre gray-800). */
+  color: var(--co-semantic-text-link, var(--co-color-primary-azul));
 }
 
 /* ─── PAGE NAVIGATION ───────────────────────────────────────── */
@@ -136,9 +137,9 @@
   align-items: center;
   gap: var(--co-spacing-xs);
   padding: var(--co-spacing-xs) var(--co-spacing-sm);
-  border: 1px solid var(--co-color-opacity-negro-8);
+  border: 1px solid var(--co-semantic-border-subtle);
   border-radius: var(--co-border-radius-xxs);
-  background: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-page);
   font-family: var(--co-font-family-primary);
   font-size: var(--co-font-size-12);
   color: var(--co-semantic-text-default);
@@ -177,13 +178,13 @@
 }
 
 .co-pagination__page-btn--active {
-  background: var(--co-color-base-negro);
-  color: var(--co-color-base-blanco);
+  background: var(--co-semantic-surface-primary);
+  color: var(--co-semantic-on-primary);
   font-weight: 500;
 }
 
 .co-pagination__page-btn--active:hover {
-  background: var(--co-color-base-negro);
+  background: var(--co-semantic-surface-primary);
 }
 
 .co-pagination__ellipsis {
@@ -192,5 +193,6 @@
   justify-content: center;
   min-width: 28px;
   height: 28px;
-  color: var(--co-color-gray-400);
+  /* text-muted: la elipsis es contenido, no un control deshabilitado (text-disabled daba 2,6). */
+  color: var(--co-semantic-text-muted);
 }

package/dist/collection/components/co-data-table-pagination/co-data-table-pagination.js

@@ -96,17 +96,17 @@ export class CoDataTablePagination {
     }
     render() {
         const pages = this.getVisiblePages();
-        return (h("div", { key: '0f62fb900604d4deb263f03e8075e2c092e8ce73', class: "co-pagination", part: "pagination" }, h("div", { key: '257d5bc2c25ef058ceb7b41ddfba949e8da0d466', class: "co-pagination__section" }, h("span", { key: '61d243f6e20b8aca4f65c4f95dd0a85a98b70485', class: "co-pagination__label" }, this.jumpToPageLabel), h("input", { key: 'd99b709c2f9ac000adf4922c3cbcd9a745f6be2f', type: "text", class: "co-pagination__jump-input", value: this.jumpToValue || String(this.page), onInput: (e) => {
+        return (h("div", { key: '617a09f825d5bd9594e9548d0c20fc13a5db7fd3', class: "co-pagination", part: "pagination" }, h("div", { key: '34a685bd8ac4491d60ff2c918dd5c28db0cbba69', class: "co-pagination__section" }, h("span", { key: '2485f9691607c27cc008f4f86b0e95d437247bc0', class: "co-pagination__label" }, this.jumpToPageLabel), h("input", { key: 'd99846b8b9c6870f1820b92058aedc04eeb3a861', type: "text", class: "co-pagination__jump-input", value: this.jumpToValue || String(this.page), onInput: (e) => {
                 this.jumpToValue = e.target.value;
             }, onKeyDown: (e) => this.handleJumpToPage(e), onFocus: (e) => {
                 e.target.select();
-            }, part: "jump-input" })), h("div", { key: '9737e4830745d75428184b9cb1e45f9cfd713aaf', class: "co-pagination__section co-pagination__section--page-size" }, h("div", { key: '1a025e7dc8fc1cc29547da7633b70e0b1b166ab7', class: "co-pagination__page-size-trigger", onClick: () => { this.showPageSizeDropdown = !this.showPageSizeDropdown; } }, h("span", { key: '5402395084c43c4e828de79454aa2dbb457bf6df', class: "co-pagination__page-size-value" }, this.pageSize), h("span", { key: '8010da33d478ce393f77122926d6d5e30eb6da27', class: "co-pagination__label" }, this.perPageLabel), h("co-icon", { key: '0abd66f654b36912826d9b11357837f1db5b045c', name: "caret-down", size: 14 })), this.showPageSizeDropdown && (h("div", { key: 'ca25c9f67dd28fbf58d903691a6f805168dc255e', class: "co-pagination__page-size-dropdown", part: "dropdown" }, this.parsedPageSizes.map(size => (h("button", { class: {
+            }, part: "jump-input" })), h("div", { key: 'f632f2fc45bbc36b9c0b6e36384c874a86bf6aa7', class: "co-pagination__section co-pagination__section--page-size" }, h("div", { key: 'f221dee7c91bc77db6f129406f75536be9e44101', class: "co-pagination__page-size-trigger", onClick: () => { this.showPageSizeDropdown = !this.showPageSizeDropdown; } }, h("span", { key: 'b393c0f979f8cb47c3c8053a45ba68f76b5dbc03', class: "co-pagination__page-size-value" }, this.pageSize), h("span", { key: '8a5ebabfd0d02cce13a336665146bdfdffc8c8b8', class: "co-pagination__label" }, this.perPageLabel), h("co-icon", { key: '50b8d964edef6e024dd05b3a9568aaeafc68e3f8', name: "caret-down", size: 14 })), this.showPageSizeDropdown && (h("div", { key: '95ea37573a30b0fa211e744357fee3d16f050e28', class: "co-pagination__page-size-dropdown", part: "dropdown" }, this.parsedPageSizes.map(size => (h("button", { class: {
                 'co-pagination__page-size-option': true,
                 'co-pagination__page-size-option--active': size === this.pageSize,
-            }, onClick: () => this.changePageSize(size) }, size)))))), h("div", { key: '3b84c572f6eb902d9bd2787e938014efa710b317', class: "co-pagination__spacer" }), h("div", { key: '0cf60f2844ccd5e7ce370bc57895c874f558b718', class: "co-pagination__section" }, h("span", { key: '944f414d863c494b00df4ac81f688b00597b0af4', class: "co-pagination__count" }, this.totalCount.toLocaleString(), " ", this.recordsLabel)), h("div", { key: '4190fcca176fc5d9918cc6e70c7ab6f5a244dfd7', class: "co-pagination__section co-pagination__nav" }, h("button", { key: '5dbb9d83e9e3df1ad9dc817e5e7995706e9c06b3', class: "co-pagination__nav-btn", disabled: this.page <= 1, onClick: () => this.goToPage(this.page - 1), part: "prev-btn" }, this.previousLabel), pages.map(p => p === '...' ? (h("span", { class: "co-pagination__ellipsis" }, "\u2026")) : (h("button", { class: {
+            }, onClick: () => this.changePageSize(size) }, size)))))), h("div", { key: '842aadd400b81993b4b351720e593e078d9430a8', class: "co-pagination__spacer" }), h("div", { key: '8a107df8e4b72daa20b7660c7fa95e772d802567', class: "co-pagination__section" }, h("span", { key: '1a532086e8349eefebb13445fe010030b6b924a7', class: "co-pagination__count" }, this.totalCount.toLocaleString(), " ", this.recordsLabel)), h("div", { key: '689e3254577b29ff67e03c01fa5c7ba7797c94eb', class: "co-pagination__section co-pagination__nav" }, h("button", { key: '34af2b66e5fe56c5770fea0efaad624f85f157c7', class: "co-pagination__nav-btn", disabled: this.page <= 1, onClick: () => this.goToPage(this.page - 1), part: "prev-btn" }, this.previousLabel), pages.map(p => p === '...' ? (h("span", { class: "co-pagination__ellipsis" }, "\u2026")) : (h("button", { class: {
                 'co-pagination__page-btn': true,
                 'co-pagination__page-btn--active': p === this.page,
-            }, onClick: () => this.goToPage(p) }, p))), h("button", { key: '7b27f1e6910b3f8c40198c83a6c6a11a4fbddaeb', class: "co-pagination__nav-btn", disabled: this.page >= this.totalPages, onClick: () => this.goToPage(this.page + 1), part: "next-btn" }, this.nextLabel))));
+            }, onClick: () => this.goToPage(p) }, p))), h("button", { key: '961479bc06744abaf978ac143390923169ba7d35', class: "co-pagination__nav-btn", disabled: this.page >= this.totalPages, onClick: () => this.goToPage(this.page + 1), part: "next-btn" }, this.nextLabel))));
     }
     static get is() { return "co-data-table-pagination"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-date-field/co-date-field.css

@@ -183,18 +183,23 @@
 }
 
 /* ---- Invalid (mirrors co-input 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); el
+   halo sale de color-mix 12% (= el rgba(170, 46, 27, .12) de antes). Fallback: la primitiva de hoy. */
 .co-date-field--invalid .co-date-field__field {
-  border-color: var(--co-semantic-status-error);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
 }
 
 .co-date-field--invalid.co-date-field--focused .co-date-field__field {
-  border-color: var(--co-semantic-status-error);
-  box-shadow: 0 0 0 2px rgba(170, 46, 27, 0.12);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--co-semantic-border-error, var(--co-semantic-status-error)) 12%, transparent);
 }
 
+/* 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-date-field__helper--error .co-date-field__helper-icon,
 .co-date-field__helper--error .co-date-field__helper-text {
-  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 ──
@@ -223,9 +228,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-date-field/co-date-field.js

@@ -168,20 +168,20 @@ export class CoDateField {
         // should still fall back to the localized default placeholder.
         const placeholder = this.placeholder || t.setDate;
         const helper = this.isInvalid ? this.errorMessage : this.helperText;
-        return (h("div", { key: 'd93a8860d06fcdd8b89dcb3aeccff5c9c5b38167', class: {
+        return (h("div", { key: '453e532a8aa115e750353877880555d00c768951', class: {
                 'co-date-field': true,
                 'co-date-field--disabled': this.disabled,
                 'co-date-field--focused': this.hasFocus,
                 'co-date-field--filled': this.hasValue,
                 'co-date-field--invalid': this.isInvalid,
                 [`co-date-field--${this.size}`]: true,
-            }, part: "wrapper" }, this.label && (h("div", { key: '6504b4f052600de1c04f02a06d8bf63e1328d22e', class: "co-date-field__labels" }, h("label", { key: '123e4c3eebf375fb7aa9071122a414236ecf4655', class: "co-date-field__label", part: "label" }, this.label, h(RequiredMark, { key: '2fbfbfe2c135f6c7205650a53085aad1b0eb353c', required: this.required })))), h("div", { key: '6149b5560bde2ef55d161bfefce6eeb09070db58', class: "co-date-field__field-row" }, h("div", { key: '4457e1e7ac2e11246d4c03d5b6c0ae876aba9ff7', class: "co-date-field__field", part: "field" }, h("co-icon", { key: 'd65eba1f429aaaa8e484525aa7c9d51b054bbc76', name: "calendar", size: 16, class: "co-date-field__icon" }), h("div", { key: 'f8a34bef5a3ffadb07f9a74f78a67ef321566a7b', class: "co-date-field__input-wrapper" }, h("input", { key: '2fc599d088b02d4bda53d7839c2c923d63d23552', ref: (el) => (this.inputEl = el), class: "co-date-field__native", type: "text", inputMode: "numeric", autocomplete: "off", value: this.draft, placeholder: placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? t.dateLabel : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" })), this.clearable && (h("button", { key: 'f255bb2cb791e9956ee6dc89d19fd320069f566b', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: 'e455cfb66bb65981ba685dcd3c2fbbf0bd98562f', class: "co-date-field__labels" }, h("label", { key: 'd3cd19357bded058f3922c5423f816bc094c5fb9', class: "co-date-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'e66ca94dabe83f2bcf77a85d6d4c72ad7eed6cdb', required: this.required })))), h("div", { key: '848c32b06cbe5fa847c9c769c1407f13237ba4d5', class: "co-date-field__field-row" }, h("div", { key: 'ca350ae929087a7e6268de42a4b2e14d3de9ef58', class: "co-date-field__field", part: "field" }, h("co-icon", { key: '9054673efd46a0f367abffc938a3328af6d0408b', name: "calendar", size: 16, class: "co-date-field__icon" }), h("div", { key: '06c441cd3829acfd26d1e2eba100f246fadf4f55', class: "co-date-field__input-wrapper" }, h("input", { key: '0b1fccd57b629230b079ad41d3d02555ca54144d', ref: (el) => (this.inputEl = el), class: "co-date-field__native", type: "text", inputMode: "numeric", autocomplete: "off", value: this.draft, placeholder: placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? t.dateLabel : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" })), this.clearable && (h("button", { key: 'afacd96145ddfb36f9c4823dace12472c1692839', class: {
                 'co-date-field__clear': true,
                 'co-date-field__clear--hidden': !showClear,
-            }, type: "button", tabIndex: -1, onMouseDown: (e) => e.preventDefault() /* keep input focus */, onClick: this.handleClear, "aria-label": (_a = this.clearLabel) !== null && _a !== void 0 ? _a : t.clearDate, part: "clear" }, h("co-icon", { key: '9d3aa2b050471790738c5744277c47a78b5c4f35', name: "x-circle", size: 16, weight: "fill" }))))), this.name && h("input", { key: '54a70ac066a6c20f644aecbd73c498485909b084', type: "hidden", name: this.name, value: (_b = this.value) !== null && _b !== void 0 ? _b : '' }), helper && (h("div", { key: '89574b44f7d194a5bfe36e639b00c9c2f62a438e', class: {
+            }, type: "button", tabIndex: -1, onMouseDown: (e) => e.preventDefault() /* keep input focus */, onClick: this.handleClear, "aria-label": (_a = this.clearLabel) !== null && _a !== void 0 ? _a : t.clearDate, part: "clear" }, h("co-icon", { key: '87d841da80b8d0ef82df03ec32345a0cd274f043', name: "x-circle", size: 16, weight: "fill" }))))), this.name && h("input", { key: '60a65f36972af02f0bb3f747c287b0fb8174de4d', type: "hidden", name: this.name, value: (_b = this.value) !== null && _b !== void 0 ? _b : '' }), helper && (h("div", { key: '05cfeef9edc268c1ca3f6b112d9750532cbf6159', class: {
                 'co-date-field__helper': true,
                 'co-date-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '6a3038de56a98bafdee4e6b11839031b37af9496', name: "warning-circle", size: 14, class: "co-date-field__helper-icon" })), h("span", { key: '9ac954adc74f2fac84abcd3a98fe68120edc1609', class: "co-date-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '8e97926b9bd11f007d850dbcced80b9fb51b37b6', name: "warning-circle", size: 14, class: "co-date-field__helper-icon" })), h("span", { key: '8cd33b10c139f17a97bc88f457a96e23413e744a', class: "co-date-field__helper-text" }, helper)))));
     }
     static get is() { return "co-date-field"; }
     static get encapsulation() { return "shadow"; }

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

@@ -50,8 +50,10 @@ co-date-field[data-variant='flat']::part(field) {
   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-date-picker__helper--error {
-  color: var(--co-semantic-status-error);
+  color: var(--co-semantic-text-error, var(--co-semantic-status-error));
 }
 
 /*
@@ -111,9 +113,10 @@ co-date-field[data-variant='flat']::part(field) {
   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-date-range/co-date-range.js

@@ -42,7 +42,7 @@ export class CoDateRange {
         }
     }
     render() {
-        return (h("co-date-range-picker", { key: 'e1d13b772fcd7aa60bbc77a25a5c6cb40a25dd4b', value: this.value, label: this.label, placeholder: this.placeholder, disabled: this.disabled, clearable: this.clearable, presets: this.presets, helperText: this.helperText, locale: this.locale, applyLabel: this.applyLabel, clearLabel: this.clearLabel, onCoApply: this.handleApply, onCoClear: () => this.coClear.emit() }));
+        return (h("co-date-range-picker", { key: '4ac8c4be9cee1d7573b8770ae61305f171f8358c', value: this.value, label: this.label, placeholder: this.placeholder, disabled: this.disabled, clearable: this.clearable, presets: this.presets, helperText: this.helperText, locale: this.locale, applyLabel: this.applyLabel, clearLabel: this.clearLabel, onCoApply: this.handleApply, onCoClear: () => this.coClear.emit() }));
     }
     static get is() { return "co-date-range"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-date-range-picker/co-date-range-picker.css

@@ -71,8 +71,11 @@
   cursor: not-allowed;
 }
 
+/* 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-date-range-picker--invalid .co-date-range-picker__trigger {
-  border-color: var(--co-semantic-status-error);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
 }
 
 .co-date-range-picker__icon,
@@ -234,8 +237,10 @@
   color: var(--co-semantic-text-muted);
   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-date-range-picker__helper--error {
-  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 ──
@@ -264,9 +269,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-date-range-picker/co-date-range-picker.js

@@ -1055,7 +1055,7 @@ export class CoDateRangePicker {
                     "references": {
                         "DateRangeValue": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
                             "id": "src/components/co-date-range-picker/co-date-range-picker.tsx::DateRangeValue"
                         }
                     }
@@ -1076,7 +1076,7 @@ export class CoDateRangePicker {
                     "references": {
                         "DateRangeValue": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-tooltip-tone/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
+                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
                             "id": "src/components/co-date-range-picker/co-date-range-picker.tsx::DateRangeValue"
                         }
                     }

package/dist/collection/components/co-date-time-picker/co-date-time-picker.css

@@ -171,13 +171,16 @@
   cursor: default;
 }
 
+/* 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); el
+   halo sale de color-mix 12% (= el rgba(170, 46, 27, .12) de antes). Fallback: la primitiva de hoy. */
 .co-date-time-picker__field--invalid {
-  border-color: var(--co-semantic-status-error);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
 }
 
 .co-date-time-picker__field--invalid:focus-within {
-  border-color: var(--co-semantic-status-error);
-  box-shadow: 0 0 0 2px rgba(170, 46, 27, 0.12);
+  border-color: var(--co-semantic-border-error, var(--co-semantic-status-error));
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--co-semantic-border-error, var(--co-semantic-status-error)) 12%, transparent);
 }
 
 /* ---- Helper text ---- */
@@ -193,8 +196,10 @@
   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-date-time-picker__helper--error {
-  color: var(--co-semantic-status-error);
+  color: var(--co-semantic-text-error, var(--co-semantic-status-error));
 }
 
 /* ============================================================
@@ -404,9 +409,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-date-time-picker/co-date-time-picker.js

@@ -371,10 +371,10 @@ export class CoDateTimePicker {
     render() {
         var _a;
         const t = getDateStrings(this.locale);
-        return (h("div", { key: 'fd0f8441ff0531546790d1d318a580cd962bf345', class: "co-date-time-picker", onKeyDown: this.onRootKeyDown }, this.renderLabel(), this.isMobile ? ([
+        return (h("div", { key: 'af86cbb11e2cdfb7c51332fcb7b862458fe5f7fa', class: "co-date-time-picker", onKeyDown: this.onRootKeyDown }, this.renderLabel(), this.isMobile ? ([
             h("div", { class: "co-date-time-picker__trigger", onClick: () => !this.disabled && !this.readonly && this.setOpen(true) }, this.renderTrigger(t)),
             h("co-drawer", { position: "bottom", open: this.open, heading: t.selectDateTime, onCoClose: this.closeApplyingDraft }, h("div", { class: "co-date-time-picker__sheet" }, this.renderPanel(t, true))),
-        ]) : (h("co-popover", { ref: (el) => (this.popoverEl = el), open: this.open, placement: this.placement, offset: 4, closeOnEscape: false, onCoOpen: this.onPopoverOpen, onCoClose: this.onPopoverClose }, h("div", { slot: "trigger", class: "co-date-time-picker__trigger" }, this.renderTrigger(t)), this.open && this.renderPanel(t, false))), this.name && h("input", { key: 'a30aed536d890836f468660f4f40f745504a6731', type: "hidden", name: this.name, value: (_a = this.value) !== null && _a !== void 0 ? _a : '' }), this.renderHelper()));
+        ]) : (h("co-popover", { ref: (el) => (this.popoverEl = el), open: this.open, placement: this.placement, offset: 4, closeOnEscape: false, onCoOpen: this.onPopoverOpen, onCoClose: this.onPopoverClose }, h("div", { slot: "trigger", class: "co-date-time-picker__trigger" }, this.renderTrigger(t)), this.open && this.renderPanel(t, false))), this.name && h("input", { key: '91f3044a08ae34ed8ad50c26ae6319fefdac79d7', type: "hidden", name: this.name, value: (_a = this.value) !== null && _a !== void 0 ? _a : '' }), this.renderHelper()));
     }
     static get is() { return "co-date-time-picker"; }
     static get encapsulation() { return "shadow"; }