@prolibu-suite/cobalt-core 0.7.0 → 0.8.0

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

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h } from './index-BCEz3S-z.js';
-import { g as getDateStrings } from './dateI18n-C1DCLOEl.js';
-import { a as todayYMD, d as addDays, p as parseISO, g as getMonthMatrix, b as addMonths, e as getMonthLabel } from './dates-tPYikBRJ.js';
-import { t as toEpoch, a as toUtcISO, g as getLocalTimeZone } from './tz-B6JZk8fL.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BCEz3S-z.js';
+import { g as getDateStrings } from './dateI18n-CnNpoKwg.js';
+import { a as todayYMD, d as addDays, p as parseISO, g as getMonthMatrix, b as addMonths, e as getMonthLabel } from './dates-BU7SQCje.js';
+import { b as toEpoch, t as toUtcISO, g as getLocalTimeZone } from './tz-1EK-COrb.js';
 
 /**
  * model.ts — the calendar event model and its normalization.
@@ -102,6 +102,7 @@ function normalizeEvent(raw, options = {}) {
         startMs,
         endMs,
         status: raw.status,
+        responseState: raw.responseState,
         backgroundColor,
         borderColor,
         className: raw.className,
@@ -125,7 +126,7 @@ function normalizeEvents(raw, options = {}) {
     return out;
 }
 
-const coEventCalendarCss = () => `:host{display:flex;flex-direction:column;gap:var(--co-spacing-md);font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);block-size:100%;min-block-size:0}.cal{display:flex;flex-direction:column;gap:var(--co-spacing-md);block-size:100%;min-block-size:0}.cal__toolbar{display:flex;align-items:center;gap:var(--co-spacing-md)}.cal__nav-group{display:inline-flex;align-items:center;gap:var(--co-spacing-xs)}.cal__title{flex:1 1 auto;margin:0;text-align:center;font-size:var(--co-font-size-16, 16px);font-weight:600;text-transform:capitalize;color:var(--co-semantic-text-default)}.cal__views-spacer{flex:0 0 auto;inline-size:1px}.cal__btn{height:32px;padding:0 var(--co-spacing-md);background:none;border:1px solid var(--co-semantic-border-default);border-radius:var(--co-border-radius-xs);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__btn:hover{background:var(--co-semantic-surface-hover)}.cal__btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__icon-btn{height:32px;width:32px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;border-radius:var(--co-border-radius-xs);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__icon-btn:hover{background:var(--co-semantic-surface-hover)}.cal__icon-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__views{display:inline-flex;gap:2px;padding:2px;background:var(--co-semantic-surface-hover);border-radius:var(--co-border-radius-xs)}.cal__view-btn{height:28px;padding:0 var(--co-spacing-md);background:none;border:0;border-radius:var(--co-border-radius-xxs);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-secondary);cursor:pointer;text-transform:capitalize}.cal__view-btn--active{background:var(--co-semantic-surface-page);color:var(--co-semantic-text-default);font-weight:600;box-shadow:0 1px 2px rgba(0, 0, 0, 0.08)}.cal__view-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__body{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column}.cal__body co-calendar-month{flex:1 1 auto;min-block-size:0}.cal__placeholder{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm);color:var(--co-semantic-text-muted);text-transform:capitalize}`;
+const coEventCalendarCss = () => `:host{display:flex;flex-direction:column;gap:var(--co-spacing-md);font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);block-size:100%;min-block-size:0}.cal{display:flex;flex-direction:column;gap:var(--co-spacing-md);block-size:100%;min-block-size:0}.cal__toolbar{display:flex;align-items:center;gap:var(--co-spacing-md)}.cal__title-group{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-xs)}.cal__title{margin:0;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--co-font-size-20, 20px);font-weight:400;letter-spacing:-0.01em;text-transform:capitalize;color:var(--co-semantic-text-default)}.cal__views-spacer{flex:0 0 auto;inline-size:1px}.cal__btn{height:32px;padding:0 var(--co-spacing-md);background:none;border:1px solid var(--co-semantic-border-default);border-radius:var(--co-border-radius-full);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__btn:hover{background:var(--co-semantic-surface-hover)}.cal__btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__icon-btn{height:32px;width:32px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;border-radius:var(--co-border-radius-xs);color:var(--co-semantic-text-default);cursor:pointer;transition:background 0.1s ease}.cal__icon-btn:hover{background:var(--co-semantic-surface-hover)}.cal__icon-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__views{display:inline-flex;gap:2px;padding:2px;background:var(--co-semantic-surface-hover);border-radius:var(--co-border-radius-xs)}.cal__view-btn{height:28px;padding:0 var(--co-spacing-md);background:none;border:0;border-radius:var(--co-border-radius-xxs);font-family:inherit;font-size:var(--co-font-size-14, 14px);color:var(--co-semantic-text-secondary);cursor:pointer;text-transform:capitalize}.cal__view-btn--active{background:var(--co-semantic-surface-page);color:var(--co-semantic-text-default);font-weight:600;box-shadow:0 1px 2px rgba(0, 0, 0, 0.08)}.cal__view-btn:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal__body{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column}.cal__body co-calendar-month{flex:1 1 auto;min-block-size:0}.cal__body co-calendar-timegrid{flex:1 1 auto;min-block-size:0}.cal__placeholder{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-sm);color:var(--co-semantic-text-muted);text-transform:capitalize}`;
 
 const CoEventCalendar = class {
     constructor(hostRef) {
@@ -133,10 +134,11 @@ const CoEventCalendar = class {
         this.coEventClick = createEvent(this, "coEventClick", 3);
         this.coDateSelect = createEvent(this, "coDateSelect", 3);
         this.coEventDrop = createEvent(this, "coEventDrop", 3);
+        this.coEventDblClick = createEvent(this, "coEventDblClick", 3);
         this.coDatesSet = createEvent(this, "coDatesSet", 3);
         this.coViewChange = createEvent(this, "coViewChange", 3);
         this.coMoreClick = createEvent(this, "coMoreClick", 3);
-        /** Active view. Phase 1 ships `month`; week/day/agenda land in later phases. */
+        /** Active view. `month`/`week`/`day` are implemented; `agenda` is pending. */
         this.view = 'month';
         /** Events: an array or a JSON string (raw-HTML use). */
         this.events = [];
@@ -154,18 +156,52 @@ const CoEventCalendar = class {
         this.availableViews = ['month'];
         /** Default minutes for a timed event missing an end. */
         this.defaultDurationMinutes = 60;
+        /** Show the all-day lane in week/day views. */
+        this.allDaySlot = true;
+        /** Visible-hours window for week/day (minutes-of-day bounds as "HH:mm"). */
+        this.minTime = '00:00';
+        this.maxTime = '24:00';
+        /** Slot/snap granularity (minutes) for week/day. */
+        this.slotMinutes = 15;
+        this.snapMinutes = 15;
+        /** Initial scroll position for week/day ("HH:mm"). */
+        this.scrollTime = '07:00';
+        /** Show the current-time indicator in week/day. */
+        this.nowIndicator = true;
+        /** Cargando eventos: se propaga a la grilla (mes/timegrid), que reemplaza
+         *  SUS chips por bloques skeleton y conserva toda su estructura — bordes,
+         *  cabecera de días, eje de horas. El toolbar sigue operable y nada se
+         *  desmonta, así no se pierde el scroll de semana/día. */
+        this.loading = false;
         this.goToday = () => this.setAnchor(todayYMD());
         this.goPrev = () => this.step(-1);
         this.goNext = () => this.step(1);
-        // ── Month delegation handlers ───────────────────────────────────────────
+        // ── View delegation handlers ─────────────────────────────────────────────
         this.handleDaySelect = (e) => {
+            var _a;
             const date = e.detail.date;
-            this.coDateSelect.emit({ start: date, end: addDays(date, 1), allDay: true });
+            this.coDateSelect.emit({ start: date, end: addDays(date, 1), allDay: true, rect: (_a = e.detail.rect) !== null && _a !== void 0 ? _a : null });
+        };
+        this.handleRangeSelect = (e) => {
+            var _a;
+            this.coDateSelect.emit({
+                start: e.detail.start,
+                end: e.detail.end,
+                allDay: false,
+                rect: (_a = e.detail.rect) !== null && _a !== void 0 ? _a : null,
+            });
         };
         this.handleEventClick = (e) => {
+            var _a;
             const ev = this.normalized.find((x) => x.id === e.detail.id);
             if (ev)
-                this.coEventClick.emit({ event: ev });
+                this.coEventClick.emit({ event: ev, rect: (_a = e.detail.rect) !== null && _a !== void 0 ? _a : null });
+        };
+        this.handleEventDblClick = (e) => {
+            var _a;
+            const ev = this.normalized.find((x) => x.id === e.detail.id);
+            if (ev)
+                this.coEventDblClick.emit({ event: ev, rect: (_a = e.detail.rect) !== null && _a !== void 0 ? _a : null });
         };
         this.handleEventDrop = (e) => {
             const ev = this.normalized.find((x) => x.id === e.detail.id);
@@ -193,6 +229,13 @@ const CoEventCalendar = class {
             this.coMoreClick.emit({ date, events });
         };
     }
+    /** Limpia el resaltado persistente de selección de la vista activa (timegrid
+     * o month) — lo llama el host al cerrar su bubble/form de creación. */
+    async clearRangeSelection() {
+        var _a, _b;
+        const view = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('co-calendar-timegrid, co-calendar-month');
+        await ((_b = view === null || view === void 0 ? void 0 : view.clearSelection) === null || _b === void 0 ? void 0 : _b.call(view));
+    }
     componentWillLoad() {
         this.anchor = this.date && parseISO(this.date) ? this.date : todayYMD();
     }
@@ -209,20 +252,60 @@ const CoEventCalendar = class {
         return this.timeZone || getLocalTimeZone();
     }
     get normalized() {
+        const c = this._normCache;
+        if (c &&
+            c.events === this.events &&
+            c.dd === this.defaultDurationMinutes &&
+            c.sc === this.statusColors) {
+            return c.result;
+        }
         const raw = parseEventsProp(this.events);
         const opts = {
             defaultDurationMinutes: this.defaultDurationMinutes,
             statusColors: parseStatusColors(this.statusColors),
         };
-        return normalizeEvents(raw, opts);
+        const result = normalizeEvents(raw, opts);
+        this._normCache = {
+            events: this.events,
+            dd: this.defaultDurationMinutes,
+            sc: this.statusColors,
+            result,
+        };
+        return result;
     }
     get viewsList() {
         return Array.isArray(this.availableViews)
             ? this.availableViews
             : String(this.availableViews).split(',').map((s) => s.trim()).filter(Boolean);
     }
-    /** Visible [start, end) of the current month view, as date strings. */
+    /** Sunday=0 UTC day-of-week of a date-only key (tz-independent). */
+    dowOf(dateKey) {
+        const [y, mo, d] = dateKey.split('-').map(Number);
+        return new Date(Date.UTC(y, mo - 1, d)).getUTCDay();
+    }
+    weekStart(dateKey) {
+        const diff = (this.dowOf(dateKey) - this.firstDayOfWeek + 7) % 7;
+        return addDays(dateKey, -diff);
+    }
+    /** Day keys the active view renders: 7 for week, 1 for day, [] for month. */
+    get visibleDates() {
+        if (this.view === 'week') {
+            const start = this.weekStart(this.anchor);
+            return Array.from({ length: 7 }, (_, i) => addDays(start, i));
+        }
+        if (this.view === 'day')
+            return [this.anchor];
+        return [];
+    }
+    /** Visible [start, end) of the active view, as date strings. */
     visibleRange() {
+        if (this.view === 'week') {
+            const start = this.weekStart(this.anchor);
+            return { start, end: addDays(start, 7) };
+        }
+        if (this.view === 'day') {
+            return { start: this.anchor, end: addDays(this.anchor, 1) };
+        }
         const a = parseISO(this.anchor);
         const matrix = getMonthMatrix(a.year, a.month, this.firstDayOfWeek);
         const start = matrix[0][0].value;
@@ -239,12 +322,12 @@ const CoEventCalendar = class {
         this.emitDatesSet();
     }
     step(dir) {
-        if (this.view === 'month') {
+        if (this.view === 'month')
             this.setAnchor(addMonths(this.anchor, dir));
-        }
-        else {
-            this.setAnchor(addDays(this.anchor, dir * 7));
-        }
+        else if (this.view === 'day')
+            this.setAnchor(addDays(this.anchor, dir));
+        else
+            this.setAnchor(addDays(this.anchor, dir * 7)); // week (and agenda fallback)
     }
     switchView(next) {
         if (next === this.view)
@@ -255,18 +338,31 @@ const CoEventCalendar = class {
     }
     title() {
         const a = parseISO(this.anchor);
-        return getMonthLabel(a.year, a.month, this.locale, 'long');
+        if (this.view === 'month')
+            return getMonthLabel(a.year, a.month, this.locale, 'long');
+        if (this.view === 'day') {
+            return new Intl.DateTimeFormat(this.locale, {
+                weekday: 'short', day: 'numeric', month: 'short', year: 'numeric',
+            }).format(utcDate(this.anchor));
+        }
+        // week: "13 – 19 jul 2026"
+        const start = this.weekStart(this.anchor);
+        const end = addDays(start, 6);
+        const fmt = new Intl.DateTimeFormat(this.locale, { day: 'numeric', month: 'short' });
+        const yr = new Intl.DateTimeFormat(this.locale, { year: 'numeric' }).format(utcDate(end));
+        return `${fmt.format(utcDate(start))} – ${fmt.format(utcDate(end))} ${yr}`;
     }
     render() {
         var _a;
         const t = getDateStrings(this.locale);
         const views = this.viewsList;
         const a = parseISO(this.anchor);
-        return (h("div", { key: '4820180047be56115d2b350343c50cd73e3c275c', class: "cal" }, h("div", { key: 'd623a44932b94bef980f35459247b743ee63b656', class: "cal__toolbar", part: "toolbar" }, h("div", { key: 'bd3019ee327752aeef1f8f5c8bcd738adf966861', class: "cal__nav-group" }, h("button", { key: '7e57307890143d11c1d18599025c9204c88c75fa', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("button", { key: '97270e2db26f1d014b4c92f01f68a38881cf9dc5', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: '64ef0715a090303ca38c039b456ead6e30ec79c9', name: "caret-left", size: 16 })), h("button", { key: '4c0e5eb70d51c8c7d74c4f49662395cc63d14c8a', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: 'e83a4ea954f6be95369b7af5c07fb8b3541761ea', name: "caret-right", size: 16 }))), h("h2", { key: '465e8b8aa199bb897d81226da06ad899d3c3467e', class: "cal__title", "aria-live": "polite" }, this.title()), views.length > 1 ? (h("div", { class: "cal__views", role: "tablist" }, views.map((v) => {
+        return (h("div", { key: '12c11a1954cd53034be9717fc5fdd80c4195ae6f', class: "cal" }, h("div", { key: '44e56be42b6ac944983a6ba29e4aba95c67589ab', class: "cal__toolbar", part: "toolbar" }, h("button", { key: '26db9f5e32e604bf6d3f5645b14a92510d224f4c', type: "button", class: "cal__btn", onClick: this.goToday }, (_a = t.today) !== null && _a !== void 0 ? _a : 'Today'), h("div", { key: '40878237f7d076531fa210b0b765087923e0256f', class: "cal__title-group" }, h("button", { key: '59bb0f5d15e834f95f54a7a2575dc097d213d5ce', type: "button", class: "cal__icon-btn", "aria-label": t.prevMonth, onClick: this.goPrev }, h("co-icon", { key: '0db880709e17ab918507bcf9ee0377dd260fbb10', name: "caret-left", size: 16 })), h("h2", { key: '772eb75bb0f749c78da037e0fb918cfa2dd3bc12', class: "cal__title", "aria-live": "polite" }, this.title()), h("button", { key: '3ec51c2cd9485841aee0b7b9145756e1721791e3', type: "button", class: "cal__icon-btn", "aria-label": t.nextMonth, onClick: this.goNext }, h("co-icon", { key: '95d54c3fcd198d16ae8d874afe558480323b993c', 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: '4997eb7d83efa22dab101463c3550e0cee373b89', class: "cal__body", part: "body" }, this.view === 'month' ? (h("co-calendar-month", { 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, onCoEventDrop: this.handleEventDrop, onCoMoreClick: this.handleMoreClick })) : (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: 'c866ef7e6117d662309e57805511a024640fd18d', 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 {
         "date": [{
                 "onDateChange": 0
@@ -311,6 +407,11 @@ function zonedDay(ms, timeZone) {
     }).format(new Date(ms));
     return parts; // en-CA → "YYYY-MM-DD"
 }
+/** UTC Date for a date-only key — safe for Intl formatting (no tz drift). */
+function utcDate(dateKey) {
+    const [y, mo, d] = dateKey.split('-').map(Number);
+    return new Date(Date.UTC(y, mo - 1, d, 12)); // noon UTC avoids any date rollover
+}
 CoEventCalendar.style = coEventCalendarCss();
 
 export { CoEventCalendar as co_event_calendar };

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

@@ -0,0 +1,130 @@
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-BCEz3S-z.js';
+import { c as computePosition } from './positioning-BMdapAL8.js';
+
+const coEventPopoverCss = () => `:host{display:contents}.pop{position:fixed;margin:0;inset:auto;width:400px;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);overflow:auto;background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-default);border-radius:var(--co-border-radius-md, 14px);box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));padding:0;z-index:1000;font-family:var(--co-font-family-primary);color:var(--co-semantic-text-default);animation:co-pop-in 0.15s cubic-bezier(0.05, 0.7, 0.1, 1);outline:none}@media (prefers-reduced-motion: reduce){.pop{animation:none}}@keyframes co-pop-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}.pop__actions{display:flex;justify-content:flex-end;gap:var(--co-spacing-xxs);padding:var(--co-spacing-sm2) var(--co-spacing-sm2) 0}.pop__head{display:flex;gap:var(--co-spacing-md);padding:var(--co-spacing-xs) var(--co-spacing-xl) var(--co-spacing-xl)}.pop__dot{flex:0 0 auto;width:14px;height:14px;border-radius:var(--co-border-radius-xxs);margin-top:5px;background:var(--co-color-primary-azul)}.pop__body{min-width:0;flex:1 1 auto}`;
+
+const CoEventPopover = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.coClose = createEvent(this, "coClose", 3);
+        this.open = false;
+        this.placement = 'right-start';
+        /** Render the leading color dot. Set false for dot-less content (quick-create). */
+        this.dot = true;
+        this.closeOnEscape = true;
+        this.closeOnClickOutside = true;
+        this.position = () => {
+            if (!this.open || !this.panelEl || !this.anchorRect)
+                return;
+            const a = this.anchorRect;
+            const triggerRect = {
+                top: a.top, left: a.left, right: a.left + a.width, bottom: a.top + a.height,
+                width: a.width, height: a.height,
+            };
+            const panelRect = this.panelEl.getBoundingClientRect();
+            const { top, left } = computePosition(triggerRect, panelRect, {
+                placement: this.placement, offset: 8, flip: true,
+            });
+            this.panelEl.style.top = `${top}px`;
+            this.panelEl.style.left = `${left}px`;
+        };
+        // The anchor rect is a point-in-time snapshot: once the page scrolls or resizes
+        // it's stale, and a top-layer panel would stay pinned to a chip that has moved
+        // (or disappeared). Google Calendar closes the popover in that case — match it.
+        this.onScroll = () => {
+            if (this.open)
+                this.requestClose();
+        };
+        this.onKeydown = (e) => {
+            if (!this.open)
+                return;
+            if (this.closeOnEscape && e.key === 'Escape') {
+                e.stopPropagation();
+                this.requestClose();
+            }
+        };
+        this.onPointerDown = (e) => {
+            if (!this.open || !this.closeOnClickOutside || !this.panelEl)
+                return;
+            const path = e.composedPath();
+            if (path.includes(this.panelEl) || path.includes(this.el))
+                return;
+            this.requestClose();
+        };
+    }
+    componentDidLoad() {
+        // Stencil no dispara @Watch para el valor inicial (gotcha conocido del DS).
+        if (this.open)
+            this.onOpenChange(true);
+    }
+    onOpenChange(v) {
+        var _a;
+        if (v) {
+            this.prevFocus = (_a = document.activeElement) !== null && _a !== void 0 ? _a : undefined;
+            requestAnimationFrame(() => this.promoteAndPosition());
+        }
+        else {
+            this.dismissPanel();
+            if (this.prevFocus)
+                this.prevFocus.focus();
+        }
+    }
+    onAnchorChange() {
+        if (this.open)
+            this.position();
+    }
+    disconnectedCallback() {
+        this.teardownListeners();
+    }
+    promoteAndPosition() {
+        var _a, _b;
+        if (!this.open || !this.panelEl)
+            return;
+        // Promote to the top-layer so contain:layout ancestors don't re-anchor us.
+        try {
+            (_b = (_a = this.panelEl).showPopover) === null || _b === void 0 ? void 0 : _b.call(_a);
+        }
+        catch ( /* already shown */_c) { /* already shown */ }
+        this.position();
+        // Dialog-pattern focus: focus the panel itself (tabIndex=-1). Slotted actions
+        // live in light DOM and co-icon-button is shadow — querySelector here can't
+        // reach them; Tab from the panel lands on the first slotted action naturally.
+        this.panelEl.focus();
+        window.addEventListener('resize', this.onScroll);
+        window.addEventListener('scroll', this.onScroll, true);
+        window.addEventListener('keydown', this.onKeydown, true);
+        window.addEventListener('pointerdown', this.onPointerDown, true);
+    }
+    dismissPanel() {
+        var _a, _b;
+        try {
+            (_b = (_a = this.panelEl) === null || _a === void 0 ? void 0 : _a.hidePopover) === null || _b === void 0 ? void 0 : _b.call(_a);
+        }
+        catch ( /* noop */_c) { /* noop */ }
+        this.teardownListeners();
+    }
+    teardownListeners() {
+        window.removeEventListener('resize', this.onScroll);
+        window.removeEventListener('scroll', this.onScroll, true);
+        window.removeEventListener('keydown', this.onKeydown, true);
+        window.removeEventListener('pointerdown', this.onPointerDown, true);
+    }
+    requestClose() {
+        this.coClose.emit();
+    }
+    render() {
+        return (h(Host, { key: 'ac4fad8add6f42cd02cd516f32e0820f1bc7b1c6' }, h("div", { key: 'bd0f4d1adb5d21d329ec5b6dd06c08ef13e86cf4', class: "pop", popover: "manual", role: "dialog", "aria-modal": "false", "aria-label": this.popoverLabel, tabIndex: -1, ref: (el) => (this.panelEl = el) }, h("div", { key: '22599ea7ff5fdc39c38b0546ecc6869f6a6e0036', class: "pop__actions", part: "actions" }, h("slot", { key: 'fd9fd75cce78007b7407be5e7a0ef54f49ce2dcc', name: "actions" })), h("div", { key: '16b5af287977fbab204b69cc94e1591c5db963fb', class: "pop__head" }, this.dot && h("span", { key: '6bb8f39ef10c5a81ee461557e42837f43cd44c20', class: "pop__dot", style: this.color ? { background: this.color } : {} }), h("div", { key: '0dcd02e0da924f914015ada88388ddc1d9732447', class: "pop__body", part: "body" }, h("slot", { key: 'b00ade5c89b5a1e908e9cb463c6b461720609121' }))))));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "open": [{
+                "onOpenChange": 0
+            }],
+        "anchorRect": [{
+                "onAnchorChange": 0
+            }]
+    }; }
+};
+CoEventPopover.style = coEventPopoverCss();
+
+export { CoEventPopover as co_event_popover };

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

@@ -33,7 +33,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: 'e321a7455329a1401504cf93f1761a37d7d45eff', class: {
+        return (h("button", { key: 'ffedc2aea8b7b813b8e646872f4a0814589f80ab', class: {
                 'co-fab': true,
                 [`co-fab--${this.variant}`]: true,
                 [`co-fab--${this.size}`]: true,
@@ -41,7 +41,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: '66a36ba9144cf10b7ad8b4bef6a821ef92257892', name: this.icon, size: iconSize }), this.label && (h("span", { key: 'c01018d61ca455a0d1952082b94ec0e5efd807b8', 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: '34242af8b8de622400507b106e566b8214f53534', name: this.icon, size: iconSize }), this.label && (h("span", { key: '56cd6e22505608ebf909a1c0356ecba5c0bae418', class: "co-fab__label", ref: (el) => (this.labelEl = el) }, this.label))));
     }
     get el() { return getElement(this); }
 };

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

@@ -450,12 +450,12 @@ const CoFileField = class {
         const previews = items.filter((it) => isImage(it) && !this.failedPreviews.has(this.keyFor(it)));
         const canReorder = this.reorderable && this.multiple && !this.disabled && !this.readonly && items.length > 1;
         const capacity = this.capacityHint(s);
-        return (h("div", { key: '6f0c0d55291904a925ddf87b444279443b123414', class: {
+        return (h("div", { key: 'd69adf5472c920d9fda750d390c8d66495c7d912', 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: 'e3d624d4b904358132fcbdcf68c283a6fb1bcabb', class: "co-file-field__labels" }, h("label", { key: 'd96a9d10db3c9eaae4bf5e4d1bc3986f3f111c3c', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '6810c17061391ead3343daf9cd06d71d3b03706c', required: this.required })))), showDropzone && (h("div", { key: 'b910dfaa918f1c6d04d4d817a67100b74b6f156f', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: '3e084a96b7fbd714fa07aeeea09146c3782af2b0', class: "co-file-field__labels" }, h("label", { key: '6618041eec9358983794238014f49ae8ad724d79', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '16aa21951eedafb190180ee40c1cba13230ef128', required: this.required })))), showDropzone && (h("div", { key: '33bfe60be00c270fe9861f0250ffe6e4ddcf820b', 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) => {
@@ -463,7 +463,7 @@ const CoFileField = class {
                     e.preventDefault();
                     this.handleBrowse();
                 }
-            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: 'a2a02be018cc925718943411aa28da509a2a2a96', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: 'bb1879d1397ae93c5da975cbdbe6b7c1c907c490', name: "file-arrow-up", size: 18 }), h("span", { key: 'e4ad56d293a8bfcc082b7b6579dfefd9a02846bc' }, this.uploadButtonText || s.uploadButton)), h("span", { key: 'e9c32bdcd65a3138b08b38e52aa909c82b8d2047', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: '417fa71efaf202fc7a1483e02bca170d35d4bf9f', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: '3697aa6c3ccc065ea9bf999f931bd8efb46ea26f', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'b6cfb211a32883ca0a37a775a8442f1d7a60b1d2', name: "actions" })), h("input", { key: '2c8a8a4c7a5ec3b633d78f3d2194d5457a3c1be3', 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: '793833955268b59bb86366b578558b0a25af3faf', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: 'd4141eed0257861c6640d0c91e4599278591619b', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '22e632b0c0050bab853d481366ae970db13935cf', class: "co-file-field__previews", part: "previews" }, previews.map((item) => (h("button", { class: "co-file-field__preview", part: "preview", type: "button", key: `prev-${this.keyFor(item)}`, title: item.name, "aria-label": s.openPreview, onClick: () => this.handlePreviewOpen(item) }, h("img", { src: item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })))))), h("ul", { key: 'f4ae0f81158f1d69ca0dbde29a2358c13f7dce20', class: "co-file-field__list", part: "list" }, items.map((item) => {
+            }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: '219538469e33b0e5e2a1e26e1591d2b578b548ef', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '5021d06fe31100f7b4c6028a868b707aeb3df0c8', name: "file-arrow-up", size: 18 }), h("span", { key: 'ba785ab9e8cd6173f367ebf0a4320a37fa4b0832' }, this.uploadButtonText || s.uploadButton)), h("span", { key: '1fae290aace7b669b27cd53529ea30c36e009805', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: '999ac1eda129973f4b8710bd252337786e4eb99c', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: 'd2ce4783e5eba96fdf59e998f37411ef0f418458', class: "co-file-field__actions", part: "actions" }, h("slot", { key: '55e22bcaff045708471a2837d1c0345d53a0a748', name: "actions" })), h("input", { key: '773880ce9b881512d03eac3be0465942c6376843', 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: '57164ac1e53062957a99ef182394ae9da7636c3e', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: '91894d7e208c62e0aa9407812bbaf7ad491ca275', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: 'c7f74b97051085770677b6433adb7b54fcf4405d', class: "co-file-field__previews", part: "previews" }, previews.map((item) => (h("button", { class: "co-file-field__preview", part: "preview", type: "button", key: `prev-${this.keyFor(item)}`, title: item.name, "aria-label": s.openPreview, onClick: () => this.handlePreviewOpen(item) }, h("img", { src: item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })))))), h("ul", { key: '4c55ead3dcdff97d502c2f41af86d372712ba478', 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: {
@@ -484,10 +484,10 @@ const CoFileField = class {
                     'co-file-field__action': true,
                     'co-file-field__action--copied': this.copiedKey === key,
                 }, type: "button", tabIndex: -1, title: this.copiedKey === key ? s.copied : s.copyUrl, "aria-label": s.copyUrl, onClick: () => this.handleCopy(item) }, h("co-icon", { name: this.copiedKey === key ? 'check' : 'copy', size: 18 }))), !this.disabled && !this.readonly && (h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, title: s.removeFile, "aria-label": s.removeFile, onClick: () => this.coRemove.emit(key) }, h("co-icon", { name: "trash", size: 18 })))));
-        })))), helper && (h("div", { key: '3c08efc8106a55cb9b52cca4b85a460b03284fbb', class: {
+        })))), helper && (h("div", { key: 'ba03c24a5c7e6e0c774b68af85f60ec2fc4a2f0e', class: {
                 'co-file-field__helper': true,
                 'co-file-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '3e011f947147f1af67cd21222e26cd2ac3860c4a', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '788a4a68794a0474289798cb5c48f75403d06bac', class: "co-file-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'ed936a52670f30b4626a1339ce7e6a246bdb65dd', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '295f5de6a6dda88246441816f636cce156aefbe8', class: "co-file-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
 };

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

@@ -58,7 +58,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: 'dbb3fd6c1a09210ee166cbe08e10f0d96cbdfedf', class: {
+        return (h("span", { key: '5eb049a7b3503d2bc82245403da53bdd7fab0ee5', class: {
                 'co-file-type-tile': true,
                 [`co-file-type-tile--${type}`]: true,
                 'co-file-type-tile--mono': !this.colorTags,
@@ -68,7 +68,7 @@ const CoFileTypeTile = class {
                 borderRadius: `${this.radius}px`,
                 background,
                 color,
-            } }, h("co-icon", { key: '787435edb87ccc8cd435e187613566779a90722a', name: meta.icon, size: iconSize, weight: "fill" })));
+            } }, h("co-icon", { key: 'ebb6d9ea5ffc35daefab825ad26519cb42ce2293', name: meta.icon, size: iconSize, weight: "fill" })));
     }
 };
 CoFileTypeTile.style = coFileTypeTileCss();

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

@@ -16,10 +16,10 @@ const CoHelperText = class {
         };
     }
     render() {
-        return (h("div", { key: 'eebe2fd2d26c909c1523e10d2fa7dfb115cc8bd6', class: {
+        return (h("div", { key: 'e0e318d1f4c3a9f524d11d3a9ad648960d26bb7f', class: {
                 'co-helper-text': true,
                 [`co-helper-text--${this.status}`]: true,
-            }, part: "helper-text" }, h("co-icon", { key: 'b70b0c859fb54e8ca45e5f236620930e1120bb2b', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: 'fa646c0828b21706fabe21b3d20b3c38536308d5', class: "co-helper-text__message" }, h("slot", { key: '9527e9abb17fff628bdc2d5ca729d201ac7915ef' }, this.message))));
+            }, part: "helper-text" }, h("co-icon", { key: 'a65678c3cf9a832ffde08f4f47e09974338745ff', name: this.STATUS_ICON[this.status], size: 14, weight: "fill", class: "co-helper-text__icon" }), h("span", { key: 'c3667f4f4b6e53748d5a90ab2fe12e3fcb9cdb2a', class: "co-helper-text__message" }, h("slot", { key: 'f854e37b266feee82a4b6281070d3ed84555f13c' }, this.message))));
     }
 };
 CoHelperText.style = coHelperTextCss();

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

@@ -45,7 +45,7 @@ const CoIconButton = class {
                     : 'var(--co-border-radius-full)',
             }
             : undefined;
-        return (h("button", { key: '5349ec99f898a9cc19df7a53fc01b3acb37f31f6', class: {
+        return (h("button", { key: '380bc110b581dba4f897ba8c8b733598c9e4f9ca', class: {
                 'co-icon-button': true,
                 [`co-icon-button--${this.variant}`]: true,
                 [`co-icon-button--${this.shape}`]: true,

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

@@ -67,12 +67,12 @@ const CoIcon = class {
         this.svgContent = await loadSvg(this.name, this.weight);
     }
     render() {
-        return (h(Host, { key: 'd4dcafabbc956f3b5e8099fa30092d0d535c5d06', "aria-hidden": "true", style: {
+        return (h(Host, { key: '3d1fa57953812f68ff8a972f85aaf0d3f7b3ea9e', "aria-hidden": "true", style: {
                 display: 'inline-flex',
                 width: `${this.size}px`,
                 height: `${this.size}px`,
                 flexShrink: '0',
-            } }, h("span", { key: 'cd9008987f65922b0c770e1f080dc0a0764d62dd', part: "svg", innerHTML: this.svgContent })));
+            } }, h("span", { key: '07413295bbb15dcbacfaaca47e7a25d28744c71e', part: "svg", innerHTML: this.svgContent })));
     }
     static get watchers() { return {
         "name": [{

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

@@ -87,17 +87,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: 'ce1a39e0f1489b46e9610b060ca652e8896746b9', class: {
+        return (h("div", { key: 'd8b9c23bee6f09946081ce7cb91c1697941087e0', 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: 'e5ec0e7d2f454f1d671ed3929c2b5eb7dc4b8cf9', class: "co-json-field__labels" }, h("label", { key: 'd9961499b8d91c385d9278cbd856e04a44b28940', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: '8ba3b3249e0fa1cb3a1b2946ac6a1b7561d30ef1', required: this.required })))), h("div", { key: 'e6f28cf374cc9ad2714505854572504a59c7258c', class: "co-json-field__field", part: "field" }, h("textarea", { key: 'd380a4c0758152c5e39da71d61f5f81e28c22563', 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: '97f76e4ffd9e8b3242515ca2d2d13b786cd390db', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: '310540578b3a2152a1c3f34b0d2f1a00677b5e76', class: {
+            }, part: "wrapper" }, this.label && (h("div", { key: 'f2ed5ce77d91b1387241a1094d56a75cb23ffe56', class: "co-json-field__labels" }, h("label", { key: 'bb29ba11182753c531d9c32a54312a85c82d79be', class: "co-json-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'f43ada2a1eedea7338022114dcd1a9f3678a2eac', required: this.required })))), h("div", { key: 'c49bbb7fbebfb654bad666d651229fefc4fa1527', class: "co-json-field__field", part: "field" }, h("textarea", { key: 'e79137036d429efa440931e7b46f1d7e72cf8194', 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: 'f84bb6f034b7fe724af92d42b8d19fe6b9e183b1', type: "hidden", name: this.name, value: this.draft }), helper && (h("div", { key: '077147072123742355123df6e56fbbff44b12037', class: {
                 'co-json-field__helper': true,
                 'co-json-field__helper--error': this.isInvalid,
-            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'e604c4e4489ace1f2c189fb532f091f26962b5ff', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: 'eb0567a78a33fd41917c090f6aaccecac49f2519', class: "co-json-field__helper-text" }, helper)))));
+            }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '8ba83b63c2283eb2ce26e43ceed41a7806f7a7b6', name: "warning-circle", size: 14, class: "co-json-field__helper-icon" })), h("span", { key: '7da6904539ed1ae85b2ceac2432824d0b9a7fbe2', class: "co-json-field__helper-text" }, helper)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BCEz3S-z.js';
-import { l as langFromLocale } from './dateI18n-C1DCLOEl.js';
+import { l as langFromLocale } from './dateI18n-CnNpoKwg.js';
 
 /**
  * Built-in UI string dictionary for co-lightbox (aria labels + tooltips).
@@ -339,17 +339,17 @@ const CoLightbox = class {
         const counter = s.counter
             .replace('{i}', String(this.index + 1))
             .replace('{n}', String(imgs.length));
-        return (h("div", { key: 'f29ff8f043b148f1f47fd477e3a12628e292f780', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, popover: "manual", ref: this.syncTopLayer, onClick: this.requestClose }, img && (h("div", { key: '8d258c9fb5f5c7ac7cd17b7195f3f5589030e5fe', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, h("span", { key: 'fa246addb464b12803399c22fd7ecc7d47fdf424', class: "co-lightbox__caption", title: img.alt }, img.alt), h("div", { key: '05e9748c4b561c8f7169c87ab897192427531ac4', class: "co-lightbox__zoom" }, h("button", { key: 'c87d84e63161ff23f1b514f992781ff3ccc9d375', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '80e9bf45f296b0c5ac16d265c19e88969511ccc6', name: "minus", size: 16 })), h("button", { key: 'aaecee75b60643d885376dee92a8773faf989a3a', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), h("button", { key: '4ad7e8d83c933f0563304911facc8ef32ec88556', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '7f5d57def9d10437913bb25f577a475eccf41851', name: "plus", size: 16 }))), h("button", { key: '32d00a606ccdc9b2694d8da797064e4f07b997a6', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, h("co-icon", { key: '492f83405006a9642c9f6dd22e02c04a9b871909', name: "arrow-square-out", size: 16 })), h("button", { key: '14241c12b7f3cb4a07c2c22af2f8316c360c1541', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, h("co-icon", { key: '44a2cdbfd7d79274f06f54663840776c05a95581', name: "x", size: 16 })))), img && (h("div", { key: '20bd42e8d80e481fec492b1cfdcd3fc54ea1e10f', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, h("img", { key: '1ba1c0942f2cd13f7f302777f28d961660c07fa8', class: {
+        return (h("div", { key: '409eeaf562838f77035c1ec68db8de59aa862f5e', class: { 'co-lightbox': true, 'co-lightbox--open': this.open }, part: "overlay", role: "dialog", "aria-modal": "true", "aria-label": img === null || img === void 0 ? void 0 : img.alt, popover: "manual", ref: this.syncTopLayer, onClick: this.requestClose }, img && (h("div", { key: '1e92d6f50ab44b6a70407a2c55acba360c0c66c0', class: "co-lightbox__toolbar", part: "toolbar", onClick: this.stop }, h("span", { key: '0181054cd227183e0b942e1262d42a29125852b5', class: "co-lightbox__caption", title: img.alt }, img.alt), h("div", { key: '97cb4d596a790dc1fe41cda38bdd4b0b4a7d873f', class: "co-lightbox__zoom" }, h("button", { key: '8c37c4b6978b8bfb1ce7a33a52fce30e2d740d4b', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomOut, title: s.zoomOut, onClick: () => this.zoomAt(this.scale / WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '294ee562bfe7be7bb2a181a8411045a4d0c1b684', name: "minus", size: 16 })), h("button", { key: 'f32438655d3a7e81a08196720471212443594d7d', class: "co-lightbox__btn co-lightbox__zoom-value", type: "button", "aria-label": s.zoomReset, title: s.zoomReset, onClick: () => this.resetView() }, Math.round(this.scale * 100), "%"), h("button", { key: 'c82db20eda5ef0bd671f551f24ff96771f30a579', class: "co-lightbox__btn", type: "button", "aria-label": s.zoomIn, title: s.zoomIn, onClick: () => this.zoomAt(this.scale * WHEEL_FACTOR, 0, 0) }, h("co-icon", { key: '855559de89e53c3aa8ae34802fbc04da8a04e28d', name: "plus", size: 16 }))), h("button", { key: '00cbfeec37137ba3a5c86801caf5e41e17a25c57', class: "co-lightbox__btn", type: "button", "aria-label": s.openOriginal, title: s.openOriginal, onClick: this.openOriginal }, h("co-icon", { key: '62f5c52bd92b3470b3940f59e61c4f89fad7e86b', name: "arrow-square-out", size: 16 })), h("button", { key: '800b50c607772142b2229b4a19fe970998a8e886', class: "co-lightbox__btn", part: "close", type: "button", "aria-label": s.close, title: s.close, ref: (el) => (this.closeBtnEl = el), onClick: this.requestClose }, h("co-icon", { key: '9850ddfb8c2aa409fa35ea9f357bbea2ace3aa41', name: "x", size: 16 })))), img && (h("div", { key: '4b669e9c6599a25743ba6d194c80faf1cdbfceec', class: "co-lightbox__stage", ref: (el) => (this.stageEl = el), onWheel: this.handleWheel }, h("img", { key: '34218bfdd2691dc399ed03ca25d64ee81106114c', class: {
                 'co-lightbox__img': true,
                 'co-lightbox__img--zoomed': this.scale > MIN_SCALE,
                 'co-lightbox__img--dragging': this.dragging,
-            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (h("button", { key: '61decb40ac1ee12a1d81d8a4da397860fe7ee116', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
+            }, part: "image", ref: (el) => (this.imgEl = el), src: img.src, alt: img.alt || '', draggable: false, style: { transform: `translate(${this.tx}px, ${this.ty}px) scale(${this.scale})` }, onClick: this.stop, onDblClick: this.handleDblClick, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }))), img && multi && (h("button", { key: 'dc9a8e78cfdf8e220e2173a8960f06a8bdeaea59', class: "co-lightbox__nav co-lightbox__nav--prev", part: "prev", type: "button", "aria-label": s.prevImage, title: s.prevImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(-1);
-            } }, h("co-icon", { key: '340f39ae3b741560bc3dc0eb6296dfa701699438', name: "caret-left", size: 24 }))), img && multi && (h("button", { key: '04cec8b520c3416ce5e38aefda815a18247b79fa', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
+            } }, h("co-icon", { key: '020e87affb9ad79b48ec9d77a7796923127b45b4', name: "caret-left", size: 24 }))), img && multi && (h("button", { key: '5dd82a8b66cc3b2abc4c04483141032a7a07bf2d', class: "co-lightbox__nav co-lightbox__nav--next", part: "next", type: "button", "aria-label": s.nextImage, title: s.nextImage, onClick: (e) => {
                 e.stopPropagation();
                 this.goTo(1);
-            } }, h("co-icon", { key: '1bb15d7437610cfad3003af07849edd8618b04c2', name: "caret-right", size: 24 }))), img && multi && (h("div", { key: '786357f804681f37cc1603e926b33ec3b8b7a76c', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
+            } }, h("co-icon", { key: '85e8aaebc526455e22eb635b2e64f5105730b56e', name: "caret-right", size: 24 }))), img && multi && (h("div", { key: '6976d3bb7f5594e8d40cf01b05cc7611cb6066cb', class: "co-lightbox__counter", part: "counter", onClick: this.stop }, counter))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/co-list-footer.entry.js

@@ -15,7 +15,7 @@ const CoListFooter = class {
         this.handleSecondary = () => this.coSecondary.emit();
     }
     render() {
-        return (h("div", { key: '6b63ecd9bc5ba3a85bb379b825c23c8eac2dcfd6', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (h("button", { key: '2e73e9e4918dbe1d05a13f8cc0989a14d3228fb7', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && h("co-icon", { key: 'a408433a6d0bcf3b732538931e3adde214127ed0', name: this.secondaryIcon, size: 16 }), h("span", { key: 'de1b3807ed56be80732eb3b2867f85287f9833ae' }, this.secondaryLabel))), this.primaryLabel && (h("button", { key: '5d88aea121289757aeee5bf30619322bdd2c3371', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && h("co-icon", { key: 'b5d3ab5e406bdf097bbbfeb182753c103cde81b4', name: this.primaryIcon, size: 16 }), h("span", { key: 'a089130f639fe642d11cbc1a5c80b21de9bbd038' }, this.primaryLabel))), h("slot", { key: 'd821c3e281bd10a66a67ae714f77fba1454214c9' })));
+        return (h("div", { key: '54b813b714dbcdfb535349f6f49c715e53bdadd7', class: "co-list-footer", part: "footer" }, this.secondaryLabel && (h("button", { key: '6fdf4c75f1803532e43b0609fd765aeb79ae3d89', class: "co-list-footer__btn co-list-footer__btn--secondary", type: "button", onClick: this.handleSecondary }, this.secondaryIcon && h("co-icon", { key: 'e4199ccd7f50044b12aa7bc16b3233fbc4ffd9bf', name: this.secondaryIcon, size: 16 }), h("span", { key: 'f6f81eaf8ae03526fd3cf5e31946d1470523adb3' }, this.secondaryLabel))), this.primaryLabel && (h("button", { key: '5ab90aceea926978ef73f6be77b7c9aa8fd45156', class: "co-list-footer__btn co-list-footer__btn--primary", type: "button", onClick: this.handlePrimary }, this.primaryIcon && h("co-icon", { key: '2693de047b35e795ee24932612b4b01c8050ef1f', name: this.primaryIcon, size: 16 }), h("span", { key: 'e29b11a48ee4bf3acda5a7a4f493cafdd6fc691d' }, this.primaryLabel))), h("slot", { key: '7f9ed9622ff7ed6486b5c253f9c3bd4e5c2ce1e3' })));
     }
 };
 CoListFooter.style = coListFooterCss();