@prolibu-suite/cobalt-core 0.9.0 → 0.9.2

package/dist/collection/components/co-bottom-sheet/co-bottom-sheet.js

@@ -1,5 +1,6 @@
 import { h } from "@stencil/core";
 import { createVelocityTracker, decideRelease, rubberBand, } from "../../utils/sheetGesture";
+import { slotHasContent } from "../../utils/slotContent";
 /**
  * Mobile bottom sheet with native drag physics: the sheet follows the finger
  * 1:1 downward, a fast flick (or a slow release past ~45% of its height)
@@ -49,10 +50,10 @@ export class CoBottomSheet {
                 this.coClose.emit();
         };
         this.handleFooterSlotChange = (e) => {
-            this.hasFooter = this.slotHasContent(e);
+            this.hasFooter = slotHasContent(e);
         };
         this.handleHeaderSlotChange = (e) => {
-            this.hasHeaderSlot = this.slotHasContent(e);
+            this.hasHeaderSlot = slotHasContent(e);
         };
         this.handleTransitionEnd = (e) => {
             if (e.propertyName !== 'transform' || e.target !== this.sheetEl)
@@ -206,12 +207,6 @@ export class CoBottomSheet {
         if (this.backdropEl)
             this.backdropEl.style.opacity = '';
     }
-    slotHasContent(e) {
-        return e.target
-            .assignedNodes({ flatten: true })
-            .some((node) => node.nodeType === Node.ELEMENT_NODE ||
-            (node.nodeType === Node.TEXT_NODE && (node.textContent || '').trim() !== ''));
-    }
     arm(e, fromBody) {
         if (!this.open || this.dismissPending || !e.isPrimary)
             return;
@@ -255,13 +250,17 @@ export class CoBottomSheet {
         (_a = this.bodyEl) === null || _a === void 0 ? void 0 : _a.removeEventListener('touchmove', this.touchBlocker);
     }
     render() {
-        return (h("div", { key: 'cbb30d66c27b5abd51309a1e55a920656a1a0c6a', class: { 'co-bottom-sheet-root': true, 'co-bottom-sheet-root--open': this.open } }, h("div", { key: '0b6d164ff4a4520eb9f7cb54991540ba30a9d1e0', class: "co-bottom-sheet__backdrop", part: "backdrop", onClick: this.handleBackdropClick, ref: (el) => (this.backdropEl = el) }), h("section", { key: 'd0a06e9c2ef7389dee933edf6251e0578a78ca71', class: { 'co-bottom-sheet': true, 'co-bottom-sheet--open': this.open }, part: "sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": this.heading ? 'co-bottom-sheet-heading' : undefined, style: { '--co-bottom-sheet-max-height': this.maxHeight }, onTransitionEnd: this.handleTransitionEnd, ref: (el) => (this.sheetEl = el) }, h("div", { key: '749d7123e579ab46b63f6ccd14df28af0890f2fd', class: "co-bottom-sheet__grip", onPointerDown: this.handleGripPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel }, this.showHandle && (h("div", { key: '1c007545c0ab262abe4a2276fe10c18068c1d5c7', class: "co-bottom-sheet__handle", part: "handle", "aria-hidden": "true" })), h("header", { key: 'd1be5c0085c6dc30009ab792b91e86e97477861d', class: {
+        return (h("div", { key: '9c7c9c9dc4f1d627be8801afdaf3cc5999ead3be', class: { 'co-bottom-sheet-root': true, 'co-bottom-sheet-root--open': this.open } }, h("div", { key: '7de7991fdeb6338f3af4a31464f275cd4c9cd909', class: "co-bottom-sheet__backdrop", part: "backdrop", onClick: this.handleBackdropClick, ref: (el) => (this.backdropEl = el) }), h("section", { key: '81ef802c44978ca6db8d2322b0e98f0613d80ad9', class: { 'co-bottom-sheet': true, 'co-bottom-sheet--open': this.open }, part: "sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": this.hasHeaderSlot
+                ? 'co-bottom-sheet-header'
+                : this.heading
+                    ? 'co-bottom-sheet-heading'
+                    : undefined, style: { '--co-bottom-sheet-max-height': this.maxHeight }, onTransitionEnd: this.handleTransitionEnd, ref: (el) => (this.sheetEl = el) }, h("div", { key: 'a66516cb09be2cf219ef1045802c476d9d9b938e', class: "co-bottom-sheet__grip", onPointerDown: this.handleGripPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel }, this.showHandle && (h("div", { key: '214e9765f91449e6f0773c2b5ad6991cf0bb6be8', class: "co-bottom-sheet__handle", part: "handle", "aria-hidden": "true" })), h("header", { key: '3d63d502be3511b543463709e882db231df40c9b', class: {
                 'co-bottom-sheet__header': true,
                 'co-bottom-sheet__header--show': this.hasHeaderSlot || !!this.heading,
-            }, part: "header" }, h("slot", { key: '2163362b13cf19b1221f9655ec5b4b09085a2b6c', name: "header", onSlotchange: this.handleHeaderSlotChange }, this.heading && (h("h2", { key: 'c2f8f34cc167b14d62ac4a27396c8c72e05ab274', class: "co-bottom-sheet__heading", id: "co-bottom-sheet-heading" }, this.heading))))), h("div", { key: 'a89e7b39bd72311b5b0ccd5358c9f9e45618fa86', class: "co-bottom-sheet__body", part: "body", onPointerDown: this.handleBodyPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, ref: (el) => (this.bodyEl = el) }, h("slot", { key: '4424ce944ef083fc9c760774b30d66b48320fe8a' })), h("footer", { key: 'b3452533a6d25a0528c3f0456ce3413e9dcccef4', class: {
+            }, part: "header", id: "co-bottom-sheet-header" }, h("slot", { key: '652d26a569389c0a4829fae4330141603fd0f072', name: "header", onSlotchange: this.handleHeaderSlotChange }, this.heading && (h("h2", { key: '6076038750176a915aad4acff2e0e6cc0f699d12', class: "co-bottom-sheet__heading", id: "co-bottom-sheet-heading" }, this.heading))))), h("div", { key: 'fb08ac38369623c07450a96409961086831be022', class: "co-bottom-sheet__body", part: "body", onPointerDown: this.handleBodyPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, ref: (el) => (this.bodyEl = el) }, h("slot", { key: '963205af45ba01d295afa648f8b37875e6f3adea' })), h("footer", { key: 'b72a488ea199acba8bc9d647a4b5d0eb3170a2c7', class: {
                 'co-bottom-sheet__footer': true,
                 'co-bottom-sheet__footer--show': this.hasFooter,
-            }, part: "footer" }, h("slot", { key: 'd697688035f2767aef0894f9cdf2b99bce9d2fb6', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
+            }, part: "footer" }, h("slot", { key: 'aeecf78508978fd5e5c068ac2b37bfaecb709e1e', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
     }
     static get is() { return "co-bottom-sheet"; }
     static get encapsulation() { return "shadow"; }

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

@@ -42,7 +42,7 @@ export class CoBreadcrumb {
     }
     render() {
         const data = this.parseItems();
-        return (h(Host, { key: '25dce93deb73a903ac025ffeed54ca53ab1f22e3', part: "breadcrumb", role: "navigation", "aria-label": "Breadcrumb" }, data
+        return (h(Host, { key: '8ab383589f78948c7f11d38d4e25fa5509a56dbc', part: "breadcrumb", role: "navigation", "aria-label": "Breadcrumb" }, data
             ? data.map((it, i) => (h("co-breadcrumb-item", { key: i, label: it.label, value: it.value, icon: it.icon, separator: this.separator, current: i === data.length - 1 })))
             : h("slot", { onSlotchange: this.handleSlotChange })));
     }

package/dist/collection/components/co-breadcrumb-item/co-breadcrumb-item.js

@@ -29,10 +29,10 @@ export class CoBreadcrumbItem {
         };
     }
     render() {
-        return (h(Host, { key: '255696950cd3a032a2c5e81afe2b7e495bc974f4', part: "breadcrumb-item", class: {
+        return (h(Host, { key: '16deecfc675429362263d3afb7257025e9170b26', part: "breadcrumb-item", class: {
                 'co-breadcrumb-item': true,
                 'co-breadcrumb-item--current': this.current,
-            } }, h("span", { key: '6a54693a183953f9eaeabf2b4d687f28c479eef6', class: "co-breadcrumb-item__sep", "aria-hidden": "true" }, h("co-icon", { key: '2bce60612e26554fd22a2bc03117e50e0d8efe36', name: this.separator, size: 13 })), h("span", { key: '889634ee730f05686916132456086e9f9a6f21db', class: "co-breadcrumb-item__content", part: "content", role: "link", tabindex: "0", "aria-current": this.current ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && (h("span", { key: 'c90e7812924e4fab4b928c7d892a4cba2f9a59f5', class: "co-breadcrumb-item__icon" }, h("co-icon", { key: '344ff71c4fa9832600ad62df6935dcc695f9a4d7', name: this.icon, size: 16 }))), h("span", { key: '488e831a5cf405f135b7ddd20d95fe823e21ae29', class: "co-breadcrumb-item__label" }, this.label, h("slot", { key: 'c5b05d33b49d273cfc3360df9395ce2417234eae' })))));
+            } }, h("span", { key: '795723b3d89d48356ffe8f9a35df63d9d5dea836', class: "co-breadcrumb-item__sep", "aria-hidden": "true" }, h("co-icon", { key: 'a1bc3a756d0b2ead8a9f150f60688ae19f46cae0', name: this.separator, size: 13 })), h("span", { key: '6dada7bc4a556af7f3b9dc63d2b2d001c13e173e', class: "co-breadcrumb-item__content", part: "content", role: "link", tabindex: "0", "aria-current": this.current ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && (h("span", { key: '63424dc201114b2a589559ee10324ee4cc9cc305', class: "co-breadcrumb-item__icon" }, h("co-icon", { key: 'be25f19369d9f6d0459acd255793782c1580256e', name: this.icon, size: 16 }))), h("span", { key: 'e8f0919b4ab1ba60ae632ccd21e3f353b04deac7', class: "co-breadcrumb-item__label" }, this.label, h("slot", { key: '0ac8d7d59e7828f939f637ef73ab7787a5c820d8' })))));
     }
     static get is() { return "co-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -53,7 +53,7 @@ export class CoButton {
             customStyle.background = this.color;
         if (this.textColor)
             customStyle.color = this.textColor;
-        return (h("button", { key: '297591f38c986f90e08de4e93a0da6da1b619a04', class: {
+        return (h("button", { key: 'e765a1fcb3b4efcc7c43e155015b3c178a536d3c', class: {
                 'co-button': true,
                 [`co-button--${this.variant}`]: true,
                 [`co-button--${this.shape}`]: true,
@@ -63,7 +63,7 @@ export class CoButton {
                 'co-button--disabled': this.disabled,
             }, style: Object.keys(customStyle).length ? customStyle : undefined, type: this.type, disabled: this.disabled, "aria-label": this.ariaLabelText || undefined, onClick: this.handleClick, part: "button" }, this.iconLeft
             ? h("co-icon", { name: this.iconLeft, weight: this.iconWeight, size: iconSize })
-            : null, h("slot", { key: 'cec4aa8696050277860cc6d569b89b725647b3a8' }, this.label), this.iconRight
+            : null, h("slot", { key: '8dd3e816276a67ba6072eeed1ad34a982b60389e' }, this.label), this.iconRight
             ? h("co-icon", { name: this.iconRight, weight: this.iconWeight, size: iconSize })
             : null));
     }

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

@@ -10,12 +10,12 @@ export class CoButtonGroup {
         this.disabled = false;
     }
     render() {
-        return (h("div", { key: '3d04106570e94fdd1787e5a1336b84b523c22607', class: {
+        return (h("div", { key: 'fe4b05941d1bf86586c7e4f2c93fe9644ea027d3', class: {
                 'co-button-group': true,
                 [`co-button-group--${this.direction}`]: true,
                 [`co-button-group--${this.variant}`]: true,
                 'co-button-group--disabled': this.disabled,
-            }, role: "group" }, h("slot", { key: '6121a73fbe3f565b251f4db3f9d2ab45450f0a3c' })));
+            }, role: "group" }, h("slot", { key: 'c583ee5dd23aceea08c3178b93b6f1227101e96e' })));
     }
     static get is() { return "co-button-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -363,7 +363,7 @@ export class CoCalendar {
     render() {
         var _a, _b;
         const t = getDateStrings(this.locale);
-        return (h("div", { key: '171842ca3d4b05a3bbc74266e4472914d3fdd075', class: "co-calendar", part: "root" }, h("div", { key: '4016b24331a9c6bf7da4b49ed37a21d0e4c8bbca', class: "co-calendar__header", part: "header" }, h("button", { key: 'a9483d553caeffd67a61a267e1de25b6ed8445f8', type: "button", class: "co-calendar__nav", onClick: this.handlePrev, "aria-label": (_a = this.prevMonthLabel) !== null && _a !== void 0 ? _a : t.prevMonth }, h("co-icon", { key: 'a866dd1fb1803e2550abb0711b75400e89b83fec', name: "caret-left", size: 16 })), h("button", { key: 'efd4f17cebfce1dd1bdfdfd0bf8e1aa9ca7ecc5d', type: "button", class: "co-calendar__title", "aria-live": "polite", onClick: this.toggleView }, this.headerTitle(), h("co-icon", { key: '9f137fb78bc788d5a9d482102dbcd3cb82d1369a', name: "caret-down", size: 12, class: "co-calendar__title-caret" })), h("button", { key: '7cca94d77736780850cf33e11b84212fcc722d77', type: "button", class: "co-calendar__nav", onClick: this.handleNext, "aria-label": (_b = this.nextMonthLabel) !== null && _b !== void 0 ? _b : t.nextMonth }, h("co-icon", { key: '94e0659623a61aec52608280793c7a356fb329d0', name: "caret-right", size: 16 }))), this.view === 'days' && this.renderDays(t), this.view === 'months' && this.renderMonths(), this.view === 'years' && this.renderYears()));
+        return (h("div", { key: '795529e38ec7b72934d786b9dcaa5046e73fbde8', class: "co-calendar", part: "root" }, h("div", { key: 'f409d1670f4f649d8e91f21915e0008d9ed330ac', class: "co-calendar__header", part: "header" }, h("button", { key: '23a4f12ec30cd86e49661daf755a6d2e23b209ad', type: "button", class: "co-calendar__nav", onClick: this.handlePrev, "aria-label": (_a = this.prevMonthLabel) !== null && _a !== void 0 ? _a : t.prevMonth }, h("co-icon", { key: 'ce6b736011e3ed13781cac180fe4542ec38c75c3', name: "caret-left", size: 16 })), h("button", { key: 'b1fcbb3d09e33b0b462bc278b46e14a348f9f9a9', type: "button", class: "co-calendar__title", "aria-live": "polite", onClick: this.toggleView }, this.headerTitle(), h("co-icon", { key: 'dbe1800ed74e234dc8f334183e504d19d8ab9d74', name: "caret-down", size: 12, class: "co-calendar__title-caret" })), h("button", { key: 'bdbda5999d20cb799aeabe48ebad6e8a4d7d89ff', type: "button", class: "co-calendar__nav", onClick: this.handleNext, "aria-label": (_b = this.nextMonthLabel) !== null && _b !== void 0 ? _b : t.nextMonth }, h("co-icon", { key: 'ec2e268c38d04d1f298cfb12d29647b530b03a94', name: "caret-right", size: 16 }))), this.view === 'days' && this.renderDays(t), this.view === 'months' && this.renderMonths(), this.view === 'years' && this.renderYears()));
     }
     static get is() { return "co-calendar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-calendar-month/co-calendar-month.js

@@ -269,7 +269,7 @@ export class CoCalendarMonth {
         const short = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'short');
         const long = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'long');
         const today = todayYMD();
-        return (h("div", { key: '2ed94ebcddb0f595f740adf3859dc4dcaff49b3c', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '7348dc62431ab4a27295529ac8d596798eee87b5', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
+        return (h("div", { key: 'f8bcb53b7ef7c47a1ff59caee0305dfc1a3f1fc2', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '11acf9973a13ad661590a04dd934c86ceaa10f5d', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
             var _a;
             return (h("div", { class: "cal-month__week", role: "row" }, h("div", { class: "cal-month__days" }, week.map((date) => {
                 const ymd = parseISO(date);

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

@@ -704,11 +704,11 @@ export class CoCalendarTimegrid {
             '--co-cal-hour-h': `calc(${60 / this.slotM} * var(--co-cal-slot-h))`,
             '--co-cal-hour-offset': `calc(${((60 - (this.minM % 60)) % 60) / this.slotM} * var(--co-cal-slot-h))`,
         };
-        return (h("div", { key: '57f7c14647a8dbca49f999bfc256cf4dd58c6d5c', class: "tg", tabIndex: 0, onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: 'f50ac115f074e8749c19d57d47b3bb3486ae68c1', class: "tg__head" }, h("div", { key: 'adf1e34eae02f86ae7eb3721374660ff4c1e4fe8', class: "tg__head-spacer" }), h("div", { key: '5907deb540459a618374a1eb42736ddd3f3d23f6', class: "tg__head-days", style: { gridTemplateColumns: colsTemplate } }, dates.map((d) => {
+        return (h("div", { key: '6714fb717616dff758156f0fcf6d50370bcc52e0', class: "tg", tabIndex: 0, onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '86aa3ebcc5c8c3e66fc200b25819b8806a8883fa', class: "tg__head" }, h("div", { key: '63353e0fb0765f90ecaf6942bad3323497638a17', class: "tg__head-spacer" }), h("div", { key: '842770c40be192de75e8e3d8635d2f78976ee492', class: "tg__head-days", style: { gridTemplateColumns: colsTemplate } }, dates.map((d) => {
             const ymd = parseISO(d);
             const dow = utcDayOfWeek(d);
             return (h("div", { class: { 'tg__head-day': true, 'tg__head-day--today': compareYMD(d, today) === 0 } }, h("span", { class: "tg__head-dow" }, short[dow]), h("span", { class: "tg__head-num" }, ymd.day)));
-        }))), this.allDaySlot && (h("div", { key: 'e517b7a6418d50c418d5d799d0bc623b5946cafd', class: "tg__allday" }, h("div", { key: 'b470f6f08482c15459f05a95508c66f0e2244860', class: "tg__allday-axis" }, gmtLabel(this.timeZone, dates[0])), h("div", { key: '50f2a093550f7320b602cc81dcfd1d1438071539', class: "tg__allday-lane", style: { height: `${Math.max(1, allDay.laneCount) * ALLDAY_LANE_H + 4}px` } }, allDay.segments.map((seg) => this.renderAllDayBar(seg, dates.length, byId))))), h("div", { key: 'fc2f4ad9bf8ab22930907c6ca2f7239ed4a57659', class: "tg__scroll", ref: (el) => (this.scrollEl = el) }, h("div", { key: 'db4a5798f1d587485b31884ebaa2ed853417c031', class: "tg__body" }, h("div", { key: '168e7a54caee97f7219a26d46e6b42b51ac86f88', class: "tg__axis", style: { height: bodyHeight } }, this.hourList().map((m) => (h("span", { class: "tg__axis-hour", style: { top: `${minutesToFraction(m, this.minM, this.maxM) * 100}%` } }, hourLabel(m, this.locale))))), h("div", { key: 'e0f1a5558b07db8abb5586d01cdf3f30eb5f0e3f', class: "tg__cols", style: Object.assign({ gridTemplateColumns: colsTemplate, height: bodyHeight }, hourVars) }, dates.map((d, i) => {
+        }))), this.allDaySlot && (h("div", { key: 'f78e9159e84ecc4a0259c296e1120830b2a2513b', class: "tg__allday" }, h("div", { key: '255ad5c8e6a8c93377c2898acb8ecc06e0a0eb6d', class: "tg__allday-axis" }, gmtLabel(this.timeZone, dates[0])), h("div", { key: '5023271e34910ac5dead15f4b4a4bd4c588b6594', class: "tg__allday-lane", style: { height: `${Math.max(1, allDay.laneCount) * ALLDAY_LANE_H + 4}px` } }, allDay.segments.map((seg) => this.renderAllDayBar(seg, dates.length, byId))))), h("div", { key: '5d37824151562d8a53906ecb059d96afdee93d3e', class: "tg__scroll", ref: (el) => (this.scrollEl = el) }, h("div", { key: 'ebeac3733271bd3ebcaca2343a9f5f01285a7f05', class: "tg__body" }, h("div", { key: '9eed6c09dfe67a9613c0641dbc305ba594312166', class: "tg__axis", style: { height: bodyHeight } }, this.hourList().map((m) => (h("span", { class: "tg__axis-hour", style: { top: `${minutesToFraction(m, this.minM, this.maxM) * 100}%` } }, hourLabel(m, this.locale))))), h("div", { key: 'bc8f8c0e5bf00c8fc92bb6c823fa9ba6c321ad2c', class: "tg__cols", style: Object.assign({ gridTemplateColumns: colsTemplate, height: bodyHeight }, hourVars) }, dates.map((d, i) => {
             var _a;
             const isToday = compareYMD(d, today) === 0;
             return (h("div", { class: { tg__col: true, 'tg__col--today': isToday }, "data-col-date": d, onPointerDown: (e) => this.startSelection(e, d, e.currentTarget), onPointerMove: (e) => this.extendSelection(e, e.currentTarget) }, this.loading

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

@@ -29,13 +29,13 @@ export class CoCard {
         return nodes.length > 0;
     }
     render() {
-        return (h("div", { key: 'c0d3f41a0cff0f996107efeb837028cb9df5622f', class: {
+        return (h("div", { key: '52e3eb679a025b1b53854b38063b6fa951cf9f70', class: {
                 'co-card': true,
                 [`co-card--${this.variant}`]: true,
                 [`co-card--pad-${this.padding}`]: true,
                 'co-card--clickable': this.clickable,
                 'co-card--stretch': this.stretch,
-            }, part: "card", role: this.clickable ? 'button' : undefined, tabIndex: this.clickable ? 0 : undefined }, h("div", { key: '89c672edd380accecd0f6a56095b62d3d240e59d', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: '96adc4a95d1c92b04c2ba9dd30cf9397c593a71a', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: '996fa0fbf2d208968302546d22874cec83a7ee14', class: "co-card__body", part: "body" }, h("slot", { key: '437234dfa32ac3d4b70f03db835f10a772ce462f' })), h("div", { key: '45c69a6951e26da78ef1ee010cb88fed12e69c91', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: '0d782397843ed0c0219ad846712dff60df87a1b2', name: "footer", onSlotchange: this.handleFooterSlotChange }))));
+            }, part: "card", role: this.clickable ? 'button' : undefined, tabIndex: this.clickable ? 0 : undefined }, h("div", { key: '753b2277a6629673e8583774e126b2472709221d', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: 'f73192e7fa291c8a2d831a0f9db7ebe8a7ef8907', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: '2916b424d3cb1feacf438678132d10217df51ad9', class: "co-card__body", part: "body" }, h("slot", { key: 'f957907056567d135c3de5d412251911c7cf8db0' })), h("div", { key: 'f1f183b7d3eacbd11787e0cc3d0ef438f8272480', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: '2171a95906d5b862c7b39a756cafee17d86f7dbc', name: "footer", onSlotchange: this.handleFooterSlotChange }))));
     }
     static get is() { return "co-card"; }
     static get encapsulation() { return "shadow"; }

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

@@ -303,11 +303,11 @@ export class CoCarousel {
         };
         if (this.dragging)
             trackStyle.transition = 'none';
-        return (h(Host, { key: '6f8c3beab5f19295967112e74f2e6a6851ea5540' }, h("div", { key: 'b9c208d9157085b462812114dec5ff08269147d2', class: { 'co-carousel': true, [aspectClass]: true }, part: "container", role: "region", "aria-roledescription": "carousel", "aria-label": s.carouselLabel, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut }, h("div", { key: 'eae4ec92ae6e6fdbe79b5a519bafc6673aef2b79', class: "co-carousel__viewport", part: "viewport", ref: el => (this.viewportEl = el), onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, onClickCapture: this.handleClickCapture }, h("div", { key: 'a322e37ee9c414b38215de1ba2ba3f2f0a0a1bba', class: "co-carousel__track", part: "track", style: trackStyle, "aria-live": this.rotating ? 'off' : 'polite' }, h("slot", { key: 'f4fcfbe79986c5883acc1f04f2fb064991713b7d', onSlotchange: this.handleSlotChange }))), this.arrows && multi && (h("button", { key: '8c2b328e0d4303079b50d498f36e1148dbd10236', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--prev': true, 'co-carousel__arrow--disabled': !canPrev }, part: "arrow-prev", type: "button", "aria-label": s.prevSlide, disabled: !canPrev, onClick: () => this.advance(-1) }, h("co-icon", { key: '126f86fe6944188ff046a1257a911d3478b571d1', name: "caret-left", size: 18, weight: "bold" }))), this.arrows && multi && (h("button", { key: '1139fadd622c526aaed8e0603dfec25215257ca4', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--next': true, 'co-carousel__arrow--disabled': !canNext }, part: "arrow-next", type: "button", "aria-label": s.nextSlide, disabled: !canNext, onClick: () => this.advance(1) }, h("co-icon", { key: 'd10dececc05054417ce07c15e435f516e3836f64', name: "caret-right", size: 18, weight: "bold" }))), this.dots && multi && (
+        return (h(Host, { key: '2e2d00e6956b5de4af5950ad6725a77023420f11' }, h("div", { key: '40878a4740b4ad9bf70cf9816d7edc89b8bafeda', class: { 'co-carousel': true, [aspectClass]: true }, part: "container", role: "region", "aria-roledescription": "carousel", "aria-label": s.carouselLabel, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut }, h("div", { key: '5c0ec11025ae5c6eb3a88b10595c243a9b910671', class: "co-carousel__viewport", part: "viewport", ref: el => (this.viewportEl = el), onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, onClickCapture: this.handleClickCapture }, h("div", { key: '746d85f914bc24ca86ad88005fe95a214de7cd31', class: "co-carousel__track", part: "track", style: trackStyle, "aria-live": this.rotating ? 'off' : 'polite' }, h("slot", { key: 'b33c34a9cb6e03af50176094a89b1c79d363f13d', onSlotchange: this.handleSlotChange }))), this.arrows && multi && (h("button", { key: '4f30b56e84da8f7e15b6cea71a0238f5cd19f39e', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--prev': true, 'co-carousel__arrow--disabled': !canPrev }, part: "arrow-prev", type: "button", "aria-label": s.prevSlide, disabled: !canPrev, onClick: () => this.advance(-1) }, h("co-icon", { key: '09eaa1a665762f7e2b372eb264860e182e411d17', name: "caret-left", size: 18, weight: "bold" }))), this.arrows && multi && (h("button", { key: '7026bfe945ee42ef7b0f9194ecf6a04f0ef1ab1c', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--next': true, 'co-carousel__arrow--disabled': !canNext }, part: "arrow-next", type: "button", "aria-label": s.nextSlide, disabled: !canNext, onClick: () => this.advance(1) }, h("co-icon", { key: '564f5bc3bef0b0ce23e8be91bed8e37540209a7b', name: "caret-right", size: 18, weight: "bold" }))), this.dots && multi && (
         // APG grouped-carousel picker pattern: plain always-tabbable
         // buttons in a labelled group (tablist/tab would demand
         // aria-controls + roving tabindex we don't implement).
-        h("div", { key: '97c9b77dc7b838b75ee152f3f2cbdc85025b8df8', class: "co-carousel__dots", part: "dots", role: "group", "aria-label": s.pickSlide }, Array.from({ length: this.itemCount }, (_, i) => (h("button", { class: { 'co-carousel__dot': true, 'co-carousel__dot--active': i === this.value }, part: "dot", type: "button", "aria-current": i === this.value ? 'true' : undefined, "aria-label": s.goToSlide.replace('{i}', String(i + 1)), onClick: () => this.setActive(i) }))))))));
+        h("div", { key: 'b19aed5296fa2f3547e85e6c439589703809bae3', class: "co-carousel__dots", part: "dots", role: "group", "aria-label": s.pickSlide }, Array.from({ length: this.itemCount }, (_, i) => (h("button", { class: { 'co-carousel__dot': true, 'co-carousel__dot--active': i === this.value }, part: "dot", type: "button", "aria-current": i === this.value ? 'true' : undefined, "aria-label": s.goToSlide.replace('{i}', String(i + 1)), onClick: () => this.setActive(i) }))))))));
     }
     static get is() { return "co-carousel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-carousel-item/co-carousel-item.js

@@ -8,7 +8,7 @@ import { Host, h } from "@stencil/core";
  */
 export class CoCarouselItem {
     render() {
-        return (h(Host, { key: '1c40138cc7732c414e5355dc9e0e77a1424f005e', role: "group", "aria-roledescription": "slide" }, h("slot", { key: '55d8ca50e2831597de8c142abecd1400394bc546' })));
+        return (h(Host, { key: 'ae04768a65db80be93705a0ff9d0852ae2e6d0cc', role: "group", "aria-roledescription": "slide" }, h("slot", { key: '7a9f94454ca5e2574b4161ed06d863728c88a814' })));
     }
     static get is() { return "co-carousel-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -37,17 +37,17 @@ export class CoCheckbox {
         // Only override the fill when a custom color is provided AND the box is "on".
         // Leaving this undefined keeps the default appearance byte-identical to before.
         const boxStyle = this.onColor && isOn ? { background: this.onColor } : undefined;
-        return (h("div", { key: '8512f4efb36fc42d7099bc157a691de4968f2490', class: {
+        return (h("div", { key: '31690de633689da0b273e3c88cc200cabb4cee75', class: {
                 'co-checkbox-row': true,
                 'co-checkbox-row--disabled': this.disabled,
-            }, onClick: this.handleClick }, h("span", { key: '372501973b4a30b12b1ed972b7bbe02cfa21c645', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || '', class: {
+            }, onClick: this.handleClick }, h("span", { key: '2b0c4ebbe4c7a7a8046cf726e682a3d42ae3ebbe', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || '', class: {
                 'co-checkbox': true,
                 [`co-checkbox--${this.size}`]: true,
                 'co-checkbox--overlay': isOverlay,
                 'co-checkbox--checked': this.checked && !this.indeterminate,
                 'co-checkbox--indeterminate': this.indeterminate,
                 'co-checkbox--disabled': this.disabled,
-            }, style: boxStyle, part: "box" }, h("svg", { key: '035d30ff80e7211c8ffc1a8fd52a02bbefdb2bad', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: '9e193614634bbeb551c7425540e6b5b3746d3840', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '47acfb0fd751073079d362750d2f261a3b422201', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: 'c139d59e1f591a4fe4a2df5af4c137ccf7776706', class: "co-checkbox__label", part: "label" }, this.label))));
+            }, style: boxStyle, part: "box" }, h("svg", { key: 'a127c176e0233460f14c4261d8d2157e657689a9', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'ad7dc0018cdae31156884cd04326bbcdba132b4f', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'dd665144b25aa51339cf9f6ce0e0edf65cfbe5a9', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: '08d6c695e2cbb8188564dc8bb5aab9b569c24838', class: "co-checkbox__label", part: "label" }, this.label))));
     }
     static get is() { return "co-checkbox"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -70,7 +70,7 @@ export class CoChip {
         else
             effectiveIconMode = 'none';
         const Tag = this.clickable ? 'button' : 'div';
-        return (h(Tag, { key: '2eded6f64036918a71cb6d826ff46f3c4f23bf56', class: {
+        return (h(Tag, { key: '385173584372bbad8872565f1fc95e8ae8e14563', class: {
                 'co-chip': true,
                 [`co-chip--${this.shape}`]: true,
                 [`co-chip--${this.size}`]: true,
@@ -80,7 +80,7 @@ export class CoChip {
                 'co-chip--clickable': this.clickable,
                 'co-chip--disabled': this.disabled,
                 'co-chip--selected': this.selected,
-            }, part: "chip", type: this.clickable ? 'button' : undefined, disabled: this.clickable ? this.disabled : undefined, onClick: this.handleClick }, this.dot && (h("span", { key: 'edb4ba89143cd35f03289454fc300c23a6f66937', class: "co-chip__dot", part: "dot", style: this.dotColor ? { color: this.dotColor } : undefined }, h("co-icon", { key: '6f1f32ac64632d33b37990a3ec89480be21e9fb7', name: "circle", size: iconSize, weight: "fill" }))), this.iconLeft && !hasLeftSlot && (h("span", { key: '884da98449796a656940642180f2c378cd34b497', class: "co-chip__icon-left", part: "icon-left" }, h("co-icon", { key: 'e05a7cf7c293e8508301e02f7322aab9e2b9665c', name: this.iconLeft, size: iconSize, weight: this.iconWeight }))), hasLeftSlot && (h("span", { key: 'b36181f6ca4d301ede3db88eff2443a860e96f23', class: "co-chip__icon-left", part: "icon-left" }, h("slot", { key: '4307af0a174e9d0bf76df1bb049cd2234c9ae8b4', name: "icon-left" }))), h("span", { key: 'c4c961ea007fc48451baaa9753295bf233aeeb3b', class: "co-chip__label" }, h("slot", { key: '001941b642afaf196126d504d86aa757f68e7755' }, this.label), this.valueLabel != null && this.valueLabel !== '' && (h("span", { key: '967d58dbd630191286d80b0f91c928a6fb9cb064', class: "co-chip__value", part: "value" }, `: ${this.valueLabel}`))), this.iconRight && !hasRightSlot && !this.removable && (h("span", { key: '41bbeba200a447f0e8de92e5ec0dab9c783c4cef', class: "co-chip__icon-right", part: "icon-right" }, h("co-icon", { key: '78f78aff00ddc41496e18b7eb0559f687a0a6657', name: this.iconRight, size: iconSize, weight: this.iconWeight }))), hasRightSlot && (h("span", { key: '718b94bfe81dcd45966c26460e083f111affab3d', class: "co-chip__icon-right", part: "icon-right" }, h("slot", { key: 'bc5844d1a367981eaba3f511b5bfd702a3129550', name: "icon-right" }))), this.removable && (h("span", { key: '785b85d4d55589f3a78276b2c2c2d4ef0aa703b3', class: "co-chip__remove", part: "remove", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleRemove, "aria-label": "Remove" }, h("co-icon", { key: '4407166fef4e6d7fd52a096877e26dfa99e62141', name: "x-circle", size: removeIconSize, weight: "fill" }))), this.trailingIcon && (h("span", { key: '8777ee3042923c17c632f6f4e76141cf0bf6c3df', class: "co-chip__trailing", part: "trailing" }, h("co-icon", { key: '39cc12d2838488eb5cbc5d97ab94870083314715', name: this.trailingIcon, size: trailingIconSize, weight: this.iconWeight })))));
+            }, part: "chip", type: this.clickable ? 'button' : undefined, disabled: this.clickable ? this.disabled : undefined, onClick: this.handleClick }, this.dot && (h("span", { key: 'a680c376ac13140b2c073e01fc901f2cfa54bde8', class: "co-chip__dot", part: "dot", style: this.dotColor ? { color: this.dotColor } : undefined }, h("co-icon", { key: '73e58b8b90234eb883b6a1e49b5e37b267f03d1b', name: "circle", size: iconSize, weight: "fill" }))), this.iconLeft && !hasLeftSlot && (h("span", { key: 'b944fbf0a0161846411d8fc2fe034c48c77d42ea', class: "co-chip__icon-left", part: "icon-left" }, h("co-icon", { key: 'b24a5a3c64d0eda1b9d87c66ac93c0d4703973bc', name: this.iconLeft, size: iconSize, weight: this.iconWeight }))), hasLeftSlot && (h("span", { key: '9f1e7fa47bd86e1d7e4812ec0fe5f61490ab0878', class: "co-chip__icon-left", part: "icon-left" }, h("slot", { key: 'e52df105783ff84c932bc289f6e88304ccc4240a', name: "icon-left" }))), h("span", { key: '269f54eca09a4ff301d9ec4e673bf9c8d19ccd87', class: "co-chip__label" }, h("slot", { key: '31fba7c9c05b830562800cc46c48e667e7dc046c' }, this.label), this.valueLabel != null && this.valueLabel !== '' && (h("span", { key: 'a455314236c688f2bff9185135787899da52ea5f', class: "co-chip__value", part: "value" }, `: ${this.valueLabel}`))), this.iconRight && !hasRightSlot && !this.removable && (h("span", { key: '13e5862e03e2fcf7129230a4d68ce7e2b1b4f11e', class: "co-chip__icon-right", part: "icon-right" }, h("co-icon", { key: '66fc09efbdeea37f1dbce3b5ad4443a760618b66', name: this.iconRight, size: iconSize, weight: this.iconWeight }))), hasRightSlot && (h("span", { key: '7acfa1a23e294cb92b17d5174ec0a78161877624', class: "co-chip__icon-right", part: "icon-right" }, h("slot", { key: '9e8ded0f256a72ab81c587a82d2bb570930288f9', name: "icon-right" }))), this.removable && (h("span", { key: 'e30345ce825c823fbf7da1aaaec4141351e18a02', class: "co-chip__remove", part: "remove", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleRemove, "aria-label": "Remove" }, h("co-icon", { key: '3d9777c29b706cda71ee64b313961c97e215b900', name: "x-circle", size: removeIconSize, weight: "fill" }))), this.trailingIcon && (h("span", { key: 'd99af23fbbb7a8557b8cefd15a4cebdc7437ff43', class: "co-chip__trailing", part: "trailing" }, h("co-icon", { key: 'aa99f2c0f6ec96f95656c607ca5846c282447e35', name: this.trailingIcon, size: trailingIconSize, weight: this.iconWeight })))));
     }
     static get is() { return "co-chip"; }
     static get encapsulation() { return "shadow"; }

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

@@ -82,10 +82,10 @@ export class CoColorPicker {
         const presets = this.parsedPresets;
         const hasValue = !!this.value;
         const statusClass = this.status !== 'default' ? `co-color-picker--${this.status}` : '';
-        return (h("div", { key: '39bee984713a560a11494da8bcceab036edc81d5', class: `co-color-picker co-color-picker--${this.size} ${statusClass} ${this.isOpen ? 'co-color-picker--open' : ''} ${this.disabled ? 'co-color-picker--disabled' : ''}` }, this.label && (h("label", { key: '765670fbc4a69ebf4879c0df7e92b3ba0981a110', class: "co-color-picker__label" }, this.label, h(RequiredMark, { key: '0c6e39571005901dbe0dd2ebf00403a9974cb3ff', required: this.required }))), h("co-popover", { key: '67265bd33c0925214d995147c8903c2006b06eee', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: 'a4e2faa594b882fae5bf8de6e45a1724da4960c9', slot: "trigger", class: "co-color-picker__trigger" }, h("span", { key: '5a51908a5b101c580e2485080f7fbcad16ab686a', class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { key: 'e24a5ffb3e920b01326658bca60d677035ab29ad', class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { key: '637e89f21b39dcb734b368d45b7d0d6461a0a0a8', class: "co-color-picker__panel" }, h("div", { key: '0cf67e473e847afe6219eb39279a971a37f25c60', class: "co-color-picker__grid" }, presets.map((preset) => {
+        return (h("div", { key: '41a7a80f81aeaf71e1f8429e66aa5511437882fa', class: `co-color-picker co-color-picker--${this.size} ${statusClass} ${this.isOpen ? 'co-color-picker--open' : ''} ${this.disabled ? 'co-color-picker--disabled' : ''}` }, this.label && (h("label", { key: '96404f15d058b7bc0b2d2c13b6744404cc11769a', class: "co-color-picker__label" }, this.label, h(RequiredMark, { key: '16af407f56b58ad6ea649a19aa8a3c96f2caae04', required: this.required }))), h("co-popover", { key: '8eb3b862b8618b32d76e862ce003e667801c3262', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '0314b0dbf7404fdb23a0b5cd837b07b5879f85a1', slot: "trigger", class: "co-color-picker__trigger" }, h("span", { key: '0d08254d17a15786834c5de548526b6b359a09be', class: "co-color-picker__swatch", style: { background: hasValue ? this.value : 'transparent' } }), h("span", { key: 'afbfa48cb5bd140767acdf2e1df35d7e8985948d', class: `co-color-picker__value ${!hasValue ? 'co-color-picker__value--empty' : ''}` }, hasValue ? this.value : this.placeholder)), this.isOpen && (h("div", { key: '9e0d22b668546a175c6e6559c2af5dd0de2a1843', class: "co-color-picker__panel" }, h("div", { key: '018fec91282680d660be82b01f340b29f13c73f7', class: "co-color-picker__grid" }, presets.map((preset) => {
             var _a;
             return (h("button", { type: "button", key: preset.value, class: `co-color-picker__grid-item ${preset.value.toUpperCase() === ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toUpperCase()) ? 'co-color-picker__grid-item--selected' : ''}`, style: { background: preset.value }, title: preset.name, onClick: () => this.handleSwatchClick(preset.value) }));
-        })), hasValue && (h("div", { key: '217066b5de2b03887e4dc98e13802eadcf0c02f7', class: "co-color-picker__hex-row" }, h("span", { key: '11d1ef4a88cad73e838357b924c0e72d1088ba50', class: "co-color-picker__hex-prefix" }, "#"), h("span", { key: 'c2669ea08315ba1597468a1a7d8570fa83d069df', class: "co-color-picker__hex-value" }, this.value.replace(/^#/, '')), h("button", { key: '86683f2cc0e34bb7f38fdc7a5722a6670b5df4bf', type: "button", class: `co-color-picker__copy-btn ${this.copied ? 'co-color-picker__copy-btn--copied' : ''}`, title: "Copy", onClick: () => this.handleCopy() }, h("co-icon", { key: '73e74f4d090c64e991dbf08a618ff1a3560cfce9', name: this.copied ? 'check' : 'copy', size: 16 }))))))), this.helperText && (h("div", { key: 'ed69274b319c7113aa8f04dca3efbc58de520040', class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { key: '8cf77ec66eb909c1fd669422f77980a5b4a87939', name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { key: '965655ec9f90401dcfac3f73872e78ab0d3dcae6', class: "co-color-picker__helper-text" }, this.helperText)))));
+        })), hasValue && (h("div", { key: '83420abbf343f57fa57804c676fd22e91d2f6816', class: "co-color-picker__hex-row" }, h("span", { key: '1b9ce2cdb091734c9d34003c8ce48a165e8763a8', class: "co-color-picker__hex-prefix" }, "#"), h("span", { key: '5733ec9110227e3ffa45c15c294629cfe420c485', class: "co-color-picker__hex-value" }, this.value.replace(/^#/, '')), h("button", { key: '249b0f7eb80517c89ecaa11c09cf64ae70fd3d52', type: "button", class: `co-color-picker__copy-btn ${this.copied ? 'co-color-picker__copy-btn--copied' : ''}`, title: "Copy", onClick: () => this.handleCopy() }, h("co-icon", { key: 'aed9a2fe68c39047e6027c76c185a1cfc5abb097', name: this.copied ? 'check' : 'copy', size: 16 }))))))), this.helperText && (h("div", { key: '276d4f39ca9f5be6add8bd2ae423a02960f82581', class: "co-color-picker__helper" }, this.statusIcon && (h("co-icon", { key: '4f4323dc9f3d26581fb6ec1f5bd1e668e9a45011', name: this.statusIcon, size: 14, weight: "fill", class: "co-color-picker__helper-icon" })), h("span", { key: 'ee725d0ce3a30985a71bf2d34e5e64124f89891b', class: "co-color-picker__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-color-picker"; }
     static get encapsulation() { return "shadow"; }

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

@@ -165,13 +165,13 @@ export class CoColumnPicker {
         return (h("div", { class: "co-column-picker__empty" }, h("co-icon", { name: "magnifying-glass", size: 40, class: "co-column-picker__empty-icon" }), h("span", null, this.emptyText)));
     }
     render() {
-        return (h("div", { key: '5cbbc6be16b4d266a510071fe49767c7631230f8', class: {
+        return (h("div", { key: '6407a41a8e03d70e54cfd378747396a413eb0a11', class: {
                 'co-column-picker': true,
                 'co-column-picker--open': this.isOpen,
                 'co-column-picker--disabled': this.disabled,
                 'co-column-picker--focused': this.focused,
                 [`co-column-picker--${this.status}`]: this.status !== 'default',
-            } }, (this.label || this.secondaryLabel) && (h("div", { key: '33713af3998ee49e4eb5530befc524be05748592', class: "co-column-picker__labels" }, this.label && h("label", { key: 'e4cf7db20568a098de850e9ef92a0f7149a9d86d', class: "co-column-picker__label" }, this.label), this.secondaryLabel && h("span", { key: '7686554a161210bfa911f4fa06e97b60bb2b5f03', class: "co-column-picker__secondary-label" }, this.secondaryLabel))), this.renderField(), this.isOpen && (h("div", { key: 'e51ac5b668622f9c6ead8b4a8c944a76abfe1c94', class: "co-column-picker__dropdown" }, this.showSearch && (h("div", { key: 'd5cb02f41b24b1fdc93bca4e39411f8cfc55219b', class: "co-column-picker__search" }, h("co-icon", { key: 'a3a5fc81f70ec9f0e95eb49d17bb6a56d5f1dcda', name: "magnifying-glass", size: 14, class: "co-column-picker__search-icon" }), h("input", { key: '589be3699eb770c74640a0bf8474e02031175492', ref: el => (this.searchInputEl = el), class: "co-column-picker__search-input", type: "text", value: this.query, placeholder: this.placeholder, onInput: this.handleSearchInput, onClick: (e) => e.stopPropagation() }), this.query && (h("button", { key: '92970f59b8b9a86252ae544f19cf22bba2c05b4f', class: "co-column-picker__search-clear", type: "button", onClick: this.handleSearchClear }, h("co-icon", { key: '7ceca0875ebaf7b99b1de777b69e22f741d665bd', name: "x", size: 14 }))))), this.showToolbar && this.multiple && (h("div", { key: '5727d26c94d8204e8d82e08089f11775fbd6a201', class: "co-column-picker__toolbar" }, h("button", { key: 'f4429cb595b1e63c2469dffc1598d3f6acde9485', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleSelectAll }, this.selectAllText), h("button", { key: '691ceb26cad861455227f28a0e663bec09b6e769', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleDeselectAll }, this.clearText), h("span", { key: 'f73627c10fc45f7e5b92ca7dd7b9d5eddb161d7b', class: "co-column-picker__toolbar-sep" }), h("button", { key: 'e2c6f0768a20d2942950699042f5993ae7e3009c', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleExpandAll }, this.expandText), h("button", { key: 'd4b003607f2785c0ccf64aac7c4bfb067a29e443', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleCollapseAll }, this.collapseText), h("span", { key: 'b468c81d59ad9582f4395876b6296a2383c1f0b3', style: { flex: '1' } }), this.selectedValues.length > 0 && h("span", { key: '921cd53de036b62148a53607a47e909298857044', class: "co-column-picker__toolbar-counter" }, this.selectedValues.length, " ", this.selectedText))), h("div", { key: '6bd3fcf4a1fcc5fe9b0ee8bacc297618689d626b', class: "co-column-picker__scroll", style: { maxHeight: `${this.maxHeight}px` } }, this.renderTree()))), this.helperText && (h("div", { key: 'fd0e9f1ed158200848db8e9a4b2f703e1fbd59db', class: `co-column-picker__helper co-column-picker__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '2f41eab22739bae9a6f53e7f454fd79afaf231f3', name: this.statusIcon, size: 14, weight: "fill", class: "co-column-picker__helper-icon" }), h("span", { key: '93e3da474f483a441d4437074adf5eb14b6dcbbc', class: "co-column-picker__helper-text" }, this.helperText)))));
+            } }, (this.label || this.secondaryLabel) && (h("div", { key: '86850ac9d0162b34369c70424549d101c9b72cc3', class: "co-column-picker__labels" }, this.label && h("label", { key: 'c05eccf88052fdcf8b593282daa1fc0f9a8bab1e', class: "co-column-picker__label" }, this.label), this.secondaryLabel && h("span", { key: 'fe64f07fb1238d51506575c679bb33c7797c2edc', class: "co-column-picker__secondary-label" }, this.secondaryLabel))), this.renderField(), this.isOpen && (h("div", { key: 'cb28e40aaf843c96a2649efef1e3803cde627345', class: "co-column-picker__dropdown" }, this.showSearch && (h("div", { key: '37ab85bf708a3ba34f5ddb1ab416600b0d0be072', class: "co-column-picker__search" }, h("co-icon", { key: '8b10c859742279f5e11d764d6012429259bdec19', name: "magnifying-glass", size: 14, class: "co-column-picker__search-icon" }), h("input", { key: '7f52dbbcc524bf78424cb85396ad62b68b16dac5', ref: el => (this.searchInputEl = el), class: "co-column-picker__search-input", type: "text", value: this.query, placeholder: this.placeholder, onInput: this.handleSearchInput, onClick: (e) => e.stopPropagation() }), this.query && (h("button", { key: 'ddbd0996534dcda27de900019d10b12eeb352d8d', class: "co-column-picker__search-clear", type: "button", onClick: this.handleSearchClear }, h("co-icon", { key: 'f4d997c88423b664f63fcc09acf5366f735f3a57', name: "x", size: 14 }))))), this.showToolbar && this.multiple && (h("div", { key: '0e6ee3c9351c48c10affd4e2146cf9939a06971d', class: "co-column-picker__toolbar" }, h("button", { key: '101167f8a9da5f47dec86a94f9ffa0d4bb2edfbb', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleSelectAll }, this.selectAllText), h("button", { key: '6e00fd6f1be5f2bc223dbb1b6800916d0872b7a2', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleDeselectAll }, this.clearText), h("span", { key: '9446309b1a737059936a3fecdbbca37677544c49', class: "co-column-picker__toolbar-sep" }), h("button", { key: '7a014ee36386286cee3b97d1a67cafe8eca60ac4', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleExpandAll }, this.expandText), h("button", { key: '09a58d24e5fef162b9c8452d905e36c89b5fb0a9', class: "co-column-picker__toolbar-btn", type: "button", onClick: this.handleCollapseAll }, this.collapseText), h("span", { key: '01468f7c6140081183cccb1c7ae063f8bbafad5e', style: { flex: '1' } }), this.selectedValues.length > 0 && h("span", { key: '94d9805ce88fed580da36d122d134c4f445df03f', class: "co-column-picker__toolbar-counter" }, this.selectedValues.length, " ", this.selectedText))), h("div", { key: '95aab5f3408bf840d0e27f6e1de3908b6a9dd3c6', class: "co-column-picker__scroll", style: { maxHeight: `${this.maxHeight}px` } }, this.renderTree()))), this.helperText && (h("div", { key: '27533140acd117f09e981f307f0c39d741b92515', class: `co-column-picker__helper co-column-picker__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '7992e3f214985653e673f64f5b85e07be5298cc7', name: this.statusIcon, size: 14, weight: "fill", class: "co-column-picker__helper-icon" }), h("span", { key: '01eb7d766027a9c0cff30f91be730f3dbb4b2443', class: "co-column-picker__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-column-picker"; }
     static get encapsulation() { return "shadow"; }

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

@@ -204,8 +204,10 @@
    Dropdown panel
    ============================================================ */
 
+/* Sin padding propio: co-option-list ES el interior del panel (search margin
+ * 12 + options padding 12 — su contrato dice "el chrome es del host; aquí solo
+ * el interior"). Un padding acá se SUMA al suyo y deja gutters dobles (24px). */
 .co-combobox__dropdown {
-  padding: var(--co-spacing-md);
   display: flex;
   flex-direction: column;
   gap: var(--co-spacing-sm2);

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

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

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

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

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

@@ -220,6 +220,39 @@ co-data-table {
   z-index: 3;
 }
 
+/* ⚠️ Una celda STICKY NO puede establecer un clip propio (overflow hidden/clip,
+   contain:paint). Doble clase para ganarle por especificidad al `overflow:hidden`
+   de las reglas base .co-data-table__th / .co-data-table__td (que van después en
+   este archivo), sin depender del orden.
+
+   Dos defectos, ambos verificados en vivo (Chromium 141, scrollbars clásicas):
+
+   1. HIT-TEST FUERA DEL SCROLLPORT — Chromium no intersecta la región de
+      hit-test de una celda sticky que tiene clip propio con el borde INFERIOR
+      del scrollport: la celda de la última fila (recortada a medias) y sus
+      hijos siguen siendo hitteables dentro del canal de 11px de la scrollbar
+      horizontal y le roban el puntero al thumb. Efecto: sobre las columnas
+      fijadas el thumb no toma :hover ni se puede arrastrar — funciona en el
+      resto del ancho. `elementFromPoint` en el canal devolvía el contenido de
+      la celda en vez de .co-data-table__scroll.
+   2. CONTENEDOR DE SCROLL FANTASMA — con la sombra ::after en right:-4px,
+      scrollWidth > clientWidth convierte a la celda en un scroll container
+      horizontal incapaz de scrollear, y el trackpad engancha el swipe al eje
+      vertical solo sobre esa columna.
+
+   Matriz medida: static+hidden = OK · sticky+visible = OK ·
+   sticky+hidden / sticky+clip / sticky+contain:paint = AMBOS defectos.
+   El z-index no influye.
+
+   El truncado NO se pierde: vive en el contenido (.co-data-table__cell-text y
+   .co-data-table__th-label ya traen overflow:hidden + text-overflow:ellipsis,
+   y sus min-width:auto resuelven a 0 por tener overflow≠visible). Bonus: la
+   sombra ::after ya no queda recortada en el <th>. */
+.co-data-table__th.co-data-table__th--sticky,
+.co-data-table__td.co-data-table__td--sticky {
+  overflow: visible;
+}
+
 /* Shadow for sticky columns on scroll */
 .co-data-table__td--sticky::after,
 .co-data-table__th--sticky::after {

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

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { edgeAutoScrollSpeed, resizeWidth } from "../../utils/columnResize";
 /**
  * @slot - Default slot for custom row content (advanced usage)
  */
@@ -52,6 +53,17 @@ export class CoDataTable {
         this.resizingColumn = null;
         this.resizeStartX = 0;
         this.resizeStartWidth = 0;
+        // Edge auto-scroll drag state — plain fields (not @State): they mutate per
+        // frame and the re-render is already driven by the columnWidths Map swap.
+        this.resizeEdgeExtra = 0;
+        this.resizeLastClientX = 0;
+        this.resizeAutoScrollRaf = 0;
+        // Scroll owed to the auto-scroll growth, applied in componentDidRender —
+        // NEVER in the tick itself: the @State render is async, so at max scroll a
+        // same-tick scrollLeft advance clamps against the not-yet-grown table and
+        // the scroll falls permanently behind the width (boundary drifts off the
+        // pointer). Deferring to didRender lands width + scroll in the SAME paint.
+        this.resizePendingScroll = 0;
         // Swallows the click the browser synthesizes right after a resize drag ends.
         // The resize handle lives inside the sortable <th>, so without this a resize
         // would bubble to the header's onClick and trigger a sort (+ a full refetch).
@@ -113,6 +125,18 @@ export class CoDataTable {
         this.parseFilteredFields();
         this.parseIndirectFields();
     }
+    componentDidRender() {
+        // Auto-scroll parity: the resize tick grew the column (async @State render)
+        // and owes the container the same px of scroll. Here the DOM already has
+        // the new table width, so the advance can't clamp — width and scroll land
+        // in the same paint and the drag boundary stays pinned under the pointer.
+        if (this.resizePendingScroll) {
+            const scrollEl = this.el.querySelector('.co-data-table__scroll');
+            if (scrollEl)
+                scrollEl.scrollLeft += this.resizePendingScroll;
+            this.resizePendingScroll = 0;
+        }
+    }
     /* ─── SORT HANDLERS ─────────────────────────────────────── */
     handleSort(field) {
         // Ignore the click synthesized by a resize drag that ended on this <th>.
@@ -164,16 +188,74 @@ export class CoDataTable {
         this.resizingColumn = field;
         this.resizeStartX = e.clientX;
         this.resizeStartWidth = this.columnWidths.get(field) || 150;
+        this.resizeEdgeExtra = 0;
+        this.resizeLastClientX = e.clientX;
+        const scrollEl = this.el.querySelector('.co-data-table__scroll');
+        const columnMinWidth = () => { var _a; return ((_a = this.parsedColumns.find(c => c.field === this.resizingColumn)) === null || _a === void 0 ? void 0 : _a.minWidth) || 80; };
+        const applyWidth = () => {
+            const column = this.resizingColumn;
+            if (!column)
+                return 0;
+            const newWidth = resizeWidth({
+                startWidth: this.resizeStartWidth,
+                minWidth: columnMinWidth(),
+                pointerDelta: this.resizeLastClientX - this.resizeStartX,
+                autoScrollExtra: this.resizeEdgeExtra,
+            });
+            this.columnWidths = new Map(this.columnWidths.set(column, newWidth));
+            return newWidth;
+        };
+        // Growing a column past the viewport needs the container to CHASE the
+        // pointer: while it hovers the edge zone, each frame adds `speed` px to the
+        // width AND owes the container the same px of scroll, so the boundary stays
+        // pinned under the pointer instead of dying at the viewport edge (the old
+        // drag forced release → scrollbar → drag again to keep growing). The owed
+        // scroll is NOT applied here — see resizePendingScroll/componentDidRender:
+        // the @State render is async, so a same-tick scrollLeft advance would clamp
+        // against the not-yet-grown table and fall permanently behind the width.
+        const autoScrollTick = () => {
+            this.resizeAutoScrollRaf = 0;
+            const column = this.resizingColumn;
+            if (!column || !scrollEl)
+                return;
+            const rect = scrollEl.getBoundingClientRect();
+            const speed = edgeAutoScrollSpeed({
+                pointerX: this.resizeLastClientX,
+                containerLeft: rect.left,
+                containerRight: rect.right,
+            });
+            if (!speed)
+                return;
+            // Shrinking at the left edge: once the column bottoms out at minWidth
+            // stop the loop — accumulating further negative extra would rubber-band
+            // the next rightward drag.
+            if (speed < 0 && (this.columnWidths.get(column) || this.resizeStartWidth) <= columnMinWidth())
+                return;
+            this.resizeEdgeExtra += speed;
+            this.resizePendingScroll += speed;
+            // applyWidth swaps the Map reference → guarantees a render → guarantees
+            // componentDidRender flushes the pending scroll right after the paint
+            // that shows the wider table.
+            applyWidth();
+            this.resizeAutoScrollRaf = requestAnimationFrame(autoScrollTick);
+        };
         const onMouseMove = (ev) => {
-            var _a;
             if (!this.resizingColumn)
                 return;
-            const diff = ev.clientX - this.resizeStartX;
-            const minWidth = ((_a = this.parsedColumns.find(c => c.field === this.resizingColumn)) === null || _a === void 0 ? void 0 : _a.minWidth) || 80;
-            const newWidth = Math.max(minWidth, this.resizeStartWidth + diff);
-            this.columnWidths = new Map(this.columnWidths.set(this.resizingColumn, newWidth));
+            this.resizeLastClientX = ev.clientX;
+            applyWidth();
+            if (!this.resizeAutoScrollRaf)
+                this.resizeAutoScrollRaf = requestAnimationFrame(autoScrollTick);
         };
         const onMouseUp = () => {
+            if (this.resizeAutoScrollRaf) {
+                cancelAnimationFrame(this.resizeAutoScrollRaf);
+                this.resizeAutoScrollRaf = 0;
+            }
+            // resizePendingScroll is NOT zeroed here: it is only ever nonzero with a
+            // render already in flight (each tick increments it right before
+            // applyWidth), so its flush in componentDidRender is the legitimate tail
+            // of the drag — zeroing it would strand the boundary short of the pointer.
             if (this.resizingColumn) {
                 const width = this.columnWidths.get(this.resizingColumn) || 150;
                 this.coColumnResize.emit({ field: this.resizingColumn, width });
@@ -339,12 +421,12 @@ export class CoDataTable {
             : h("slot", { name: "empty-action" }))));
     }
     render() {
-        return (h("div", { key: 'baf9a797b25e76d4b054513b3e4c90aacce24a80', class: {
+        return (h("div", { key: '6ba1f3bb555252c55246c8af73b8ce08610e93b0', 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: '132100357cb7fed5d27054e2e3a66c218dddad9d', class: "co-data-table__scroll" }, h("table", { key: '0e183744b6f1c7c44ec8dd741eb8cdbbbdf5b638', class: "co-data-table__table", style: { width: `${this.getTableWidth()}px`, minWidth: '100%' } }, this.renderColgroup(), this.renderHeader(), h("slot", { key: 'c3c58515f63fdfdfa760ba483f00c686863ddb20' }), this.loading ? this.renderSkeletonBody() : null)), this.renderEmpty()));
+            } }, h("div", { key: '69bc61a98f48ac06006d9b5ab132abf15bbeeb64', class: "co-data-table__scroll" }, h("table", { key: 'bc7627b050900ca6c8887981e47368bfb7f181ea', class: "co-data-table__table", style: { width: `${this.getTableWidth()}px`, minWidth: '100%' } }, this.renderColgroup(), this.renderHeader(), h("slot", { key: 'fc98863e680b660844ec968af6ebc645160ee32e' }), this.loading ? this.renderSkeletonBody() : null)), this.renderEmpty()));
     }
     static get is() { return "co-data-table"; }
     static get originalStyleUrls() {
@@ -368,7 +450,7 @@ export class CoDataTable {
                     "references": {
                         "CoDataTableColumn": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-data-table/co-data-table.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-data-table/co-data-table.tsx",
                             "id": "src/components/co-data-table/co-data-table.tsx::CoDataTableColumn"
                         }
                     }