@prolibu-suite/cobalt-core 0.11.6 → 0.11.8

package/dist/esm/co-empty-state.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-DJkaRtbb.js';
 
-const coEmptyStateCss = () => `:host{display:block}.co-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--co-spacing-2xl) var(--co-spacing-xl);font-family:var(--co-font-family-primary);max-width:492px;margin:0 auto}.co-empty-state__icon{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-semantic-text-muted);margin-bottom:var(--co-spacing-xl)}.co-empty-state__heading{font-size:var(--co-font-size-20);font-weight:600;color:var(--co-semantic-text-default);margin-bottom:var(--co-spacing-sm)}.co-empty-state__description{font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);line-height:1.5;margin-bottom:var(--co-spacing-xl)}.co-empty-state__actions{display:flex;gap:var(--co-spacing-md);flex-wrap:wrap;justify-content:center}.co-empty-state__actions:empty{display:none}.co-empty-state--card{gap:var(--co-spacing-3xl, 32px);padding:var(--co-spacing-5xl, 48px) var(--co-spacing-3xl, 32px);background:var(--co-color-base-blanco, #fff);box-shadow:inset 0 0 0 1px var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-lg, 16px)}.co-empty-state--card .co-empty-state__icon{margin-bottom:0;background:var(--co-color-gray-100, #f6f6f6);color:var(--co-color-gray-600, #585858)}.co-empty-state--card .co-empty-state__heading{margin-bottom:0}.co-empty-state--card .co-empty-state__description{margin-bottom:0;line-height:1.35;color:var(--co-color-gray-600, #585858);max-width:366px}.co-empty-state--l .co-empty-state__icon{width:98px;height:98px}.co-empty-state--l .co-empty-state__heading{font-size:var(--co-font-size-24, 24px);font-weight:500;line-height:1.25}.co-empty-state__icon,.co-empty-state__heading,.co-empty-state__description,.co-empty-state__actions{animation:co-empty-reveal var(--co-motion-duration-slower) var(--co-motion-ease-out) both}.co-empty-state__heading{animation-delay:var(--co-motion-duration-instant)}.co-empty-state__description{animation-delay:calc(var(--co-motion-duration-instant) * 2)}.co-empty-state__actions{animation-delay:calc(var(--co-motion-duration-instant) * 3)}@keyframes co-empty-reveal{from{opacity:0;transform:translateY(12px);filter:blur(var(--co-motion-blur-md))}to{opacity:1;transform:translateY(0);filter:none}}`;
+const coEmptyStateCss = () => `:host{display:block}.co-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--co-spacing-2xl) var(--co-spacing-xl);font-family:var(--co-font-family-primary);max-width:492px;margin:0 auto}.co-empty-state__icon{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--co-semantic-surface-control);color:var(--co-semantic-text-muted);margin-bottom:var(--co-spacing-xl)}.co-empty-state__heading{font-size:var(--co-font-size-20);font-weight:600;color:var(--co-semantic-text-default);margin-bottom:var(--co-spacing-sm)}.co-empty-state__description{font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);line-height:1.5;margin-bottom:var(--co-spacing-xl)}.co-empty-state__actions{display:flex;gap:var(--co-spacing-md);flex-wrap:wrap;justify-content:center}.co-empty-state__actions:empty{display:none}.co-empty-state--card{gap:var(--co-spacing-3xl, 32px);padding:var(--co-spacing-5xl, 48px) var(--co-spacing-3xl, 32px);background:var(--co-semantic-surface-page);box-shadow:inset 0 0 0 1px var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-lg, 16px)}.co-empty-state--card .co-empty-state__icon{margin-bottom:0;background:var(--co-semantic-surface-control);color:var(--co-semantic-text-secondary)}.co-empty-state--card .co-empty-state__heading{margin-bottom:0}.co-empty-state--card .co-empty-state__description{margin-bottom:0;line-height:1.35;color:var(--co-semantic-text-secondary);max-width:366px}.co-empty-state--l .co-empty-state__icon{width:98px;height:98px}.co-empty-state--l .co-empty-state__heading{font-size:var(--co-font-size-24, 24px);font-weight:500;line-height:1.25}.co-empty-state__icon,.co-empty-state__heading,.co-empty-state__description,.co-empty-state__actions{animation:co-empty-reveal var(--co-motion-duration-slower) var(--co-motion-ease-out) both}.co-empty-state__heading{animation-delay:var(--co-motion-duration-instant)}.co-empty-state__description{animation-delay:calc(var(--co-motion-duration-instant) * 2)}.co-empty-state__actions{animation-delay:calc(var(--co-motion-duration-instant) * 3)}@keyframes co-empty-reveal{from{opacity:0;transform:translateY(12px);filter:blur(var(--co-motion-blur-md))}to{opacity:1;transform:translateY(0);filter:none}}`;
 
 const CoEmptyState = class {
     constructor(hostRef) {
@@ -13,11 +13,11 @@ const CoEmptyState = class {
     render() {
         var _a;
         const iconWeight = (_a = this.iconWeight) !== null && _a !== void 0 ? _a : (this.variant === 'card' ? 'regular' : 'light');
-        return (h("div", { key: '419da2f8dee690bb65956debb4a1d9aad3319906', class: {
+        return (h("div", { key: '19132f82995eef467098bfddbc78dc65b98a9290', class: {
                 'co-empty-state': true,
                 [`co-empty-state--${this.variant}`]: true,
                 [`co-empty-state--${this.size}`]: true,
-            }, part: "empty-state" }, this.icon && (h("div", { key: '5fd70dd13d10ad6e76f4c73ed43c7a4aca9c4fa1', class: "co-empty-state__icon" }, h("co-icon", { key: '75882f8eed9f64ffbe8b1163ea9d0a7666372ab2', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: '514ee7eb7b29867aa0d95088c03d6d24a1805f32', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: '2e004a9bacf1094c0c1ee5ad697862b13d05241b', class: "co-empty-state__description" }, this.description)), h("div", { key: '4e78c8ce7a8169e4afabc9fbce485f40175ee1cb', class: "co-empty-state__actions" }, h("slot", { key: '519d8af5d16b2f3382044d3ee098207b97e1bbf4' }))));
+            }, part: "empty-state" }, this.icon && (h("div", { key: 'e2e91d957055eeec9b884e089b43a351acb693c6', class: "co-empty-state__icon" }, h("co-icon", { key: '8269c9b54de522ffe7eb4ae00a9c89b003654531', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: '8ee14a4ef7136581050dc0530f3024b0c3d33b97', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: '115f78cabbd7b6842f16e6c6e10725d5405a45dc', class: "co-empty-state__description" }, this.description)), h("div", { key: '7439b17467b5470671e96515161838382d6764ea', class: "co-empty-state__actions" }, h("slot", { key: 'c34c498840f451ebec7e1bb062afa499a6299cff' }))));
     }
 };
 CoEmptyState.style = coEmptyStateCss();

package/dist/esm/co-event-calendar.entry.js

@@ -359,10 +359,10 @@ const CoEventCalendar = class {
         const t = getDateStrings(this.locale);
         const views = this.viewsList;
         const a = parseISO(this.anchor);
-        return (h("div", { key: '523b25e47b0d586ead40867d0c496b6d8fd1a21b', class: "cal" }, h("div", { key: '4943440f6f492be23a23f8820b1d638a0d292902', class: "cal__toolbar", part: "toolbar" }, h("button", { key: 'a6d890434149f15ef770db851e70e4d93646571b', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("div", { key: 'a617c5087b9055bc4f8530eafe619cca49c0930e', class: "cal__title-group" }, h("button", { key: '1b2f1ba3972d815be76a4527711e887066a994a1', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: '918828dec396d69678618d40c8aeb3793c6aa620', name: "caret-left", size: 16 })), h("h2", { key: 'c099fc2e18fa07f79fe0a0e72e372e71b658c553', class: "cal__title", "aria-live": "polite" }, this.title()), h("button", { key: '52c2ad1d1a06955f892ac6d179d905270df3a967', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: '9b4becd4d18465a86d42491291166ccad94973d3', name: "caret-right", size: 16 }))), views.length > 1 ? (h("div", { class: "cal__views", role: "tablist" }, views.map((v) => {
+        return (h("div", { key: '832acb515b3f21d70ce662838a6e6e3698b56217', class: "cal" }, h("div", { key: 'c083f584a806fe73c967669674cd150db68d44b9', class: "cal__toolbar", part: "toolbar" }, h("button", { key: '4d9643c42858f77d10e3ae2fd6b94e3127acf1bc', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("div", { key: '1ef58de1d94cde443ba40fd30d3145f527a7ec4d', class: "cal__title-group" }, h("button", { key: 'ad9df38e0f8e69d44b60aa21ce3ba1606d499b24', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: 'c6277c1173b4b11240844c85dd83169f2b3b3061', name: "caret-left", size: 16 })), h("h2", { key: '4ad13c5721eacc1102d9c192f82f545158dbc44d', class: "cal__title", "aria-live": "polite" }, this.title()), h("button", { key: '225374ba888f99f3d70c4db5a5a7fd96e367df44', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: '72bb0f7e8eb4e53b071656eb2ea4e4b7dc73adf2', name: "caret-right", size: 16 }))), views.length > 1 ? (h("div", { class: "cal__views", role: "tablist" }, views.map((v) => {
             var _a;
             return (h("button", { type: "button", role: "tab", "aria-selected": this.view === v ? 'true' : 'false', class: { 'cal__view-btn': true, 'cal__view-btn--active': this.view === v }, onClick: () => this.switchView(v) }, (_a = t[v]) !== null && _a !== void 0 ? _a : v));
-        }))) : (h("span", { class: "cal__views-spacer" }))), h("div", { key: '266dc8d6f4b490559eaa648970328e0861d44ec8', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { loading: this.loading, events: this.normalized, year: a.year, month: a.month, locale: this.locale, firstDayOfWeek: this.firstDayOfWeek, timeZone: this.tz, minDate: this.minDate, maxDate: this.maxDate, editable: this.editable, selectable: this.selectable, maxLanes: this.dayMaxEvents, onCoDaySelect: this.handleDaySelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : this.view === 'week' || this.view === 'day' ? (h("co-calendar-timegrid", { loading: this.loading, events: this.normalized, dates: this.visibleDates, locale: this.locale, timeZone: this.tz, editable: this.editable, selectable: this.selectable, minDate: this.minDate, maxDate: this.maxDate, onCoRangeSelect: this.handleRangeSelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, defaultDurationMinutes: this.defaultDurationMinutes, allDaySlot: this.allDaySlot, minTime: this.minTime, maxTime: this.maxTime, slotMinutes: this.slotMinutes, snapMinutes: this.snapMinutes, scrollTime: this.scrollTime, nowIndicator: this.nowIndicator })) : (h("div", { class: "cal__placeholder" }, h("co-icon", { name: "calendar-dots", size: 32 }), h("p", null, `${this.view} view — coming soon`))))));
+        }))) : (h("span", { class: "cal__views-spacer" }))), h("div", { key: 'a11f0e302ec7a4f8e5c0e6958bb3de75acec43cf', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { loading: this.loading, events: this.normalized, year: a.year, month: a.month, locale: this.locale, firstDayOfWeek: this.firstDayOfWeek, timeZone: this.tz, minDate: this.minDate, maxDate: this.maxDate, editable: this.editable, selectable: this.selectable, maxLanes: this.dayMaxEvents, onCoDaySelect: this.handleDaySelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : this.view === 'week' || this.view === 'day' ? (h("co-calendar-timegrid", { loading: this.loading, events: this.normalized, dates: this.visibleDates, locale: this.locale, timeZone: this.tz, editable: this.editable, selectable: this.selectable, minDate: this.minDate, maxDate: this.maxDate, onCoRangeSelect: this.handleRangeSelect, onCoEventClick: this.handleEventClick, onCoEventDblClick: this.handleEventDblClick, onCoEventDrop: this.handleEventDrop, defaultDurationMinutes: this.defaultDurationMinutes, allDaySlot: this.allDaySlot, minTime: this.minTime, maxTime: this.maxTime, slotMinutes: this.slotMinutes, snapMinutes: this.snapMinutes, scrollTime: this.scrollTime, nowIndicator: this.nowIndicator })) : (h("div", { class: "cal__placeholder" }, h("co-icon", { name: "calendar-dots", size: 32 }), h("p", null, `${this.view} view — coming soon`))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-event-popover.entry.js

@@ -120,7 +120,7 @@ const CoEventPopover = class {
         this.coClose.emit();
     }
     render() {
-        return (h(Host, { key: '9796ba38e83610ddb390dcab0818baf6bededc72' }, h("div", { key: 'e08bba8ebefb5206cbdd7a554e25ff9f4fcf9541', class: "pop", popover: "manual", role: "dialog", "aria-modal": "false", "aria-label": this.popoverLabel, tabIndex: -1, ref: (el) => (this.panelEl = el) }, h("div", { key: '185e30ed1640cbfb04e056d7a3433df2f5b94e06', class: "pop__actions", part: "actions" }, h("slot", { key: 'db04986cc1b63d52c5f1cc6579b5d00dbd46e476', name: "actions" })), h("div", { key: '89bbdc2a255e18d180183dbb127ce05a72ff262d', class: "pop__head" }, this.dot && h("span", { key: '6819901baff501958c8214dd7546a90a108c45f5', class: "pop__dot", style: this.color ? { background: this.color } : {} }), h("div", { key: '1111598f3ee886a0f2d9360c57278f1d71b76ddc', class: "pop__body", part: "body" }, h("slot", { key: '82c5eb8ff0e7752993d8b25b6d33a4d15d7edd25' }))))));
+        return (h(Host, { key: '5bd2501cd2a3b7163ddb91cac5b4397ea9394d6c' }, h("div", { key: '1aa203d59b6705638bdd5aa412fbb88ead2bd9f2', class: "pop", popover: "manual", role: "dialog", "aria-modal": "false", "aria-label": this.popoverLabel, tabIndex: -1, ref: (el) => (this.panelEl = el) }, h("div", { key: '3d740784adb2378dc83d8dbd1374d55ad3596ef7', class: "pop__actions", part: "actions" }, h("slot", { key: '4a79c8011bbcb610d1b650ee36b4c6875600a3fa', name: "actions" })), h("div", { key: 'b34f414b6a77c733189364037949360813e617eb', class: "pop__head" }, this.dot && h("span", { key: '498557c45c87c3e14ef838740ce76c449e94c607', class: "pop__dot", style: this.color ? { background: this.color } : {} }), h("div", { key: 'ca746458cfc81afd00ae5814ca196b71cad75449', class: "pop__body", part: "body" }, h("slot", { key: '4a851b8f4ddfd9321b2d882544adedff4dab7ade' }))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-fab.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DJkaRtbb.js';
 
-const coFabCss = () => `:host{display:inline-flex;font-family:var(--co-font-family-primary);line-height:1}.co-fab{display:inline-flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:none;border-radius:var(--co-border-radius-full);cursor:pointer;font-family:inherit;font-weight:500;white-space:nowrap;box-sizing:border-box;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-shadow:0 4px 12px rgba(31, 28, 27, 0.15)}.co-fab--xl{--co-fab-size:64px;width:64px;height:64px;font-size:var(--co-font-size-16)}.co-fab--l{--co-fab-size:56px;width:56px;height:56px;font-size:var(--co-font-size-16)}.co-fab--m{--co-fab-size:48px;width:48px;height:48px;font-size:var(--co-font-size-14)}.co-fab--s{--co-fab-size:40px;width:40px;height:40px;font-size:var(--co-font-size-14)}.co-fab--extended{width:auto;border-radius:var(--co-border-radius-lg)}.co-fab--extended.co-fab--xl{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--l{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--m{padding:0 var(--co-spacing-lg)}.co-fab--extended.co-fab--s{padding:0 var(--co-spacing-md)}.co-fab--hover-expand{justify-content:flex-start;overflow:hidden;transition:width var(--co-motion-duration-slow) var(--co-motion-ease-in-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand.co-fab--xl{padding:0 20px}.co-fab--hover-expand.co-fab--l{padding:0 16px}.co-fab--hover-expand.co-fab--m{padding:0 14px}.co-fab--hover-expand.co-fab--s{padding:0 11px}.co-fab--hover-expand:hover:not(:disabled),.co-fab--hover-expand:focus-visible{width:calc(var(--co-fab-size) + var(--co-spacing-sm2) + var(--co-fab-label-w, 0px));transition:width var(--co-motion-duration-slower) var(--co-motion-ease-spring), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand co-icon{flex-shrink:0;transition:transform var(--co-motion-duration-slower) var(--co-motion-ease-spring)}.co-fab--hover-expand:hover:not(:disabled) co-icon,.co-fab--hover-expand:focus-visible co-icon{transform:rotate(90deg)}.co-fab--hover-expand .co-fab__label{flex-shrink:0;opacity:0;transform:translateX(-6px);transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{opacity:1;transform:translateX(0);transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-out) 0.1s, transform var(--co-motion-duration-slow) var(--co-motion-ease-spring) 0.1s}@media (prefers-reduced-motion: reduce){.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{transition-delay:0s}}.co-fab--primary{background:var(--co-fab-bg, var(--co-color-base-negro, #1f1c1b));color:var(--co-semantic-on-primary)}.co-fab--primary:hover:not(:disabled){box-shadow:0 6px 20px rgba(31, 28, 27, 0.2);transform:translateY(-1px)}.co-fab--secondary{background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-subtle)}.co-fab--secondary:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab--stroke{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-fab--stroke:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab:active:not(:disabled){transform:translateY(0) scale(0.96)}.co-fab--disabled{opacity:0.4;cursor:not-allowed;box-shadow:none}.co-fab--bottom-right{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--bottom-left{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab--top-right{position:fixed;top:var(--co-fab-offset-top, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--top-left{position:fixed;top:var(--co-fab-offset-top, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab__label{line-height:1}`;
+const coFabCss = () => `:host{display:inline-flex;font-family:var(--co-font-family-primary);line-height:1}.co-fab{display:inline-flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:none;border-radius:var(--co-border-radius-full);cursor:pointer;font-family:inherit;font-weight:500;white-space:nowrap;box-sizing:border-box;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-shadow:0 4px 12px rgba(31, 28, 27, 0.15)}.co-fab--xl{--co-fab-size:64px;width:64px;height:64px;font-size:var(--co-font-size-16)}.co-fab--l{--co-fab-size:56px;width:56px;height:56px;font-size:var(--co-font-size-16)}.co-fab--m{--co-fab-size:48px;width:48px;height:48px;font-size:var(--co-font-size-14)}.co-fab--s{--co-fab-size:40px;width:40px;height:40px;font-size:var(--co-font-size-14)}.co-fab--extended{width:auto;border-radius:var(--co-border-radius-lg)}.co-fab--extended.co-fab--xl{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--l{padding:0 var(--co-spacing-xl)}.co-fab--extended.co-fab--m{padding:0 var(--co-spacing-lg)}.co-fab--extended.co-fab--s{padding:0 var(--co-spacing-md)}.co-fab--hover-expand{justify-content:flex-start;overflow:hidden;transition:width var(--co-motion-duration-slow) var(--co-motion-ease-in-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand.co-fab--xl{padding:0 20px}.co-fab--hover-expand.co-fab--l{padding:0 16px}.co-fab--hover-expand.co-fab--m{padding:0 14px}.co-fab--hover-expand.co-fab--s{padding:0 11px}.co-fab--hover-expand:hover:not(:disabled),.co-fab--hover-expand:focus-visible{width:calc(var(--co-fab-size) + var(--co-spacing-sm2) + var(--co-fab-label-w, 0px));transition:width var(--co-motion-duration-slower) var(--co-motion-ease-spring), background var(--co-motion-duration-fast) var(--co-motion-ease-out),     box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand co-icon{flex-shrink:0;transition:transform var(--co-motion-duration-slower) var(--co-motion-ease-spring)}.co-fab--hover-expand:hover:not(:disabled) co-icon,.co-fab--hover-expand:focus-visible co-icon{transform:rotate(90deg)}.co-fab--hover-expand .co-fab__label{flex-shrink:0;opacity:0;transform:translateX(-6px);transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{opacity:1;transform:translateX(0);transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-out) 0.1s, transform var(--co-motion-duration-slow) var(--co-motion-ease-spring) 0.1s}@media (prefers-reduced-motion: reduce){.co-fab--hover-expand:hover:not(:disabled) .co-fab__label,.co-fab--hover-expand:focus-visible .co-fab__label{transition-delay:0s}}.co-fab--primary{background:var(--co-fab-bg, var(--co-semantic-surface-primary));color:var(--co-semantic-on-primary)}.co-fab--primary:hover:not(:disabled){box-shadow:0 6px 20px rgba(31, 28, 27, 0.2);transform:translateY(-1px)}.co-fab--secondary{background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-subtle)}.co-fab--secondary:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab--stroke{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-fab--stroke:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-fab:active:not(:disabled){transform:translateY(0) scale(0.96)}.co-fab--disabled{opacity:0.4;cursor:not-allowed;box-shadow:none}.co-fab--bottom-right{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--bottom-left{position:fixed;bottom:var(--co-fab-offset-bottom, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab--top-right{position:fixed;top:var(--co-fab-offset-top, 24px);right:var(--co-fab-offset-right, 24px);z-index:1000}.co-fab--top-left{position:fixed;top:var(--co-fab-offset-top, 24px);left:var(--co-fab-offset-left, 24px);z-index:1000}.co-fab__label{line-height:1}`;
 
 const CoFab = class {
     constructor(hostRef) {
@@ -37,7 +37,7 @@ const CoFab = class {
         const iconSize = this.size === 'xl' ? 24 : this.size === 'l' ? 24 : this.size === 's' ? 18 : 20;
         const hasLabel = !!this.label;
         const hoverExpand = hasLabel && this.expandOnHover;
-        return (h("button", { key: 'cae304a87d9ad88c7ea2f1d2f926d018250e6128', class: {
+        return (h("button", { key: '740058822962826eaed6d9783ba012234f7343a1', class: {
                 'co-fab': true,
                 [`co-fab--${this.variant}`]: true,
                 [`co-fab--${this.size}`]: true,
@@ -45,7 +45,7 @@ const CoFab = class {
                 'co-fab--hover-expand': hoverExpand,
                 'co-fab--disabled': this.disabled,
                 [`co-fab--${this.position}`]: this.position !== 'none',
-            }, type: "button", disabled: this.disabled, onClick: this.handleClick, onPointerEnter: this.handleExpandMeasure, onFocusin: this.handleExpandMeasure, "aria-label": this.ariaLabelText || this.label || this.icon }, h("co-icon", { key: 'a1384ce9899fb2cbf5f4917cca49fb41480d82f6', name: this.icon, size: iconSize }), this.label && (h("span", { key: 'c5d7370d87478218dcce73c3c1d3edbf1c5c4a01', class: "co-fab__label", ref: (el) => (this.labelEl = el) }, this.label))));
+            }, type: "button", disabled: this.disabled, onClick: this.handleClick, onPointerEnter: this.handleExpandMeasure, onFocusin: this.handleExpandMeasure, "aria-label": this.ariaLabelText || this.label || this.icon }, h("co-icon", { key: '279d46289a80b83745e82743f9b13e22a28669ba', name: this.icon, size: iconSize }), this.label && (h("span", { key: 'f91eaf3101142d390c6281c0c945016b421f995b', class: "co-fab__label", ref: (el) => (this.labelEl = el) }, this.label))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/co-file-field.entry.js

@@ -96,8 +96,65 @@ function previewSrc(item) {
         return item.url || item.thumbnail;
     return hasImageExtension(item) ? item.url || item.thumbnail : item.thumbnail || item.url;
 }
+/** Extensiones conocidas por familia MIME: respaldo del comodín cuando el navegador no da `type`. */
+const EXTS_BY_FAMILY = { image: IMAGE_EXTS, video: VIDEO_EXTS };
+/**
+ * ¿`file` entra por la lista `accept` normalizada (sin punto, en minúscula)? Acepta extensión
+ * (`pdf`), MIME exacto (`application/pdf`) y COMODÍN de MIME (`image/*`) — el mismo vocabulario
+ * que el atributo `accept` del `<input>`. Sin el comodín, `image/*` rechazaba toda imagen que el
+ * propio picker del navegador había dejado elegir («Formato no permitido: .png»).
+ * Lista vacía = todo permitido.
+ */
+function acceptsFile(list, file) {
+    if (!list.length)
+        return true;
+    const ext = extOf(file.name);
+    const type = (file.type || '').toLowerCase();
+    return list.some((a) => {
+        var _a;
+        if (!a.includes('/'))
+            return a === ext;
+        if (!a.endsWith('/*'))
+            return type === a;
+        const family = a.slice(0, -2);
+        // Sin MIME (algunos SO/drag de apps no lo mandan): la extensión conocida de la familia.
+        return type ? type.startsWith(`${family}/`) : !!((_a = EXTS_BY_FAMILY[family]) === null || _a === void 0 ? void 0 : _a.has(ext));
+    });
+}
+const REVOKE_DELAY_MS = 2000;
+/**
+ * Descarga `url` como archivo `name`: fetch → blob → object URL → `<a download>`. Un `<a
+ * download>` directo NO sirve con las URLs de los archivos: son firmadas y cross-origin
+ * (S3/CDN), y el navegador IGNORA `download` fuera del mismo origen — abría la imagen en otra
+ * pestaña. Devuelve `false` si no se pudo (CORS, red, 403/404 — un `!ok` no se guarda, sería el
+ * XML de error) para que el host caiga a abrir la URL. El object URL se revoca DIFERIDO: revocarlo
+ * en el mismo tick cancela el handoff de la descarga en algunos motores.
+ */
+async function downloadViaBlob(url, name, deps = {}) {
+    const { fetchImpl = globalThis.fetch, doc = globalThis.document, urlApi = URL } = deps;
+    try {
+        const res = await fetchImpl(url);
+        if (!res.ok)
+            return false;
+        const objectUrl = urlApi.createObjectURL(await res.blob());
+        const link = doc.createElement('a');
+        link.href = objectUrl;
+        link.download = name || 'download';
+        link.rel = 'noopener noreferrer';
+        doc.body.appendChild(link);
+        link.click();
+        setTimeout(() => {
+            link.remove();
+            urlApi.revokeObjectURL(objectUrl);
+        }, REVOKE_DELAY_MS);
+        return true;
+    }
+    catch (_a) {
+        return false;
+    }
+}
 
-const coFileFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 55%, transparent);border:1px dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__preview--video{position:relative;background:var(--co-color-base-negro)}.co-file-field__preview-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);color:var(--co-color-base-blanco);pointer-events:none}.co-file-field__preview-play-badge{display:flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-negro-80);box-shadow:inset 0 0 0 1px var(--co-color-opacity-blanco-25);transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview--video:hover .co-file-field__preview-play-badge{transform:scale(1.08)}.co-file-field__preview-play-badge co-icon{transform:translateX(1px)}.co-file-field__preview-ext{font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);font-weight:var(--co-font-weight-medium);letter-spacing:var(--co-font-letter-spacing-overline);color:var(--co-color-opacity-blanco-80)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-status-error)}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-status-error)}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-status-error);font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;text-decoration:none;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-status-error)}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-file-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
+const coFileFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-semantic-text-error, var(--co-color-status-error))}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 55%, transparent);border:1px dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__preview--video{position:relative;background:var(--co-color-base-negro)}.co-file-field__preview-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm2);color:var(--co-color-base-blanco);pointer-events:none}.co-file-field__preview-play-badge{display:flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:var(--co-border-radius-full);background:var(--co-color-opacity-negro-80);box-shadow:inset 0 0 0 1px var(--co-color-opacity-blanco-25);transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview--video:hover .co-file-field__preview-play-badge{transform:scale(1.08)}.co-file-field__preview-play-badge co-icon{transform:translateX(1px)}.co-file-field__preview-ext{font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);font-weight:var(--co-font-weight-medium);letter-spacing:var(--co-font-letter-spacing-overline);color:var(--co-color-opacity-blanco-80)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error))}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-text-error, var(--co-semantic-status-error));font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;text-decoration:none;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error))}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}:host([layout='horizontal']) .co-file-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
 
 const CoFileField = class {
     constructor(hostRef) {
@@ -254,19 +311,31 @@ const CoFileField = class {
         return i >= 0 ? name.slice(i + 1).toLowerCase() : '';
     }
     validate(file) {
-        const list = this.acceptList;
-        if (list.length) {
-            const ext = this.extOf(file.name);
-            const okExt = list.includes(ext);
-            const okMime = list.some((a) => a.includes('/') && file.type === a);
-            if (!okExt && !okMime)
-                return fillTemplate(this.strings.errInvalidFormat, { x: ext });
+        // acceptsFile entiende el comodín `image/*` (antes: igualdad exacta de MIME → toda imagen
+        // del explorador salía «Formato no permitido»).
+        if (!acceptsFile(this.acceptList, file)) {
+            return fillTemplate(this.strings.errInvalidFormat, { x: this.extOf(file.name) });
         }
         if (this.maxBytes && file.size > this.maxBytes) {
             return fillTemplate(this.strings.errTooLarge, { x: formatBytes(file.size) });
         }
         return null;
     }
+    /**
+     * Descarga de verdad (fetch → blob): el `download` del <a> no vale con la URL firmada
+     * cross-origin. ⌘/Ctrl/Shift/medio-click conservan el comportamiento nativo del enlace
+     * (abrir en pestaña). Si el fetch falla (CORS, red, 403) se abre la URL como antes.
+     */
+    onDownloadClick(e, item) {
+        if (e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || !item.url)
+            return;
+        e.preventDefault();
+        const url = item.url;
+        void downloadViaBlob(url, item.name).then((ok) => {
+            if (!ok)
+                window.open(url, '_blank', 'noopener,noreferrer');
+        });
+    }
     handleFiles(fileList) {
         if (this.disabled || this.readonly)
             return;
@@ -358,7 +427,9 @@ const CoFileField = class {
         const gallery = this.previewItems();
         const images = gallery.map((it) => isVideo(it)
             ? { src: previewSrc(it), thumbnail: it.thumbnail, alt: it.name, kind: 'video', poster: it.thumbnail }
-            : { src: previewSrc(it), thumbnail: it.thumbnail, alt: it.name });
+            : // `original`: sin extensión de imagen el visor muestra la miniatura; «Abrir
+                // original» debe abrir el archivo guardado (cae a la miniatura si no decodifica).
+                { src: previewSrc(it), thumbnail: it.thumbnail, alt: it.name, original: it.url });
         const startIndex = Math.max(0, gallery.findIndex((it) => this.keyFor(it) === this.keyFor(item)));
         this.closeLightbox();
         const lb = document.createElement('co-lightbox');
@@ -442,12 +513,12 @@ const CoFileField = class {
         const previews = this.previewItems();
         const canReorder = this.reorderable && this.multiple && !this.disabled && !this.readonly && items.length > 1;
         const capacity = this.capacityHint(s);
-        return (h("div", { key: 'ee6fa70ea7fd466ec315eff1b6f3d044b1c6c6d9', class: {
+        return (h("div", { key: '4a6cea48737c68e53f90a32e962660473f49ce5a', class: {
                 'co-file-field': true,
                 'co-file-field--disabled': this.disabled,
                 'co-file-field--invalid': this.isInvalid,
                 [statusClass]: !!statusClass,
-            }, part: "wrapper" }, this.label && (h("div", { key: '48a181a0cb1e0c53da9d61a856f3d2cc5e97d079', class: "co-file-field__labels" }, h("label", { key: '47f162d9fdad44d4c8c8f7756c901eea216b7627', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '4549d57f016e2874ea7b141d9dc83e09c38bdbf3', required: this.required })))), showDropzone && (h("div", { key: '3d16ff2e38de335e5fba78931cd6b1b009603a70', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '3532e314c63b19208c7a7665dd025ff38585a598', class: "co-file-field__labels" }, h("label", { key: 'ae8aa6da81d6b959233218473086ecabe5ab8017', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '78d12c0e676217fd208bc03cc6a119b6fbf521e7', required: this.required })))), showDropzone && (h("div", { key: 'a6e5764aa57090d6b9383b1f8148bcba1239ff3a', class: {
                 'co-file-field__dropzone': true,
                 'co-file-field__dropzone--drag': this.dragOver,
             }, part: "dropzone", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleBrowse, onKeyDown: (e) => {
@@ -455,7 +526,7 @@ const CoFileField = class {
                     e.preventDefault();
                     this.handleBrowse();
                 }
-            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: 'e9a2c51a238455e7887e8310c02ac739ebf89e4e', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '5a6fe016b2e26896a8b788bb1473c5434d71e85f', name: "file-arrow-up", size: 18 }), h("span", { key: 'e69793c228fef62c5c0aec07f5f038aa3e931b3b' }, this.uploadButtonText || s.uploadButton)), h("span", { key: '7343bd26d1132ac6b0b0ded57f1a2a32f228d0e8', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: 'd7b68c8723c91b80b124298e29c9165c2489f59f', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: '38318d6e86a90cc8faf6955ea480b39d242d8122', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'ad9f134cd0f01b1ed61d8d8966d5a7d40bda0812', name: "actions" })), h("input", { key: '8a3b769794a89213a1f02f0b82899e624a5578d6', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: '8040d77615d29a691bc2087eddd7298b3922066c', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: 'e4660cdfe20c1b4669b57a4474234161bac4c812', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '636e3e35dcb8ad263361e1b652dca23b499e5354', class: "co-file-field__previews", part: "previews" }, previews.map((item) => {
+            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: '44558c1a5d15c5aca23a7e204bcccf5e57d6b740', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '662340ae54f1d070606c0fd8226155b0360e803e', name: "file-arrow-up", size: 18 }), h("span", { key: '752f18e7121040eb4edf571a54a9a5308825cb13' }, this.uploadButtonText || s.uploadButton)), h("span", { key: 'b92332ee8e7e658b33814b8c1ae34a4630045819', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: 'ed1f7c9093145ecbb49446b72a3d3bc99ee232e2', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: 'fd4953e9dfebf35936ae836d6f28ccdc17ccf951', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'c2e568fabd1512ecfa298c2ab281d310fbe21664', name: "actions" })), h("input", { key: '17acb79e8d066c18f7c1ac051a365d4282c852af', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: 'a793e2b836269abaafe71fd56b07b3d54155cf75', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: '2a265874db718faf1e78f2dd46e5ff14bbfbbff2', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: 'a4ebb3fae5ad4b2b29263381f9eb5ae03a98867d', class: "co-file-field__previews", part: "previews" }, previews.map((item) => {
             const key = this.keyFor(item);
             const video = isVideo(item);
             // A video without a usable poster still gets a card — the
@@ -466,7 +537,7 @@ const CoFileField = class {
                     'co-file-field__preview': true,
                     'co-file-field__preview--video': video,
                 }, part: "preview", type: "button", key: `prev-${key}`, title: item.name, "aria-label": `${video ? s.playVideo : s.openPreview}: ${item.name}`, onClick: () => this.handlePreviewOpen(item) }, showImg && (h("img", { src: video ? poster : item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })), video && (h("span", { class: "co-file-field__preview-play", "aria-hidden": "true" }, h("span", { class: "co-file-field__preview-play-badge" }, h("co-icon", { name: "play", size: 20, weight: "fill" })), !poster && (h("span", { class: "co-file-field__preview-ext" }, fileExtension(item).toUpperCase()))))));
-        }))), h("ul", { key: 'b67b8c43f8c02c65e780b3fa644123bf0f29d69b', class: "co-file-field__list", part: "list" }, items.map((item) => {
+        }))), h("ul", { key: '97ead2383d036b1ed2b09d6e931be2bfbcce25d2', class: "co-file-field__list", part: "list" }, items.map((item) => {
             const key = this.keyFor(item);
             const draggable = canReorder && item.status === 'done';
             return (h("li", { class: {
@@ -486,14 +557,14 @@ const CoFileField = class {
                     'co-file-field__row-icon--spin': item.status === 'uploading',
                 } })), h("div", { class: "co-file-field__row-body" }, h("span", { class: "co-file-field__row-name", title: item.name }, truncateLeft(item.name)), item.status === 'uploading' && (h("div", { class: "co-file-field__progress" }, h("div", { class: "co-file-field__progress-bar", style: typeof item.progress === 'number'
                     ? { width: `${item.progress}%` }
-                    : undefined }))), item.status === 'error' && item.error && (h("span", { class: "co-file-field__row-error" }, item.error))), item.size != null && (h("span", { class: "co-file-field__row-size" }, formatBytes(item.size))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: s.downloadFile }, h("a", { class: "co-file-field__action", href: item.url, target: "_blank", rel: "noopener noreferrer", download: item.name, tabIndex: -1, "aria-label": s.downloadFile }, h("co-icon", { name: "download", size: 18 })))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: this.copiedKey === key ? s.copied : s.copyUrl }, h("button", { class: {
+                    : undefined }))), item.status === 'error' && item.error && (h("span", { class: "co-file-field__row-error" }, item.error))), item.size != null && (h("span", { class: "co-file-field__row-size" }, formatBytes(item.size))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: s.downloadFile }, h("a", { class: "co-file-field__action", href: item.url, target: "_blank", rel: "noopener noreferrer", download: item.name, tabIndex: -1, "aria-label": s.downloadFile, onClick: (e) => this.onDownloadClick(e, item) }, h("co-icon", { name: "download", size: 18 })))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: this.copiedKey === key ? s.copied : s.copyUrl }, h("button", { class: {
                     'co-file-field__action': true,
                     'co-file-field__action--copied': this.copiedKey === key,
                 }, type: "button", tabIndex: -1, "aria-label": s.copyUrl, onClick: () => this.handleCopy(item) }, h("co-icon", { name: this.copiedKey === key ? 'check' : 'copy', size: 18 })))), !this.disabled && !this.readonly && (h("co-tooltip", { content: s.removeFile }, h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, "aria-label": s.removeFile, onClick: () => this.coRemove.emit(key) }, h("co-icon", { name: "trash", size: 18 }))))));
-        })))), helper && (h("div", { key: 'ff75602503a198d8598d2b35fd881c848a7b76d6', class: {
+        })))), helper && (h("div", { key: 'd4fef1bb2aa10f90ca7cd5e01bb5fed9ea917637', class: {
                 'co-file-field__helper': true,
                 'co-file-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'af79e0b999c781560c316023897aaa850b1d6ae0', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: 'b5af4dab0d3c7dc317265604159a95f3bf8d200d', class: "co-file-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '2fb9d5d28732c239bcec4b0a30dfe194367e8b5d', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '09bd101388c52a7fb8d0139c20f52f2da733543b', class: "co-file-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/co-file-type-tile.entry.js

@@ -74,7 +74,7 @@ const CoFileTypeTile = class {
         const iconSize = Math.round(this.size * 0.5);
         const background = this.colorTags ? meta.tint : 'var(--co-color-gray-100)';
         const color = this.colorTags ? meta.accent : 'var(--co-color-gray-600)';
-        return (h("span", { key: 'da0b0b3e48e1847bd7c74e32bec23abc074f53a7', class: {
+        return (h("span", { key: '9c08b899dcf809c6c5dffe9eef70d277cdbdc37d', class: {
                 'co-file-type-tile': true,
                 [`co-file-type-tile--${type}`]: true,
                 'co-file-type-tile--mono': !this.colorTags,
@@ -84,7 +84,7 @@ const CoFileTypeTile = class {
                 borderRadius: `${this.radius}px`,
                 background,
                 color,
-            } }, h("co-icon", { key: '70034ff2279181498ba2481fb3709cae3016901d', name: meta.icon, size: iconSize, weight: "fill" })));
+            } }, h("co-icon", { key: '0b20a29e58d1b63951cd314838f54dc98fd3c3f8', name: meta.icon, size: iconSize, weight: "fill" })));
     }
 };
 CoFileTypeTile.style = coFileTypeTileCss();

package/dist/esm/co-gradient-bar.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DJkaRtbb.js';
-import { i as interpolateStopColor, p as positionFromPointer, g as gradientCss, o as opaqueColor, h as hasTransparentStop, s as stepPosition } from './gradientStops-DDK0y8ra.js';
+import { i as interpolateStopColor, p as positionFromPointer, g as gradientCss, o as opaqueColor, h as hasTransparentStop, s as stepPosition } from './gradientStops-W-_rTTl_.js';
 import { l as langFromLocale } from './dateI18n-jYd9gu_c.js';
-import './color-BVGGRfNG.js';
+import './color-BzxEh7sq.js';
 import './hsv-COJdaKBU.js';
 
 /**
@@ -191,12 +191,12 @@ const CoGradientBar = class {
         const live = this.liveStops();
         const n = live.length;
         const hasSelection = this.selected != null && this.selected >= 0 && this.selected < n;
-        return (h("div", { key: '10e1f78165d061dd08141de0a0ca885f15b7ff83', class: {
+        return (h("div", { key: 'cef89872e93311d220f59805754f472a118dfce0', class: {
                 'co-gradient-bar': true,
                 'co-gradient-bar--disabled': this.disabled,
                 'co-gradient-bar--dragging': this.dragIndex >= 0,
                 'co-gradient-bar--transparent': hasTransparentStop(live),
-            }, role: "group", "aria-label": this.label || s.barLabel, "aria-disabled": this.disabled ? 'true' : undefined }, h("div", { key: 'e591b6e6d74ee9c9f3b9992f6d12cfd360f9fa49', class: "co-gradient-bar__track", part: "track", ref: (el) => (this.trackEl = el), onClick: this.handleTrackClick }, h("div", { key: 'fd5b93939df8988a08b8ab9f1fab36cc3eb24096', class: "co-gradient-bar__fill", style: { background: gradientCss(live) } }), live.map((stop, i) => {
+            }, role: "group", "aria-label": this.label || s.barLabel, "aria-disabled": this.disabled ? 'true' : undefined }, h("div", { key: 'bdcf7544119daba7392bd8b3f14924f81ab88f7f', class: "co-gradient-bar__track", part: "track", ref: (el) => (this.trackEl = el), onClick: this.handleTrackClick }, h("div", { key: 'ac58517f315ca19e37a6e590950397935e643be0', class: "co-gradient-bar__fill", style: { background: gradientCss(live) } }), live.map((stop, i) => {
             const selected = i === this.selected;
             // Roving tabindex: una sola parada de tab (la seleccionada, o la primera).
             const tabbable = hasSelection ? selected : i === 0;

package/dist/esm/co-helper-text.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-DJkaRtbb.js';
 
-const coHelperTextCss = () => `:host{display:block}.co-helper-text{display:flex;align-items:center;gap:var(--co-spacing-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);line-height:1.4}.co-helper-text__icon{flex-shrink:0}.co-helper-text--default{color:var(--co-semantic-text-muted)}.co-helper-text--error{color:var(--co-semantic-status-error)}.co-helper-text--success{color:var(--co-semantic-status-success)}.co-helper-text--warning{color:var(--co-semantic-status-warning)}.co-helper-text--info{color:var(--co-semantic-status-info)}`;
+const coHelperTextCss = () => `:host{display:block}.co-helper-text{display:flex;align-items:center;gap:var(--co-spacing-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12);line-height:1.4}.co-helper-text__icon{flex-shrink:0}.co-helper-text--default{color:var(--co-semantic-text-muted)}.co-helper-text--error{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}.co-helper-text--success{color:var(--co-semantic-text-success, var(--co-semantic-status-success))}.co-helper-text--warning{color:var(--co-semantic-text-warning, var(--co-semantic-status-warning))}.co-helper-text--info{color:var(--co-semantic-text-info, var(--co-semantic-status-info))}`;
 
 const CoHelperText = class {
     constructor(hostRef) {
@@ -16,10 +16,10 @@ const CoHelperText = class {
         };
     }
     render() {
-        return (h("div", { key: '12a67e485fed5d931c4325a0139d3ae7669b8de4', class: {
+        return (h("div", { key: '019ae80dcb000fb5179c645ac7ac9f218d290c53', class: {
                 'co-helper-text': true,
                 [`co-helper-text--${this.status}`]: true,
-            }, part: "helper-text" }, h("co-icon", { key: '5bdb8635fa1654a9e10176c9818ba4197fc252e8', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: 'c2f165cc0226ea1d799c62d0929d6acbf5cc1b98', class: "co-helper-text__message" }, h("slot", { key: 'd8315ea3ea6c002f83f1d936f9a3521831593b3d' }, this.message))));
+            }, part: "helper-text" }, h("co-icon", { key: '430a1f6c560ae70ae68e5ef427cb2af79960b114', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: '10b37550ab4818649debdaf87bce951948db154a', class: "co-helper-text__message" }, h("slot", { key: 'ea2433ffdf06655e3a0f2bfa8e4313e485b6d2a4' }, this.message))));
     }
 };
 CoHelperText.style = coHelperTextCss();

package/dist/esm/co-icon-button.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-DJkaRtbb.js';
 
-const coIconButtonCss = () => `:host{display:inline-flex}:host([disabled]){pointer-events:none}:host([fluid]){flex:1 1 0;min-width:0}:host([fluid]) .co-icon-button{width:100%}.co-icon-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;padding:0;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out),     background var(--co-motion-duration-fast) var(--co-motion-ease-out),     transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))));backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))))}.co-icon-button--filled{background:color-mix(in srgb, var(--co-semantic-surface-primary) 78%, transparent);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-icon-button--outlined{background:color-mix(in srgb, var(--co-icon-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);color:var(--co-icon-button-color, var(--co-semantic-on-secondary));border:1px solid var(--co-icon-button-border, var(--co-semantic-border-subtle))}.co-icon-button--ghost{background:transparent;color:var(--co-icon-button-color, var(--co-semantic-text-default));border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--ghost:hover:not(:disabled){background:var(--co-color-opacity-negro-8, rgba(31, 28, 27, 0.08))}.co-icon-button--soft{background:var(--co-semantic-surface-control);color:var(--co-icon-button-color, var(--co-semantic-text-default));border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--soft:hover:not(:disabled){background:color-mix(in srgb, var(--co-semantic-surface-control), var(--co-semantic-surface-hover))}.co-icon-button--dark{color:var(--co-icon-button-color, var(--co-color-base-blanco, #fff))}.co-icon-button--dark.co-icon-button--ghost:hover:not(:disabled){background:var(--co-color-opacity-blanco-16, rgba(255, 255, 255, 0.16))}.co-icon-button--selected,.co-icon-button--selected:hover:not(:disabled),.co-icon-button--dark.co-icon-button--selected:hover:not(:disabled){background:var(--co-icon-button-selected-bg, var(--co-semantic-accent));color:var(--co-icon-button-selected-color, var(--co-semantic-on-accent))}.co-icon-button--rounded.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--square.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-xl));}.co-icon-button--square.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-lg));}.co-icon-button--square.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-lg));}.co-icon-button--square.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-sm));}.co-icon-button--square.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-xs));}.co-icon-button--square.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-icon-button-radius, var(--co-spacing-sm));}::slotted(*){width:var(--co-icon-button-glyph-size);height:var(--co-icon-button-glyph-size);flex-shrink:0}.co-icon-button--caret{gap:4px}.co-icon-button--caret.co-icon-button--xl{width:calc(80px + 8px)}.co-icon-button--caret.co-icon-button--lg{width:calc(64px + 8px)}.co-icon-button--caret.co-icon-button--md{width:calc(56px + 8px)}.co-icon-button--caret.co-icon-button--sm{width:calc(48px + 8px)}.co-icon-button--caret.co-icon-button--xs{width:calc(32px + 8px)}.co-icon-button--caret.co-icon-button--xxs{width:calc(24px + 8px)}.co-icon-button--disabled,.co-icon-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-icon-button:hover:not(:disabled){opacity:0.88}.co-icon-button:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus)}.co-icon-button--dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-color-base-blanco, #fff) 45%, transparent)}.co-icon-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}@supports not (background: color-mix(in srgb, red, transparent)){.co-icon-button--filled{background:var(--co-semantic-surface-primary)}.co-icon-button--outlined{background:var(--co-icon-button-bg, var(--co-semantic-surface-secondary))}}.co-icon-button__swap{display:inline-grid}.co-icon-button__swap>co-icon{grid-area:1 / 1;transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-in-out),     transform var(--co-motion-duration-base) var(--co-motion-ease-in-out),     filter var(--co-motion-duration-base) var(--co-motion-ease-in-out)}.co-icon-button__swap>co-icon:last-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:first-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:last-child{opacity:1;transform:scale(1);filter:blur(0)}`;
+const coIconButtonCss = () => `:host{display:inline-flex}:host([disabled]){pointer-events:none}:host([fluid]){flex:1 1 0;min-width:0}:host([fluid]) .co-icon-button{width:100%}.co-icon-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;padding:0;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out),     background var(--co-motion-duration-fast) var(--co-motion-ease-out),     transform var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))));backdrop-filter:var(--co-icon-button-backdrop-filter, var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))))}.co-icon-button--filled{background:color-mix(in srgb, var(--co-semantic-surface-primary) 78%, transparent);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-icon-button--outlined{background:color-mix(in srgb, var(--co-icon-button-bg, var(--co-semantic-surface-secondary)) 55%, transparent);color:var(--co-icon-button-color, var(--co-semantic-on-secondary));border:1px solid var(--co-icon-button-border, var(--co-semantic-border-subtle))}.co-icon-button--ghost{background:transparent;color:var(--co-icon-button-color, var(--co-semantic-text-default));border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--ghost:hover:not(:disabled){background:var(--co-color-opacity-negro-8, rgba(31, 28, 27, 0.08))}.co-icon-button--soft{background:var(--co-semantic-surface-control);color:var(--co-icon-button-color, var(--co-semantic-text-default));border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.co-icon-button--soft:hover:not(:disabled){background:color-mix(in srgb, var(--co-semantic-surface-control), var(--co-semantic-surface-hover))}.co-icon-button--dark{color:var(--co-icon-button-color, var(--co-surface-dark-ink, var(--co-color-base-blanco, #fff)))}.co-icon-button--dark.co-icon-button--ghost:hover:not(:disabled){background:color-mix(in srgb, var(--co-surface-dark-ink, var(--co-color-base-blanco, #fff)) 16%, transparent)}.co-icon-button--selected,.co-icon-button--selected:hover:not(:disabled),.co-icon-button--dark.co-icon-button--selected:hover:not(:disabled){background:var(--co-icon-button-selected-bg, var(--co-semantic-accent));color:var(--co-icon-button-selected-color, var(--co-semantic-on-accent))}.co-icon-button--rounded.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--rounded.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-full))}.co-icon-button--square.co-icon-button--xl{width:80px;height:80px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-xl));}.co-icon-button--square.co-icon-button--lg{width:64px;height:64px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-lg));}.co-icon-button--square.co-icon-button--md{width:56px;height:56px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-lg));}.co-icon-button--square.co-icon-button--sm{width:48px;height:48px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-sm));}.co-icon-button--square.co-icon-button--xs{width:32px;height:32px;border-radius:var(--co-icon-button-radius, var(--co-border-radius-xs));}.co-icon-button--square.co-icon-button--xxs{width:24px;height:24px;border-radius:var(--co-icon-button-radius, var(--co-spacing-sm));}::slotted(*){width:var(--co-icon-button-glyph-size);height:var(--co-icon-button-glyph-size);flex-shrink:0}.co-icon-button--caret{gap:4px}.co-icon-button--caret.co-icon-button--xl{width:calc(80px + 8px)}.co-icon-button--caret.co-icon-button--lg{width:calc(64px + 8px)}.co-icon-button--caret.co-icon-button--md{width:calc(56px + 8px)}.co-icon-button--caret.co-icon-button--sm{width:calc(48px + 8px)}.co-icon-button--caret.co-icon-button--xs{width:calc(32px + 8px)}.co-icon-button--caret.co-icon-button--xxs{width:calc(24px + 8px)}.co-icon-button--disabled,.co-icon-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-icon-button:hover:not(:disabled){opacity:0.88}.co-icon-button:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus)}.co-icon-button--dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-surface-dark-ink, var(--co-color-base-blanco, #fff)) 45%, transparent)}.co-icon-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}@supports not (background: color-mix(in srgb, red, transparent)){.co-icon-button--filled{background:var(--co-semantic-surface-primary)}.co-icon-button--outlined{background:var(--co-icon-button-bg, var(--co-semantic-surface-secondary))}}.co-icon-button__swap{display:inline-grid}.co-icon-button__swap>co-icon{grid-area:1 / 1;transition:opacity var(--co-motion-duration-base) var(--co-motion-ease-in-out),     transform var(--co-motion-duration-base) var(--co-motion-ease-in-out),     filter var(--co-motion-duration-base) var(--co-motion-ease-in-out)}.co-icon-button__swap>co-icon:last-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:first-child{opacity:0;transform:scale(0.25);filter:blur(var(--co-motion-blur-sm))}.co-icon-button__swap--toggled>co-icon:last-child{opacity:1;transform:scale(1);filter:blur(0)}`;
 
 const CoIconButton = class {
     constructor(hostRef) {
@@ -85,7 +85,7 @@ const CoIconButton = class {
         const usesSlot = !this.icon;
         const style = usesSlot
             ? Object.assign(Object.assign({}, (boxStyle !== null && boxStyle !== void 0 ? boxStyle : {})), { '--co-icon-button-glyph-size': `${resolvedIconSize}px` }) : boxStyle;
-        return (h("button", { key: 'd04a7878b984d9613603801b0b18285d02e71f7e', class: {
+        return (h("button", { key: 'c83227eb38cf7d3573e5490c7dff2130402e8a09', class: {
                 'co-icon-button': true,
                 [`co-icon-button--${this.variant}`]: true,
                 [`co-icon-button--${this.shape}`]: true,
@@ -96,7 +96,7 @@ const CoIconButton = class {
                 'co-icon-button--disabled': this.disabled,
             }, style: style, disabled: this.disabled, "aria-label": this.label || (this.toggled && this.toggleIcon ? this.toggleIcon : this.icon), "aria-pressed": this.selected ? 'true' : undefined, part: "button" }, this.icon && this.toggleIcon ? (h("span", { class: { 'co-icon-button__swap': true, 'co-icon-button__swap--toggled': this.toggled }, "aria-hidden": "true" }, h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize }), h("co-icon", { name: this.toggleIcon, weight: this.iconWeight, size: resolvedIconSize }))) : this.icon ? (h("co-icon", { name: this.icon, weight: this.iconWeight, size: resolvedIconSize })) : (
         // Sin `icon`: el consumidor proyecta su propio glifo (ver @slot).
-        h("slot", null)), this.caret && h("co-icon", { key: 'db59eb79e6609b237ed3a642f5c44f2a046a4efe', class: "co-icon-button__caret", name: "caret-down", size: 8 })));
+        h("slot", null)), this.caret && h("co-icon", { key: 'a70e77a1b2c2db11dfa0a0e0f5629c3ea2829754', class: "co-icon-button__caret", name: "caret-down", size: 8 })));
     }
 };
 CoIconButton.style = coIconButtonCss();

package/dist/esm/co-icon.entry.js

@@ -83,12 +83,12 @@ const CoIcon = class {
         this.svgContent = await loadSvg(this.name, this.weight);
     }
     render() {
-        return (h(Host, { key: 'e6f8302d22e1fbeac4e82d199b9214063c7b2313', "aria-hidden": "true", style: {
+        return (h(Host, { key: '571cfcec3bd5dbc68b0d773278d243163441334b', "aria-hidden": "true", style: {
                 display: 'inline-flex',
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 flexShrink: '0',
-            } }, h("span", { key: '7967a0787112955036f6f88231a2a635e647e218', part: "svg", innerHTML: this.svgContent })));
+            } }, h("span", { key: 'fe079b6aa1813517cd27b88ba5855f57f260de94', part: "svg", innerHTML: this.svgContent })));
     }
     static get watchers() { return {
         "name": [{

package/dist/esm/co-input.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DJkaRtbb.js';
 import { R as RequiredMark } from './requiredMark-D5C5NzOE.js';
 
-const coInputCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-input{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-input__label{white-space:normal}:host([layout='horizontal']) .co-input>:not(.co-input__labels){grid-column:2;min-width:0}.co-input__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-input__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-input__secondary-label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;text-align:right}.co-input__field-row{display:flex;align-items:stretch}.co-input__field{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);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:40px;box-sizing:border-box;overflow:hidden;flex:1;min-width:0}.co-input--flat .co-input__field{background:transparent;border-color:transparent}.co-input--soft .co-input__field{background:var(--co-semantic-surface-control, #f6f6f6);border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--co-semantic-text-default)}.co-input--s .co-input__field{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-input--sm .co-input__field{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-input--lg .co-input__field{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-input--has-action .co-input__field{border-radius:var(--co-border-radius-xs) 0 0 var(--co-border-radius-xs);border-right:none}.co-input__field ::slotted([slot="action"]){margin-left:auto;margin-right:calc(-1 * var(--co-spacing-md));margin-top:calc(-1 * var(--co-spacing-sm2));margin-bottom:calc(-1 * var(--co-spacing-sm2));border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;flex-shrink:0}.co-input__field ::slotted([slot="chips"]){display:flex;gap:var(--co-spacing-xxs);align-items:center;flex-wrap:wrap;min-width:0}.co-input__input-wrapper{flex:1;display:flex;align-items:center;min-width:0;min-height:22px;padding:0}.co-input__native{width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:inherit;font-weight:400;letter-spacing:inherit;line-height:1;color:var(--co-semantic-text-default);padding:0;margin:0}.co-input__native::placeholder{color:var(--co-semantic-text-muted)}.co-input__native[type='number']::-webkit-inner-spin-button,.co-input__native[type='number']::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.co-input__native[type='number']{-moz-appearance:textfield;appearance:textfield}.co-input__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-input__clear--hidden{visibility:hidden;pointer-events:none}.co-input__clear:hover{color:var(--co-semantic-text-default)}.co-input__action{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md) var(--co-spacing-sm2) var(--co-spacing-sm2);background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none;border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;cursor:pointer;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box}.co-input__action:hover{opacity:0.85}.co-input__action:disabled{opacity:0.4;cursor:not-allowed}.co-input__action-icon{display:flex;align-items:center;flex-shrink:0}.co-input__action-label{display:flex;align-items:center}.co-input__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-input__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-input--focused .co-input__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-input--disabled .co-input__labels .co-input__label,.co-input--disabled .co-input__labels .co-input__secondary-label{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__field{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-input--disabled .co-input__native{color:var(--co-semantic-text-disabled);cursor:not-allowed}.co-input--disabled .co-input__native::placeholder{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__icon{color:var(--co-semantic-text-disabled)}.co-input__status-icon{flex-shrink:0;display:flex;align-items:center}.co-input--success .co-input__status-icon{color:var(--co-semantic-status-success)}.co-input--error .co-input__status-icon{color:var(--co-semantic-status-error)}.co-input--warning .co-input__status-icon{color:var(--co-color-status-review)}.co-input--info .co-input__status-icon{color:var(--co-semantic-status-info)}.co-input--error .co-input__field{border-color:var(--co-semantic-status-error)}.co-input--error.co-input--focused .co-input__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-input__helper--error .co-input__helper-icon,.co-input__helper--error .co-input__helper-text{color:var(--co-semantic-status-error)}.co-input--shake .co-input__field{animation:co-input-shake calc(var(--co-motion-duration-instant) * 3.5) var(--co-motion-ease-out) both}@keyframes co-input-shake{0%{transform:translateX(0);animation-timing-function:var(--co-motion-ease-out)}28.57%{transform:translateX(-6px);animation-timing-function:var(--co-motion-ease-out)}57.14%{transform:translateX(6px);animation-timing-function:var(--co-motion-ease-out)}78.57%{transform:translateX(-4px);animation-timing-function:var(--co-motion-ease-out)}100%{transform:translateX(0)}}.co-input--success .co-input__field{border-color:var(--co-semantic-status-success)}.co-input--success.co-input--focused .co-input__field{border-color:var(--co-semantic-status-success);box-shadow:0 0 0 2px rgba(10, 119, 36, 0.12)}.co-input__helper--success .co-input__helper-icon,.co-input__helper--success .co-input__helper-text{color:var(--co-semantic-status-success)}.co-input--warning .co-input__field{border-color:var(--co-color-status-review)}.co-input--warning.co-input--focused .co-input__field{border-color:var(--co-color-status-review);box-shadow:0 0 0 2px rgba(133, 87, 31, 0.12)}.co-input__helper--warning .co-input__helper-icon,.co-input__helper--warning .co-input__helper-text{color:var(--co-color-status-review)}.co-input--info .co-input__field{border-color:var(--co-semantic-status-info)}.co-input--info.co-input--focused .co-input__field{border-color:var(--co-semantic-status-info);box-shadow:0 0 0 2px rgba(45, 108, 197, 0.12)}.co-input__helper--info .co-input__helper-icon,.co-input__helper--info .co-input__helper-text{color:var(--co-semantic-status-info)}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}@supports not (background: color-mix(in srgb, red, transparent)){.co-input__field{background:var(--co-semantic-surface-secondary)}}.co-input--fill .co-input__field{background:var(--co-color-gray-100, #f6f6f6);border:none;box-shadow:none;border-radius:10px;padding:0 12px;gap:var(--co-spacing-sm2);min-height:46px;font-size:13.5px;-webkit-backdrop-filter:none;backdrop-filter:none}.co-input--fill.co-input--s .co-input__field{min-height:38px}.co-input--fill.co-input--sm .co-input__field{min-height:42px}.co-input--fill.co-input--lg .co-input__field{min-height:52px}.co-input--fill .co-input__native{font-size:13.5px;font-family:var(--co-font-family-primary);letter-spacing:var(--co-font-letter-spacing-body)}.co-input--fill .co-input__native::placeholder{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__icon{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__clear{color:var(--co-color-gray-400, #a0a0a0)}.co-input--fill .co-input__clear:hover{color:var(--co-color-gray-600, #585858)}.co-input--fill.co-input--focused .co-input__field{border-color:transparent;box-shadow:none}.co-input--xs .co-input__field{min-height:24px;padding:0 var(--co-spacing-md);font-size:var(--co-font-size-12);border-radius:var(--co-border-radius-xxs);gap:var(--co-spacing-sm)}.co-input--soft.co-input--disabled .co-input__field{background:var(--co-semantic-surface-control, #f6f6f6);border-color:transparent}.co-input--soft.co-input--disabled .co-input__field>.co-input__icon,.co-input--soft.co-input--disabled .co-input__field>.co-input__input-wrapper,.co-input--soft.co-input--disabled .co-input__field>.co-input__clear,.co-input--soft.co-input--disabled .co-input__field>.co-input__status-icon,.co-input--soft.co-input--disabled .co-input__field ::slotted(:not([slot="prefix"])){opacity:0.35}.co-input__input-wrapper{gap:var(--co-spacing-xs)}.co-input__input-wrapper ::slotted([slot="prefix"]){display:flex;align-items:center;flex-shrink:0;color:var(--co-semantic-text-muted)}.co-input--xs .co-input__input-wrapper ::slotted([slot="prefix"]){font-size:var(--co-font-size-12);font-weight:400;color:var(--co-color-gray-600, #585858)}.co-input__field ::slotted([slot="suffix"]){color:var(--co-input-suffix-color, inherit)}.co-input--xs .co-input__field ::slotted([slot="suffix"]){font-size:var(--co-font-size-12)}`;
+const coInputCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-input{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-input__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-input__label{white-space:normal}:host([layout='horizontal']) .co-input>:not(.co-input__labels){grid-column:2;min-width:0}.co-input__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-input__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-input__secondary-label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;text-align:right}.co-input__field-row{display:flex;align-items:stretch}.co-input__field{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);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:40px;box-sizing:border-box;overflow:hidden;flex:1;min-width:0}.co-input--flat .co-input__field{background:transparent;border-color:transparent}.co-input--soft .co-input__field{background:var(--co-semantic-surface-control, #f6f6f6);border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--co-semantic-text-default)}.co-input--s .co-input__field{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-input--sm .co-input__field{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-input--lg .co-input__field{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-input--has-action .co-input__field{border-radius:var(--co-border-radius-xs) 0 0 var(--co-border-radius-xs);border-right:none}.co-input__field ::slotted([slot="action"]){margin-left:auto;margin-right:calc(-1 * var(--co-spacing-md));margin-top:calc(-1 * var(--co-spacing-sm2));margin-bottom:calc(-1 * var(--co-spacing-sm2));border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;flex-shrink:0}.co-input__field ::slotted([slot="chips"]){display:flex;gap:var(--co-spacing-xxs);align-items:center;flex-wrap:wrap;min-width:0}.co-input__input-wrapper{flex:1;display:flex;align-items:center;min-width:0;min-height:22px;padding:0}.co-input__native{width:100%;border:none;outline:none;background:transparent;font-family:inherit;font-size:inherit;font-weight:400;letter-spacing:inherit;line-height:1;color:var(--co-semantic-text-default);padding:0;margin:0}.co-input__native::placeholder{color:var(--co-semantic-text-muted)}.co-input__native[type='number']::-webkit-inner-spin-button,.co-input__native[type='number']::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.co-input__native[type='number']{-moz-appearance:textfield;appearance:textfield}.co-input__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__clear{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-input__clear--hidden{visibility:hidden;pointer-events:none}.co-input__clear:hover{color:var(--co-semantic-text-default)}.co-input__action{display:flex;align-items:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none;border-radius:0 var(--co-border-radius-xs) var(--co-border-radius-xs) 0;cursor:pointer;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;flex-shrink:0;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box}.co-input__action:hover{opacity:0.85}.co-input__action:disabled{opacity:0.4;cursor:not-allowed}.co-input__action-icon{display:flex;align-items:center;flex-shrink:0}.co-input__action-label{display:flex;align-items:center}.co-input--s .co-input__action{padding-inline:var(--co-spacing-sm2)}.co-input--sm .co-input__action{padding-inline:var(--co-spacing-sm2)}.co-input--lg .co-input__action{padding-inline:var(--co-spacing-lg)}.co-input__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-input__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-input__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-input--focused .co-input__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-input--disabled .co-input__labels .co-input__label,.co-input--disabled .co-input__labels .co-input__secondary-label{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__field{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-input--disabled .co-input__native{color:var(--co-semantic-text-disabled);cursor:not-allowed}.co-input--disabled .co-input__native::placeholder{color:var(--co-semantic-text-disabled)}.co-input--disabled .co-input__icon{color:var(--co-semantic-text-disabled)}.co-input__status-icon{flex-shrink:0;display:flex;align-items:center}.co-input--success .co-input__status-icon{color:var(--co-semantic-text-success, var(--co-semantic-status-success))}.co-input--error .co-input__status-icon{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}.co-input--warning .co-input__status-icon{color:var(--co-semantic-text-warning, var(--co-color-status-review))}.co-input--info .co-input__status-icon{color:var(--co-semantic-text-info, var(--co-semantic-status-info))}.co-input--error .co-input__field{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error))}.co-input--error.co-input--focused .co-input__field{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error));box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-error, var(--co-semantic-status-error)) 12%, transparent)}.co-input__helper--error .co-input__helper-icon,.co-input__helper--error .co-input__helper-text{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}.co-input--shake .co-input__field{animation:co-input-shake calc(var(--co-motion-duration-instant) * 3.5) var(--co-motion-ease-out) both}@keyframes co-input-shake{0%{transform:translateX(0);animation-timing-function:var(--co-motion-ease-out)}28.57%{transform:translateX(-6px);animation-timing-function:var(--co-motion-ease-out)}57.14%{transform:translateX(6px);animation-timing-function:var(--co-motion-ease-out)}78.57%{transform:translateX(-4px);animation-timing-function:var(--co-motion-ease-out)}100%{transform:translateX(0)}}.co-input--success .co-input__field{border-color:var(--co-semantic-status-success)}.co-input--success.co-input--focused .co-input__field{border-color:var(--co-semantic-status-success);box-shadow:0 0 0 2px rgba(10, 119, 36, 0.12)}.co-input__helper--success .co-input__helper-icon,.co-input__helper--success .co-input__helper-text{color:var(--co-semantic-text-success, var(--co-semantic-status-success))}.co-input--warning .co-input__field{border-color:var(--co-color-status-review)}.co-input--warning.co-input--focused .co-input__field{border-color:var(--co-color-status-review);box-shadow:0 0 0 2px rgba(133, 87, 31, 0.12)}.co-input__helper--warning .co-input__helper-icon,.co-input__helper--warning .co-input__helper-text{color:var(--co-semantic-text-warning, var(--co-color-status-review))}.co-input--info .co-input__field{border-color:var(--co-semantic-status-info)}.co-input--info.co-input--focused .co-input__field{border-color:var(--co-semantic-status-info);box-shadow:0 0 0 2px rgba(45, 108, 197, 0.12)}.co-input__helper--info .co-input__helper-icon,.co-input__helper--info .co-input__helper-text{color:var(--co-semantic-text-info, var(--co-semantic-status-info))}.co-field-required{margin-left:2px;color:var(--co-semantic-text-error, var(--co-color-status-error))}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}@supports not (background: color-mix(in srgb, red, transparent)){.co-input__field{background:var(--co-semantic-surface-secondary)}}.co-input--fill .co-input__field{background:var(--co-semantic-surface-control, #f6f6f6);border:none;box-shadow:none;border-radius:10px;padding:0 12px;gap:var(--co-spacing-sm2);min-height:46px;font-size:13.5px;-webkit-backdrop-filter:none;backdrop-filter:none}.co-input--fill.co-input--s .co-input__field{min-height:38px}.co-input--fill.co-input--sm .co-input__field{min-height:42px}.co-input--fill.co-input--lg .co-input__field{min-height:52px}.co-input--fill .co-input__native{font-size:13.5px;font-family:var(--co-font-family-primary);letter-spacing:var(--co-font-letter-spacing-body)}.co-input--fill .co-input__native::placeholder{color:var(--co-semantic-text-muted, #888888)}.co-input--fill .co-input__icon{color:var(--co-semantic-text-muted, #888888)}.co-input--fill .co-input__clear{color:var(--co-semantic-text-muted, #888888)}.co-input--fill .co-input__clear:hover{color:var(--co-semantic-text-secondary, #585858)}.co-input--fill.co-input--focused .co-input__field{border-color:transparent;box-shadow:none}.co-input--xs .co-input__field{min-height:24px;padding:0 var(--co-spacing-md);font-size:var(--co-font-size-12);border-radius:var(--co-border-radius-xxs);gap:var(--co-spacing-sm)}.co-input--soft.co-input--disabled .co-input__field{background:var(--co-semantic-surface-control, #f6f6f6);border-color:transparent}.co-input--soft.co-input--disabled .co-input__field>.co-input__icon,.co-input--soft.co-input--disabled .co-input__field>.co-input__input-wrapper,.co-input--soft.co-input--disabled .co-input__field>.co-input__clear,.co-input--soft.co-input--disabled .co-input__field>.co-input__status-icon,.co-input--soft.co-input--disabled .co-input__field ::slotted(:not([slot="prefix"])){opacity:0.35}.co-input__input-wrapper{gap:var(--co-spacing-xs)}.co-input__input-wrapper ::slotted([slot="prefix"]){display:flex;align-items:center;flex-shrink:0;color:var(--co-semantic-text-muted)}.co-input--xs .co-input__input-wrapper ::slotted([slot="prefix"]){font-size:var(--co-font-size-12);font-weight:400;color:var(--co-semantic-text-secondary, #585858)}.co-input__field ::slotted([slot="suffix"]){color:var(--co-input-suffix-color, inherit)}.co-input--xs .co-input__field ::slotted([slot="suffix"]){font-size:var(--co-font-size-12)}`;
 
 const CoInput = class {
     constructor(hostRef) {

package/dist/esm/co-json-field.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DJkaRtbb.js';
 import { R as RequiredMark } from './requiredMark-D5C5NzOE.js';
 
-const coJsonFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-json-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-json-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-json-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-json-field__field{display:flex;background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);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);box-sizing:border-box;overflow:hidden}.co-json-field__native{width:100%;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--co-font-family-mono, monospace);font-size:var(--co-font-size-13, 13px);font-weight:400;line-height:1.5;color:var(--co-semantic-text-default);padding:var(--co-spacing-sm2) var(--co-spacing-md);margin:0;box-sizing:border-box;tab-size:2}.co-json-field__native::placeholder{color:var(--co-semantic-text-muted)}.co-json-field--s .co-json-field__native{padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12, 12px)}.co-json-field--sm .co-json-field__native{padding:var(--co-spacing-xs) var(--co-spacing-sm)}.co-json-field--lg .co-json-field__native{padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-14)}.co-json-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-json-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-json-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-json-field--disabled{opacity:0.6;pointer-events:none}.co-json-field--disabled .co-json-field__field{background:var(--co-semantic-surface-disabled);border-color:transparent}.co-json-field--invalid .co-json-field__field,.co-json-field--error .co-json-field__field{border-color:var(--co-semantic-status-error)}.co-json-field--invalid.co-json-field--focused .co-json-field__field,.co-json-field--error.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-json-field__helper--error .co-json-field__helper-icon,.co-json-field__helper--error .co-json-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-json-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-json-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-json-field__label{white-space:normal}:host([layout='horizontal']) .co-json-field>:not(.co-json-field__labels){grid-column:2;min-width:0}`;
+const coJsonFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-json-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-json-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-json-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-semantic-text-error, var(--co-color-status-error))}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-json-field__field{display:flex;background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);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);box-sizing:border-box;overflow:hidden}.co-json-field__native{width:100%;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--co-font-family-mono, monospace);font-size:var(--co-font-size-13, 13px);font-weight:400;line-height:1.5;color:var(--co-semantic-text-default);padding:var(--co-spacing-sm2) var(--co-spacing-md);margin:0;box-sizing:border-box;tab-size:2}.co-json-field__native::placeholder{color:var(--co-semantic-text-muted)}.co-json-field--s .co-json-field__native{padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12, 12px)}.co-json-field--sm .co-json-field__native{padding:var(--co-spacing-xs) var(--co-spacing-sm)}.co-json-field--lg .co-json-field__native{padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-14)}.co-json-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-json-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-json-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-json-field--disabled{opacity:0.6;pointer-events:none}.co-json-field--disabled .co-json-field__field{background:var(--co-semantic-surface-disabled);border-color:transparent}.co-json-field--invalid .co-json-field__field,.co-json-field--error .co-json-field__field{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error))}.co-json-field--invalid.co-json-field--focused .co-json-field__field,.co-json-field--error.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-border-error, var(--co-semantic-status-error));box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-error, var(--co-semantic-status-error)) 12%, transparent)}.co-json-field__helper--error .co-json-field__helper-icon,.co-json-field__helper--error .co-json-field__helper-text{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}:host([layout='horizontal']) .co-json-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-json-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-json-field__label{white-space:normal}:host([layout='horizontal']) .co-json-field>:not(.co-json-field__labels){grid-column:2;min-width:0}`;
 
 const CoJsonField = class {
     constructor(hostRef) {
@@ -92,17 +92,17 @@ const CoJsonField = class {
     render() {
         const helper = this.internalInvalid ? this.invalidMessage : this.helperText;
         const statusClass = this.status !== 'default' ? `co-json-field--${this.status}` : '';
-        return (h("div", { key: '116c07e036c670e20dd461a907a3bc46e0120b74', class: {
+        return (h("div", { key: '3488016fe7b45678a0925275fd240b29107733e4', 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: 'aecaf5025db4a5fe4030e513b57df1b98121b62e', class: "co-json-field__labels" }, h("label", { key: '2f23f19d1fa5cd9f324c67a6fe93ac3d5df98c66', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'cf1dad000ccfd9de7598c2891413f2564d5e3f6e', required: this.required })))), h("div", { key: '0c43c4df775b1a854f10db5a0531d5e0817a916c', class: "co-json-field__field", part: "field" }, h("textarea", { key: 'f9472a1dbc02388214d0c51277dcc838289e2b79', 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: '6c365c240716d857fc026e4c58c08c59722b95f9', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: 'e97c531fbd3a1c3dbec67d0de3f90ba632fe64cb', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '46cac96bd27c532528d00ed9178dcd52c76b1fce', class: "co-json-field__labels" }, h("label", { key: '7ea63ec78e2c9637c5be2c9737f62e612473d567', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'e0a6da86cfde978e7e1ae6bfd1a834967b6bb829', required: this.required })))), h("div", { key: '78e11d6f221bfe35bab6299be7c1f7c97bc3a05a', class: "co-json-field__field", part: "field" }, h("textarea", { key: '70eda7639839b0f83c85db5a6d40da2a0eb07ebf', 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: '6f0517a5284ac3eea2c6788cb0c64c630e6527d3', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: 'ff13e6ce9172d5c45230e0bc1d3231a232db1214', class: {
                 'co-json-field__helper': true,
                 'co-json-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'ae9751723abb04b19127d93a4fd798f5e03e8b90', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: '8d44b589ba7d923476e7fd94f572d04452585977', class: "co-json-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '2db231d921b67b6c6ff7fd058e6903f6ffd99977', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: 'af3dc5badb989c19bfaf960a09a63efff2f59308', class: "co-json-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {