@prolibu-suite/cobalt-core 0.2.0 → 0.4.0

package/dist/esm/co-command-search.entry.js

@@ -1,13 +1,64 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-Es9IUmmt.js';
 import { r as rankByMatch, h as highlightMatch } from './normalizeText-CQY6Ul7q.js';
 
-const coCommandSearchCss = () => `:host{display:contents}.co-command-search__trigger{display:contents}.co-command-search{display:flex;flex-direction:column;width:90vw;max-width:560px;max-height:420px;background:var(--co-semantic-surface-page);border-radius:var(--co-border-radius-lg);box-shadow:0 16px 48px rgba(0, 0, 0, 0.16);overflow:hidden;font-family:var(--co-font-family-primary);transform:translateY(8px) scale(0.98);opacity:0;transition:transform 0.15s ease, opacity 0.15s ease;margin-top:-15vh}.co-command-search--open{transform:translateY(0) scale(1);opacity:1}.co-command-search__input-row{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-md) var(--co-spacing-lg);border-bottom:1px solid var(--co-semantic-border-default);color:var(--co-semantic-text-muted)}.co-command-search__input{flex:1;border:none;outline:none;background:transparent;font-size:var(--co-font-size-16);font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);min-width:0}.co-command-search__input::placeholder{color:var(--co-semantic-text-muted)}.co-command-search__shortcut{font-size:var(--co-font-size-10);color:var(--co-semantic-text-muted);background:var(--co-semantic-surface-muted);padding:2px var(--co-spacing-xs);border-radius:var(--co-border-radius-xxs);font-weight:500;line-height:1.4;flex-shrink:0}.co-command-search__results{flex:1;overflow-y:auto;padding:var(--co-spacing-xs) 0}.co-command-search__item{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm) var(--co-spacing-lg);cursor:pointer;font-size:var(--co-font-size-14);color:var(--co-semantic-text-default);transition:background 0.08s ease}.co-command-search__item:hover,.co-command-search__item--active{background:var(--co-semantic-surface-hover)}.co-command-search__item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-command-search__match{font-weight:700}.co-command-search__empty{padding:var(--co-spacing-2xl) var(--co-spacing-lg);text-align:center;font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted)}`;
+/** Flatten an ordered CommandItem[] into render rows, inserting a header
+ *  whenever the section changes. `index` counts items only (drives activeIndex). */
+function groupItems(items) {
+    const rows = [];
+    let lastSection;
+    let i = 0;
+    for (const item of items) {
+        const section = item.section;
+        if (section && section !== lastSection) {
+            rows.push({ kind: 'header', label: section });
+        }
+        lastSection = section;
+        rows.push({ kind: 'item', item, index: i });
+        i++;
+    }
+    return rows;
+}
+
+/**
+ * Pure: should the component keep open and emit coScopeChange
+ * instead of the default coSelect+close?
+ */
+function shouldKeepOpen(item) {
+    return item.keepOpen === true;
+}
+/**
+ * Pure: should coBackspaceEmpty fire?
+ * True when the user presses Backspace with an empty query.
+ */
+function isEmptyBackspace(key, query) {
+    return key === 'Backspace' && query === '';
+}
+/**
+ * Pure: client-side item filtering.
+ * Mirrors the filteredItems getter logic from co-command-search.tsx.
+ * When async=true all items pass through (host already filtered them).
+ */
+function applyClientFilter(items, query, async) {
+    if (async)
+        return items;
+    if (!query)
+        return items;
+    return rankByMatch(items, query, item => [item.label, item.value]);
+}
+
+const coCommandSearchCss = () => `:host{display:contents}co-overlay{--co-overlay-bg:rgba(0, 0, 0, 0.16)}.co-command-search__trigger{display:contents}.co-command-search{display:flex;flex-direction:column;width:90vw;max-width:560px;max-height:420px;background:var(--co-semantic-surface-page);border-radius:var(--co-border-radius-lg);box-shadow:0 8px 32px rgba(0, 0, 0, 0.12);overflow:hidden;font-family:var(--co-font-family-primary);transform:translateY(8px) scale(0.98);opacity:0;transition:transform 0.15s ease, opacity 0.15s ease;margin-top:-15vh}.co-command-search--open{transform:translateY(0) scale(1);opacity:1}.co-command-search__input-row{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-md) var(--co-spacing-lg);border-bottom:1px solid var(--co-semantic-border-default);color:var(--co-semantic-text-muted)}.co-command-search__input{flex:1;border:none;outline:none;background:transparent;font-size:var(--co-font-size-16);font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);min-width:0}.co-command-search__input::placeholder{color:var(--co-semantic-text-muted)}.co-command-search__shortcut{font-size:var(--co-font-size-10);color:var(--co-semantic-text-muted);background:var(--co-semantic-surface-muted);padding:2px var(--co-spacing-xs);border-radius:var(--co-border-radius-xxs);font-weight:500;line-height:1.4;flex-shrink:0}.co-command-search__results{flex:1;overflow-y:auto;padding:var(--co-spacing-xs) 0}.co-command-search__item{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm) var(--co-spacing-lg);cursor:pointer;font-size:var(--co-font-size-14);color:var(--co-semantic-text-default);transition:background 0.08s ease}.co-command-search__item:hover,.co-command-search__item--active{background:var(--co-semantic-surface-hover)}.co-command-search__item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-command-search__match{font-weight:700}.co-command-search__empty{padding:var(--co-spacing-2xl) var(--co-spacing-lg);text-align:center;font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted)}.co-command-search__section{padding:var(--co-spacing-sm) var(--co-spacing-lg) var(--co-spacing-xs);font-size:var(--co-font-size-12);font-weight:600;text-transform:uppercase;letter-spacing:0.04em;color:var(--co-semantic-text-muted)}.co-command-search__item-text{flex:1;min-width:0;display:flex;flex-direction:column}.co-command-search__item-subtitle{font-size:var(--co-font-size-12);color:var(--co-semantic-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-command-search__loading{flex-shrink:0;display:flex;align-items:center}.co-command-search__facet-chip{display:inline-flex;align-items:center;gap:2px;padding:2px var(--co-spacing-xs);background:var(--co-color-primary-azul);color:var(--co-color-base-blanco, #fff);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:500;white-space:nowrap;flex-shrink:0}.co-command-search__facet-chip-label{max-width:110px;overflow:hidden;text-overflow:ellipsis}.co-command-search__facet-chip-remove{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border:none;border-radius:var(--co-border-radius-full);background:rgba(255, 255, 255, 0.25);color:inherit;cursor:pointer;padding:0;line-height:1;transition:background 0.1s ease}.co-command-search__facet-chip-remove:hover{background:rgba(255, 255, 255, 0.4)}.co-command-search__tabs{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-md);overflow-x:auto;border-bottom:1px solid var(--co-semantic-border-default);scroll-padding-right:104px}.co-command-search__tab{flex:0 0 auto}.co-command-search__tab--more{position:sticky;right:0;padding-left:var(--co-spacing-sm);background:var(--co-semantic-surface-page);box-shadow:-12px 0 10px -4px var(--co-semantic-surface-page)}.co-command-search__fav{padding:var(--co-spacing-sm) var(--co-spacing-lg) var(--co-spacing-md);border-bottom:1px solid var(--co-semantic-border-default)}.co-command-search__fav-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(88px, 1fr));gap:var(--co-spacing-xs)}.co-command-search__fav-card{display:flex;flex-direction:column;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm) var(--co-spacing-xs);background:transparent;border:none;border-radius:var(--co-border-radius-sm);cursor:pointer;font-family:inherit;text-align:center;min-width:0;transition:background 0.12s ease}.co-command-search__fav-card:hover{background:var(--co-semantic-surface-hover)}.co-command-search__fav-card:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-command-search__fav-icon{flex:none;width:50px;height:50px;border-radius:var(--co-border-radius-sm);display:flex;align-items:center;justify-content:center;color:var(--co-color-base-blanco, #fff);box-shadow:0 2px 6px rgba(0, 0, 0, 0.14)}.co-command-search__fav-label{font-size:var(--co-font-size-12);font-weight:500;line-height:1.2;color:var(--co-semantic-text-default);max-width:100%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}`;
 
 const CoCommandSearch = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.coSelect = createEvent(this, "coSelect", 7);
         this.coClose = createEvent(this, "coClose", 7);
+        this.coQueryChange = createEvent(this, "coQueryChange", 7);
+        this.coScopeChange = createEvent(this, "coScopeChange", 1);
+        this.coBackspaceEmpty = createEvent(this, "coBackspaceEmpty", 1);
+        this.coChipRemove = createEvent(this, "coChipRemove", 1);
+        this.coTabSelect = createEvent(this, "coTabSelect", 1);
+        this.coMoreTabs = createEvent(this, "coMoreTabs", 1);
         /** Whether the command palette is open */
         this.open = false;
         /** Placeholder text for the search input */
@@ -16,13 +67,38 @@ const CoCommandSearch = class {
         this.items = [];
         /** Empty state message when no results match */
         this.emptyMessage = 'No results found';
+        /** When true, the host supplies already-filtered, ordered items: disable
+         *  internal client filtering so fetch-as-you-type results pass through. */
+        this.async = false;
+        /** Show a loading indicator in the results area (async fetch in flight). */
+        this.loading = false;
+        /** Facet chips as JSON string: [{label:string, icon?:string}[]] */
+        this.chips = '[]';
+        /** Module tabs (mac-Spotlight style) as JSON: [{value,label,icon}]. Empty = no tabs row. */
+        this.tabs = '[]';
+        /** The active tab's value (the scope model key), or '' = no active tab. */
+        this.activeTab = '';
+        /** Show the "Más ▾" overflow tab. */
+        this.hasMore = false;
+        /** Label for the overflow tab. */
+        this.moreLabel = 'More';
+        /** Favorites / shortcuts grid (mac-Spotlight app grid) as JSON: [{value,label,icon,color}].
+         *  Shown as a grid at the top of the results, only while the query is empty. */
+        this.favorites = '[]';
         this.query = '';
         this.activeIndex = 0;
         this.handleInput = (e) => {
             this.query = e.target.value;
             this.activeIndex = 0;
+            this.coQueryChange.emit(this.query);
         };
         this.handleKeyDown = (e) => {
+            // Backspace with empty query → notify host to pop scope or last facet-chip
+            if (isEmptyBackspace(e.key, this.query)) {
+                e.preventDefault();
+                this.coBackspaceEmpty.emit(this.query);
+                return;
+            }
             const items = this.filteredItems;
             switch (e.key) {
                 case 'ArrowDown':
@@ -43,6 +119,14 @@ const CoCommandSearch = class {
                     e.preventDefault();
                     this.close();
                     break;
+                case 'Tab':
+                    e.preventDefault();
+                    if (items.length > 0) {
+                        this.activeIndex = e.shiftKey
+                            ? (this.activeIndex - 1 + items.length) % items.length
+                            : (this.activeIndex + 1) % items.length;
+                    }
+                    break;
             }
         };
         this.handleOverlayClick = () => {
@@ -67,9 +151,34 @@ const CoCommandSearch = class {
         return this.items;
     }
     get filteredItems() {
-        if (!this.query)
-            return this.parsedItems;
-        return rankByMatch(this.parsedItems, this.query, item => [item.label, item.value]);
+        return applyClientFilter(this.parsedItems, this.query, this.async);
+    }
+    get parsedChips() {
+        try {
+            const arr = typeof this.chips === 'string' ? JSON.parse(this.chips) : this.chips;
+            return Array.isArray(arr) ? arr : [];
+        }
+        catch (_a) {
+            return [];
+        }
+    }
+    get parsedTabs() {
+        try {
+            const a = typeof this.tabs === 'string' ? JSON.parse(this.tabs) : this.tabs;
+            return Array.isArray(a) ? a : [];
+        }
+        catch (_a) {
+            return [];
+        }
+    }
+    get parsedFavorites() {
+        try {
+            const a = typeof this.favorites === 'string' ? JSON.parse(this.favorites) : this.favorites;
+            return Array.isArray(a) ? a : [];
+        }
+        catch (_a) {
+            return [];
+        }
     }
     /** Item label with the matched substring wrapped for highlighting. */
     renderLabel(label) {
@@ -78,6 +187,20 @@ const CoCommandSearch = class {
             return label;
         return [seg.pre, h("span", { class: "co-command-search__match" }, seg.match), seg.post];
     }
+    onActiveTabChange(newVal) {
+        if (newVal) {
+            this.query = '';
+            this.activeIndex = 0;
+        }
+        // The active tab may be appended past the visible width (e.g. a model picked
+        // from "Más"). Scroll it into view; scroll-padding-right keeps it clear of the
+        // sticky "Más" chip.
+        requestAnimationFrame(() => {
+            var _a;
+            const active = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.co-command-search__tab[aria-selected="true"]');
+            active === null || active === void 0 ? void 0 : active.scrollIntoView({ inline: 'nearest', block: 'nearest' });
+        });
+    }
     onOpenChange(newVal) {
         if (newVal) {
             this.query = '';
@@ -85,7 +208,12 @@ const CoCommandSearch = class {
             requestAnimationFrame(() => { var _a; return (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus(); });
         }
     }
+    /** Two-stage commit: keepOpen items emit coScopeChange only; all others emit coSelect + close. */
     selectItem(item) {
+        if (shouldKeepOpen(item)) {
+            this.coScopeChange.emit(item.value);
+            return;
+        }
         this.coSelect.emit(item.value);
         this.close();
     }
@@ -96,17 +224,28 @@ const CoCommandSearch = class {
     render() {
         const items = this.filteredItems;
         return [
-            h("div", { key: 'a837e25103bc4d0b5f12510394e6faa7a10cfed0', class: "co-command-search__trigger", onClick: this.handleTriggerClick }, h("slot", { key: '68ce8b285bb6d340514c3f94e893a660e82cfd11', name: "trigger" })),
-            h("co-overlay", { key: '6e1ab3f12cc2990925f3de792f8a9147e03a9344', open: this.open, onCoClose: this.handleOverlayClick }, h("div", { key: 'addbcba32e1a93816430a469bb656d73e1d9c720', class: { 'co-command-search': true, 'co-command-search--open': this.open }, part: "panel", role: "dialog", "aria-modal": "true", "aria-label": "Command palette", onClick: this.handlePanelClick }, h("div", { key: '26d15f5ce055af014fc10bd653a0e60bd76b1b6a', class: "co-command-search__input-row", part: "input-row" }, h("co-icon", { key: '8a28ed2a0a5d006756666c21bc065fdee66bf075', name: "magnifying-glass", size: 20 }), h("input", { key: 'd29e28125dbb19d7f5e037f0f222bbd29e99b290', class: "co-command-search__input", type: "text", placeholder: this.placeholder, value: this.query, onInput: this.handleInput, onKeyDown: this.handleKeyDown, ref: el => (this.inputEl = el), part: "input" }), h("span", { key: '73472a3e802a00e7a9a93fd567501a7105c936c1', class: "co-command-search__shortcut" }, "ESC")), h("div", { key: '3f70472cb5821c8d5a16fc9d3887d6f2920f3d89', class: "co-command-search__results", part: "results" }, items.length > 0
-                ? items.map((item, index) => (h("div", { class: {
-                        'co-command-search__item': true,
-                        'co-command-search__item--active': index === this.activeIndex,
-                    }, part: "item", onClick: () => this.selectItem(item), onMouseEnter: () => { this.activeIndex = index; } }, item.icon && h("co-icon", { name: item.icon, size: 18 }), h("span", { class: "co-command-search__item-label" }, this.renderLabel(item.label)))))
-                : h("div", { class: "co-command-search__empty", part: "empty" }, this.emptyMessage)))),
+            h("div", { key: '8997e31184c5531e5b329432f6ff29496d1070f5', class: "co-command-search__trigger", onClick: this.handleTriggerClick }, h("slot", { key: '63bf6dbcb3aaf35a0fdacd70b96b8f5701cd27cf', name: "trigger" })),
+            h("co-overlay", { key: '7f96e661c6cab4f6440beab808993665efb86cab', open: this.open, onCoClose: this.handleOverlayClick }, h("div", { key: '20b27b7609cd00cb52d903babbb7565885ce1188', class: { 'co-command-search': true, 'co-command-search--open': this.open }, part: "panel", role: "dialog", "aria-modal": "true", "aria-label": "Command palette", onClick: this.handlePanelClick }, h("div", { key: 'c9bb1834d60ea728cb70e4ebb9ce08c76abafec1', class: "co-command-search__input-row", part: "input-row" }, h("co-icon", { key: '971da90765cf33c7d427c173e974fb7f68e96ed5', name: "magnifying-glass", size: 20 }), this.parsedChips.map((chip, idx) => (h("span", { class: "co-command-search__facet-chip" }, chip.icon && h("co-icon", { name: chip.icon, size: 12 }), h("span", { class: "co-command-search__facet-chip-label" }, chip.label), h("button", { class: "co-command-search__facet-chip-remove", type: "button", "aria-label": `Remove filter ${chip.label}`, onClick: (e) => {
+                    e.stopPropagation();
+                    this.coChipRemove.emit(idx);
+                } }, h("co-icon", { name: "x", size: 10, weight: "bold" }))))), h("input", { key: '81921bb9085d6bfb3ed4a274ef195e299dd01023', class: "co-command-search__input", type: "text", placeholder: this.placeholder, value: this.query, onInput: this.handleInput, onKeyDown: this.handleKeyDown, ref: el => (this.inputEl = el), part: "input", role: "combobox", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "co-cmd-results", "aria-autocomplete": "list", "aria-activedescendant": this.filteredItems[this.activeIndex] ? 'co-cmd-opt-' + this.activeIndex : undefined }), this.loading && (h("co-loader", { key: 'd5ab9e9a98b7a94c3c6f8d16682994666f1c5b18', class: "co-command-search__loading", part: "loading", size: "sm" })), h("span", { key: 'eb62a8d79faff742108246565ede12ff7ee145f1', class: "co-command-search__shortcut" }, "ESC")), (this.parsedTabs.length > 0 || this.hasMore) && (h("div", { key: '4533b27e38469ab4ab6ddc9e918b408e136e097b', class: "co-command-search__tabs", part: "tabs", role: "tablist" }, this.parsedTabs.map(tab => {
+                const active = tab.value === this.activeTab;
+                return (h("co-chip", { class: "co-command-search__tab", role: "tab", "aria-selected": active ? 'true' : 'false', clickable: true, selected: active, variant: active ? 'filled' : 'outlined', color: active ? 'primary' : 'default', iconLeft: tab.icon, label: tab.label, onCoClick: () => this.coTabSelect.emit(active ? '' : tab.value) }));
+            }), this.hasMore && (h("co-chip", { key: '4efe5ab79e9e5b3b5c973ff4bbc80caf2f49bb9c', class: "co-command-search__tab co-command-search__tab--more", clickable: true, variant: "outlined", label: this.moreLabel, iconRight: "caret-down", onCoClick: () => this.coMoreTabs.emit() })))), h("div", { key: 'd2e6d24d6d7aba13111d3f148bed12157e80ea6d', class: "co-command-search__results", part: "results", role: "listbox", id: "co-cmd-results" }, this.parsedFavorites.length > 0 && !this.query && (h("div", { key: '17abc91e955610afec6ef6c68aae5bac25bd6820', class: "co-command-search__fav", part: "favorites" }, h("div", { key: 'dc5dee8ec8f9d1a5c1dc9b4119e04ca4459750bf', class: "co-command-search__fav-grid" }, this.parsedFavorites.map(fav => (h("button", { class: "co-command-search__fav-card", type: "button", onClick: () => this.coSelect.emit(fav.value) }, h("span", { class: "co-command-search__fav-icon", style: { background: fav.color || 'var(--co-semantic-surface-muted)' } }, h("co-icon", { name: fav.icon || 'circle', size: 26, weight: "fill" })), h("span", { class: "co-command-search__fav-label" }, fav.label))))))), items.length > 0
+                ? groupItems(items).map(row => row.kind === 'header'
+                    ? h("div", { class: "co-command-search__section", part: "section", role: "presentation" }, row.label)
+                    : (h("div", { class: {
+                            'co-command-search__item': true,
+                            'co-command-search__item--active': row.index === this.activeIndex,
+                        }, part: "item", role: "option", id: 'co-cmd-opt-' + row.index, "aria-selected": row.index === this.activeIndex ? 'true' : 'false', onClick: () => this.selectItem(row.item), onMouseEnter: () => { this.activeIndex = row.index; } }, row.item.icon && h("co-icon", { name: row.item.icon, size: 18 }), h("span", { class: "co-command-search__item-text" }, h("span", { class: "co-command-search__item-label" }, this.renderLabel(row.item.label)), row.item.subtitle && (h("span", { class: "co-command-search__item-subtitle" }, row.item.subtitle))))))
+                : !this.loading && (h("div", { class: "co-command-search__empty", part: "empty" }, this.emptyMessage))))),
         ];
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "activeTab": [{
+                "onActiveTabChange": 0
+            }],
         "open": [{
                 "onOpenChange": 0
             }]

package/dist/esm/co-data-table-pagination.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-BKmfyPZK.js';
+import { r as registerInstance, c as createEvent, h } from './index-Es9IUmmt.js';
 
 const coDataTablePaginationCss = () => `:host{display:block;font-family:var(--co-font-family-primary)}.co-pagination{display:flex;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);font-size:var(--co-font-size-12);color:var(--co-semantic-text-secondary);letter-spacing:var(--co-font-letter-spacing-body);user-select:none}.co-pagination__section{display:flex;align-items:center;gap:var(--co-spacing-sm);flex-shrink:0}.co-pagination__spacer{flex:1}.co-pagination__label{color:var(--co-semantic-text-secondary);white-space:nowrap}.co-pagination__count{color:var(--co-semantic-text-secondary);white-space:nowrap}.co-pagination__jump-input{width:32px;height:28px;border:1px solid var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-xxs);background:var(--co-color-base-blanco);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);color:var(--co-semantic-text-default);text-align:center;padding:0 var(--co-spacing-xs);outline:none;transition:border-color 0.15s ease}.co-pagination__jump-input:focus{border-color:var(--co-color-primary-azul)}.co-pagination__section--page-size{position:relative}.co-pagination__page-size-trigger{display:flex;align-items:center;gap:var(--co-spacing-xs);cursor:pointer;padding:var(--co-spacing-xs) var(--co-spacing-sm);border-radius:var(--co-border-radius-xxs);transition:background-color 0.15s ease}.co-pagination__page-size-trigger:hover{background:var(--co-semantic-surface-hover)}.co-pagination__page-size-value{font-weight:500;color:var(--co-semantic-text-default)}.co-pagination__page-size-dropdown{position:absolute;bottom:calc(100% + 4px);left:0;min-width:72px;background:var(--co-color-base-blanco);border:1px solid var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-xs);box-shadow:0 4px 12px var(--co-color-opacity-negro-8);padding:var(--co-spacing-xs) 0;z-index:10}.co-pagination__page-size-option{display:block;width:100%;padding:var(--co-spacing-sm) var(--co-spacing-md);border:none;background:none;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);color:var(--co-semantic-text-default);text-align:left;cursor:pointer;transition:background-color 0.1s ease}.co-pagination__page-size-option:hover{background:var(--co-semantic-surface-hover)}.co-pagination__page-size-option--active{font-weight:500;color:var(--co-color-primary-azul)}.co-pagination__nav{display:flex;align-items:center;gap:var(--co-spacing-xxs)}.co-pagination__nav-btn{display:flex;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-radius:var(--co-border-radius-xxs);background:var(--co-color-base-blanco);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);color:var(--co-semantic-text-default);cursor:pointer;transition:background-color 0.15s ease;white-space:nowrap}.co-pagination__nav-btn:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-pagination__nav-btn:disabled{opacity:0.4;cursor:not-allowed}.co-pagination__page-btn{min-width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--co-border-radius-xxs);background:none;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);color:var(--co-semantic-text-secondary);cursor:pointer;transition:background-color 0.1s ease}.co-pagination__page-btn:hover{background:var(--co-semantic-surface-hover)}.co-pagination__page-btn--active{background:var(--co-color-base-negro);color:var(--co-color-base-blanco);font-weight:500}.co-pagination__page-btn--active:hover{background:var(--co-color-base-negro)}.co-pagination__ellipsis{display:flex;align-items:center;justify-content:center;min-width:28px;height:28px;color:var(--co-color-gray-400)}`;
 
@@ -89,17 +89,17 @@ const CoDataTablePagination = class {
     }
     render() {
         const pages = this.getVisiblePages();
-        return (h("div", { key: '4b7d41e571e1c8a6e353b413b5e790b48ea37995', class: "co-pagination", part: "pagination" }, h("div", { key: '8a0dedd2ea3b54dd19d2286c5e114fe61f732278', class: "co-pagination__section" }, h("span", { key: 'e4629e6610c5d4e9b1d1cfb24b5edf0e2703c80e', class: "co-pagination__label" }, this.jumpToPageLabel), h("input", { key: 'fd25c034fdd8c05bf665c6aeffa9686a32573bd9', type: "text", class: "co-pagination__jump-input", value: this.jumpToValue || String(this.page), onInput: (e) => {
+        return (h("div", { key: '58fdc57923ac061b83b248ad47bfc898b66fb512', class: "co-pagination", part: "pagination" }, h("div", { key: '918fdaecef593fdde7095353be9d28a19b1a89c4', class: "co-pagination__section" }, h("span", { key: '4b962d74a9655b6fd6a6ec670df4139b28bd49c1', class: "co-pagination__label" }, this.jumpToPageLabel), h("input", { key: 'c4db59aea2a672f6b103ec1b3183af94c10168b2', 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: '4ddc38a6e5817cb1f516b35dd07e46d811a2006b', class: "co-pagination__section co-pagination__section--page-size" }, h("div", { key: 'b4aca717ecd742f1dcb60da8ec64bc194d7cd47b', class: "co-pagination__page-size-trigger", onClick: () => { this.showPageSizeDropdown = !this.showPageSizeDropdown; } }, h("span", { key: '53169bfff85ffe4a97fb8ce369f3be9ecc163725', class: "co-pagination__page-size-value" }, this.pageSize), h("span", { key: '01b9e912b864fd989548b03ae8119ada87e6de49', class: "co-pagination__label" }, this.perPageLabel), h("co-icon", { key: 'a56598b548e6635296886750354c315b12fbe2d8', name: "caret-down", size: 14 })), this.showPageSizeDropdown && (h("div", { key: '093a6b2c02f2c7309a14b9b3c7d44e4801643d32', class: "co-pagination__page-size-dropdown", part: "dropdown" }, this.parsedPageSizes.map(size => (h("button", { class: {
+            }, part: "jump-input" })), h("div", { key: '76de3483638cab4fbd2161c3ecd0331d8ce479c9', class: "co-pagination__section co-pagination__section--page-size" }, h("div", { key: '816fce2951c214419670d7bc060476beb1d3dda3', class: "co-pagination__page-size-trigger", onClick: () => { this.showPageSizeDropdown = !this.showPageSizeDropdown; } }, h("span", { key: 'c65b889eb1c7287559c40e7449e4053e3ffafa87', class: "co-pagination__page-size-value" }, this.pageSize), h("span", { key: '72191c99bb24055f6a239aeb301452240ad954b3', class: "co-pagination__label" }, this.perPageLabel), h("co-icon", { key: 'f9688b7b17af70c9348b837bdacc2cf879a50e71', name: "caret-down", size: 14 })), this.showPageSizeDropdown && (h("div", { key: '47273c123ecdcfd8aee50d6d67d27bddcd78efcb', 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: 'b2c6703a5cb87eba43264acd998e837eebbff342', class: "co-pagination__spacer" }), h("div", { key: 'a48a4bdf1cc1ee9dc80901504c11741589a9ebc3', class: "co-pagination__section" }, h("span", { key: '1c7cb0c55a537530d4322a1e7b452c810f32ea94', class: "co-pagination__count" }, this.totalCount.toLocaleString(), " ", this.recordsLabel)), h("div", { key: '60b13b593caf9b08396dd30ac1b9e513ec6a3197', class: "co-pagination__section co-pagination__nav" }, h("button", { key: '125da6a4b3e175fc7651d25ee020316f6d64e3d6', 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: '38fa750720d8df2087b6579d287f79681c6b0ff8', class: "co-pagination__spacer" }), h("div", { key: '17f1557e704f2f466efe06babc9ba4d065d67c7f', class: "co-pagination__section" }, h("span", { key: '376d1c381f7efc92ee1afafa664e665ab80f6b17', class: "co-pagination__count" }, this.totalCount.toLocaleString(), " ", this.recordsLabel)), h("div", { key: 'cea4fe162d5610c6fd847be228f672fc3ae088cb', class: "co-pagination__section co-pagination__nav" }, h("button", { key: '64b7983f49a768631265f82af2904b15b6b927ef', 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: '068e6184593877f651a41573d8aa456f9ef2ef49', 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: 'efd6ec713cb22bdb9eb6774e094f8fbc12cb4811', class: "co-pagination__nav-btn", disabled: this.page >= this.totalPages, onClick: () => this.goToPage(this.page + 1), part: "next-btn" }, this.nextLabel))));
     }
     static get watchers() { return {
         "pageSizes": [{

package/dist/esm/co-data-table.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-Es9IUmmt.js';
 
-const coDataTableCss = () => `co-data-table{display:block;flex:1;min-height:0;overflow:hidden}.co-data-table{position:relative;font-family:var(--co-font-family-primary);background:var(--co-color-base-blanco);display:flex;flex-direction:column;height:100%}.co-data-table--resizing{cursor:col-resize;user-select:none}.co-data-table__scroll{flex:1;overflow-x:auto;overflow-y:auto;min-height:0}.co-data-table__table{min-width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.co-data-table__head{position:sticky;top:0;z-index:2}.co-data-table__header-row{height:40px}.co-data-table__th{position:relative;padding:var(--co-spacing-md);background:var(--co-color-base-blanco);border-bottom:1px solid var(--co-color-opacity-negro-8);border-right:1px solid var(--co-color-opacity-negro-8);text-align:left;vertical-align:middle;font-size:var(--co-font-size-14);font-weight:500;color:var(--co-semantic-text-default);letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;overflow:hidden;box-sizing:border-box}.co-data-table__th:last-child{border-right:none}.co-data-table__th--sortable{cursor:pointer}.co-data-table__th--sortable:hover{background:var(--co-semantic-surface-hover)}.co-data-table__th-content{display:flex;align-items:center;justify-content:space-between;gap:var(--co-spacing-sm)}.co-data-table__pin-icon{display:flex;align-items:center;flex-shrink:0;color:var(--co-color-gray-300);cursor:pointer;opacity:0;transition:opacity 0.15s ease, color 0.15s ease}.co-data-table__pin-icon--active{opacity:1;color:var(--co-semantic-text-default)}.co-data-table__th:hover .co-data-table__pin-icon{opacity:1}.co-data-table__pin-icon:hover{color:var(--co-semantic-text-default)}.co-data-table__th-label{flex:1;overflow:hidden;text-overflow:ellipsis}.co-data-table__sort-icon{display:flex;align-items:center;flex-shrink:0;color:var(--co-color-gray-400);transition:color 0.15s ease}.co-data-table__sort-icon--active{color:var(--co-semantic-text-default)}.co-data-table__th--checkbox,.co-data-table__td--checkbox{width:48px;min-width:48px;max-width:48px;padding:var(--co-spacing-md);text-align:center}.co-data-table__th--sticky,.co-data-table__td--sticky{position:sticky;z-index:1;background:var(--co-color-base-blanco)}.co-data-table__th--sticky{z-index:3}.co-data-table__td--sticky::after,.co-data-table__th--sticky::after{content:'';position:absolute;top:0;right:-4px;bottom:0;width:4px;pointer-events:none;opacity:0;background:linear-gradient(to right, var(--co-color-opacity-negro-8), transparent);transition:opacity 0.15s ease}.co-data-table__resize-handle{position:absolute;top:0;right:-2px;width:5px;height:100%;cursor:col-resize;z-index:1}.co-data-table__resize-handle:hover{background:var(--co-color-primary-azul);opacity:0.3}.co-data-table__resize-handle--active{background:var(--co-color-primary-azul);opacity:0.3}.co-data-table__row{height:48px;transition:background-color 0.15s ease;content-visibility:auto;contain-intrinsic-size:auto 48px}.co-data-table__row:hover{background:var(--co-semantic-surface-hover)}.co-data-table__row--selected{background:var(--co-color-opacity-negro-4)}.co-data-table__row--selected:hover{background:var(--co-color-opacity-negro-8)}.co-data-table__td{padding:var(--co-spacing-xs);background:inherit;border-bottom:1px solid var(--co-color-opacity-negro-8);border-right:1px solid var(--co-color-opacity-negro-8);vertical-align:middle;font-size:var(--co-font-size-12);color:var(--co-semantic-text-default);letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box}.co-data-table__td:last-child{border-right:none}.co-data-table__th--align-center,.co-data-table__td--align-center{text-align:center}.co-data-table__th--align-right,.co-data-table__td--align-right{text-align:right}.co-data-table__cell-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}.co-data-table--empty .co-data-table__scroll{flex:0 0 auto;overflow:hidden}.co-data-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;flex:1;min-height:280px;padding:var(--co-spacing-3xl) var(--co-spacing-lg);gap:var(--co-spacing-sm)}.co-data-table__empty-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-muted);color:var(--co-semantic-text-secondary);margin-bottom:var(--co-spacing-sm)}.co-data-table__empty-title{font-size:var(--co-font-size-16);font-weight:600;color:var(--co-semantic-text-default);letter-spacing:-0.03em;margin:0}.co-data-table__empty-message{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);margin:0;max-width:360px}.co-data-table__empty-action{margin-top:var(--co-spacing-md);display:inline-flex}.co-data-table__empty-action:empty{display:none}.co-data-table__skeleton{height:14px;border-radius:var(--co-border-radius-xxs);background:var(--co-color-gray-100);animation:co-dt-shimmer 1.5s ease-in-out infinite;width:70%}.co-data-table__skeleton--checkbox{width:16px;height:16px;margin:0 auto}@keyframes co-dt-shimmer{0%,100%{opacity:1}50%{opacity:0.4}}.co-data-table__row--skeleton{pointer-events:none;content-visibility:visible}.co-data-table__row--flash-create{animation:co-dt-flash-create 1s ease-out}.co-data-table__row--flash-update{animation:co-dt-flash-update 1s ease-out}.co-data-table__row--flash-delete{animation:co-dt-flash-delete 0.5s ease-out forwards}@keyframes co-dt-flash-create{0%{background-color:rgba(2, 162, 112, 0.15)}100%{background-color:transparent}}@keyframes co-dt-flash-update{0%{background-color:rgba(37, 99, 235, 0.15)}100%{background-color:transparent}}@keyframes co-dt-flash-delete{0%{opacity:1;background-color:rgba(170, 46, 27, 0.1)}100%{opacity:0;height:0;padding:0;overflow:hidden}}`;
+const coDataTableCss = () => `co-data-table{display:block;flex:1;min-height:0;overflow:hidden;contain:layout}.co-data-table{position:relative;font-family:var(--co-font-family-primary);background:var(--co-color-base-blanco);display:flex;flex-direction:column;height:100%}.co-data-table--resizing{cursor:col-resize;user-select:none}.co-data-table__scroll{flex:1;overflow-x:auto;overflow-y:auto;min-height:0}.co-data-table__table{min-width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.co-data-table__head{position:sticky;top:0;z-index:2}.co-data-table__header-row{height:40px}.co-data-table__th{position:relative;padding:var(--co-spacing-md);background:var(--co-color-base-blanco);border-bottom:1px solid var(--co-color-opacity-negro-8);border-right:1px solid var(--co-color-opacity-negro-8);text-align:left;vertical-align:middle;font-size:var(--co-font-size-14);font-weight:500;color:var(--co-semantic-text-default);letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;overflow:hidden;box-sizing:border-box}.co-data-table__th:last-child{border-right:none}.co-data-table__th--sortable{cursor:pointer}.co-data-table__th--sortable:hover{background-image:linear-gradient(var(--co-semantic-surface-hover), var(--co-semantic-surface-hover))}.co-data-table__th-content{display:flex;align-items:center;justify-content:space-between;gap:var(--co-spacing-sm)}.co-data-table__pin-icon{display:flex;align-items:center;flex-shrink:0;color:var(--co-color-gray-300);cursor:pointer;opacity:0;transition:opacity 0.15s ease, color 0.15s ease}.co-data-table__pin-icon--active{opacity:1;color:var(--co-semantic-text-default)}.co-data-table__th:hover .co-data-table__pin-icon{opacity:1}.co-data-table__pin-icon:hover{color:var(--co-semantic-text-default)}.co-data-table__th-label{flex:1;overflow:hidden;text-overflow:ellipsis}.co-data-table__sort-icon{display:flex;align-items:center;flex-shrink:0;color:var(--co-color-gray-400);transition:color 0.15s ease}.co-data-table__sort-icon--active{color:var(--co-semantic-text-default)}.co-data-table__sort-button{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:var(--co-spacing-sm);background:transparent;border:0;padding:0;margin:0;font:inherit;color:inherit;letter-spacing:inherit;text-align:left;cursor:pointer}.co-data-table__sort-button:focus-visible{outline:2px solid var(--co-semantic-border-focus, var(--co-color-primary-azul));outline-offset:-2px;border-radius:var(--co-border-radius-xxs)}.co-data-table__th--checkbox,.co-data-table__td--checkbox{width:48px;min-width:48px;max-width:48px;padding:var(--co-spacing-md);text-align:center}.co-data-table__th--sticky,.co-data-table__td--sticky{position:sticky;z-index:1;background:var(--co-color-base-blanco)}.co-data-table__th--sticky{z-index:3}.co-data-table__td--sticky::after,.co-data-table__th--sticky::after{content:'';position:absolute;top:0;right:-4px;bottom:0;width:4px;pointer-events:none;opacity:0;background:linear-gradient(to right, var(--co-color-opacity-negro-8), transparent);transition:opacity 0.15s ease}.co-data-table__resize-handle{position:absolute;top:0;right:-2px;width:5px;height:100%;cursor:col-resize;z-index:1}.co-data-table__resize-handle:hover{background:var(--co-color-primary-azul);opacity:0.3}.co-data-table__resize-handle--active{background:var(--co-color-primary-azul);opacity:0.3}.co-data-table__row{height:48px;transition:background-color 0.15s ease;content-visibility:auto;contain-intrinsic-size:auto 48px}.co-data-table__row:hover{background:var(--co-semantic-surface-hover)}.co-data-table__row--selected{background:var(--co-color-opacity-negro-4)}.co-data-table__row--selected:hover{background:var(--co-color-opacity-negro-8)}.co-data-table__td{height:48px;padding:0 var(--co-spacing-md);background:inherit;border-bottom:1px solid var(--co-color-opacity-negro-8);border-right:1px solid var(--co-color-opacity-negro-8);vertical-align:middle;font-size:var(--co-font-size-12);color:var(--co-semantic-text-default);letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box}.co-data-table__td:last-child{border-right:none}.co-data-table__th--align-center,.co-data-table__td--align-center{text-align:center}.co-data-table__th--align-right,.co-data-table__td--align-right{text-align:right}.co-data-table__cell-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}.co-data-table--empty .co-data-table__scroll{flex:0 0 auto;overflow:hidden}.co-data-table__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;flex:1;min-height:280px;padding:var(--co-spacing-3xl) var(--co-spacing-lg);gap:var(--co-spacing-sm)}.co-data-table__empty-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-muted);color:var(--co-semantic-text-secondary);margin-bottom:var(--co-spacing-sm)}.co-data-table__empty-title{font-size:var(--co-font-size-16);font-weight:600;color:var(--co-semantic-text-default);letter-spacing:-0.03em;margin:0}.co-data-table__empty-message{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);margin:0;max-width:360px}.co-data-table__empty-action{margin-top:var(--co-spacing-md);display:inline-flex}.co-data-table__empty-action:empty{display:none}.co-data-table__skeleton{height:14px;border-radius:var(--co-border-radius-xxs);background:var(--co-color-gray-100);animation:co-dt-shimmer 1.5s ease-in-out infinite;width:70%}.co-data-table__skeleton--checkbox{width:16px;height:16px;margin:0 auto}@keyframes co-dt-shimmer{0%,100%{opacity:1}50%{opacity:0.4}}.co-data-table__row--skeleton{pointer-events:none;content-visibility:visible}.co-data-table__row--flash-create{animation:co-dt-flash-create 1s ease-out}.co-data-table__row--flash-update{animation:co-dt-flash-update 1s ease-out}.co-data-table__row--flash-delete{animation:co-dt-flash-delete 0.5s ease-out forwards}@keyframes co-dt-flash-create{0%{background-color:rgba(2, 162, 112, 0.15)}100%{background-color:transparent}}@keyframes co-dt-flash-update{0%{background-color:rgba(37, 99, 235, 0.15)}100%{background-color:transparent}}@keyframes co-dt-flash-delete{0%{opacity:1;background-color:rgba(170, 46, 27, 0.1)}100%{opacity:0;height:0;padding:0;overflow:hidden}}`;
 
 const CoDataTable = class {
     constructor(hostRef) {
@@ -12,6 +12,7 @@ const CoDataTable = class {
         this.coColumnPin = createEvent(this, "coColumnPin", 7);
         this.coRowDblClick = createEvent(this, "coRowDblClick", 7);
         this.coRowClick = createEvent(this, "coRowClick", 7);
+        this.coEmptyAction = createEvent(this, "coEmptyAction", 7);
         /* ─── DATA ──────────────────────────────────────────────── */
         /** Column definitions (JSON string or array) */
         this.columns = '[]';
@@ -30,6 +31,8 @@ const CoDataTable = class {
         this.emptyMessage = 'No records found';
         /** Empty state icon (Phosphor icon name). */
         this.emptyIcon = 'magnifying-glass';
+        /** Variant for the prop-driven empty-action button. */
+        this.emptyActionVariant = 'stroke';
         /* ─── SORT ──────────────────────────────────────────────── */
         /** Current sort field */
         this.sortField = '';
@@ -101,14 +104,17 @@ const CoDataTable = class {
             this.suppressNextSort = false;
             return;
         }
+        // Standalone 3-state cycle: asc → desc → unsorted ('').
+        // (Controlled consumers like suite-v2 ignore `order` and drive sortField/
+        // sortOrder via props, so their own policy wins regardless of this.)
         let order;
         if (this.sortField === field) {
-            order = this.sortOrder === 'asc' ? 'desc' : 'asc';
+            order = this.sortOrder === 'asc' ? 'desc' : this.sortOrder === 'desc' ? '' : 'asc';
         }
         else {
             order = 'asc';
         }
-        this.sortField = field;
+        this.sortField = order === '' ? '' : field;
         this.sortOrder = order;
         this.coSort.emit({ field, order });
     }
@@ -249,6 +255,18 @@ const CoDataTable = class {
     renderColgroup() {
         return (h("colgroup", null, this.selectable && h("col", { style: { width: '48px' } }), this.parsedColumns.map(col => (h("col", { style: { width: `${this.getColumnWidth(col)}px`, minWidth: `${col.minWidth || 80}px` } })))));
     }
+    renderSortIcon(col) {
+        if (!col.sortable)
+            return null;
+        const isActive = this.sortField === col.field && this.sortOrder !== '';
+        const iconName = !isActive
+            ? 'caret-up-down'
+            : (this.sortOrder === 'asc' ? 'caret-up' : 'caret-down');
+        return (h("span", { class: {
+                'co-data-table__sort-icon': true,
+                'co-data-table__sort-icon--active': isActive,
+            } }, h("co-icon", { name: iconName, size: 16, weight: isActive ? 'fill' : 'regular' })));
+    }
     renderHeader() {
         return (h("thead", { class: "co-data-table__head" }, h("tr", { class: "co-data-table__header-row" }, this.selectable && (h("th", { class: "co-data-table__th co-data-table__th--checkbox co-data-table__th--sticky", style: { left: '0px' } }, h("co-checkbox", { size: "small", checked: this.isAllSelected(), indeterminate: this.isSomeSelected(), onCoChange: () => this.handleSelectAll() }))), this.parsedColumns.map((col, i) => (h("th", { class: {
                 'co-data-table__th': true,
@@ -256,41 +274,44 @@ const CoDataTable = class {
                 'co-data-table__th--sortable': !!col.sortable,
                 'co-data-table__th--sorted': this.sortField === col.field,
                 [`co-data-table__th--align-${col.align || 'left'}`]: true,
-            }, style: this.getColumnStyle(col), onClick: () => col.sortable && this.handleSort(col.field) }, h("span", { class: "co-data-table__th-content" }, h("span", { class: {
+            }, style: this.getColumnStyle(col), "aria-sort": col.sortable && this.sortField === col.field && this.sortOrder !== ''
+                ? (this.sortOrder === 'asc' ? 'ascending' : 'descending')
+                : undefined }, h("span", { class: "co-data-table__th-content" }, h("span", { class: {
                 'co-data-table__pin-icon': true,
                 'co-data-table__pin-icon--active': !!col.sticky,
-            }, title: col.sticky ? 'Unpin column' : 'Pin column', onClick: (e) => this.handleColumnPin(col.field, e) }, h("co-icon", { name: "push-pin", size: 14, weight: col.sticky ? 'fill' : 'regular' })), h("span", { class: "co-data-table__th-label" }, col.label), col.sortable && (h("span", { class: {
-                'co-data-table__sort-icon': true,
-                'co-data-table__sort-icon--active': this.sortField === col.field,
-            } }, h("co-icon", { name: "caret-up-down", size: 16, weight: this.sortField === col.field ? 'fill' : 'regular' })))), this.resizable && i < this.parsedColumns.length - 1 && (h("span", { class: {
+            }, title: col.sticky ? 'Unpin column' : 'Pin column', onClick: (e) => this.handleColumnPin(col.field, e) }, h("co-icon", { name: "push-pin", size: 14, weight: col.sticky ? 'fill' : 'regular' })), col.sortable ? (h("button", { type: "button", class: "co-data-table__sort-button", "aria-label": `Sort by ${col.label}`, onClick: () => this.handleSort(col.field) }, h("span", { class: "co-data-table__th-label" }, col.label), this.renderSortIcon(col))) : (h("span", { class: "co-data-table__th-label" }, col.label))), this.resizable && i < this.parsedColumns.length - 1 && (h("span", { class: {
                 'co-data-table__resize-handle': true,
                 'co-data-table__resize-handle--active': this.resizingColumn === col.field,
             }, onMouseDown: (e) => this.handleResizeStart(col.field, e), onClick: (e) => e.stopPropagation() }))))))));
     }
-    renderBody() {
-        if (this.loading) {
-            return (h("tbody", { class: "co-data-table__body" }, Array.from({ length: this.skeletonRows }).map((_, rowIndex) => (h("tr", { class: "co-data-table__row co-data-table__row--skeleton", key: `skeleton-${rowIndex}` }, this.selectable && (h("td", { class: "co-data-table__td co-data-table__td--checkbox co-data-table__td--sticky", style: { left: '0px' } }, h("div", { class: "co-data-table__skeleton co-data-table__skeleton--checkbox" }))), this.parsedColumns.map(col => (h("td", { class: {
-                    'co-data-table__td': true,
-                    'co-data-table__td--sticky': !!col.sticky,
-                }, style: Object.assign({}, this.getColumnStyle(col)) }, h("div", { class: "co-data-table__skeleton" })))))))));
-        }
-        // When not loading, delegate row rendering to the consumer via default slot.
-        // This avoids Stencil's costly per-cell named-slot relocation (N rows × M cols).
-        // The consumer (e.g. Vue) renders <tbody> directly using co-data-table CSS classes.
-        return h("slot", null);
+    // Skeleton rows shown WHILE loading. Rendered as a SEPARATE <tbody> that
+    // co-exists with the always-mounted default <slot/> (see render()) — it never
+    // REPLACES it. Previously the body position was swapped between this skeleton
+    // and <slot/> on every `loading` toggle; that swap tore the slot down and
+    // orphaned the consumer's projected rows (e.g. Vue's <tbody>), so a concurrent
+    // consumer patch threw "insertBefore ... not a child of this node" on data/model
+    // switches. Row rendering itself is still delegated to the consumer via the
+    // default slot — this avoids Stencil's costly per-cell named-slot relocation.
+    renderSkeletonBody() {
+        return (h("tbody", { class: "co-data-table__body co-data-table__body--skeleton", "aria-hidden": "true" }, Array.from({ length: this.skeletonRows }).map((_, rowIndex) => (h("tr", { class: "co-data-table__row co-data-table__row--skeleton", key: `skeleton-${rowIndex}` }, this.selectable && (h("td", { class: "co-data-table__td co-data-table__td--checkbox co-data-table__td--sticky", style: { left: '0px' } }, h("div", { class: "co-data-table__skeleton co-data-table__skeleton--checkbox" }))), this.parsedColumns.map(col => (h("td", { class: {
+                'co-data-table__td': true,
+                'co-data-table__td--sticky': !!col.sticky,
+            }, style: Object.assign({}, this.getColumnStyle(col)) }, h("div", { class: "co-data-table__skeleton" })))))))));
     }
     renderEmpty() {
         if (this.loading || this.parsedRows.length > 0)
             return null;
-        return (h("div", { class: "co-data-table__empty", part: "empty" }, h("div", { class: "co-data-table__empty-icon" }, h("co-icon", { name: this.emptyIcon, size: 32, weight: "regular" })), this.emptyTitle && (h("h3", { class: "co-data-table__empty-title" }, this.emptyTitle)), this.emptyMessage && (h("p", { class: "co-data-table__empty-message" }, this.emptyMessage)), h("div", { class: "co-data-table__empty-action" }, h("slot", { name: "empty-action" }))));
+        return (h("div", { class: "co-data-table__empty", part: "empty" }, h("div", { class: "co-data-table__empty-icon" }, h("co-icon", { name: this.emptyIcon, size: 32, weight: "regular" })), this.emptyTitle && (h("h3", { class: "co-data-table__empty-title" }, this.emptyTitle)), this.emptyMessage && (h("p", { class: "co-data-table__empty-message" }, this.emptyMessage)), h("div", { class: "co-data-table__empty-action" }, this.emptyActionLabel
+            ? (h("co-button", { variant: this.emptyActionVariant, size: "m", label: this.emptyActionLabel, iconLeft: this.emptyActionIcon, onClick: () => this.coEmptyAction.emit() }))
+            : h("slot", { name: "empty-action" }))));
     }
     render() {
-        return (h("div", { key: 'a5c4cb6afafe73264b5b6643c762867a449bcf1f', class: {
+        return (h("div", { key: '0ca5b4b0a0a31c1ea7488a7ca22b64683a9d35e1', class: {
                 'co-data-table': true,
                 'co-data-table--resizing': this.resizingColumn !== null,
                 'co-data-table--loading': this.loading,
                 'co-data-table--empty': !this.loading && this.parsedRows.length === 0,
-            } }, h("div", { key: '22f664b7c45ab3882665c45bb398f7e41bad331d', class: "co-data-table__scroll" }, h("table", { key: '6cc6e81e405f4d560800aa983b193902eb8ecb5c', class: "co-data-table__table", style: { width: `${this.getTableWidth()}px`, minWidth: '100%' } }, this.renderColgroup(), this.renderHeader(), this.renderBody())), this.renderEmpty()));
+            } }, h("div", { key: 'b2155d0ad52836223b65bb396775bfe726f25966', class: "co-data-table__scroll" }, h("table", { key: 'f950dc3e38660fd1d80f6883bb58384f6e03ef07', class: "co-data-table__table", style: { width: `${this.getTableWidth()}px`, minWidth: '100%' } }, this.renderColgroup(), this.renderHeader(), h("slot", { key: '33751ea8dfef38c5c285b8a08dc763845f509bb7' }), this.loading ? this.renderSkeletonBody() : null)), this.renderEmpty()));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-date-picker.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
-import { R as RequiredMark } from './requiredMark-DFvtYtkE.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-Es9IUmmt.js';
+import { R as RequiredMark } from './requiredMark-Bg25QWFn.js';
 import { g as getDateStrings } from './dateI18n-C1DCLOEl.js';
 
 const coDatePickerCss = () => `:host{display:block;font-family:var(--co-font-family-primary)}.co-date-picker{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-date-picker__label{padding:0 var(--co-spacing-xs);color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-date-picker__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-date-picker__helper--error{color:var(--co-semantic-status-error)}.co-date-picker co-popover{display:block;width:100%}.co-date-picker__trigger{display:block;width:100%;cursor:text}.co-date-picker__panel{padding:var(--co-spacing-md)}.co-date-picker__sheet{display:flex;justify-content:center;padding:var(--co-spacing-sm) 0 var(--co-spacing-lg)}:host([layout='horizontal']) .co-date-picker{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-date-picker__label{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-date-picker__label{white-space:normal}:host([layout='horizontal']) .co-date-picker>:not(.co-date-picker__label){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}`;

package/dist/esm/co-date-range-picker.entry.js

@@ -1,9 +1,9 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
-import { R as RequiredMark } from './requiredMark-DFvtYtkE.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-Es9IUmmt.js';
+import { R as RequiredMark } from './requiredMark-Bg25QWFn.js';
 import { g as getDateStrings } from './dateI18n-C1DCLOEl.js';
-import { i as isValidYMD, t as toLocalDate, p as parseISO, c as compareYMD, a as todayYMD, b as addMonths, s as startOfMonth, d as addDays, f as formatDisplay } from './dates-CyYF8IJE.js';
+import { i as isValidYMD, t as toLocalDate, p as parseISO, c as compareYMD, a as todayYMD, b as addMonths, s as startOfMonth, d as addDays, f as formatDisplay } from './dates-tPYikBRJ.js';
 
-const coDateRangePickerCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14)}.co-date-range-picker{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-date-range-picker__label{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);line-height:1;padding:0 var(--co-spacing-xs)}.co-date-range-picker co-popover{display:block;width:100%}.co-date-range-picker--s .co-date-range-picker__trigger{min-height:28px;padding:0 var(--co-spacing-sm)}.co-date-range-picker--sm .co-date-range-picker__trigger{min-height:32px;padding:0 var(--co-spacing-sm)}.co-date-range-picker--lg .co-date-range-picker__trigger{min-height:48px;padding:0 var(--co-spacing-lg)}.co-date-range-picker__trigger{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);width:100%;min-height:40px;padding:0 var(--co-spacing-md);background:var(--co-semantic-surface-secondary);border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xs);cursor:pointer;color:var(--co-semantic-text-default);box-sizing:border-box;transition:border-color 0.15s ease, box-shadow 0.15s ease}.co-date-range-picker__trigger--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-date-range-picker__trigger--disabled{opacity:0.5;cursor:not-allowed}.co-date-range-picker--invalid .co-date-range-picker__trigger{border-color:var(--co-semantic-status-error)}.co-date-range-picker__icon,.co-date-range-picker__caret{color:var(--co-semantic-text-muted);flex-shrink:0}.co-date-range-picker__trigger-text{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.co-date-range-picker__trigger-text--placeholder{color:var(--co-semantic-text-muted)}.co-date-range-picker__clear{background:none;border:0;padding:0;cursor:pointer;color:var(--co-semantic-text-muted);display:inline-flex;align-items:center;flex-shrink:0}.co-date-range-picker__clear:hover{color:var(--co-semantic-text-default)}.co-date-range-picker__panel{display:flex;flex-direction:column;gap:var(--co-spacing-md);padding:var(--co-spacing-md);min-width:280px}.co-date-range-picker__fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--co-spacing-sm)}.co-date-range-picker__body{display:flex;gap:var(--co-spacing-md);align-items:flex-start}.co-date-range-picker__body--touch{flex-direction:column;align-items:stretch}.co-date-range-picker__body--touch .co-date-range-picker__presets{flex-direction:row;flex-wrap:wrap;min-width:0;border-right:0;padding-right:0;border-bottom:1px solid var(--co-semantic-border-subtle);padding-bottom:var(--co-spacing-sm)}.co-date-range-picker__body--touch co-calendar{align-self:center}.co-date-range-picker__presets{display:flex;flex-direction:column;gap:var(--co-spacing-xxs);min-width:120px;border-right:1px solid var(--co-semantic-border-subtle);padding-right:var(--co-spacing-md)}.co-date-range-picker__preset{text-align:left;background:none;border:0;padding:var(--co-spacing-xs) var(--co-spacing-sm);border-radius:var(--co-border-radius-xs);font-size:var(--co-font-size-14);font-family:inherit;color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.co-date-range-picker__preset:hover{background:var(--co-semantic-surface-hover)}.co-date-range-picker__footer{display:flex;justify-content:flex-end;gap:var(--co-spacing-sm);padding-top:var(--co-spacing-sm);border-top:1px solid var(--co-semantic-border-subtle)}.co-date-range-picker__btn{padding:var(--co-spacing-xs) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-size:var(--co-font-size-14);font-family:inherit;font-weight:500;cursor:pointer;border:0}.co-date-range-picker__btn--ghost{background:transparent;color:var(--co-semantic-text-default)}.co-date-range-picker__btn--ghost:hover{background:var(--co-semantic-surface-hover)}.co-date-range-picker__btn--primary{background:var(--co-color-primary-azul);color:var(--co-color-base-blanco, #fff)}.co-date-range-picker__btn--primary:disabled{opacity:0.5;cursor:not-allowed}.co-date-range-picker__helper{display:inline-flex;align-items:center;gap:var(--co-spacing-xs);font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);padding:0 var(--co-spacing-xs)}.co-date-range-picker__helper--error{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-date-range-picker{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-date-range-picker__label{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-date-range-picker__label{white-space:normal}:host([layout='horizontal']) .co-date-range-picker>:not(.co-date-range-picker__label){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}`;
+const coDateRangePickerCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14)}.co-date-range-picker{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-date-range-picker__label{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);line-height:1;padding:0 var(--co-spacing-xs)}.co-date-range-picker co-popover{display:block;width:100%}.co-date-range-picker--s .co-date-range-picker__trigger{min-height:28px;padding:0 var(--co-spacing-sm)}.co-date-range-picker--sm .co-date-range-picker__trigger{min-height:32px;padding:0 var(--co-spacing-sm)}.co-date-range-picker--lg .co-date-range-picker__trigger{min-height:48px;padding:0 var(--co-spacing-lg)}.co-date-range-picker__trigger{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);width:100%;min-height:40px;padding:0 var(--co-spacing-md);background:color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xs);cursor:pointer;color:var(--co-semantic-text-default);box-sizing:border-box;transition:border-color 0.15s ease, box-shadow 0.15s ease}.co-date-range-picker__trigger--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-date-range-picker__trigger--disabled{opacity:0.5;cursor:not-allowed}.co-date-range-picker--invalid .co-date-range-picker__trigger{border-color:var(--co-semantic-status-error)}.co-date-range-picker__icon,.co-date-range-picker__caret{color:var(--co-semantic-text-muted);flex-shrink:0}.co-date-range-picker__trigger-text{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.co-date-range-picker__trigger-text--placeholder{color:var(--co-semantic-text-muted)}.co-date-range-picker__clear{background:none;border:0;padding:0;cursor:pointer;color:var(--co-semantic-text-muted);display:inline-flex;align-items:center;flex-shrink:0}.co-date-range-picker__clear:hover{color:var(--co-semantic-text-default)}.co-date-range-picker__panel{display:flex;flex-direction:column;gap:var(--co-spacing-md);padding:var(--co-spacing-md);min-width:280px}.co-date-range-picker__fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--co-spacing-sm)}.co-date-range-picker__body{display:flex;gap:var(--co-spacing-md);align-items:flex-start}.co-date-range-picker__body--touch{flex-direction:column;align-items:stretch}.co-date-range-picker__body--touch .co-date-range-picker__presets{flex-direction:row;flex-wrap:wrap;min-width:0;border-right:0;padding-right:0;border-bottom:1px solid var(--co-semantic-border-subtle);padding-bottom:var(--co-spacing-sm)}.co-date-range-picker__body--touch co-calendar{align-self:center}.co-date-range-picker__presets{display:flex;flex-direction:column;gap:var(--co-spacing-xxs);min-width:120px;border-right:1px solid var(--co-semantic-border-subtle);padding-right:var(--co-spacing-md)}.co-date-range-picker__preset{text-align:left;background:none;border:0;padding:var(--co-spacing-xs) var(--co-spacing-sm);border-radius:var(--co-border-radius-xs);font-size:var(--co-font-size-14);font-family:inherit;color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.co-date-range-picker__preset:hover{background:var(--co-semantic-surface-hover)}.co-date-range-picker__footer{display:flex;justify-content:flex-end;gap:var(--co-spacing-sm);padding-top:var(--co-spacing-sm);border-top:1px solid var(--co-semantic-border-subtle)}.co-date-range-picker__btn{padding:var(--co-spacing-xs) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-size:var(--co-font-size-14);font-family:inherit;font-weight:500;cursor:pointer;border:0}.co-date-range-picker__btn--ghost{background:transparent;color:var(--co-semantic-text-default)}.co-date-range-picker__btn--ghost:hover{background:var(--co-semantic-surface-hover)}.co-date-range-picker__btn--primary{background:var(--co-color-primary-azul);color:var(--co-color-base-blanco, #fff)}.co-date-range-picker__btn--primary:disabled{opacity:0.5;cursor:not-allowed}.co-date-range-picker__helper{display:inline-flex;align-items:center;gap:var(--co-spacing-xs);font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);padding:0 var(--co-spacing-xs)}.co-date-range-picker__helper--error{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-date-range-picker{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-date-range-picker__label{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-date-range-picker__label{white-space:normal}:host([layout='horizontal']) .co-date-range-picker>:not(.co-date-range-picker__label){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}@supports not (background: color-mix(in srgb, red, transparent)){.co-date-range-picker__trigger{background:var(--co-semantic-surface-secondary)}}`;
 
 const CoDateRangePicker = class {
     constructor(hostRef) {

package/dist/esm/co-date-range.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BKmfyPZK.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-Es9IUmmt.js';
 
 const coDateRangeCss = () => `:host{display:block}`;
 
@@ -31,7 +31,7 @@ const CoDateRange = class {
         }
     }
     render() {
-        return (h("co-date-range-picker", { key: '52a80ab59ff863209e62f5dcddbc674ea32a662c', 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: 'a366a10a7980292014ac8a9f48a97077cac09299', 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() }));
     }
     get el() { return getElement(this); }
 };