@prolibu-suite/cobalt-core 0.9.0 → 0.9.2

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

@@ -97,17 +97,17 @@ export class CoJsonField {
     render() {
         const helper = this.internalInvalid ? this.invalidMessage : this.helperText;
         const statusClass = this.status !== 'default' ? `co-json-field--${this.status}` : '';
-        return (h("div", { key: '37c5b552e44d19e321bfd64a35da61e54418013c', class: {
+        return (h("div", { key: '5b2311f320820573ac6f7fb501b1a566e1e640fb', class: {
                 'co-json-field': true,
                 'co-json-field--disabled': this.disabled,
                 'co-json-field--focused': this.hasFocus,
                 'co-json-field--invalid': this.isInvalid,
                 [`co-json-field--${this.size}`]: true,
                 [statusClass]: !!statusClass,
-            }, part: "wrapper" }, this.label && (h("div", { key: '5ab03329fc4828abf624e473aef67bfa6878a4b1', class: "co-json-field__labels" }, h("label", { key: '14babf193d87564b813174f34df4ae4fc299155b', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: '635dd453ef2ed9ee720cc1c3f1c07a7b744d61ec', required: this.required })))), h("div", { key: '83763a2b5438b74da65e51bcbbdd6e6776eda45a', class: "co-json-field__field", part: "field" }, h("textarea", { key: '1f3929e95d98aca26d8f47b3fbce6c2c37aea3fa', class: "co-json-field__native", rows: this.rows, spellcheck: false, autocomplete: "off", value: this.draft, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? 'JSON' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" })), this.name && h("input", { key: '1dd77538a40085b72ba6b407e88d31faa73cd8dc', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: '6fb332624ab9dfa6b21af159ad3153eea4066c9a', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '98b624bc8d99515a83f19df185207ae696dcb943', class: "co-json-field__labels" }, h("label", { key: 'cfdccd9cedd268e5c8074b9f68c06618cf7d222d', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'eb659605e09458ba403de648c4d499f08e899e90', required: this.required })))), h("div", { key: '25cc5eb6b413f4d2f3e57154849adc2e91d23cea', class: "co-json-field__field", part: "field" }, h("textarea", { key: '5739bc7a9f45853d0c553bc03459028fb9225e1e', class: "co-json-field__native", rows: this.rows, spellcheck: false, autocomplete: "off", value: this.draft, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? 'JSON' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" })), this.name && h("input", { key: '2a49f930780920205b51403271c86e2a7d49908f', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: '3ffa24824f850162de4e3dbdf12535f35ccdb864', class: {
                 'co-json-field__helper': true,
                 'co-json-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'f4da415f949ee8d127eece321f4d8feecdd3a1ff', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: '7e3b458f7173be6ac4fdcf7df42d3a132ab5082b', class: "co-json-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'f01083ead8818bdb50e0579f6805ab3c07d5829f', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: '02d8146ec67d84171bb21ce58838e4ef9cc6391c', class: "co-json-field__helper-text" }, helper)))));
     }
     static get is() { return "co-json-field"; }
     static get encapsulation() { return "shadow"; }

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

@@ -313,17 +313,17 @@ export class CoLightbox {
         const counter = s.counter
             .replace('{i}', String(this.index + 1))
             .replace('{n}', String(imgs.length));
-        return (h("div", { key: 'c1743a4e71ebdb84af2271962ba1b76a434bbe24', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, popover: "manual", ref: this.syncTopLayer, onClick: this.requestClose }, img && (h("div", { key: 'f12555c4b7e8f4f061b7a449d3cb6665c4846cda', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, h("span", { key: '4bb66de1922f388886d000342f983ab852db0045', class: "co-lightbox__caption", title: img.alt }, img.alt), h("div", { key: '9fbdc078e7dbe0af9813a91a60155c1545e7309e', class: "co-lightbox__zoom" }, h("button", { key: 'b780571cec8da08b9ae069e1ffb6be1d933c4ea1', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '05ffc5137ff964d4159fed49191c2af17abec51f', name: "minus", size: 16 })), h("button", { key: 'b3d6751bb3b81233ccfb61b9692b9d14dda3307f', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), h("button", { key: '34ffc666558698b6e8dd3c0559ed1c5372c7947b', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: 'a0c066dfb0cf6026b08f85821e197e2340963979', name: "plus", size: 16 }))), h("button", { key: '12f8f66333d043214c57cebb81d1a153be72f9b3', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, h("co-icon", { key: 'c60b9a9856aa62728576c356af09880ca2d7710d', name: "arrow-square-out", size: 16 })), h("button", { key: '8a7caebb371e5f509051b92a730712f6e304eac2', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, h("co-icon", { key: 'efcd1f9672c2fa61b74f75b25771574ec6108004', name: "x", size: 16 })))), img && (h("div", { key: 'fc99ed851d5ffd99fb09b7c98fb4d317bcaa1f2a', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, h("img", { key: '7e43afbd4e170ab2b1a818501b7e34d4147c143e', class: {
+        return (h("div", { key: 'b3999d685ec6dc1c12bf430eba3bc0982b2fd4d3', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, popover: "manual", ref: this.syncTopLayer, onClick: this.requestClose }, img && (h("div", { key: '3c757d34339330ddc8179869771548d2e10eeb86', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, h("span", { key: 'ea97b286b84225423f46de0241fb7ab5f86a615e', class: "co-lightbox__caption", title: img.alt }, img.alt), h("div", { key: '273f23d1c551f459ed2d2b7d2dbdccf43beba000', class: "co-lightbox__zoom" }, h("button", { key: '7af226c8ea17183f2555e9983627ecf29189ddb3', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '085ed06e6593b99e13cf36009149d9cf90524280', name: "minus", size: 16 })), h("button", { key: 'f4df42781faa209de6b8ebbcfdd58c9c605a7977', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), h("button", { key: 'd1cbe7e831ff8b1f76927c87cc5929d5d29aae02', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: 'e10fb035385e19dab132fffc4b8d962e720c379e', name: "plus", size: 16 }))), h("button", { key: 'f500ccfea7a04b5f47cf786579cd1d1f138cbbd9', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, h("co-icon", { key: 'd9098c2bf45c888681b5982dea6d59b9a5e3d89d', name: "arrow-square-out", size: 16 })), h("button", { key: 'b61f45f9df568c4441cc764a88d74ba31debd16c', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, h("co-icon", { key: '787d1be07f3befb406beddbb7853d1f604fbfa30', name: "x", size: 16 })))), img && (h("div", { key: 'd4e4dcab4f5b34cfade28927cb484eb0fade7c6c', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, h("img", { key: '06ce0ba917e7007da67a5db9372457286d33d84c', class: {
                 'co-lightbox__img': true,
                 'co-lightbox__img--zoomed': this.scale > MIN_SCALE,
                 'co-lightbox__img--dragging': this.dragging,
-            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (h("button", { key: '461444963dde42d1d72af6bd88fe2013ab3858ee', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
+            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (h("button", { key: 'c0af13776f424508ef953c40efe203e8a9f0ffab', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(-1);
-            } }, h("co-icon", { key: 'a69c348080ac70da9d5af641c502e6a1f206f7dd', name: "caret-left", size: 24 }))), img && multi && (h("button", { key: '56504889f11cb56cea40aef5676ea6916aade850', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
+            } }, h("co-icon", { key: '17cb67246511c6a83a06ce594060be52c9f46cd0', name: "caret-left", size: 24 }))), img && multi && (h("button", { key: 'b2e8ab1029b75ef8db09c7141bf035e3aa67d156', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(1);
-            } }, h("co-icon", { key: '44cb0a0c644aa75c581bdd863df98590dbd0ebc3', name: "caret-right", size: 24 }))), img && multi && (h("div", { key: '6642109e875532fea123fc75fe0cf0ea6129be85', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
+            } }, h("co-icon", { key: '1ab70f0b03bb640b9df26420df704b041b14a5a4', name: "caret-right", size: 24 }))), img && multi && (h("div", { key: '116097d4c98a45c150033b38dbf1e83f12602449', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
     }
     static get is() { return "co-lightbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-list-footer/co-list-footer.js

@@ -17,7 +17,7 @@ export class CoListFooter {
         this.handleSecondary = () => this.coSecondary.emit();
     }
     render() {
-        return (h("div", { key: 'fbf4ec72aa2f6814b558d51c44592e784355751e', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (h("button", { key: '78abef0f79117263c7d30e5ce37a876d193ba5e4', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && h("co-icon", { key: 'a765ab5be51d7eb5791d3161cf5c7d3688fa0fd7', name: this.secondaryIcon, size: 16 }), h("span", { key: '0f5d57201bcd6ce40439c26916e01f1e37fcd87e' }, this.secondaryLabel))), this.primaryLabel && (h("button", { key: '27aa3b20666c9fe2a6fb7f28a9ca6e2542dd8fd7', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && h("co-icon", { key: 'bafe2ebb9cfb2cc26c682ae9b419b09a512652f8', name: this.primaryIcon, size: 16 }), h("span", { key: 'c3c9baead987beea02ead3a65d3372c5532a67b8' }, this.primaryLabel))), h("slot", { key: '7a1ce48c91cc95c320c4d680053f42555e601187' })));
+        return (h("div", { key: 'd522b5d67635a4a7751a7b4760ccca1133f6e8f1', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (h("button", { key: '3e1ba3d6e14b48014dce5c91a1a39baba5a14556', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && h("co-icon", { key: '9b31eb5104f0109c93a11ddcef4029517348c9da', name: this.secondaryIcon, size: 16 }), h("span", { key: '1d097b4874f5379a7e6f2f9882ba83b0828d1099' }, this.secondaryLabel))), this.primaryLabel && (h("button", { key: '7ffa258f1778a0ae31b574a3ccb1319162648fb9', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && h("co-icon", { key: 'd75c5a25355c3b65222889b5a1ea75ecb559c05c', name: this.primaryIcon, size: 16 }), h("span", { key: '3a3cb4f049c8d590088182ef486304b291963aa4' }, this.primaryLabel))), h("slot", { key: '8e7579f147928f28f3f119ebb5423efb85922995' })));
     }
     static get is() { return "co-list-footer"; }
     static get encapsulation() { return "shadow"; }

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

@@ -70,21 +70,21 @@ export class CoListItem {
         requestAnimationFrame(this.measureTruncation);
     }
     render() {
-        return (h("div", { key: '23cfee682f0e7d3a22ca793b9e6b29eb89cf8ca1', class: {
+        return (h("div", { key: '4f75f2a1f42dea993a9b6fa7fe922bed8cbac7e5', class: {
                 'co-list-item': true,
                 'co-list-item--selected': this.selected,
                 'co-list-item--disabled': this.disabled,
                 'co-list-item--dense': this.dense,
                 'co-list-item--has-description': !!this.description,
-            }, part: "item", role: "option", tabindex: this.disabled ? -1 : 0, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'a0f3c86656e408225fdbfeb610a088f8adebfa55', class: "co-list-item__prefix" }, this.icon && h("co-icon", { key: '18be77a790afd7b83f8ad07c9af5925abed4f23b', name: this.icon, size: 18 }), h("slot", { key: '2e198e4c541e1c86c6c266cf93408e195c851428', name: "prefix" })), h("div", { key: 'cbb5768d0a7bb287dbab1e013ae5e03ff2194a1f', class: "co-list-item__content" }, this.label && (h("co-tooltip", { key: '79730131bb1a74660d6dba076b622358b7c1ee15', block: true, class: "co-list-item__tip", content: this.label, placement: "top", disabled: !this.labelTruncated }, h("span", { key: '778b003dc31bc196a770a7dc6c4eebe649faf8c3', class: "co-list-item__label", ref: (el) => {
+            }, part: "item", role: "option", tabindex: this.disabled ? -1 : 0, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'f4da4a9cfc3685cd3124c95308857353729fe71e', class: "co-list-item__prefix" }, this.icon && h("co-icon", { key: '640630cb8639d9b897734ceb4fa91b6eddd2a432', name: this.icon, size: 18 }), h("slot", { key: '300cfc7354b11bce7c94a349d2ec0c6d58bc00da', name: "prefix" })), h("div", { key: '7278c5c18ce4f390e31fc2af8f360de91c2ca644', class: "co-list-item__content" }, this.label && (h("co-tooltip", { key: 'fb1a48e2364bd34d1940cddda3402c8a114720cc', block: true, class: "co-list-item__tip", content: this.label, placement: "top", disabled: !this.labelTruncated }, h("span", { key: '4079eb57702d8faa93f6dab67ddf3024ba2fea15', class: "co-list-item__label", ref: (el) => {
                 this.labelEl = el;
                 if (el && this.ro)
                     this.ro.observe(el);
-            } }, this.label))), this.description && (h("co-tooltip", { key: '56c81304ceec7039a659c1e2443a17df48bf88eb', block: true, class: "co-list-item__tip", content: this.description, placement: "top", disabled: !this.descTruncated }, h("span", { key: '5f1f870da25778bfbe801cfb769319cff71fac75', class: "co-list-item__description", ref: (el) => {
+            } }, this.label))), this.description && (h("co-tooltip", { key: 'b40df7e5bec902fad45f79e2984b226302b68d5f', block: true, class: "co-list-item__tip", content: this.description, placement: "top", disabled: !this.descTruncated }, h("span", { key: '2af014c92bbf2d596f7fd78d73309f6cb7813047', class: "co-list-item__description", ref: (el) => {
                 this.descEl = el;
                 if (el && this.ro)
                     this.ro.observe(el);
-            } }, this.description))), h("slot", { key: '136ec5db83f4d2a77126d734ecac511c92b36d91' })), h("span", { key: '759b18ea3bedcb7b7b8023cb6ca1444fbacb5748', class: "co-list-item__suffix" }, h("slot", { key: 'c6519a183c1b7cdb84e4d822a5e2fa523a99ab52', name: "suffix" }))));
+            } }, this.description))), h("slot", { key: '1066c2e56c9855d77e28d891b77602988e70aba4' })), h("span", { key: 'c6413614311416a7d06681c7d381a004dfd9891b', class: "co-list-item__suffix" }, h("slot", { key: 'aff9146f80c9b61c42e1da3926b7b6b8a7eaf1f7', name: "suffix" }))));
     }
     static get is() { return "co-list-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-media-thumb/co-media-thumb.js

@@ -23,13 +23,13 @@ export class CoMediaThumb {
     }
     render() {
         var _a;
-        return (h("div", { key: 'acd021eb5ebcc987eeb1528b874fdbdfa48f8b52', class: {
+        return (h("div", { key: '12fa10a5ad7d6148b1dfbbe0c0e176770c87674e', class: {
                 'co-media-thumb': true,
                 'co-media-thumb--video': this.video,
             }, part: "thumb", style: {
                 height: this.toCss(this.height),
                 borderRadius: `${this.radius}px`,
-            } }, this.src ? (h("img", { class: "co-media-thumb__img", src: this.src, alt: (_a = this.alt) !== null && _a !== void 0 ? _a : '', part: "img" })) : (h("slot", null)), this.video && (h("div", { key: 'a6ec84bed9d75673b7b917b2cb513f01545d5bf2', class: "co-media-thumb__scrim", part: "scrim" }, h("div", { key: '9ce636bf0a3d9e53eb271803fc0bbd60f4314989', class: "co-media-thumb__play", part: "play" }, h("svg", { key: '07016dfed6ee4ff793650d830f152d2555731550', class: "co-media-thumb__play-icon", width: "16", height: "18", viewBox: "0 0 16 18", fill: "none", "aria-hidden": "true" }, h("path", { key: '825b3921b94248f28b30ce91b63525fd2fda5b35', d: "M2 2l12 7-12 7z", fill: "var(--co-color-base-negro, #1f1c1b)" })))))));
+            } }, this.src ? (h("img", { class: "co-media-thumb__img", src: this.src, alt: (_a = this.alt) !== null && _a !== void 0 ? _a : '', part: "img" })) : (h("slot", null)), this.video && (h("div", { key: 'd361913b211494e36be8f84eadd3e79087c97453', class: "co-media-thumb__scrim", part: "scrim" }, h("div", { key: 'ca2ee329750c62c701026b9e42e9983ca9dd3c11', class: "co-media-thumb__play", part: "play" }, h("svg", { key: 'e6b20bcfd2bd8862ab4bccf71da18222534650dd', class: "co-media-thumb__play-icon", width: "16", height: "18", viewBox: "0 0 16 18", fill: "none", "aria-hidden": "true" }, h("path", { key: '8a197ade5ab1afc39e4ffcd19b44b44933efffa6', d: "M2 2l12 7-12 7z", fill: "var(--co-color-base-negro, #1f1c1b)" })))))));
     }
     static get is() { return "co-media-thumb"; }
     static get encapsulation() { return "shadow"; }

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

@@ -111,7 +111,7 @@ export class CoMenu {
         (_b = (_a = items[next]) === null || _a === void 0 ? void 0 : _a.focusItem) === null || _b === void 0 ? void 0 : _b.call(_a);
     }
     render() {
-        return (h("co-popover", { key: 'a386ccd371e9eb5627b6c70f43e66d6844df0b8a', placement: this.placement, offset: this.offset, open: this.open, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("slot", { key: '9115ac2e7689183d9d397bd602d1a8651dcf364d', name: "trigger", slot: "trigger" }), h("div", { key: 'a56a14dfc5810144b93ca68ce54aceb7e5c2b85c', class: "co-menu", role: "menu", style: this.width ? { width: this.width, minWidth: this.width } : undefined }, h("slot", { key: '045510a7bbde56d841eee17d7561249a090e6de3' }))));
+        return (h("co-popover", { key: '718b9e0d42dad29533ca48b7fef6ee22fa6cc333', placement: this.placement, offset: this.offset, open: this.open, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("slot", { key: 'f9c94ff702e55f1410b1114b753c25b6e57095d7', name: "trigger", slot: "trigger" }), h("div", { key: 'a9d5c6bf91ece47c8fb1ba73e6287035c97f21fd', class: "co-menu", role: "menu", style: this.width ? { width: this.width, minWidth: this.width } : undefined }, h("slot", { key: '8fc58143f17c900f7dfe82319e5d39eb2766e7a9' }))));
     }
     static get is() { return "co-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-menu-divider/co-menu-divider.js

@@ -5,7 +5,7 @@ import { h } from "@stencil/core";
  */
 export class CoMenuDivider {
     render() {
-        return h("hr", { key: '9896239f2395bd79f45309fb61e0a0173572947a', class: "co-menu-divider", role: "separator" });
+        return h("hr", { key: 'be5b2213b3e1d8bf8a0b3c238de90598117b5fce', class: "co-menu-divider", role: "separator" });
     }
     static get is() { return "co-menu-divider"; }
     static get encapsulation() { return "shadow"; }

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

@@ -157,7 +157,9 @@
   --co-button-radius: var(--co-border-radius-xs);
 }
 
-.co-modal__footer:empty { display: none; }
+/* `:empty` can't detect slotted content (the <slot> is itself a child, so the
+   wrapper is never empty) — JS slotchange drives this class. */
+.co-modal__footer--empty { display: none; }
 
 /* ─── No dividers variant ───────────────────────────────────── */
 .co-modal--no-dividers .co-modal__footer {

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

@@ -1,5 +1,6 @@
 import { h } from "@stencil/core";
 import { afterEventFor } from "../co-overlay/overlayAfterClose";
+import { slotHasContent } from "../../utils/slotContent";
 /**
  * @slot        - Modal body content
  * @slot footer - Footer with action buttons
@@ -35,6 +36,11 @@ export class CoModal {
         this.size = 'md';
         /** Hide body section and all border dividers (compact confirm dialogs) */
         this.noDividers = false;
+        /* `:empty` can't see across a <slot>, so slotted presence is tracked in JS */
+        this.hasFooter = false;
+        this.handleFooterSlotChange = (e) => {
+            this.hasFooter = slotHasContent(e);
+        };
         this.handleOverlayClick = () => {
             if (this.closeOnOverlay)
                 this.coClose.emit();
@@ -62,14 +68,14 @@ export class CoModal {
             this.coClose.emit();
     }
     render() {
-        return (h("co-overlay", { key: 'ff50cf55b239e9b98ecfd047f612b0ccbe53812d', open: this.open, onCoClose: this.handleOverlayClick }, h("div", { key: '344ca11c6dca11be7f130316979a0042c58a2727', class: "co-modal__frame" }, h("div", { key: 'd91ac84494926b9bee4f347dd14a9f1ca900c997', class: {
+        return (h("co-overlay", { key: 'd8a169309bd13e529bbe1f6363f7d5f261aab8eb', open: this.open, onCoClose: this.handleOverlayClick }, h("div", { key: 'e9045bb14dcba0d2eba7d985fe1b79723b21ba6c', class: "co-modal__frame" }, h("div", { key: '1ed0eede2a8b8408112c32253b8046a6a9761dae', class: {
                 'co-modal': true,
                 'co-modal--open': this.open,
                 'co-modal--sm': this.size === 'sm',
                 'co-modal--lg': this.size === 'lg',
                 'co-modal--full': this.size === 'full',
                 'co-modal--no-dividers': this.noDividers,
-            }, part: "modal", ref: (el) => (this.modalEl = el), role: "dialog", "aria-modal": "true", "aria-labelledby": "modal-heading", onClick: this.stopPropagation, onTransitionEnd: this.handleTransitionEnd }, h("div", { key: '9c2e4c0abfb160f422db6c048ba291fbfe403eb6', class: "co-modal__header", part: "header" }, h("div", { key: 'e35895ad9eca4b1ef77530353e86f1ea06e853dd', class: "co-modal__header-text" }, h("h2", { key: 'd628fe5b03db72fd8b632ff05df78deeeef1e85e', class: "co-modal__heading", id: "modal-heading" }, this.heading), this.description && (h("p", { key: '388698d018ccae8c14c3280c30e3039efe6285ed', class: "co-modal__description" }, this.description))), this.closable && (h("button", { key: '9a9e313e0f6f39aa25ebbcf12a3893afc5dc48c9', class: "co-modal__close", type: "button", "aria-label": "Close", onClick: this.handleCloseClick }, h("co-icon", { key: 'ae3d4a26f37c459c9ecd9badb037fe4dfb8d1b20', name: "x", size: 20 })))), !this.noDividers && (h("div", { key: '13a32d3db0aed81e11670d64c41fb7022e26e16d', class: "co-modal__body", part: "body" }, h("slot", { key: '68edd276b236c35f73652ea8c676e736a9b939dc' }))), h("div", { key: '2346c64810c60f47424383c5e8cbccc909e2dcf6', class: "co-modal__footer", part: "footer" }, h("slot", { key: '8e824c5d5b8042046b0fa8605cb21b5081f5f97c', name: "footer" }))))));
+            }, part: "modal", ref: (el) => (this.modalEl = el), role: "dialog", "aria-modal": "true", "aria-labelledby": this.heading ? 'modal-heading' : undefined, onClick: this.stopPropagation, onTransitionEnd: this.handleTransitionEnd }, h("div", { key: '7208dd4502f2f001a3b4b0d187de7b244e29b9d4', class: "co-modal__header", part: "header" }, h("div", { key: '81dad02cdce3b324e0609b5863c0b17649224899', class: "co-modal__header-text" }, h("h2", { key: '0e94f6295c645ba100c4b762d18e5171d32d8c8a', class: "co-modal__heading", id: "modal-heading" }, this.heading), this.description && (h("p", { key: '7a6e9b0f9a2c4a0d8bd5a75050b8644f0802e4b0', class: "co-modal__description" }, this.description))), this.closable && (h("button", { key: 'b22682124517861d9f4ba7a24f697460ef03573d', class: "co-modal__close", type: "button", "aria-label": "Close", onClick: this.handleCloseClick }, h("co-icon", { key: 'c1c9152d1d37396428f9990c96128a93f60c78df', name: "x", size: 20 })))), !this.noDividers && (h("div", { key: '95073452c4e27974f82c0b0c815e4b0dc620869a', class: "co-modal__body", part: "body" }, h("slot", { key: '6f4e9ac5e29347de9116e4654ab94929c6d75d0e' }))), h("div", { key: '13cb1e194dd20201b9560edbe6891dd8982073b8', class: { 'co-modal__footer': true, 'co-modal__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: '73e1c6cfb288fa0debfa3064434fb9b44d6823ce', name: "footer", onSlotchange: this.handleFooterSlotChange }))))));
     }
     static get is() { return "co-modal"; }
     static get encapsulation() { return "shadow"; }
@@ -246,6 +252,11 @@ export class CoModal {
             }
         };
     }
+    static get states() {
+        return {
+            "hasFooter": {}
+        };
+    }
     static get events() {
         return [{
                 "method": "coClose",

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

@@ -14,12 +14,12 @@ export class CoNavbar {
         this.rounded = false;
     }
     render() {
-        return (h("div", { key: '2bfd8f245fd8e93a2d085c5cecbe729a32f10754', class: {
+        return (h("div", { key: '9db66169484ffc0954c76c21ca395bafe6a5c749', class: {
                 'co-navbar': true,
                 [`co-navbar--${this.variant}`]: true,
                 [`co-navbar--${this.size}`]: true,
                 'co-navbar--rounded': this.rounded,
-            }, part: "navbar", role: "toolbar" }, h("slot", { key: 'a07380f56382e9b96b335ab9169a16c8ed9e042e' })));
+            }, part: "navbar", role: "toolbar" }, h("slot", { key: 'dbf92282c2698bc55b7c7b0ce6bcc49724f636d6' })));
     }
     static get is() { return "co-navbar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -124,13 +124,13 @@ export class CoNumberField {
         this.coChange.emit(clamped);
     }
     render() {
-        return (h("div", { key: '5778de74c2122527e5e1dd5374ca7462c9777602', class: {
+        return (h("div", { key: 'e21d2694b5fd0fd5b77f514d8455c71f455a894b', class: {
                 'co-number-field': true,
                 'co-number-field--disabled': this.disabled,
                 'co-number-field--focused': this.focused,
                 [`co-number-field--${this.size}`]: true,
                 [`co-number-field--${this.status}`]: this.status !== 'default',
-            } }, (this.label || this.secondaryLabel) && (h("div", { key: '13944093fe31d72ffc4ed4170dfb756224d22e41', class: "co-number-field__labels" }, this.label && h("label", { key: '1bc489c56bb27e91da2f81e56632d3a7ae3fdf13', class: "co-number-field__label" }, this.label, h(RequiredMark, { key: 'e69950bb76c776673c758086777fdf6329850981', required: this.required })), this.secondaryLabel && h("span", { key: 'd7418acba4cc4f4f585f339c74ff65ef2e7925eb', class: "co-number-field__secondary-label" }, this.secondaryLabel))), h("div", { key: '2c48d204e0f73570a6e8fb7fc1e62bc4edece3e5', class: "co-number-field__row" }, h("button", { key: '2c8e1a93f645b4abea04f3c1208420b33360dac3', class: "co-number-field__btn co-number-field__btn--minus", type: "button", tabIndex: -1, disabled: !this.canDecrement, onClick: this.handleDecrement, "aria-label": "Decrease" }, h("co-icon", { key: '5b97f5ee852aa45ad2a23479de2935a3bded9949', name: "minus", size: 16 })), h("input", { key: '71a9b87401cd8ae246feb7a11b6ade377449737b', ref: el => (this.inputEl = el), class: "co-number-field__input", type: "text", inputMode: "decimal", value: this.isEmpty ? '' : String(this.toDisplay(this.value)), placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown }), this.scaled && !this.isEmpty && (h("span", { key: '8d1f92d1a292095a025123df72cbb1eddd856554', class: "co-number-field__affix", "aria-hidden": "true" }, "%")), this.clearable && !this.isEmpty && !this.disabled && (h("button", { key: 'acfbb71c7e6da0f6af4a202453ab41d71f00cc0b', class: "co-number-field__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: '17ab4abf993d782e607a112d6eace5dcf98634d4', name: "x-circle", size: 16, weight: "fill" }))), h("button", { key: '30d79b2b4e5ad4d9dd2d5c11b0ed176de32d3447', class: "co-number-field__btn co-number-field__btn--plus", type: "button", tabIndex: -1, disabled: !this.canIncrement, onClick: this.handleIncrement, "aria-label": "Increase" }, h("co-icon", { key: '333ced48d340087501dce733c6e54708de8b5ac9', name: "plus", size: 16 }))), this.helperText && (h("div", { key: 'fdeab7f5a8f87c4374e4d1c19dd722b013df093d', class: `co-number-field__helper co-number-field__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '959111c29e78996eba76e0e4dc0b9a81139536e8', name: this.statusIcon, size: 14, weight: "fill", class: "co-number-field__helper-icon" }), h("span", { key: '57696fb113011d84e158cc3dfcbd619a0951c002', class: "co-number-field__helper-text" }, this.helperText)))));
+            } }, (this.label || this.secondaryLabel) && (h("div", { key: '17efd9e4987c6ea49173cac684b0bff5a218c5c6', class: "co-number-field__labels" }, this.label && h("label", { key: '977f2f3606ccf1080028fa45bf039dc419e51501', class: "co-number-field__label" }, this.label, h(RequiredMark, { key: '79866d27266b934c2bbf0b2c9b7ff5234e3ee31c', required: this.required })), this.secondaryLabel && h("span", { key: '0f336f36b8c40655088cbe25e42c582df103b235', class: "co-number-field__secondary-label" }, this.secondaryLabel))), h("div", { key: 'a46ab7533a82a23c935e76dc44d1d6f6cf3c1cad', class: "co-number-field__row" }, h("button", { key: '8ade028bbfe79d177a95b3a72823ddf325fb39bf', class: "co-number-field__btn co-number-field__btn--minus", type: "button", tabIndex: -1, disabled: !this.canDecrement, onClick: this.handleDecrement, "aria-label": "Decrease" }, h("co-icon", { key: '85f7ecc76fab9ac8776be5669fe1dc7f494b55a2', name: "minus", size: 16 })), h("input", { key: '0e3959431a17c29a6ee42c18f893be71d6ff156f', ref: el => (this.inputEl = el), class: "co-number-field__input", type: "text", inputMode: "decimal", value: this.isEmpty ? '' : String(this.toDisplay(this.value)), placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown }), this.scaled && !this.isEmpty && (h("span", { key: 'f5d2518f8bb4ae3aefdf7ee059ad92e6fee66e9c', class: "co-number-field__affix", "aria-hidden": "true" }, "%")), this.clearable && !this.isEmpty && !this.disabled && (h("button", { key: '5ee9748d2a17601638276af4ce5cc7eb57a75ac9', class: "co-number-field__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: '05e5ebbbb8f8403b8fca2e53d2df4e915e53af21', name: "x-circle", size: 16, weight: "fill" }))), h("button", { key: 'f1d0473bec40293d4bd4cd558516118731069b4e', class: "co-number-field__btn co-number-field__btn--plus", type: "button", tabIndex: -1, disabled: !this.canIncrement, onClick: this.handleIncrement, "aria-label": "Increase" }, h("co-icon", { key: 'b8fca118622fab53168fb5123e20029fe5864ce9', name: "plus", size: 16 }))), this.helperText && (h("div", { key: '9feea41492ad64cb440c03ad69410ad49f4130c1', class: `co-number-field__helper co-number-field__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '66217b4f1a8a44e111bc9b73abf6f8a44665bf12', name: this.statusIcon, size: 14, weight: "fill", class: "co-number-field__helper-icon" }), h("span", { key: '201c84b2cb3a055e08e3eb004e50666513828038', class: "co-number-field__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-number-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-option-list/co-option-list.css

@@ -674,10 +674,12 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   font-family: var(--co-font-family-primary, 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
 }
 
-/* Figma spec (panel dropdown unificado): search 32px + filas 32px/12px
- * regular, pitch vertical 34px (= fila 32 + gap 2) — debe coincidir con
- * VIRTUAL_ITEM_HEIGHT en optionListLogic.ts. El chrome del panel (borde,
- * sombra, bg, ancho) es del host; aquí solo el interior.
+/* Figma spec (panel dropdown unificado): search 32px + filas 32px, pitch
+ * vertical 34px (= fila 32 + gap 2) — debe coincidir con VIRTUAL_ITEM_HEIGHT
+ * en optionListLogic.ts. El chrome del panel (borde, sombra, bg, ancho) es del
+ * host; aquí solo el interior. Labels/search a 14px (subidos del 12px del
+ * Figma original, 2026-07-29: a 12px el texto quedaba ilegible en paneles
+ * densos como el picker de campos del filtro avanzado).
  * Todos los var() llevan fallback literal: el host puede tener un build de
  * tokens viejo sin los tokens nuevos (font-size-12, spacing-sm2, mono…). */
 .co-option-list {
@@ -723,7 +725,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   background: transparent;
   padding: 0;
   font-family: var(--co-font-family-primary, 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
-  font-size: var(--co-font-size-12, 12px);
+  font-size: var(--co-font-size-14, 14px);
   font-weight: 500;
   letter-spacing: var(--co-font-letter-spacing-body, -0.03em);
   line-height: 1;
@@ -764,7 +766,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 }
 
 /* ── Rows ────────────────────────────────────────────────── */
-/* 32px de alto, padding 4/8/4/4, radius 8, label 12px regular. */
+/* 32px de alto, padding 4/8/4/4, radius 8, label 14px regular. */
 .co-option-list__option {
   display: flex;
   align-items: center;
@@ -775,7 +777,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   padding: var(--co-spacing-xs, 4px) var(--co-spacing-sm2, 8px) var(--co-spacing-xs, 4px) var(--co-spacing-xs, 4px);
   border-radius: var(--co-border-radius-xs, 8px);
   cursor: pointer;
-  font-size: var(--co-font-size-12, 12px);
+  font-size: var(--co-font-size-14, 14px);
   letter-spacing: var(--co-font-letter-spacing-body, -0.03em);
   color: var(--co-semantic-text-default, #1f1c1b);
   transition: background var(--co-motion-duration-fast) var(--co-motion-ease-out);
@@ -943,7 +945,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   cursor: pointer;
   text-align: left;
   font-family: var(--co-font-family-primary, 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
-  font-size: var(--co-font-size-12, 12px);
+  font-size: var(--co-font-size-14, 14px);
   letter-spacing: var(--co-font-letter-spacing-body, -0.03em);
   color: var(--co-semantic-text-secondary, #585858);
 }
@@ -965,7 +967,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   align-items: center;
   gap: var(--co-spacing-sm2, 8px);
   padding: var(--co-spacing-md, 12px) var(--co-spacing-xs, 4px);
-  font-size: var(--co-font-size-12, 12px);
+  font-size: var(--co-font-size-14, 14px);
   color: var(--co-semantic-text-muted, #888888);
 }
 

package/dist/collection/components/co-option-list/co-option-list.js

@@ -365,11 +365,11 @@ export class CoOptionList {
         const selectedIds = this.selectedIds;
         const { hasMore, remaining } = deriveMore(this.parsedItems.length, this.total, this.hasMore);
         const showClear = !!this.clearOptionLabel && selectedIds.length > 0;
-        return (h("div", { key: '7abdf55cbf87783da5a7fb6526e54b80f743c971', class: "co-option-list", onKeyDown: this.onRootKeyDown }, this.searchable && (h("div", { key: 'b7ebe6f402048db7f1565cfb1a387b2fde63a9ae', class: "co-option-list__search", part: "search" }, h("co-icon", { key: '155de622b297b3b39ec7ee4c1760885c1422020e', name: "magnifying-glass", size: 16 }), h("input", { key: '79374bea9a1afc5ee0b93392bd8409315000d65a', class: "co-option-list__search-input", type: "text", placeholder: this.searchPlaceholder, value: this.term, onInput: this.onSearchInput, ref: (el) => (this.searchInputEl = el), role: "combobox", "aria-expanded": "true", "aria-autocomplete": "list" }))), h("div", { key: 'cff1206bc9e5ad472319b6d38c06f8e3b15cf133', class: "co-option-list__options", part: "options", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : 'false', ref: (el) => (this.optionsEl = el), onScroll: this.onNativeScroll }, h("div", { key: 'b12077f8e6e97f3548ba4bd4da0c05f2b1a19909', class: "co-option-list__inner" }, showClear && (h("button", { key: '129731579fa9c6eb6da59886fe2c6b8554487846', class: "co-option-list__clear-row", type: "button", onClick: () => this.coClearSelection.emit() }, h("co-icon", { key: '9d4b7f51e3043e9cb3fede1c7db53074cd538c8c', name: "x-circle", size: 14 }), h("span", { key: '946279b2732f63a74a4e388c5a27b09236bd88d1' }, this.clearOptionLabel))), this.loading && items.length === 0 && (h("div", { key: 'ef4bd3ca4192ca8a17f87a53199838428aa0873c', class: "co-option-list__loading" }, h("co-loader", { key: 'c98049223d10b7e5e2e5ddff03cd2da1a4e26555', size: "sm" }))), !this.loading && items.length === 0 && (h("div", { key: '3d828a24b260b9ad44adc7c3e8f223dec5413e42', class: "co-option-list__empty" }, h("co-icon", { key: '5952137642716cdacf8f07222482a1e9bd17d357', name: "magnifying-glass", size: 20 }), h("span", { key: '5661973b0a3dc745670eae494785eefe8e3e4569' }, this.emptyMessage))), items.length > 0 && this.virtual
+        return (h("div", { key: '1002a1993d3a13db23898cba6b8bd14aade3d8ac', class: "co-option-list", onKeyDown: this.onRootKeyDown }, this.searchable && (h("div", { key: 'a3f6d8a19f4dc7d7aac1898b053de0ccabc5ce6d', class: "co-option-list__search", part: "search" }, h("co-icon", { key: 'a3972500879ae7e5941841a13bf03af6dccc10f0', name: "magnifying-glass", size: 16 }), h("input", { key: '37861b77d5848ad9b8d0cfaf7c7ac2699e51000f', class: "co-option-list__search-input", type: "text", placeholder: this.searchPlaceholder, value: this.term, onInput: this.onSearchInput, ref: (el) => (this.searchInputEl = el), role: "combobox", "aria-expanded": "true", "aria-autocomplete": "list" }))), h("div", { key: '652fbbbbb6145c8c6bffc354a1435c09bc3a4e62', class: "co-option-list__options", part: "options", role: "listbox", "aria-multiselectable": this.multiple ? 'true' : 'false', ref: (el) => (this.optionsEl = el), onScroll: this.onNativeScroll }, h("div", { key: 'e0b68873c27f2d08a9edc0196384b3f75bd95e05', class: "co-option-list__inner" }, showClear && (h("button", { key: '7e4716349f9af4980fac732fdfe4013fc81e7b18', class: "co-option-list__clear-row", type: "button", onClick: () => this.coClearSelection.emit() }, h("co-icon", { key: '3d23e2a85e9387f364b0a5c705ca034020c83e43', name: "x-circle", size: 14 }), h("span", { key: '8fcc642763adbba7ca79507d53f18de157c61443' }, this.clearOptionLabel))), this.loading && items.length === 0 && (h("div", { key: '3ea9842f365d5e51338ff5799fccb27ca7bfe466', class: "co-option-list__loading" }, h("co-loader", { key: '306972ee829c41ae32ba69bd02b4dec839842a03', size: "sm" }))), !this.loading && items.length === 0 && (h("div", { key: 'b184393bc7348370fc6fc84ff7a38584a7fc2fd5', class: "co-option-list__empty" }, h("co-icon", { key: '39e9e495a62f285d22bbb5197227d48a52dd5c40', name: "magnifying-glass", size: 20 }), h("span", { key: '6faefea453fbf0ce3083c863b9c822a1902466b3' }, this.emptyMessage))), items.length > 0 && this.virtual
             ? this.renderVirtual(items, selectedIds)
             : buildRows(items).map((row) => row.kind === 'header'
                 ? h("div", { class: "co-option-list__group", role: "presentation" }, row.label)
-                : this.renderRow(row.item, row.index, selectedIds)), this.loading && items.length > 0 && (h("div", { key: '673a6ef5157b4873e1ea3c0d7481880661ead459', class: "co-option-list__loading-more" }, h("co-loader", { key: '39d822a93415d7adc1eb87ad2fc9f221e0364e34', size: "sm" }))), !this.loading && hasMore && remaining > 0 && (h("div", { key: '2e0ef5fabb28f2638bb992271972387c8bf57f61', class: "co-option-list__more" }, remaining, " more results")))), h("slot", { key: '17f5b0c9d9989f7ba4df15c5f19cb71218886a51', name: "footer" })));
+                : this.renderRow(row.item, row.index, selectedIds)), this.loading && items.length > 0 && (h("div", { key: '9a4cc5cf05196070febf62c6bf309b45fe8f5974', class: "co-option-list__loading-more" }, h("co-loader", { key: '0eb546749b37b5cd83d88bc6c40b34b3b5b04532', size: "sm" }))), !this.loading && hasMore && remaining > 0 && (h("div", { key: '06c4deab21fe6c56dcda175ba9b4f37add4c2e8a', class: "co-option-list__more" }, remaining, " more results")))), h("slot", { key: 'eaa788987749e25086a3be92df591e767c33c65b', name: "footer" })));
     }
     static get is() { return "co-option-list"; }
     static get encapsulation() { return "shadow"; }
@@ -859,7 +859,7 @@ export class CoOptionList {
                 "name": "coSearch",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -874,7 +874,7 @@ export class CoOptionList {
                 "name": "coChange",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -896,7 +896,7 @@ export class CoOptionList {
                 "name": "coLoadMore",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -911,7 +911,7 @@ export class CoOptionList {
                 "name": "coClearSelection",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -926,7 +926,7 @@ export class CoOptionList {
                 "name": "coRemoveItem",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -941,7 +941,7 @@ export class CoOptionList {
                 "name": "coReorder",
                 "bubbles": false,
                 "cancelable": true,
-                "composed": true,
+                "composed": false,
                 "docs": {
                     "tags": [],
                     "text": "Emitido tras un drag-reorder: nuevo orden de ids seleccionados + \u00EDtem movido."

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

@@ -187,7 +187,7 @@ export class CoOverlay {
         focusables[nextIndex].focus();
     }
     render() {
-        return (h("div", { key: '4945d0a43fbe34f58e630f2cb67b3b4301e5743f', class: { 'co-overlay': true, 'co-overlay--open': this.open }, part: "overlay", popover: "manual", tabindex: this.trapFocus ? -1 : undefined, ref: (el) => (this.overlayEl = el), onClick: this.handleClick, onTransitionEnd: this.handleTransitionEnd }, h("slot", { key: '4196e5718d8f8aace2a24439b770ef16ff2c2efb' })));
+        return (h("div", { key: '686e2708db09be6fbbb35bb267e3969d240bba4f', class: { 'co-overlay': true, 'co-overlay--open': this.open }, part: "overlay", popover: "manual", tabindex: this.trapFocus ? -1 : undefined, ref: (el) => (this.overlayEl = el), onClick: this.handleClick, onTransitionEnd: this.handleTransitionEnd }, h("slot", { key: '61b7864c03339835d2373efe36804d781f770d3a' })));
     }
     static get is() { return "co-overlay"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-page-header/co-page-header.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class CoPageHeader {
     render() {
-        return (h("div", { key: '0d1ce2960b81a9a7ace9a47e4dfe4211f9aa5751', class: "co-page-header", part: "page-header" }, h("div", { key: 'cd0989d7a005a8549cebb5a443afa95c38edb551', class: "co-page-header__left" }, this.icon && (h("span", { key: 'b5bbc595c87abea99bb3aea5141b796241ae9232', class: "co-page-header__icon" }, h("co-icon", { key: '514c8687d716cf7b70a2166d5f618fa97d715051', name: this.icon, size: 24 }))), h("span", { key: 'b8c3f604c0122e961bd964c6816112cbc9467c0b', class: "co-page-header__title" }, h("slot", { key: '460a789271c89a4f9defdeb7640fe97434a1e6e8' }, this.heading))), h("div", { key: '84b84a5e9df01d796e5d0bd2c4736da6e47b59f3', class: "co-page-header__actions" }, h("slot", { key: 'c89df3f9fd5e0e8c2017881a4f62b5fac3ad8adb', name: "actions" }))));
+        return (h("div", { key: 'cc4d3011b35cf0c7e409e26e81c0443d4acf7116', class: "co-page-header", part: "page-header" }, h("div", { key: 'd0d79d2a1f1e55ef178ae6deb4a4bda9a718f3f7', class: "co-page-header__left" }, this.icon && (h("span", { key: '5d6c4210d2f18a69c9f1371ec79ba63a884a586b', class: "co-page-header__icon" }, h("co-icon", { key: '3bd905fa57f3c772cd2f61cd9de1e2d60407af62', name: this.icon, size: 24 }))), h("span", { key: '9656285b6a3d91f442d00e4acf9c55a8300ca5a0', class: "co-page-header__title" }, h("slot", { key: '1b31917e3bcbacdc111d8c5f46be03a56d188548' }, this.heading))), h("div", { key: 'fa551bee2dade362de86402835532b09547bdb30', class: "co-page-header__actions" }, h("slot", { key: '8ecfd5b89dd1c1fb5d62f5d78c375e918f6abff6', name: "actions" }))));
     }
     static get is() { return "co-page-header"; }
     static get encapsulation() { return "shadow"; }

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

@@ -159,7 +159,7 @@ export class CoPhoneField {
     render() {
         const entry = this.selectedEntry;
         const statusClass = this.status !== 'default' ? `co-phone-field--${this.status}` : '';
-        return (h("div", { key: '7d4a0a1226f8ba40202afa669447f8c419d395e4', class: `co-phone-field co-phone-field--${this.size} ${statusClass} ${this.disabled ? 'co-phone-field--disabled' : ''}` }, this.label && (h("label", { key: '15895fc034d0d4303dce675cd8f9daf57c71fcc6', class: "co-phone-field__label" }, this.label, h(RequiredMark, { key: 'edc44ea4d7a3bc0ae68eaf60b62a87b718de2407', required: this.required }))), h("div", { key: '60619b262eb6d6d46333f6f672b0576b4ad55d86', class: "co-phone-field__container" }, h("button", { key: '688f1646916dc07743f5d97dc3cf882d6083e4df', type: "button", class: "co-phone-field__selector", disabled: this.disabled, onClick: () => this.handleToggleDropdown(), "aria-expanded": String(this.isOpen), "aria-haspopup": "listbox" }, entry ? (h("img", { class: "co-phone-field__flag", src: `https://flagcdn.com/w40/${entry.iso2.toLowerCase()}.png`, alt: entry.iso2 })) : (h("co-icon", { name: "phone", size: 16 })), h("span", { key: '6b0595471c189a7a9c3e501afd4288efe3fba936', class: "co-phone-field__dial-code" }, entry ? entry.dialCode : ''), h("span", { key: 'c00388c1846b422a966937e58908bae0a10e049c', class: "co-phone-field__chevron" }, h("co-icon", { key: 'f8100593b1dfbbcd2bd814a8af92636094a50de4', name: "caret-down", size: 14 }))), h("input", { key: 'c55322191719935623e8faa6a083f7da90d86573', class: "co-phone-field__input", type: "tel", placeholder: this.placeholder, value: this.numberPart, disabled: this.disabled, onInput: (e) => this.handleNumberInput(e) })), this.isOpen && (h("div", { key: '4724a073146df0aa8d5dc4f46fc759c412e838ff', class: "co-phone-field__dropdown", role: "listbox" }, h("div", { key: '6b1ee6a39128da83634f7336bfd48a8c9ec96c9c', class: "co-phone-field__search" }, h("input", { key: '2ca5d2020ee5d0a0795c8cb3493c8d6d752fde6d', class: "co-phone-field__search-input", type: "text", placeholder: "Search country...", value: this.searchQuery, onInput: (e) => this.handleSearchInput(e), autoFocus: true })), h("div", { key: '611a469f17f4de85b01c48ec57faed7d433fe8f4', class: "co-phone-field__options" }, this.filteredCountries.map((d) => (h("button", { type: "button", key: d.iso2, class: `co-phone-field__option ${d.iso2 === this.selectedIso2 ? 'co-phone-field__option--selected' : ''}`, role: "option", "aria-selected": d.iso2 === this.selectedIso2 ? 'true' : 'false', onClick: () => this.handleCountrySelect(d) }, h("img", { class: "co-phone-field__option-flag", src: `https://flagcdn.com/w40/${d.iso2.toLowerCase()}.png`, alt: d.iso2 }), h("span", { class: "co-phone-field__option-name" }, this.renderName(d.name)), h("span", { class: "co-phone-field__option-code" }, d.dialCode))))))), this.helperText && (h("div", { key: '2ebbd43a0168fbeda12fe8e8d03b90852feab678', class: "co-phone-field__helper" }, this.statusIcon && (h("co-icon", { key: '0b78b938f0a32ed8c7dd53e907894298a9a20582', name: this.statusIcon, size: 14, weight: "fill", class: "co-phone-field__helper-icon" })), h("span", { key: '9e4751a137675b5e0929959f8e6d74968959fe79', class: "co-phone-field__helper-text" }, this.helperText)))));
+        return (h("div", { key: '39e358a001c1c0df6b6fb626f031ea2efd416e78', class: `co-phone-field co-phone-field--${this.size} ${statusClass} ${this.disabled ? 'co-phone-field--disabled' : ''}` }, this.label && (h("label", { key: '3210c553f76fafdfec97bab4f9468e2438f0c5c2', class: "co-phone-field__label" }, this.label, h(RequiredMark, { key: 'f9057119f8e7d7d37765ae758829aef9ef4b47c6', required: this.required }))), h("div", { key: '782a76b6c15bdac59b6e33964f326451ce85a5ef', class: "co-phone-field__container" }, h("button", { key: 'fc31bf1af8767f56508f9fcff28e9c50be6da447', type: "button", class: "co-phone-field__selector", disabled: this.disabled, onClick: () => this.handleToggleDropdown(), "aria-expanded": String(this.isOpen), "aria-haspopup": "listbox" }, entry ? (h("img", { class: "co-phone-field__flag", src: `https://flagcdn.com/w40/${entry.iso2.toLowerCase()}.png`, alt: entry.iso2 })) : (h("co-icon", { name: "phone", size: 16 })), h("span", { key: 'd98253ada8bbf1a905ef6eadd4b30723dd4ec4ee', class: "co-phone-field__dial-code" }, entry ? entry.dialCode : ''), h("span", { key: '746626be2b166e290af16181f5f9e9837ae8e3dc', class: "co-phone-field__chevron" }, h("co-icon", { key: 'bffa21af2ceee3dad2d045cdf07996b4da1ad0bb', name: "caret-down", size: 14 }))), h("input", { key: '51d59eb3fa78d64984f59f6096f8ca5ea013cb3d', class: "co-phone-field__input", type: "tel", placeholder: this.placeholder, value: this.numberPart, disabled: this.disabled, onInput: (e) => this.handleNumberInput(e) })), this.isOpen && (h("div", { key: 'e0b96accd38c9226812da68f811db79ae1f39e06', class: "co-phone-field__dropdown", role: "listbox" }, h("div", { key: '919556f077ab5b55fb7b72dcec7cfa43c4ae2b25', class: "co-phone-field__search" }, h("input", { key: 'f3d78c9daa4bb43f8617d06b6d9bb9efdb88dc58', class: "co-phone-field__search-input", type: "text", placeholder: "Search country...", value: this.searchQuery, onInput: (e) => this.handleSearchInput(e), autoFocus: true })), h("div", { key: 'ad53c211f9130391585e21da43435777f156bdf1', class: "co-phone-field__options" }, this.filteredCountries.map((d) => (h("button", { type: "button", key: d.iso2, class: `co-phone-field__option ${d.iso2 === this.selectedIso2 ? 'co-phone-field__option--selected' : ''}`, role: "option", "aria-selected": d.iso2 === this.selectedIso2 ? 'true' : 'false', onClick: () => this.handleCountrySelect(d) }, h("img", { class: "co-phone-field__option-flag", src: `https://flagcdn.com/w40/${d.iso2.toLowerCase()}.png`, alt: d.iso2 }), h("span", { class: "co-phone-field__option-name" }, this.renderName(d.name)), h("span", { class: "co-phone-field__option-code" }, d.dialCode))))))), this.helperText && (h("div", { key: 'a39f039fe9ae6216e84e032c9f8ef1b18791d224', class: "co-phone-field__helper" }, this.statusIcon && (h("co-icon", { key: 'fd32dedcbd326365ae80f71d58ad1a7653a0474c', name: this.statusIcon, size: 14, weight: "fill", class: "co-phone-field__helper-icon" })), h("span", { key: '369daab4e46552564be76402d739f56b3f46b669', class: "co-phone-field__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-phone-field"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,5 +1,6 @@
 import { h } from "@stencil/core";
 import { computePosition, findNearestScrollParent, getOffsetAncestor } from "../../utils/positioning";
+import { pushLayer, removeLayer, isTopLayer } from "../../utils/popover-stack";
 /** Side classes driving the entrance `transform-origin` (see co-popover.css). */
 const SIDE_CLASSES = ['top', 'bottom', 'left', 'right'].map((s) => `co-popover__panel--${s}`);
 export class CoPopover {
@@ -13,7 +14,14 @@ export class CoPopover {
         this.matchWidth = false;
         /** Gap in px between trigger and panel. */
         this.offset = 4;
-        /** Close when clicking outside the component. */
+        /**
+         * Close when clicking outside the component.
+         *
+         * ⚠️ In a stacked popover scenario, only the top-of-stack layer reacts to
+         * outside clicks (see `handleDocumentClickManual`). If the TOP layer sets
+         * this to `false` (a persistent popover), outside clicks are swallowed
+         * entirely — popovers below it in the stack lose their dismiss too.
+         */
         this.closeOnClickOutside = true;
         /** Close when pressing Escape. */
         this.closeOnEscape = true;
@@ -39,6 +47,15 @@ export class CoPopover {
             // Early-exit keeps closed instances silent.
             if (!this.open || !this.closeOnClickOutside)
                 return;
+            // Solo el tope de la pila reacciona al click afuera: con popovers
+            // anidados (dropdown dentro de un panel de filtro), el primer click
+            // afuera cierra solo el de más arriba; el padre queda intacto. Nota: si
+            // el TOPE tiene closeOnClickOutside=false (popover persistente), el
+            // click afuera no cierra NADA — el padre queda protegido detrás del hijo
+            // persistente (comportamiento deseado: el hijo bloquea el dismiss del
+            // padre). Con un solo popover abierto, nada cambia respecto a hoy.
+            if (!isTopLayer(this.el))
+                return;
             const path = e.composedPath();
             if (!path.includes(this.el)) {
                 this.open = false;
@@ -47,6 +64,8 @@ export class CoPopover {
         this.handleDocumentKeydownManual = (e) => {
             if (!this.open || !this.closeOnEscape)
                 return;
+            if (!isTopLayer(this.el))
+                return; // solo el tope reacciona a ESC
             if (e.key === 'Escape') {
                 e.stopPropagation();
                 this.open = false;
@@ -144,12 +163,14 @@ export class CoPopover {
             this.onOpenChange(true);
     }
     disconnectedCallback() {
+        removeLayer(this.el);
         this.unbindDocListeners();
         this.cleanupListeners();
     }
     // ── Watchers ───────────────────────────────────────────────
     onOpenChange(isOpen) {
         if (isOpen) {
+            pushLayer(this.el);
             this.coOpen.emit();
             this.bindDocListeners();
             // Schedule two updates: one immediate for initial position,
@@ -163,6 +184,7 @@ export class CoPopover {
             this.addScrollListeners();
         }
         else {
+            removeLayer(this.el);
             this.coClose.emit();
             this.cleanupListeners();
             this.unbindDocListeners();
@@ -249,13 +271,13 @@ export class CoPopover {
     }
     // ── Render ─────────────────────────────────────────────────
     render() {
-        return (h("div", { key: '52d7ebec42ee6e0306bbc31f177454810299fd97', class: "co-popover" }, h("div", { key: '7b3b35302f130c9aef3d352b896ded7aa85590a4', class: "co-popover__trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick }, h("slot", { key: 'b601a5bfa04b45a5d4d7fe8001b4537a855ef168', name: "trigger" })), this.open && (h("div", { key: '7281452d76e80934192c5d0c945e8b00672dab0c', class: "co-popover__panel", popover: "manual", ref: (el) => {
+        return (h("div", { key: '8a4ccad04a131824d9990759a41905e4772fd56c', class: "co-popover" }, h("div", { key: 'b71344c25aa5f785dbcb65425931f25403877173', class: "co-popover__trigger", ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick }, h("slot", { key: '3a2ad77fbf1d79f917f9c7278faef8ecb65a364e', name: "trigger" })), this.open && (h("div", { key: 'dd6d65a867b15ad3d6fe18658d1f3fdd89be8806', class: "co-popover__panel", popover: "manual", ref: (el) => {
                 if (el && el !== this.panelEl) {
                     this.panelEl = el;
                     this.promotePanel();
                     this.scheduleUpdate();
                 }
-            } }, h("slot", { key: 'd0903b97d26f0f16be36054f15dd64d6ae9a3d77' })))));
+            } }, h("slot", { key: '3082d046fc973bd5f571b4f9b845844be6e6bf9c' })))));
     }
     static get is() { return "co-popover"; }
     static get encapsulation() { return "shadow"; }
@@ -300,7 +322,7 @@ export class CoPopover {
                     "references": {
                         "PopoverPlacement": {
                             "location": "local",
-                            "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-popover/co-popover.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-release/packages/core/src/components/co-popover/co-popover.tsx",
                             "id": "src/components/co-popover/co-popover.tsx::PopoverPlacement"
                         }
                     }
@@ -369,7 +391,7 @@ export class CoPopover {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Close when clicking outside the component."
+                    "text": "Close when clicking outside the component.\n\n\u26A0\uFE0F In a stacked popover scenario, only the top-of-stack layer reacts to\noutside clicks (see `handleDocumentClickManual`). If the TOP layer sets\nthis to `false` (a persistent popover), outside clicks are swallowed\nentirely \u2014 popovers below it in the stack lose their dismiss too."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/co-progress-bar/co-progress-bar.js

@@ -18,12 +18,12 @@ export class CoProgressBar {
     render() {
         const clamped = Math.max(0, Math.min(100, this.value));
         const indeterminate = this.indeterminate;
-        return (h("div", { key: '03c7bc9c161cd1e44401cd6671c99dee6f317f59', class: {
+        return (h("div", { key: 'ec9ad8aa5fec0758148920a219a9ad38bbb2d26a', class: {
                 'co-progress-bar': true,
                 [`co-progress-bar--${this.status}`]: true,
                 [`co-progress-bar--${this.variant}`]: true,
                 'co-progress-bar--indeterminate': indeterminate,
-            }, role: "progressbar", "aria-valuenow": indeterminate ? undefined : clamped, "aria-valuemin": 0, "aria-valuemax": 100, part: "bar", style: { height: `${this.thickness}px` } }, h("div", { key: 'fcc7e309aa98fdb0442d5532320df3ab1d6fe902', class: "co-progress-bar__fill", style: indeterminate ? undefined : { width: `${clamped}%` } })));
+            }, role: "progressbar", "aria-valuenow": indeterminate ? undefined : clamped, "aria-valuemin": 0, "aria-valuemax": 100, part: "bar", style: { height: `${this.thickness}px` } }, h("div", { key: '18185890f38b6fba049d914a98644c655d0f5cbe', class: "co-progress-bar__fill", style: indeterminate ? undefined : { width: `${clamped}%` } })));
     }
     static get is() { return "co-progress-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-progress-circle/co-progress-circle.js

@@ -19,7 +19,7 @@ export class CoProgressCircle {
         const clamped = Math.max(0, Math.min(100, this.value));
         const angle = (clamped / 100) * 360;
         const safeStroke = Math.min(this.strokeWidth, this.size / 2);
-        return (h("div", { key: '6c378b05df9c04d7856d0514fe773f2b63d07f23', class: {
+        return (h("div", { key: '54589f277b5c2b8b0d79ee514d96c58fc82f7f55', class: {
                 'co-progress-circle': true,
                 [`co-progress-circle--${this.status}`]: true,
             }, role: "progressbar", "aria-valuenow": clamped, "aria-valuemin": 0, "aria-valuemax": 100, part: "circle", style: {
@@ -27,7 +27,7 @@ export class CoProgressCircle {
                 height: `${this.size}px`,
                 '--co-pc-angle': `${angle}deg`,
                 '--co-pc-stroke': `${safeStroke}px`,
-            } }, h("div", { key: '4adb6940868fca1bab3c1e8bd09088c69cae244e', class: "co-progress-circle__track" }), this.showLabel && (h("span", { key: 'a54ed3aad5460777dc765874007a6cb665cbca19', class: "co-progress-circle__label" }, clamped, "%"))));
+            } }, h("div", { key: '531012a9eb019c39b11037e0ab6748ece8c946f1', class: "co-progress-circle__track" }), this.showLabel && (h("span", { key: '6ca9aff7a1069d59ad8cc65e5fb8c913084c6aa2', class: "co-progress-circle__label" }, clamped, "%"))));
     }
     static get is() { return "co-progress-circle"; }
     static get encapsulation() { return "shadow"; }