@prolibu-suite/cobalt-core 0.8.0 → 0.9.1

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

@@ -40,7 +40,7 @@
   background: transparent;
   cursor: pointer;
   color: var(--co-semantic-border-subtle);
-  transition: color 0.1s ease, transform 0.1s ease;
+  transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 .co-rating__star:hover:not(:disabled) {

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

@@ -36,16 +36,16 @@ export class CoRating {
         const iconSize = this.size === 'large' ? 28 : 20;
         const active = this.hoverValue || this.value;
         const stars = Array.from({ length: this.max }, (_, i) => i + 1);
-        return (h("div", { key: '1f30917baf6de9922ebf76214c324b2669046f98', class: {
+        return (h("div", { key: '3e6bb945a46ad896a07d2588c6a4d969bce3dfcf', class: {
                 'co-rating': true,
                 'co-rating--disabled': this.disabled,
                 'co-rating--readonly': this.readOnly,
                 [`co-rating--${this.size}`]: true,
-            } }, this.label && h("label", { key: 'f03d4bd39a49f4e16d5724478f4c0f15ac3a8c92', class: "co-rating__label" }, this.label), h("div", { key: '96301d47ba510e923f0abd3f5fff63b5f8437099', class: "co-rating__stars", onMouseLeave: this.handleMouseLeave }, stars.map(star => (h("button", { class: {
+            } }, this.label && h("label", { key: 'ef9971e3314eb4f270c35b94d2a85f25b8861b68', class: "co-rating__label" }, this.label), h("div", { key: 'b1c3997ec8a3a8950e24ef97af571d5db7283b50', class: "co-rating__stars", onMouseLeave: this.handleMouseLeave }, stars.map(star => (h("button", { class: {
                 'co-rating__star': true,
                 'co-rating__star--active': star <= active,
                 'co-rating__star--hover': this.hoverValue > 0 && star <= this.hoverValue,
-            }, type: "button", tabIndex: this.disabled || this.readOnly ? -1 : 0, disabled: this.disabled, onClick: () => this.handleClick(star), onMouseEnter: () => this.handleMouseEnter(star), "aria-label": `${star} of ${this.max}` }, h("co-icon", { name: this.icon, size: iconSize, weight: star <= active ? 'fill' : 'regular' }))))), this.helperText && (h("div", { key: '4e84ece3536c2e028057be76910eae6fa3ac6228', class: `co-rating__helper co-rating__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: 'a24e3451108027dc941c96dbf03988e1cab92424', name: this.statusIcon, size: 14, weight: "fill", class: "co-rating__helper-icon" }), h("span", { key: '734bc0b5515d95ac1d5545b20842d949e35a0d87', class: "co-rating__helper-text" }, this.helperText)))));
+            }, type: "button", tabIndex: this.disabled || this.readOnly ? -1 : 0, disabled: this.disabled, onClick: () => this.handleClick(star), onMouseEnter: () => this.handleMouseEnter(star), "aria-label": `${star} of ${this.max}` }, h("co-icon", { name: this.icon, size: iconSize, weight: star <= active ? 'fill' : 'regular' }))))), this.helperText && (h("div", { key: '523e14b17fceb0f52f77cd1e9b4053fdd25dffba', class: `co-rating__helper co-rating__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: 'ae894de5a6c390837c511364b5e8b7ba8a8123f1', name: this.statusIcon, size: 14, weight: "fill", class: "co-rating__helper-icon" }), h("span", { key: '23d04a20799d6b15693c7eb119922e5584031373', class: "co-rating__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-rating"; }
     static get encapsulation() { return "shadow"; }

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

@@ -64,7 +64,7 @@
   min-height: 40px;
   box-sizing: border-box;
   cursor: pointer;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+  transition: border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 /* ── Variant: flat (no border/background — reads as content) ──────────
@@ -162,6 +162,21 @@
   align-items: center;
 }
 
+/* Badge de estado del trigger (triggerBadgeIcon): pill chico tras el label.
+   El fondo por defecto es un velo neutro que funciona sobre triggers tintados
+   (navbar por color de workspace); los hosts lo ajustan vía
+   --co-ref-field-trigger-badge-bg. */
+.co-ref-field__trigger-badge {
+  flex-shrink: 0;
+  display: grid;
+  place-items: center;
+  width: 18px;
+  height: 18px;
+  border-radius: var(--co-border-radius-xxs);
+  background: var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));
+  color: var(--co-semantic-text-default);
+}
+
 .co-ref-field__clear {
   flex-shrink: 0;
   display: flex;
@@ -172,7 +187,7 @@
   background: transparent;
   cursor: pointer;
   color: var(--co-semantic-text-muted);
-  transition: color 0.15s ease;
+  transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 .co-ref-field__clear:hover {
@@ -303,7 +318,7 @@
   background: transparent;
   cursor: pointer;
   color: var(--co-color-gray-500);
-  transition: color 0.1s ease;
+  transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out);
   flex-shrink: 0;
 }
 
@@ -386,7 +401,7 @@
   letter-spacing: var(--co-font-letter-spacing-body);
   white-space: nowrap;
   cursor: pointer;
-  transition: opacity 0.15s ease;
+  transition: opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);
   box-sizing: border-box;
   min-height: 32px;
 }

package/dist/collection/components/co-ref-field/co-ref-field.js

@@ -56,6 +56,15 @@ export class CoRefField {
         this.maxChips = 0;
         /** Panel color theme. 'auto' follows trigger, 'dark' forces dark panel, 'light' forces light. */
         this.panelTheme = 'auto';
+        /**
+         * Phosphor icon rendered as a small status badge after the selected label in
+         * the trigger (e.g. 'funnel' = strict workspace filter active). Only shows
+         * while a value is selected. Empty = no badge. Tint the pill via
+         * --co-ref-field-trigger-badge-bg.
+         */
+        this.triggerBadgeIcon = '';
+        /** Accessible name / tooltip for the trigger badge. */
+        this.triggerBadgeLabel = '';
         /**
          * Shape of the leading avatar (selected value + option rows). Defaults to
          * 'circle' (people refs); use 'square' for company/workspace refs — it renders
@@ -78,6 +87,18 @@ export class CoRefField {
             if (this.disabled)
                 e.stopPropagation();
         };
+        /** Change de la co-option-list: `value: null` = deselección explícita (la X
+         *  de la fila) → mismo camino que la X del trigger (clear + coClear). El
+         *  resto sigue por handleOptionClick con el ítem. */
+        this.handleListChange = (detail) => {
+            if (!this.multiple && detail.value === null) {
+                this.value = '';
+                this.coClear.emit();
+                this.isOpen = false;
+                return;
+            }
+            this.handleOptionClick(detail.item);
+        };
         this.handleOptionClick = (option) => {
             if (this.multiple) {
                 const current = this.parsedValue;
@@ -273,7 +294,7 @@ export class CoRefField {
                 [`co-ref-field--${this.normalizedSize}`]: true,
                 [`co-ref-field--${this.status}`]: this.status !== 'default',
                 'co-ref-field--flat': this.variant === 'flat',
-            }, onClick: this.handleTriggerClick }, this.iconLeft && (h("span", { class: "co-ref-field__icon" }, h("co-icon", { name: this.iconLeft, size: 16 }))), h("div", { class: "co-ref-field__value" }, !hasValue && h("span", { class: "co-ref-field__placeholder", part: "trigger-placeholder" }, this.placeholder), hasValue && !this.multiple && this.renderSingleValue(selected[0]), hasValue && this.multiple && this.renderMultipleValue(selected)), hasValue && this.clearable && !this.disabled && (h("button", { class: "co-ref-field__clear", part: "trigger-clear", onClick: this.handleClear, type: "button" }, h("co-icon", { name: "x", size: 14 }))), h("span", { class: "co-ref-field__caret", part: "trigger-chevron" }, h("co-icon", { name: "caret-up-down", size: 16 }))));
+            }, onClick: this.handleTriggerClick }, this.iconLeft && (h("span", { class: "co-ref-field__icon" }, h("co-icon", { name: this.iconLeft, size: 16 }))), h("div", { class: "co-ref-field__value" }, !hasValue && h("span", { class: "co-ref-field__placeholder", part: "trigger-placeholder" }, this.placeholder), hasValue && !this.multiple && this.renderSingleValue(selected[0]), hasValue && this.multiple && this.renderMultipleValue(selected)), hasValue && this.triggerBadgeIcon && (h("span", { class: "co-ref-field__trigger-badge", part: "trigger-badge", role: "img", title: this.triggerBadgeLabel || undefined, "aria-label": this.triggerBadgeLabel || undefined }, h("co-icon", { name: this.triggerBadgeIcon, size: 11, weight: "fill" }))), hasValue && this.clearable && !this.disabled && (h("button", { class: "co-ref-field__clear", part: "trigger-clear", onClick: this.handleClear, type: "button" }, h("co-icon", { name: "x", size: 14 }))), h("span", { class: "co-ref-field__caret", part: "trigger-chevron" }, h("co-icon", { name: "caret-up-down", size: 16 }))));
     }
     /**
      * Leading visual for a selected value / chip. Prefers a real avatar (image
@@ -320,11 +341,11 @@ export class CoRefField {
                 'co-ref-field__panel': true,
                 'co-ref-field__panel--dark': this.panelTheme === 'dark',
                 'co-ref-field__panel--light': this.panelTheme === 'light',
-            } }, h("co-option-list", { ref: (el) => (this.optionListEl = el), items: typeof this.options === 'string' ? this.options : JSON.stringify(this.options), value: this.value, selectedItems: typeof this.selectedDisplay === 'string' ? this.selectedDisplay : JSON.stringify(this.selectedDisplay), multiple: this.multiple, selectedFirst: this.multiple, reorderable: this.multiple, selectedAffordance: "deselect", searchable: this.searchable, searchPlaceholder: this.searchPlaceholder, searchDebounce: this.searchDebounce, loading: this.loading, total: this.total, emptyMessage: this.emptyMessage, avatarShape: this.avatarShape, onCoSearch: (e) => this.coSearch.emit(e.detail), onCoChange: (e) => this.handleOptionClick(e.detail.item), onCoReorder: (e) => this.handleReorder(e.detail), onCoLoadMore: () => this.coLoadMore.emit() }, this.showFooter && (h("div", { class: "co-ref-field__footer", slot: "footer" }, h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--secondary", type: "button", onClick: this.handleFooterSecondary }, h("co-icon", { name: "plus", size: 16 }), h("span", null, this.footerSecondaryLabel)), h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--primary", type: "button", onClick: this.handleFooterPrimary }, h("co-icon", { name: "check", size: 16 }), h("span", null, this.footerPrimaryLabel)))))));
+            }, style: this.panelWidth ? { width: this.panelWidth } : undefined }, h("co-option-list", { ref: (el) => (this.optionListEl = el), items: typeof this.options === 'string' ? this.options : JSON.stringify(this.options), value: this.value, selectedItems: typeof this.selectedDisplay === 'string' ? this.selectedDisplay : JSON.stringify(this.selectedDisplay), multiple: this.multiple, selectedFirst: this.multiple, reorderable: this.multiple, selectedAffordance: "deselect", searchable: this.searchable, searchPlaceholder: this.searchPlaceholder, searchDebounce: this.searchDebounce, loading: this.loading, total: this.total, emptyMessage: this.emptyMessage, avatarShape: this.avatarShape, onCoSearch: (e) => this.coSearch.emit(e.detail), onCoChange: (e) => this.handleListChange(e.detail), onCoReorder: (e) => this.handleReorder(e.detail), onCoLoadMore: () => this.coLoadMore.emit() }, h("slot", { name: "panel-footer", slot: "footer" }), this.showFooter && (h("div", { class: "co-ref-field__footer", slot: "footer" }, this.footerSecondaryLabel && (h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--secondary", type: "button", onClick: this.handleFooterSecondary }, h("co-icon", { name: "plus", size: 16 }), h("span", null, this.footerSecondaryLabel))), h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--primary", type: "button", onClick: this.handleFooterPrimary }, h("co-icon", { name: "check", size: 16 }), h("span", null, this.footerPrimaryLabel)))))));
     }
     // ── Main render ────────────────────────────────────────────
     render() {
-        return (h("div", { key: '0ce5a3a17573be110e31d9b9a852c9d38920ebe7', class: "co-ref-field" }, (this.label || this.secondaryLabel) && (h("div", { key: 'd8e57aa53a86c4a7eea93f5eb5bf599172028c8b', class: "co-ref-field__labels" }, this.label && (h("label", { key: '85047359916520cb24dd41806bc55105d58546c0', class: "co-ref-field__label" }, this.labelIcon && (h("co-icon", { key: '1a915ad0d00edde85e5a42c6aca46dd51d6934cd', class: "co-ref-field__label-icon", name: this.labelIcon, size: 16 })), this.label, h(RequiredMark, { key: '117e40254873f5736cf0adf41f8e075975e46c28', required: this.required }))), this.secondaryLabel && (h("span", { key: '054f1fe59359d4dafda008396867f1c9b70607cb', class: "co-ref-field__secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: '56dbfeb3560e771908e9e0c4d41c34b0a69c8db4', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '4fe5a05e993c561d5e721c778ed55e71a3e26260', slot: "trigger" }, this.renderTrigger()), this.isOpen && this.renderPanel()), this.helperText && (h("div", { key: '9a49dcd557477db1c8460ee974682a13730b360e', class: `co-ref-field__helper co-ref-field__helper--${this.status}` }, this.status !== 'default' && (h("co-icon", { key: 'a8868a9cf707dd1b202a86c03ccab43778857fe8', name: this.status === 'error' ? 'warning-circle' : this.status === 'success' ? 'check-circle' : 'info', size: 14 })), h("span", { key: 'a11dbf26c8c975089d5e384316a154a2f03eab7b' }, this.helperText)))));
+        return (h("div", { key: '2947ab90a0811a53bc77263f96f13da30a2ed975', class: "co-ref-field" }, (this.label || this.secondaryLabel) && (h("div", { key: '5e16afd2e37e56191e019cdf4be27aea292836eb', class: "co-ref-field__labels" }, this.label && (h("label", { key: '28b97b7f577fa1a1ea2c2c9a8bbd31aa9915ef7f', class: "co-ref-field__label" }, this.labelIcon && (h("co-icon", { key: 'a02fdfc4ebd37c6b7fe1ff84788fb5b94b11c5bf', class: "co-ref-field__label-icon", name: this.labelIcon, size: 16 })), this.label, h(RequiredMark, { key: '933bb1d1d78894a9d127d0666f184a470bbe621f', required: this.required }))), this.secondaryLabel && (h("span", { key: 'cfe226e11e1cafb1187a90c4bba8abfe2318a9ca', class: "co-ref-field__secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: 'd6fb3e669735e53c4b01269a69c018d703761758', open: this.isOpen, placement: "bottom-start", matchWidth: !this.panelWidth, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '7f80d30580f77a23b38f85a4771b6fb1170f6791', slot: "trigger" }, this.renderTrigger()), this.isOpen && this.renderPanel()), this.helperText && (h("div", { key: '9ed05c93faee76f9d4ff18f41f8ae1e8ce60a734', class: `co-ref-field__helper co-ref-field__helper--${this.status}` }, this.status !== 'default' && (h("co-icon", { key: 'ffcb659c5dd52bc6f8b14ca982d0cba5f4089529', name: this.status === 'error' ? 'warning-circle' : this.status === 'success' ? 'check-circle' : 'info', size: 14 })), h("span", { key: 'ab0f53e7e2ade7d635389767b0b31d89844697ae' }, this.helperText)))));
     }
     static get is() { return "co-ref-field"; }
     static get encapsulation() { return "shadow"; }
@@ -895,6 +916,65 @@ export class CoRefField {
                 "attribute": "panel-theme",
                 "defaultValue": "'auto'"
             },
+            "triggerBadgeIcon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Phosphor icon rendered as a small status badge after the selected label in\nthe trigger (e.g. 'funnel' = strict workspace filter active). Only shows\nwhile a value is selected. Empty = no badge. Tint the pill via\n--co-ref-field-trigger-badge-bg."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "trigger-badge-icon",
+                "defaultValue": "''"
+            },
+            "triggerBadgeLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible name / tooltip for the trigger badge."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "trigger-badge-label",
+                "defaultValue": "''"
+            },
+            "panelWidth": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fixed panel width (CSS size, e.g. '264px'). By default the panel matches\nthe trigger width (form-field convention); set this for compact triggers\nwhose panel needs room of its own (e.g. the navbar workspace selector with\nits panel-footer switch). The panel stays anchored to the trigger's start\nedge."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "panel-width"
+            },
             "avatarShape": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/co-rich-text-editor/co-rich-text-editor.css

@@ -40,7 +40,7 @@ co-rich-text-editor {
   background: var(--co-semantic-surface-page);
   border: 1px solid var(--co-semantic-border-field);
   border-radius: var(--co-border-radius-xs);
-  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+  transition: border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out);
   min-height: 0;
   flex: 1;
   position: relative;
@@ -525,7 +525,7 @@ co-rich-text-editor {
   font-size: 11px;
   cursor: pointer;
   white-space: nowrap;
-  transition: background 0.12s, border-color 0.12s;
+  transition: background var(--co-motion-duration-fast), border-color var(--co-motion-duration-fast);
 }
 
 .co-rte-bubble__select-trigger:hover {
@@ -700,7 +700,7 @@ co-rich-text-editor {
   border: none;
   border-radius: 3px;
   cursor: pointer;
-  transition: transform 0.1s, box-shadow 0.1s;
+  transition: transform var(--co-motion-duration-fast), box-shadow var(--co-motion-duration-fast);
 }
 
 .co-rte-bubble__color-swatch:hover {
@@ -1225,7 +1225,7 @@ co-rich-text-editor {
   background: transparent;
   color: var(--co-semantic-text-default, #333);
   cursor: pointer;
-  transition: background 0.12s, border-color 0.12s;
+  transition: background var(--co-motion-duration-fast), border-color var(--co-motion-duration-fast);
 }
 
 .co-rte-img-layout__btn:hover {
@@ -1262,7 +1262,7 @@ co-rich-text-editor {
   border-radius: 4px;
   pointer-events: none;
   opacity: 0;
-  transition: opacity 0.12s ease;
+  transition: opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);
   z-index: 100;
 }
 .co-rte-img-layout__btn[data-tooltip]:hover::after {

package/dist/collection/components/co-rich-text-editor/co-rich-text-editor.js

@@ -2031,7 +2031,7 @@ export class CoRichTextEditor {
     render() {
         const showToolbar = this.resolvedToolbar !== 'none' && !this.readonly && !this.disabled;
         const showCount = this.showCharacterCount || this.maxLength != null;
-        return (h("div", { key: 'd600084f58be73fcade0b1a18111ccd1ab2a32ea', class: {
+        return (h("div", { key: 'c3753a40ce423ef2c8e744be02e79536200b00cf', class: {
                 'co-rich-text-editor': true,
                 'co-rich-text-editor--focused': this.hasFocus,
                 'co-rich-text-editor--disabled': this.disabled,
@@ -2039,10 +2039,10 @@ export class CoRichTextEditor {
                 'co-rich-text-editor--loading': !this.ready,
                 [`co-rich-text-editor--${this.status}`]: this.status !== 'default',
                 'co-rich-text-editor--flat': this.variant === 'flat',
-            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: 'f692d9fdadcf547da8fd0ba485d69fe882b14580', class: "co-rich-text-editor__labels" }, this.label && h("label", { key: '77ef28fee83ee26782deca75f0310abea3cbf64d', class: "co-rich-text-editor__label", part: "label" }, this.label), this.secondaryLabel && (h("span", { key: 'f26ce7f7457414e3c1353e33aff2ae9e40522643', class: "co-rich-text-editor__secondary-label" }, this.secondaryLabel)))), h("div", { key: '20a121b30f139ec62b37a6248aa4309e71888771', class: "co-rich-text-editor__frame" }, showToolbar && (h("co-rich-text-toolbar", { key: '7391cf2bc71e6c9636222b055d614845201b4d05', class: "co-rich-text-editor__toolbar", part: "toolbar", variant: this.resolvedToolbar, disabled: this.disabled || this.readonly, locale: this.locale, attachmentsEnabled: this.attachmentsEnabled, attachmentAccept: this.attachmentAccept, onCoAttachmentsSelected: (e) => {
+            }, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: 'ea8d8b975095ace8694ac7ae523e2e9f6385c52d', class: "co-rich-text-editor__labels" }, this.label && h("label", { key: '0346e882e321f10813b20a9d7f6ed68e30270d3d', class: "co-rich-text-editor__label", part: "label" }, this.label), this.secondaryLabel && (h("span", { key: 'd6c48a58fb7b37ab44f2a23a787f490368623bfc', class: "co-rich-text-editor__secondary-label" }, this.secondaryLabel)))), h("div", { key: '623338675e90a2b6cef791a4016652c1ad6e62f6', class: "co-rich-text-editor__frame" }, showToolbar && (h("co-rich-text-toolbar", { key: '8261b966367504c7befe6d0de27970563bf8a6b7', class: "co-rich-text-editor__toolbar", part: "toolbar", variant: this.resolvedToolbar, disabled: this.disabled || this.readonly, locale: this.locale, attachmentsEnabled: this.attachmentsEnabled, attachmentAccept: this.attachmentAccept, onCoAttachmentsSelected: (e) => {
                 e.stopPropagation();
                 this.coAttachmentsSelected.emit(e.detail);
-            }, ref: (el) => (this.toolbarEl = el) })), h("div", { key: '22847c8d57d9e9a903a2e2c6ffb658ea61f9d0a7', class: "co-rich-text-editor__box" }, h("div", { key: '70bb598dd6435c913044c6e9ae8e743f63a7efc5', class: "co-rte-content", part: "content", role: "textbox", "aria-multiline": "true", "aria-label": this.label, "aria-required": this.required ? 'true' : undefined, "aria-invalid": this.status === 'error' ? 'true' : undefined, ref: (el) => (this.contentEl = el) }))), h("div", { key: 'c3875f25af1683b61eae18c3b0ddd7c07fe05970', class: "co-rich-text-editor__footer" }, this.helperText && (h("div", { key: 'd61a15129d7f5870126fb16ebd1bb9f069753000', class: `co-rich-text-editor__helper co-rich-text-editor__helper--${this.status}`, part: "helper" }, h("co-icon", { key: '4e75dfa744e3ba2240a0461f60bc407a85aa974e', name: this.helperIcon, size: 14 }), h("span", { key: '9a081b10f32da576769c6d7b11775a5d51c92951' }, this.helperText))), showCount && (h("span", { key: '82673395155bf73ff766d71c352d895d49f35539', class: "co-rich-text-editor__count", ref: (el) => (this.charCountEl = el) }, this.charCount, this.maxLength != null ? ` / ${this.maxLength}` : '')))));
+            }, ref: (el) => (this.toolbarEl = el) })), h("div", { key: '3561ed2f658f81f7704e597d00e64183bfbe3457', class: "co-rich-text-editor__box" }, h("div", { key: '1ce7f396efdb92e4a4cd8e25e4ae731af96c50cc', class: "co-rte-content", part: "content", role: "textbox", "aria-multiline": "true", "aria-label": this.label, "aria-required": this.required ? 'true' : undefined, "aria-invalid": this.status === 'error' ? 'true' : undefined, ref: (el) => (this.contentEl = el) }))), h("div", { key: '72d2cd2fa5a5b8b54f5d024fa927e47f79c3d30a', class: "co-rich-text-editor__footer" }, this.helperText && (h("div", { key: 'a7841aa36dd1a63907d9811f563b286ccaa2136c', class: `co-rich-text-editor__helper co-rich-text-editor__helper--${this.status}`, part: "helper" }, h("co-icon", { key: 'd3da4da7e0ccbea5c0be2ea0fd37395aaff365be', name: this.helperIcon, size: 14 }), h("span", { key: '8cdfccf2edd7505e7abd13258155a5b8745bfb78' }, this.helperText))), showCount && (h("span", { key: 'e257595d41c060544862068a0d35b9e3f3a4b62a', class: "co-rich-text-editor__count", ref: (el) => (this.charCountEl = el) }, this.charCount, this.maxLength != null ? ` / ${this.maxLength}` : '')))));
     }
     static get is() { return "co-rich-text-editor"; }
     static get originalStyleUrls() {

package/dist/collection/components/co-rich-text-toolbar/co-rich-text-toolbar.css

@@ -53,7 +53,7 @@
   border-radius: 4px;
   pointer-events: none;
   opacity: 0;
-  transition: opacity 0.15s ease;
+  transition: opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);
   z-index: 9999;
 }
 [data-tooltip]:hover::after {
@@ -85,7 +85,7 @@
   background: transparent;
   color: var(--co-semantic-text-default, #333);
   cursor: pointer;
-  transition: background 0.12s ease, color 0.12s ease;
+  transition: background var(--co-motion-duration-fast) var(--co-motion-ease-out), color var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 .co-rich-text-toolbar__btn:hover:not(:disabled):not(.co-rich-text-toolbar__btn--active) {
@@ -128,7 +128,7 @@
   font-size: var(--co-font-size-12, 12px);
   cursor: pointer;
   white-space: nowrap;
-  transition: background 0.12s, border-color 0.12s;
+  transition: background var(--co-motion-duration-fast), border-color var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__select-btn:hover:not(:disabled) {
@@ -209,7 +209,7 @@
   cursor: pointer;
   background: var(--co-semantic-surface-secondary, #fff);
   color: var(--co-semantic-text-default, #333);
-  transition: background 0.12s;
+  transition: background var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__popover-btn:hover:not(.co-rich-text-toolbar__popover-btn--primary) {
@@ -246,7 +246,7 @@
   font-size: var(--co-font-size-14, 14px);
   cursor: pointer;
   text-align: left;
-  transition: background 0.1s;
+  transition: background var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__popover-option:hover {
@@ -285,7 +285,7 @@
   font-size: var(--co-font-size-14, 14px);
   cursor: pointer;
   text-align: left;
-  transition: background 0.12s;
+  transition: background var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__dropdown-item:hover {
@@ -360,7 +360,7 @@
   border: none;
   border-radius: 3px;
   cursor: pointer;
-  transition: transform 0.1s, box-shadow 0.1s;
+  transition: transform var(--co-motion-duration-fast), box-shadow var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__color-swatch:hover {
@@ -459,7 +459,7 @@
   background: transparent;
   color: var(--co-semantic-text-secondary, #666);
   cursor: pointer;
-  transition: background 0.12s, color 0.12s;
+  transition: background var(--co-motion-duration-fast), color var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__table-tab:hover {
@@ -491,7 +491,7 @@
   border-radius: 3px;
   background: transparent;
   cursor: pointer;
-  transition: background 0.08s, border-color 0.08s;
+  transition: background var(--co-motion-duration-instant), border-color var(--co-motion-duration-instant);
 }
 
 .co-rich-text-toolbar__grid-cell:hover,
@@ -593,7 +593,7 @@
   border: none;
   border-radius: var(--co-border-radius-xxs, 4px);
   cursor: pointer;
-  transition: opacity 0.12s;
+  transition: opacity var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__table-btn--primary {
@@ -639,7 +639,7 @@
   background: transparent;
   color: var(--co-semantic-text-default, #333);
   cursor: pointer;
-  transition: background 0.12s ease;
+  transition: background var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 .co-rich-text-toolbar__split-caret:hover:not(:disabled),
@@ -680,7 +680,7 @@
   border-radius: 8px;
   background: var(--co-semantic-surface-secondary, #fff);
   cursor: pointer;
-  transition: border-color 0.12s, box-shadow 0.12s, background 0.12s;
+  transition: border-color var(--co-motion-duration-fast), box-shadow var(--co-motion-duration-fast), background var(--co-motion-duration-fast);
 }
 
 .co-rich-text-toolbar__listpicker-item:hover {

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

@@ -13,11 +13,11 @@ export class CoRow {
         this.size = 'sm';
     }
     render() {
-        return (h("div", { key: '0a4400aebb95a4c221a9a084a7b4fdf6e2a22558', class: {
+        return (h("div", { key: 'cf40ecb8896089a87f527be917396d1f01057cec', class: {
                 'co-row': true,
                 [`co-row--${this.position}`]: true,
                 [`co-row--${this.size}`]: true,
-            }, part: "row" }, h("div", { key: 'a87e3439e72b8e620b23270c6748f02329980fa5', class: "co-row__prefix" }, h("slot", { key: '1ef9640ca87642e61c6f8d76a1ffc725b65ed8d4', name: "prefix" })), h("div", { key: '56236a111369b8b70b68b9b36211555f7161b7bc', class: "co-row__content" }, h("slot", { key: 'c8faefc9609037a804d3e6045732af338a6df276' })), h("div", { key: '11632f0b2c99357e03fb044f3f402ac240a5a543', class: "co-row__suffix" }, h("slot", { key: '9b0d002049447a1e49a8bbfd4da889ef3368def7', name: "suffix" }))));
+            }, part: "row" }, h("div", { key: '8d24887fb9704673fe0facfaabd792ca455bd479', class: "co-row__prefix" }, h("slot", { key: 'd2546cc155fe508f8f2a7eba580a99e370e82887', name: "prefix" })), h("div", { key: '5e6c33efacc0dde29f202a09c664294ad7524572', class: "co-row__content" }, h("slot", { key: '5efffa62218f021f439ad12eba00cb1479ccfc58' })), h("div", { key: '42cc9c00f8ca199e4e29ac8e2f6b6b585c2b3a99', class: "co-row__suffix" }, h("slot", { key: '3389e9ef5a2914629a7c2d1246d37c5fa956be33', name: "suffix" }))));
     }
     static get is() { return "co-row"; }
     static get encapsulation() { return "shadow"; }

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

@@ -735,7 +735,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   min-height: 40px;
   box-sizing: border-box;
   cursor: pointer;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+  transition: border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 /* ── Variant: flat (no border/background — reads as content) ──────────
@@ -788,7 +788,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   background: transparent;
   cursor: pointer;
   color: var(--co-color-gray-500);
-  transition: color 0.1s ease;
+  transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out);
   flex-shrink: 0;
 }
 
@@ -877,7 +877,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   background: transparent;
   cursor: pointer;
   color: var(--co-semantic-text-muted);
-  transition: color 0.15s ease;
+  transition: color var(--co-motion-duration-fast) var(--co-motion-ease-out);
 }
 
 .co-select__clear:hover {
@@ -965,7 +965,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   padding: var(--co-spacing-sm2) var(--co-spacing-md);
   border-radius: var(--co-border-radius-xs);
   cursor: pointer;
-  transition: background 0.1s ease;
+  transition: background var(--co-motion-duration-fast) var(--co-motion-ease-out);
   min-height: 32px;
   box-sizing: border-box;
 }

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

@@ -25,6 +25,10 @@ export class CoSelect {
         this.searchable = false;
         this.searchPlaceholder = 'Search…';
         this.emptyText = 'No results';
+        /** Footer de confirmación al pie del panel (paridad co-combobox/co-ref-field). */
+        this.showFooter = false;
+        /** Label del botón primario del footer. */
+        this.footerPrimaryLabel = 'Ok';
         this.isOpen = false;
         this.scrollTop = 0;
         this.searchText = '';
@@ -56,6 +60,10 @@ export class CoSelect {
             this.coClear.emit();
             this.coChange.emit(this.multiple ? [] : '');
         };
+        this.handleFooterPrimary = () => {
+            this.coFooterPrimary.emit();
+            this.isOpen = false;
+        };
         this.handleOptionClick = (optionValue) => {
             if (this.multiple) {
                 const sel = [...this.selectedValues];
@@ -213,20 +221,20 @@ export class CoSelect {
         var _a;
         const selected = this.selectedValues;
         const options = this.filteredOptions;
-        return (h("div", { key: 'dda1b5f2f72939374a748224137586c8cc67cfcb', class: {
+        return (h("div", { key: 'bad4f3499f16c7bbe02c6ca688350224dafc5d6b', class: {
                 'co-select': true,
                 'co-select--open': this.isOpen,
                 'co-select--disabled': this.disabled,
                 [`co-select--${this.size}`]: true,
                 [`co-select--${this.status}`]: this.status !== 'default',
                 'co-select--flat': this.variant === 'flat',
-            } }, (this.label || this.secondaryLabel) && (h("div", { key: '5947cfc99c31904238dd3c86c4da4e42e7d94ba3', class: "co-select__labels" }, this.label && h("label", { key: 'fac1de54916c5b0701c10b3b618c41f8319c3a50', class: "co-select__label" }, this.label, h(RequiredMark, { key: '12f175c2dc67ef19c949fd517e38cd2c32b55084', required: this.required })), this.secondaryLabel && h("span", { key: 'a1a0fa82fc220952e4c8225e13fa8bbb2cbbe310', class: "co-select__secondary-label" }, this.secondaryLabel))), h("co-popover", { key: '126cb2923ea3a5e3646697fd514050258c82bcaa', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '0b3dd75a9d0bb427bc8e5c8f17fe5c297855a899', slot: "trigger", class: "co-select__trigger", onClick: this.handleTriggerClick }, this.iconLeft && h("co-icon", { key: 'ad2fa6c5a6798314097d8e0715cddff8ce349586', name: this.iconLeft, size: 16, class: "co-select__icon" }), ((_a = this.selectedOption) === null || _a === void 0 ? void 0 : _a.image) && (h("img", { key: '36e7407bf782a1adb15cd41432bc4f36d5605094', class: "co-select__flag", src: this.selectedOption.image, alt: "" })), this.multiple && this.hasValue ? (h("div", { class: "co-select__chips" }, this.selectedValues.map((v) => {
+            } }, (this.label || this.secondaryLabel) && (h("div", { key: '16f9d5d6b49559400c9bec5e14e1c4df027ce1ea', class: "co-select__labels" }, this.label && h("label", { key: '83943deadacbad791de84a140721c9ec4f33f614', class: "co-select__label" }, this.label, h(RequiredMark, { key: 'f8d016bdce053c0f9ff11a197a9786eadb80b2c8', required: this.required })), this.secondaryLabel && h("span", { key: '33a470cf9faa4dbd57a935efa076f6cfcacbf56e', class: "co-select__secondary-label" }, this.secondaryLabel))), h("co-popover", { key: '363d1cbfab691acc7b63fb0c42864a9753e66b72', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '9f5c31a29ea2027dc4721e6bf3eedeeb3bab1627', slot: "trigger", class: "co-select__trigger", onClick: this.handleTriggerClick }, this.iconLeft && h("co-icon", { key: 'a1a0379af6cbcf5ff9d03dd21b8a6eed67681aa3', name: this.iconLeft, size: 16, class: "co-select__icon" }), ((_a = this.selectedOption) === null || _a === void 0 ? void 0 : _a.image) && (h("img", { key: 'a6f2c211809d1db409f76d549ae8283d503e34e9', class: "co-select__flag", src: this.selectedOption.image, alt: "" })), this.multiple && this.hasValue ? (h("div", { class: "co-select__chips" }, this.selectedValues.map((v) => {
             const opt = this.parsedOptions.find((o) => o.value === v);
             return (h("span", { class: "co-select__chip", key: v }, h("span", { class: "co-select__chip-label" }, opt ? opt.label : v), h("button", { class: "co-select__chip-remove", type: "button", tabIndex: -1, "aria-label": "Remove", onClick: (e) => {
                     e.stopPropagation();
                     this.handleOptionClick(v);
                 } }, h("co-icon", { name: "x", size: 12 }))));
-        }))) : (h("span", { class: { 'co-select__text': true, 'co-select__text--placeholder': !this.hasValue } }, this.hasValue ? this.displayText : this.placeholder)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '3e97e8239b922280a21cd0fa53d37cbb15f313ba', class: "co-select__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: 'da2171535417fed8e6a3422120c13f4f860354e3', name: "x-circle", size: 16, weight: "fill" }))), h("co-icon", { key: 'e262edfb38a2bcd9771082c78af22ae3816a4472', name: this.isOpen ? 'caret-up' : 'caret-down', size: 16, class: "co-select__caret" })), h("div", { key: 'd557662d3722a7a60e7b499fea0c47a11bb86737', class: "co-select__dropdown" }, this.isOpen && this.searchable && (h("div", { key: '7248c5417c929016e43eba3754ef74cb68e21d76', class: "co-select__search" }, h("co-icon", { key: 'a88c9f7da98cb112d33a7bc6f970f503d7fbfcdc', name: "magnifying-glass", size: 16, class: "co-select__search-icon" }), h("input", { key: 'ed90bd495b6d92941af5f585d24ad9a4986757d9', class: "co-select__search-input", type: "text", placeholder: this.searchPlaceholder, value: this.searchText, onInput: this.handleSearchInput, ref: (el) => (this.searchInputEl = el) }))), this.isOpen && this.searchable && options.length === 0 && (h("div", { key: '0b9a0a98cb298dd25f2f869f7c6d01ced4c030a8', class: "co-select__empty" }, this.emptyText)), h("div", { key: '4c0aa1f9e0f0f3fcede94decb037217466c80ca5', class: "co-select__options", ref: (el) => (this.optionsContainerEl = el) }, this.isOpen && (() => {
+        }))) : (h("span", { class: { 'co-select__text': true, 'co-select__text--placeholder': !this.hasValue } }, this.hasValue ? this.displayText : this.placeholder)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '3d166cacb8bffe7a9d1afb3024393ecab45983db', class: "co-select__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: '9c294164bffc014958d650f0f73abe89590bf0d4', name: "x-circle", size: 16, weight: "fill" }))), h("co-icon", { key: '5fa3c25ee20c61b2a108051bfcae41e1a806230b', name: this.isOpen ? 'caret-up' : 'caret-down', size: 16, class: "co-select__caret" })), h("div", { key: 'b332004740d6b9b28009521b7462eabd5c9e34e5', class: "co-select__dropdown" }, this.isOpen && this.searchable && (h("div", { key: '5e74135218cae4f3ac081e484e0f8fd6ff243349', class: "co-select__search" }, h("co-icon", { key: '3c696854ee11e8e5dc5f2ebc30bb64b07ad251a4', name: "magnifying-glass", size: 16, class: "co-select__search-icon" }), h("input", { key: '7c3982eb4a72a89a41e6495faf9fb67ff59e39dc', class: "co-select__search-input", type: "text", placeholder: this.searchPlaceholder, value: this.searchText, onInput: this.handleSearchInput, ref: (el) => (this.searchInputEl = el) }))), this.isOpen && this.searchable && options.length === 0 && (h("div", { key: '076020e18baab05215d3203d8b75feede2e00f40', class: "co-select__empty" }, this.emptyText)), h("div", { key: '3d1ea578714f6ed2cf078365869cd15424b5e120', class: "co-select__options", ref: (el) => (this.optionsContainerEl = el) }, this.isOpen && (() => {
             const { totalHeight, startIdx, endIdx, offsetY } = this.getVirtualSlice(options);
             return (h("div", { class: "co-select__virtual-spacer", style: { height: `${totalHeight}px`, position: 'relative' } }, h("div", { style: { position: 'absolute', top: `${offsetY}px`, left: '0', right: '0' } }, options.slice(startIdx, endIdx).map(opt => {
                 const isSelected = selected.includes(opt.value);
@@ -237,7 +245,7 @@ export class CoSelect {
                         'co-select__option--disabled': isDisabled,
                     }, onClick: () => !isDisabled && this.handleOptionClick(opt.value) }, opt.image ? (h("img", { class: "co-select__option-flag", src: opt.image, alt: "", loading: "lazy" })) : opt.icon ? (h("co-icon", { name: opt.icon, size: 20, class: "co-select__option-icon" })) : null, h("span", { class: "co-select__option-label" }, this.renderLabel(opt.label)), isSelected && h("co-icon", { name: "check", size: 16, class: "co-select__option-check" })));
             }))));
-        })()))), this.helperText && (h("div", { key: 'b7f14d7e02dd3fe15be6c0f82b13df14edc0db60', class: `co-select__helper co-select__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '80dbcc3fe68bbe9e89256fa7a3dae7d846280d33', name: this.statusIcon, size: 14, class: "co-select__helper-icon" }), h("span", { key: 'd2162ba7ac4c287720185295643ef1c3e2187c84', class: "co-select__helper-text" }, this.helperText)))));
+        })()), this.isOpen && this.showFooter && (h("co-list-footer", { key: '2111c0b465b9bb197c1dcd4adfb9a779f8683872', class: "co-select__footer", primaryLabel: this.footerPrimaryLabel, primaryIcon: "check", onCoPrimary: this.handleFooterPrimary })))), this.helperText && (h("div", { key: '4b1b97363bda399af6e8d60dbd5a4ffc2c844c87', class: `co-select__helper co-select__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '466b666be057e2a6090c3b695c12215b1f1fa629', name: this.statusIcon, size: 14, class: "co-select__helper-icon" }), h("span", { key: '3da8e3ecaa7380a17c9cc61d98025737659c066a', class: "co-select__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-select"; }
     static get encapsulation() { return "shadow"; }
@@ -614,6 +622,46 @@ export class CoSelect {
                 "reflect": false,
                 "attribute": "empty-text",
                 "defaultValue": "'No results'"
+            },
+            "showFooter": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Footer de confirmaci\u00F3n al pie del panel (paridad co-combobox/co-ref-field)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-footer",
+                "defaultValue": "false"
+            },
+            "footerPrimaryLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Label del bot\u00F3n primario del footer."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "footer-primary-label",
+                "defaultValue": "'Ok'"
             }
         };
     }
@@ -656,6 +704,21 @@ export class CoSelect {
                     "resolved": "void",
                     "references": {}
                 }
+            }, {
+                "method": "coFooterPrimary",
+                "name": "coFooterPrimary",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Click en el bot\u00F3n primario del footer (el panel se cierra solo)."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
             }];
     }
     static get elementRef() { return "el"; }

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

@@ -57,7 +57,7 @@ export class CoSeparator {
                 style['--co-separator-inset-end'] = '0px';
             }
         }
-        return (h("hr", { key: 'fa1b1c05d8d5dfb77619036555d1d8a13590f33a', class: {
+        return (h("hr", { key: 'e3424f147cc4168638d2ac823046351fb880ac57', class: {
                 'co-separator': true,
                 'co-separator--vertical': this.vertical,
                 'co-separator--dark': this.dark,

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

@@ -11,7 +11,7 @@
   font-family: var(--co-font-family-primary);
   box-sizing: border-box;
   overflow: hidden;
-  transition: width 0.2s ease;
+  transition: width var(--co-motion-duration-base) var(--co-motion-ease-out);
 }
 
 /* ─── Modes ─────────────────────────────────────────────────── */

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

@@ -10,10 +10,10 @@ export class CoSidebar {
         this.mode = 'full';
     }
     render() {
-        return (h("nav", { key: '3c0842a02ed5a1bf40b1c69263efceff221aa193', class: {
+        return (h("nav", { key: 'ad5f66c721365f3a9ca2192765df243e8dea492e', class: {
                 'co-sidebar': true,
                 [`co-sidebar--${this.mode}`]: true,
-            }, part: "sidebar" }, h("div", { key: '392937b5a15fe0c7f6abb78a717b34601c616bf4', class: "co-sidebar__header", part: "header" }, h("slot", { key: '28f3b073070f7dfa9e8b0a2260c911ef264e9c66', name: "header" })), h("div", { key: '622f3dd5167875811492a820e7fa9a12734a8247', class: "co-sidebar__body", part: "body" }, h("slot", { key: '10cec6e86c11203e167eed243aeb718ddeca4a98' })), h("div", { key: '55dc3013edc9c4e0c7531a52d15ddc7070722847', class: "co-sidebar__footer", part: "footer" }, h("slot", { key: 'ec0bff733e378e23b6788b39b7cf18457b30c8a6', name: "footer" }))));
+            }, part: "sidebar" }, h("div", { key: '45a2250516e1080f79b4a4554a0db7715c30066d', class: "co-sidebar__header", part: "header" }, h("slot", { key: '04a468d4eb6cf9bbd2acc482ba50defc4271166e', name: "header" })), h("div", { key: '730e37997945ce8bc7bc2d177beb25bbd0a1813f', class: "co-sidebar__body", part: "body" }, h("slot", { key: '22c20554c8f2d85952d43484cda5903dbf33588d' })), h("div", { key: '6bb53d0394b9107ea1553e21047d51ea5fe0f292', class: "co-sidebar__footer", part: "footer" }, h("slot", { key: '2b326d1beed32288d50ba17abad459929ed1e940', name: "footer" }))));
     }
     static get is() { return "co-sidebar"; }
     static get encapsulation() { return "shadow"; }