@prolibu-suite/cobalt-core 0.9.2 → 0.9.4

package/dist/esm/co-audio-player.entry.js

@@ -1,12 +1,37 @@
 import { r as registerInstance, c as createEvent, h } from './index-CrtiywTB.js';
 
-/** Seconds → "m:ss" (floors; 0 for NaN/negative). */
+/** Rendered in place of `m:ss` while a time is not known.
+ *
+ *  Not an error state: `<audio>.duration` is `Infinity` for any container whose
+ *  header carries no duration — every blob `MediaRecorder` produces, i.e. every
+ *  freshly recorded voice note — and Chrome keeps it that way until the clip has
+ *  been played end to end. `0:00` there would read as a zero-length recording;
+ *  `--:--` reads as "not known yet", which is the truth. */
+const UNKNOWN_TIME = '--:--';
+/** Seconds → "m:ss" (floors). Anything that is not a finite, non-negative number
+ *  (`Infinity`, `NaN`, negatives) → `UNKNOWN_TIME` — never `"Infinity:NaN"`. */
 function formatTime(seconds) {
-    const s = Math.max(0, Math.floor(seconds || 0));
+    if (!Number.isFinite(seconds) || seconds < 0)
+        return UNKNOWN_TIME;
+    const s = Math.floor(seconds);
     const m = Math.floor(s / 60);
     const sec = s % 60;
     return `${m}:${sec.toString().padStart(2, '0')}`;
 }
+/** Picks the duration to trust (seconds), or `NaN` when neither source knows it.
+ *
+ *  `<audio>.duration` is authoritative *when it is a real number*. It is not for
+ *  a duration-less container (see `UNKNOWN_TIME`), where it reports `Infinity`.
+ *  The WebAudio decode the player already runs to draw the waveform does know the
+ *  real length (`AudioBuffer.duration`), so it is the fallback. `0` from either
+ *  source means "empty/unknown" too, so it never wins. */
+function resolveDuration(fromAudio, fromDecode) {
+    if (Number.isFinite(fromAudio) && fromAudio > 0)
+        return fromAudio;
+    if (Number.isFinite(fromDecode) && fromDecode > 0)
+        return fromDecode;
+    return NaN;
+}
 /** Downsample raw PCM to `bars` peak heights, each normalized to a 0..1 fraction. */
 function resamplePeaks(channelData, bars) {
     const len = channelData.length;
@@ -73,7 +98,10 @@ const CoAudioPlayer = class {
         this.isLoading = false;
         this.hasError = false;
         this.currentTime = 0;
-        this.duration = 0;
+        /** Playback length in seconds, or `NaN` while it is not known — which is the
+         *  normal state for a `MediaRecorder` blob until the decode lands. Everything
+         *  that does arithmetic with it goes through `knownDuration`. */
+        this.duration = NaN;
         this.peaks = [];
         /** Measured wave width (px); 0 until the ResizeObserver reports it. */
         this.containerWidth = 0;
@@ -81,7 +109,13 @@ const CoAudioPlayer = class {
         this.playbackRate = 1;
         // Decoded mono PCM, kept so bars can be re-resampled on resize without re-fetching.
         this.rawChannelData = null;
-        this.onMeta = () => { var _a; this.duration = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.duration) || 0; };
+        // Length reported by the WebAudio decode; NaN when nothing has decoded (yet).
+        // It is the only trustworthy duration for a container without a duration header.
+        this.decodedDuration = NaN;
+        // Bumped by every init(); an in-flight extractPeaks whose token no longer matches
+        // belongs to a superseded `src` and must not write peaks/duration.
+        this.loadToken = 0;
+        this.onMeta = () => { this.syncDuration(); };
         this.onCanPlay = () => { this.isLoading = false; };
         this.onWaiting = () => { this.isLoading = true; };
         this.onTime = () => { var _a; this.currentTime = ((_a = this.audio) === null || _a === void 0 ? void 0 : _a.currentTime) || 0; };
@@ -108,11 +142,15 @@ const CoAudioPlayer = class {
             if (this.audio)
                 this.audio.playbackRate = this.playbackRate;
         };
+        // Scrubbing needs a real total to map the click fraction onto: with an unknown
+        // duration `frac * duration` is Infinity (or NaN at frac 0), and assigning that
+        // to `currentTime` throws. No total → no scrub.
         this.seekAt = (clientX) => {
-            if (!this.audio || !this.waveEl || !this.duration)
+            const total = this.knownDuration;
+            if (!this.audio || !this.waveEl || !total)
                 return;
             const frac = scrubFraction(clientX, this.waveEl.getBoundingClientRect());
-            this.audio.currentTime = frac * this.duration;
+            this.audio.currentTime = frac * total;
             this.currentTime = this.audio.currentTime;
         };
         this.onWaveKey = (e) => {
@@ -121,17 +159,29 @@ const CoAudioPlayer = class {
                 this.toggle();
                 return;
             }
-            if (!this.audio || !this.duration)
+            if (!this.audio)
                 return;
+            // Relative nudges stay available even with an unknown duration (the media
+            // element clamps a forward seek to its own seekable end); only the upper
+            // clamp needs a total, and both operands stay finite either way.
+            const total = this.knownDuration;
+            const at = this.audio.currentTime;
             if (e.key === 'ArrowRight')
-                this.audio.currentTime = Math.min(this.duration, this.audio.currentTime + 5);
+                this.audio.currentTime = total ? Math.min(total, at + 5) : at + 5;
             else if (e.key === 'ArrowLeft')
-                this.audio.currentTime = Math.max(0, this.audio.currentTime - 5);
+                this.audio.currentTime = Math.max(0, at - 5);
             else
                 return;
             this.currentTime = this.audio.currentTime;
         };
     }
+    /** Duration usable for arithmetic (seek target, progress %, ARIA): `0` when it
+     *  is not known, so every caller can bail on a plain falsy check instead of
+     *  letting `Infinity`/`NaN` reach `audio.currentTime` — that setter takes a
+     *  restricted `double` and THROWS a TypeError on a non-finite value. */
+    get knownDuration() {
+        return Number.isFinite(this.duration) && this.duration > 0 ? this.duration : 0;
+    }
     /** Bar count: derived from the measured width (V1-style density) once known,
      *  else the `bars` fallback. Floored at 24 so a narrow player still reads as a wave. */
     get effectiveBars() {
@@ -169,6 +219,7 @@ const CoAudioPlayer = class {
     }
     disconnectedCallback() {
         var _a;
+        this.loadToken++; // orphan any in-flight decode so it can't write to a dead instance
         this.teardown();
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
         this.resizeObserver = undefined;
@@ -183,16 +234,18 @@ const CoAudioPlayer = class {
     }
     init() {
         this.teardown();
+        const token = ++this.loadToken;
         this.rawChannelData = null;
+        this.decodedDuration = NaN;
         this.peaks = fallbackPeaks(this.effectiveBars); // draw immediately; refine with real peaks
         this.currentTime = 0;
-        this.duration = 0;
+        this.duration = NaN; // unknown until `loadedmetadata` or the decode says otherwise
         this.playbackRate = 1; // a fresh source starts at 1x (new <audio> defaults to 1)
         this.hasError = false;
         if (!this.src)
             return;
         this.isLoading = true;
-        this.extractPeaks(this.src);
+        this.extractPeaks(this.src, token);
         if (typeof Audio === 'undefined')
             return; // test/SSR guard
         const el = new Audio();
@@ -221,22 +274,52 @@ const CoAudioPlayer = class {
         }
         this.isPlaying = false;
     }
-    async extractPeaks(url) {
+    async extractPeaks(url, token) {
+        let ctx;
         try {
             const Ctx = window.AudioContext || window.webkitAudioContext;
             if (!Ctx || typeof fetch === 'undefined')
                 return; // keep fallback
-            const ctx = new Ctx();
+            ctx = new Ctx();
             const buf = await (await fetch(url)).arrayBuffer();
             const audioBuf = await ctx.decodeAudioData(buf);
+            if (token !== this.loadToken)
+                return; // a newer src superseded this decode
             this.rawChannelData = audioBuf.getChannelData(0);
+            this.decodedDuration = audioBuf.duration;
             this.peaks = resamplePeaks(this.rawChannelData, this.effectiveBars);
-            ctx.close();
         }
         catch (_a) {
+            if (token !== this.loadToken)
+                return;
+            // Undecodable (codec WebAudio can't handle, CORS, network): keep the
+            // deterministic fallback wave and let <audio> own the duration — playback,
+            // seek and the time readout all still work, or degrade to `--:--`.
             this.rawChannelData = null;
+            this.decodedDuration = NaN;
             this.peaks = fallbackPeaks(this.effectiveBars); // stays functional
         }
+        finally {
+            // Always release the context. Chrome caps concurrent AudioContexts per
+            // document, so leaking one per failed decode would eventually stop every
+            // later player on the page from decoding at all.
+            try {
+                await (ctx === null || ctx === void 0 ? void 0 : ctx.close());
+            }
+            catch ( /* already closed */_b) { /* already closed */ }
+        }
+        if (token === this.loadToken)
+            this.syncDuration();
+    }
+    /** Re-derive the shown duration from whichever source knows it. Called from both
+     *  `loadedmetadata` and the end of the decode, because either can land first. */
+    syncDuration() {
+        var _a, _b;
+        const next = resolveDuration((_b = (_a = this.audio) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : NaN, this.decodedDuration);
+        // Object.is, not !==: Stencil's @State setter re-renders on any `oldVal !== newVal`,
+        // and NaN !== NaN — so a plain assignment would re-render on every no-op sync.
+        if (!Object.is(next, this.duration))
+            this.duration = next;
     }
     async download() {
         if (!this.src || typeof fetch === 'undefined')
@@ -257,14 +340,20 @@ const CoAudioPlayer = class {
     render() {
         const H = 40, UNIT = 3, W = 1.8, R = 0.6;
         const vbW = Math.max(1, this.peaks.length * UNIT);
-        const pct = this.duration ? (this.currentTime / this.duration) * 100 : 0;
-        const bar = (hFrac, i, played = false) => (h("rect", { key: 'ffe5ce97626e52c12e60b953b62d237f14acb582', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
-        return (h("div", { key: '012710aded6ca183e80d7fde087cb0fdf413249b', class: {
+        const total = this.knownDuration; // 0 while unknown → no progress fill, no ARIA max
+        const pct = total ? (this.currentTime / total) * 100 : 0;
+        // Undefined drops the attribute (Stencil removes null/undefined attrs). An
+        // `aria-valuemax="Infinity"`/`"NaN"` is invalid, and a stand-in `"0"` would sit
+        // below `aria-valuenow` the moment playback advances. ARIA 1.2 makes valuemax
+        // optional for `slider`, so leaving it off while unknown is well-formed.
+        const ariaMax = total ? Math.floor(total) : undefined;
+        const bar = (hFrac, i, played = false) => (h("rect", { key: '997dcefc32f5188c41afa0a7b5135c70cceeed1d', x: i * UNIT, y: H / 2 - (hFrac * H) / 2, width: W, height: Math.max(hFrac * H, 2), rx: R, class: { 'co-audio-player__bar': true, 'co-audio-player__bar--played': played } }));
+        return (h("div", { key: '8ac91ab3f8eb417df5e7cf4d1e016d6ca7eb45a3', class: {
                 'co-audio-player': true,
                 'co-audio-player--compact': this.compact,
                 'co-audio-player--error': this.hasError,
                 'co-audio-player--playing': this.isPlaying,
-            }, part: "player" }, h("button", { key: '2505b88e97e73fd39aa31e3dad5e7fe0c1b94c80', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: 'e0e0d2dd5f6e0578ba80a3c235e5c221a6e8fe21', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: 'd2b32119c69c64d2f68d469fe4ae056780446322', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": Math.floor(this.duration), "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'fb9643df152d2d0b119580954f639cb3a9c2cd66', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: 'c2901cfe7c7e910bd53c8c92894b2d2395cde270', id: "co-ap-clip" }, h("rect", { key: '8129a85201e09ba6646b08ed0075798b0a0b0dfc', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: '69bc1780122d48f1a545d1c59bf7ed6536285ed2', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '3747622619bd81545f85e7eb2f9c19b1aca6e7c2', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: '84341856fb2e0b6a094c673a727370b148190e30', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: 'd6767d185317f20299b40c4050a806d88165682f', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: 'a0f0a09cdf705ecf15e0156cf93011f89f41ffa5', name: "download-simple", size: 14 })))));
+            }, part: "player" }, h("button", { key: '0e5897dc64c91ee67432f17d7b0d57a27f44cd0e', type: "button", class: "co-audio-player__play", part: "play", "aria-label": this.hasError ? 'Audio no disponible' : this.isPlaying ? 'Pausar' : 'Reproducir', "aria-busy": this.isLoading ? 'true' : 'false', disabled: this.hasError || !this.src, onClick: this.toggle }, h("co-icon", { key: '4843751a2a3709942a49ae03ff9ba0eb08ab7d97', name: this.hasError ? 'warning-circle' : this.isPlaying ? 'pause' : 'play', weight: "fill", size: this.compact ? 12 : 14 })), h("div", { key: 'b7aebd0e0c5197b0dec6257bbec7c9dd8dd55d6f', class: "co-audio-player__wave", part: "wave", role: "slider", tabindex: "0", "aria-label": "Progreso de reproducci\u00F3n", "aria-valuemin": 0, "aria-valuemax": ariaMax, "aria-valuenow": Math.floor(this.currentTime), ref: (el) => (this.waveEl = el), onClick: (e) => this.seekAt(e.clientX), onKeyDown: this.onWaveKey }, h("svg", { key: 'a504d058a27bb33dd57733ec32db306eb0ed87e9', class: "co-audio-player__svg", viewBox: `0 0 ${vbW} ${H}`, preserveAspectRatio: "none", "aria-hidden": "true" }, this.peaks.map((hFrac, i) => bar(hFrac, i)), h("clipPath", { key: '9cfa69ba28801893baf62c8f66b18a31319fdebe', id: "co-ap-clip" }, h("rect", { key: '6e5cb34baeb2b7dddd6ef7e94f8585ef912e0315', x: "0", y: "0", width: (pct / 100) * vbW, height: H })), h("g", { key: '4b78a29dde762cabc85d7921aacbcd261d8fa6b5', "clip-path": "url(#co-ap-clip)" }, this.peaks.map((hFrac, i) => bar(hFrac, i, true))))), h("span", { key: '9067d22b0e2994e46ef49c60356292ec59f61a21', class: "co-audio-player__time", part: "time" }, formatTime(this.currentTime), " / ", formatTime(this.duration)), !this.compact && (h("button", { key: 'f6149a9996e6ce15230221c2f6fcec95fec5f485', type: "button", class: "co-audio-player__speed", part: "speed", "aria-label": `Velocidad de reproducción ${this.playbackRate}x`, onClick: this.cycleSpeed }, this.playbackRate, "x")), !this.compact && !this.noDownload && (h("button", { key: '73d291d31d92bcb0e18e230fe0ac35d3ab4077b2', type: "button", class: "co-audio-player__dl", part: "download", "aria-label": "Descargar", onClick: () => this.download() }, h("co-icon", { key: '9ab09f5d6b975f4f5544019f70bd2ca1ee521068', name: "download-simple", size: 14 })))));
     }
     static get watchers() { return {
         "src": [{

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

@@ -1,35 +1,7 @@
 import { r as registerInstance, h, a as getElement } from './index-CrtiywTB.js';
+import { i as isLightColor } from './color-BG4WRR22.js';
 import { c as computePosition, g as getOffsetAncestor, f as findNearestScrollParent } from './positioning-BMdapAL8.js';
 
-/**
- * Shared color utilities for Cobalt components.
- * WCAG sRGB relative luminance for contrast detection.
- */
-function parseHex(hex) {
-    if (!hex || typeof hex !== 'string')
-        return null;
-    const h = hex.replace('#', '');
-    if (h.length === 3) {
-        return { r: parseInt(h[0] + h[0], 16), g: parseInt(h[1] + h[1], 16), b: parseInt(h[2] + h[2], 16) };
-    }
-    if (h.length === 6) {
-        return { r: parseInt(h.slice(0, 2), 16), g: parseInt(h.slice(2, 4), 16), b: parseInt(h.slice(4, 6), 16) };
-    }
-    return null;
-}
-/** WCAG sRGB relative luminance (0–1). */
-function luminance(hex) {
-    const c = parseHex(hex);
-    if (!c)
-        return 0;
-    const [rs, gs, bs] = [c.r / 255, c.g / 255, c.b / 255].map((v) => v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4));
-    return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
-}
-/** Returns true when the color is perceptually light (needs dark foreground). */
-function isLightColor(hex) {
-    return luminance(hex) > 0.4;
-}
-
 const coAvatarCss = () => `:host{display:inline-flex;--co-avatar-squircle:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'><path d='M100 50L99.94 68.06L99.75 73.81L99.44 77.94L99.01 81.26L98.44 84.05L97.74 86.46L96.91 88.57L95.94 90.43L94.81 92.07L93.53 93.53L92.07 94.81L90.43 95.94L88.57 96.91L86.46 97.74L84.05 98.44L81.26 99.01L77.94 99.44L73.81 99.75L68.06 99.94L50 100L31.94 99.94L26.19 99.75L22.06 99.44L18.74 99.01L15.95 98.44L13.54 97.74L11.43 96.91L9.57 95.94L7.93 94.81L6.47 93.53L5.19 92.07L4.06 90.43L3.09 88.57L2.26 86.46L1.56 84.05L0.99 81.26L0.56 77.94L0.25 73.81L0.06 68.06L0 50L0.06 31.94L0.25 26.19L0.56 22.06L0.99 18.74L1.56 15.95L2.26 13.54L3.09 11.43L4.06 9.57L5.19 7.93L6.47 6.47L7.93 5.19L9.57 4.06L11.43 3.09L13.54 2.26L15.95 1.56L18.74 0.99L22.06 0.56L26.19 0.25L31.94 0.06L50 0L68.06 0.06L73.81 0.25L77.94 0.56L81.26 0.99L84.05 1.56L86.46 2.26L88.57 3.09L90.43 4.06L92.07 5.19L93.53 6.47L94.81 7.93L95.94 9.57L96.91 11.43L97.74 13.54L98.44 15.95L99.01 18.74L99.44 22.06L99.75 26.19L99.94 31.94Z' fill='%23fff'/></svg>")}.co-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);font-family:var(--co-font-family-primary);font-weight:600;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);overflow:hidden;flex-shrink:0;user-select:none;-webkit-font-smoothing:antialiased}.co-avatar::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 var(--co-avatar-border-width, 1px) var(--co-avatar-border-color, transparent)}.co-avatar__text{text-transform:uppercase}.co-avatar__img{width:100%;height:100%;object-fit:cover;display:block}.co-avatar--square{border-radius:0;-webkit-mask:var(--co-avatar-squircle) center / 100% 100% no-repeat;mask:var(--co-avatar-squircle) center / 100% 100% no-repeat}.co-avatar--square::after{--co-avatar-bw:var(--co-avatar-border-width, 1px);box-shadow:none;background:var(--co-avatar-border-color, transparent);-webkit-mask:var(--co-avatar-squircle) center / 100% 100% no-repeat,     var(--co-avatar-squircle) center / calc(100% - 2 * var(--co-avatar-bw)) calc(100% - 2 * var(--co-avatar-bw)) no-repeat;-webkit-mask-composite:xor;mask:var(--co-avatar-squircle) center / 100% 100% no-repeat,     var(--co-avatar-squircle) center / calc(100% - 2 * var(--co-avatar-bw)) calc(100% - 2 * var(--co-avatar-bw)) no-repeat;mask-composite:exclude}.co-avatar--light{color:rgba(0, 0, 0, 0.87)}co-tooltip{display:inline-flex;align-items:center;line-height:0}`;
 
 const SIZE_MAP = {
@@ -70,6 +42,10 @@ const CoAvatar = class {
         const iconSize = (_b = ICON_SIZE_MAP[this.size]) !== null && _b !== void 0 ? _b : 24;
         const fontSize = (_c = FONT_SIZE_MAP[this.size]) !== null && _c !== void 0 ? _c : 'var(--co-font-size-18)';
         const showImage = this.type === 'image' && this.src && !this.imgFailed;
+        // Broken/missing image without initials falls back to the ICON (default
+        // "user") — never an empty disc. With `text` present, initials win (they
+        // identify the record better than a generic glyph).
+        const showIcon = this.type === 'icon' || (this.type === 'image' && !showImage && !this.text);
         const ariaLabel = this.type === 'text'
             ? this.text
             : this.type === 'image'
@@ -83,7 +59,7 @@ const CoAvatar = class {
                 'co-avatar--light': !!this.color && isLightColor(this.color),
             }, style: Object.assign(Object.assign({ width: `var(--co-avatar-size, ${dim}px)`, height: `var(--co-avatar-size, ${dim}px)`, fontSize }, (this.color ? { background: this.color } : {})), (this.ringColor
                 ? { '--co-avatar-border-color': this.ringColor, '--co-avatar-border-width': '2px' }
-                : {})), part: "avatar", role: "img", "aria-label": ariaLabel }, showImage ? (h("img", { class: "co-avatar__img", src: this.src, alt: (_g = (_f = this.alt) !== null && _f !== void 0 ? _f : this.text) !== null && _g !== void 0 ? _g : '', onError: this.handleImgError })) : this.type === 'icon' ? (h("co-icon", { name: this.icon, weight: this.iconWeight, size: iconSize })) : (h("span", { class: "co-avatar__text" }, this.text))));
+                : {})), part: "avatar", role: "img", "aria-label": ariaLabel }, showImage ? (h("img", { class: "co-avatar__img", src: this.src, alt: (_g = (_f = this.alt) !== null && _f !== void 0 ? _f : this.text) !== null && _g !== void 0 ? _g : '', onError: this.handleImgError })) : showIcon ? (h("co-icon", { name: this.icon, weight: this.iconWeight, size: iconSize })) : (h("span", { class: "co-avatar__text" }, this.text))));
         // No tooltip when `name` is unset/empty — renders exactly as before, no wrapper.
         if (!this.name)
             return disc;

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, a as getElement } from './index-CrtiywTB.js';
 
-const coButtonCss = () => `:host{display:inline-flex}.co-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;font-family:var(--co-font-family-primary);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;-webkit-font-smoothing:antialiased;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-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))}.co-button--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-button--secondary{background:color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);color:var(--co-semantic-on-secondary);border-color:var(--co-semantic-border-subtle)}.co-button--stroke{background:color-mix(in srgb, var(--co-semantic-surface-secondary) 25%, transparent);color:var(--co-semantic-text-default);border-color:var(--co-semantic-border-default)}.co-button--ghost{background:transparent;color:var(--co-semantic-text-default);border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.co-button--danger{background:var(--co-semantic-status-error);color:var(--co-color-base-blanco);border-color:transparent}.co-button--success{background:var(--co-semantic-status-success);color:var(--co-color-base-blanco);border-color:transparent}.co-button--rounded.co-button--l{padding:var(--co-spacing-xl) var(--co-spacing-2xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-18);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--m{padding:var(--co-spacing-lg) var(--co-spacing-xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-16);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--s{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-14);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--xs{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-12);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--square.co-button--l{padding:var(--co-spacing-lg) var(--co-spacing-xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-18);border-radius:var(--co-border-radius-lg)}.co-button--square.co-button--m{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-16);border-radius:var(--co-border-radius-sm)}.co-button--square.co-button--s{padding:var(--co-spacing-sm2) var(--co-spacing-md);gap:var(--co-spacing-sm);font-size:var(--co-font-size-14);border-radius:var(--co-border-radius-xs)}.co-button--square.co-button--xs{padding:var(--co-spacing-sm) var(--co-spacing-sm2);gap:var(--co-spacing-xs);font-size:var(--co-font-size-12);border-radius:var(--co-spacing-sm)}.co-button--disabled,.co-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-button--primary:hover:not(:disabled){opacity:0.88}.co-button--secondary:hover:not(:disabled),.co-button--stroke:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-button--ghost:hover:not(:disabled){background:color-mix(in srgb, var(--co-semantic-surface-hover) 60%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))}.co-button--danger:hover:not(:disabled),.co-button--success:hover:not(:disabled){opacity:0.88}.co-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}.co-button--primary{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-slow) var(--co-motion-ease-spring)}.co-button--secondary.co-button--elevated{box-shadow:var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04)),     inset 0 0 0 1px var(--co-color-opacity-negro-8)}.co-button--ghost.co-button--surface-dark,.co-button--stroke.co-button--surface-dark{color:var(--co-color-base-blanco, #fff)}.co-button--ghost.co-button--surface-dark:hover:not(:disabled),.co-button--stroke.co-button--surface-dark:hover:not(:disabled){background:var(--co-color-opacity-blanco-16);-webkit-backdrop-filter:none;backdrop-filter:none}.co-button--danger.co-button--surface-dark:hover:not(:disabled){opacity:1;background:color-mix(in srgb, var(--co-semantic-status-error) 84%, var(--co-color-base-blanco, #fff))}.co-button--danger.co-button--surface-dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-color-base-blanco, #fff) 45%, transparent)}::slotted([slot="icon-left"]),::slotted([slot="icon-right"]){display:inline-flex;flex-shrink:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-button--primary{background:var(--co-semantic-surface-primary)}.co-button--secondary{background:var(--co-semantic-surface-secondary)}.co-button--stroke{background:transparent}}`;
+const coButtonCss = () => `:host{display:inline-flex}:host([disabled]){pointer-events:none}.co-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;outline:none;font-family:var(--co-font-family-primary);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;-webkit-font-smoothing:antialiased;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-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))}.co-button--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border-color:color-mix(in srgb, var(--co-semantic-on-primary) 28%, transparent)}.co-button--secondary{background:color-mix(in srgb, var(--co-semantic-surface-secondary) 55%, transparent);color:var(--co-semantic-on-secondary);border-color:var(--co-semantic-border-subtle)}.co-button--stroke{background:color-mix(in srgb, var(--co-semantic-surface-secondary) 25%, transparent);color:var(--co-semantic-text-default);border-color:var(--co-semantic-border-default)}.co-button--ghost{background:transparent;color:var(--co-semantic-text-default);border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.co-button--danger{background:var(--co-semantic-status-error);color:var(--co-color-base-blanco);border-color:transparent}.co-button--success{background:var(--co-semantic-status-success);color:var(--co-color-base-blanco);border-color:transparent}.co-button--rounded.co-button--l{padding:var(--co-spacing-xl) var(--co-spacing-2xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-18);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--m{padding:var(--co-spacing-lg) var(--co-spacing-xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-16);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--s{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-14);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--rounded.co-button--xs{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-12);border-radius:var(--co-button-radius, var(--co-border-radius-full))}.co-button--square.co-button--l{padding:var(--co-spacing-lg) var(--co-spacing-xl);gap:var(--co-spacing-md);font-size:var(--co-font-size-18);border-radius:var(--co-border-radius-lg)}.co-button--square.co-button--m{padding:var(--co-spacing-md) var(--co-spacing-lg);gap:var(--co-spacing-sm2);font-size:var(--co-font-size-16);border-radius:var(--co-border-radius-sm)}.co-button--square.co-button--s{padding:var(--co-spacing-sm2) var(--co-spacing-md);gap:var(--co-spacing-sm);font-size:var(--co-font-size-14);border-radius:var(--co-border-radius-xs)}.co-button--square.co-button--xs{padding:var(--co-spacing-sm) var(--co-spacing-sm2);gap:var(--co-spacing-xs);font-size:var(--co-font-size-12);border-radius:var(--co-spacing-sm)}.co-button--disabled,.co-button:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-button--primary:hover:not(:disabled){opacity:0.88}.co-button--secondary:hover:not(:disabled),.co-button--stroke:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-button--ghost:hover:not(:disabled){background:color-mix(in srgb, var(--co-semantic-surface-hover) 60%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate))}.co-button--danger:hover:not(:disabled),.co-button--success:hover:not(:disabled){opacity:0.88}.co-button:active:not(:disabled){transform:scale(0.97);transition-duration:var(--co-motion-duration-instant)}.co-button--primary{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-slow) var(--co-motion-ease-spring)}.co-button--secondary.co-button--elevated{box-shadow:var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04)),     inset 0 0 0 1px var(--co-color-opacity-negro-8)}.co-button--ghost.co-button--surface-dark,.co-button--stroke.co-button--surface-dark{color:var(--co-color-base-blanco, #fff)}.co-button--ghost.co-button--surface-dark:hover:not(:disabled),.co-button--stroke.co-button--surface-dark:hover:not(:disabled){background:var(--co-color-opacity-blanco-16);-webkit-backdrop-filter:none;backdrop-filter:none}.co-button--danger.co-button--surface-dark:hover:not(:disabled){opacity:1;background:color-mix(in srgb, var(--co-semantic-status-error) 84%, var(--co-color-base-blanco, #fff))}.co-button--danger.co-button--surface-dark:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--co-color-base-blanco, #fff) 45%, transparent)}::slotted([slot="icon-left"]),::slotted([slot="icon-right"]){display:inline-flex;flex-shrink:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-button--primary{background:var(--co-semantic-surface-primary)}.co-button--secondary{background:var(--co-semantic-surface-secondary)}.co-button--stroke{background:transparent}}`;
 
 const ICON_SIZE = { l: 20, m: 18, s: 16, xs: 14 };
 const CoButton = class {
@@ -23,7 +23,9 @@ const CoButton = class {
          * `variant="danger" surface="dark"`.
          */
         this.surface = 'light';
-        /** Disabled state */
+        /** Disabled state. Reflected so :host([disabled]) can kill pointer-events —
+         *  the inner button's own pointer-events:none re-targets clicks to the host,
+         *  where consumers' click listeners live. */
         this.disabled = false;
         /** Icon weight applied to both iconLeft and iconRight */
         this.iconWeight = 'regular';
@@ -54,7 +56,7 @@ const CoButton = class {
             customStyle.background = this.color;
         if (this.textColor)
             customStyle.color = this.textColor;
-        return (h("button", { key: 'e765a1fcb3b4efcc7c43e155015b3c178a536d3c', class: {
+        return (h("button", { key: '651f8d079c09cf21d076aa20564a462a15ca8c4a', class: {
                 'co-button': true,
                 [`co-button--${this.variant}`]: true,
                 [`co-button--${this.shape}`]: true,
@@ -64,7 +66,7 @@ const CoButton = class {
                 'co-button--disabled': this.disabled,
             }, style: Object.keys(customStyle).length ? customStyle : undefined, type: this.type, disabled: this.disabled, "aria-label": this.ariaLabelText || undefined, onClick: this.handleClick, part: "button" }, this.iconLeft
             ? h("co-icon", { name: this.iconLeft, weight: this.iconWeight, size: iconSize })
-            : null, h("slot", { key: '8dd3e816276a67ba6072eeed1ad34a982b60389e' }, this.label), this.iconRight
+            : null, h("slot", { key: 'b8c5b230a473fe4a57aa087533186e410db64bed' }, this.label), this.iconRight
             ? h("co-icon", { name: this.iconRight, weight: this.iconWeight, size: iconSize })
             : null));
     }

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

@@ -365,6 +365,11 @@ function readableTextToken(host, bg) {
 
 const coCalendarMonthCss = () => `:host{display:block;font-family:var(--co-font-family-primary);--co-cal-daynum-h:24px;--co-cal-lane-h:22px;--co-cal-min-week-h:92px;--co-cal-gap:2px;--co-cal-surface:var(--co-semantic-surface-page);--co-cal-border:var(--co-semantic-border-default);--co-cal-text:var(--co-semantic-text-default);--co-cal-text-muted:var(--co-semantic-text-muted);--co-cal-hover:var(--co-semantic-surface-hover);--co-cal-today-ring:var(--co-color-primary-azul);--co-cal-event-radius:6px;--co-cal-elevation-hover:var(--co-shadow-lg);--co-cal-event-bg:var(--co-color-primary-azul);--co-cal-event-border:transparent;--co-cal-event-text:var(--co-color-base-blanco, #fff);--co-cal-event-text-light:var(--co-color-base-blanco, #fff);--co-cal-event-text-dark:var(--co-semantic-text-default)}.cal-month{display:flex;flex-direction:column;height:100%;border-radius:var(--co-border-radius-xs);overflow:hidden;background:var(--co-cal-surface)}.cal-month__dow{display:grid;grid-template-columns:repeat(7, 1fr);border-bottom:1px solid var(--co-cal-border)}.cal-month__dow-cell{padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-10, 10px);font-weight:600;text-transform:uppercase;letter-spacing:0.04em;color:var(--co-cal-text-muted);text-align:right}.cal-month__week{position:relative;min-height:var(--co-cal-min-week-h);flex:1 0 auto}.cal-month__week:not(:last-child){border-bottom:1px solid var(--co-cal-border)}.cal-month__days{display:grid;grid-template-columns:repeat(7, 1fr);height:100%;position:absolute;inset:0}.cal-month__day{border-right:1px solid var(--co-cal-border);padding:var(--co-spacing-xxs);cursor:pointer;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.cal-month__day:last-child{border-right:0}.cal-month__day:hover{background:var(--co-cal-hover)}.cal-month__day:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:-2px}.cal-month__day--outside .cal-month__daynum{color:var(--co-cal-text-muted)}.cal-month__day--disabled{cursor:not-allowed;background:color-mix(in srgb, var(--co-cal-border) 20%, transparent)}.cal-month__day--drag-over{background:color-mix(in srgb, var(--co-cal-today-ring) 14%, transparent);box-shadow:inset 0 0 0 2px var(--co-cal-today-ring)}.cal-month__day--selected{background:color-mix(in srgb, var(--co-cal-today-ring) 10%, transparent)}.cal-month__daynum{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;margin-left:auto;float:right;font-size:var(--co-font-size-12, 12px);color:var(--co-cal-text);border-radius:var(--co-border-radius-full)}.cal-month__day--today .cal-month__daynum{background:var(--co-cal-today-ring);color:var(--co-color-base-blanco, #fff);font-weight:600}.cal-month__events{position:absolute;inset:0;pointer-events:none;}.cal-chip,.cal-month__more{position:absolute;height:calc(var(--co-cal-lane-h) - 3px);box-sizing:border-box;pointer-events:auto;display:flex;align-items:center;gap:var(--co-spacing-xxs);margin:0 3px;padding:0 var(--co-spacing-xs);border:1px solid var(--co-cal-event-border);border-radius:var(--co-cal-event-radius);font-family:inherit;font-size:var(--co-font-size-12, 12px);line-height:1;text-align:left;cursor:pointer;overflow:hidden;white-space:nowrap}.cal-chip{background:var(--co-cal-event-bg);color:var(--co-cal-event-text);user-select:none;-webkit-user-select:none;touch-action:none}.cal-month__chip-skeleton{position:absolute;height:calc(var(--co-cal-lane-h) - 3px);box-sizing:border-box;margin:0 3px;border-radius:var(--co-cal-event-radius);overflow:hidden;pointer-events:none}.cal-month__chip-skeleton co-skeleton{display:block;block-size:100%}.cal-chip--all-day:hover{filter:brightness(0.95);box-shadow:var(--co-cal-elevation-hover)}.cal-chip:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:1px}.cal-chip--all-day{font-weight:500}.cal-chip__dot{flex:0 0 auto;width:7px;height:7px;border-radius:var(--co-border-radius-full);background:var(--co-cal-event-bg)}.cal-chip:not(.cal-chip--all-day){background:transparent;color:var(--co-cal-text);border-color:transparent}.cal-chip:not(.cal-chip--all-day):hover{background:var(--co-cal-hover);filter:none}.cal-chip__time{flex:0 0 auto;color:var(--co-cal-text-muted);font-variant-numeric:tabular-nums}.cal-chip__title{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}.cal-chip__ext{flex:0 0 auto;margin-inline-start:auto;opacity:0.8}.cal-chip--past{opacity:0.55}.cal-chip--locked{cursor:default}.cal-chip--external{border-style:dashed}.cal-chip--dragging{opacity:0.4}.cal-month--interacting .cal-chip{pointer-events:none}.cal-chip--all-day.cal-chip--tentative{background-image:repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.5) 0 4px, transparent 4px 8px)}.cal-chip--cancelled{opacity:0.6}.cal-chip--cancelled .cal-chip__title{text-decoration:line-through}.cal-chip--continues-before{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:0}.cal-chip--continues-after{border-top-right-radius:0;border-bottom-right-radius:0;margin-right:0}.cal-month__more{background:transparent;color:var(--co-cal-text-muted);border-color:transparent;font-weight:600;font-size:var(--co-font-size-11, 11px)}.cal-month__more:hover{background:var(--co-cal-hover);color:var(--co-cal-text)}`;
 
+// Distancia (px) que el puntero debe recorrer tras el pointerdown para que un drag
+// de evento se comprometa. Por debajo de esto el gesto es un CLICK: el drag no
+// arranca, el chip conserva sus pointer-events y su click abre el popover. Mismo
+// literal/mecanismo que co-calendar-timegrid.tsx (DRAG_THRESHOLD_PX ahí, línea ~28).
+const DRAG_THRESHOLD_PX$1 = 5;
 const CoCalendarMonth = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -395,6 +400,21 @@ const CoCalendarMonth = class {
         /** Epoch ms of "now", refreshed on a 60s timer so `past` styling stays live. */
         this.nowMs = 0;
         this.onPointerUp = () => this.finishDrag();
+        this.onPointerMove = (e) => this.trackDrag(e);
+        // Drag ARMADO pero aún no comprometido: `startDrag` guarda el id y el punto de
+        // agarre acá; el drag pasa a activo (`dragId`) recién cuando el puntero cruza
+        // DRAG_THRESHOLD_PX en `trackDrag` (mismo patrón que co-calendar-timegrid.tsx,
+        // `dragArmedId`/`startMove`). Así un click simple en un evento arrastrable no
+        // arranca drag (que pone `pointer-events:none` en los chips vía
+        // `cal-month--interacting`) y su popover abre normal.
+        this.dragArmedId = null;
+        this.dragStartPointer = null;
+        // Set right before coEventDrop so the trailing click no-ops (mismo patrón que
+        // co-calendar-timegrid.tsx#suppressNextClick): un drag COMPROMETIDO deja el
+        // chip con pointer-events restaurados (`setInteracting(false)`) ANTES de que
+        // el navegador dispare el `click` sintético que sigue al `pointerup` — sin
+        // este flag ese click reabriría el popover justo después de soltar.
+        this.suppressNextClick = false;
         // ── Selection / activation ──────────────────────────────────────────────
         /** Día seleccionado que PERSISTE resaltado mientras el host tiene abierto su
          * form/bubble de creación (referencia visual, paridad Google). */
@@ -439,9 +459,11 @@ const CoCalendarMonth = class {
     }
     connectedCallback() {
         window.addEventListener('pointerup', this.onPointerUp);
+        window.addEventListener('pointermove', this.onPointerMove);
     }
     disconnectedCallback() {
         window.removeEventListener('pointerup', this.onPointerUp);
+        window.removeEventListener('pointermove', this.onPointerMove);
         if (this.nowTimer)
             window.clearInterval(this.nowTimer);
     }
@@ -498,16 +520,43 @@ const CoCalendarMonth = class {
             return;
         // Ver la nota en co-calendar-timegrid#startMove: preventDefault en
         // pointerdown mata el click y el chip arrastrable no podía activarse.
+        // Tampoco se toca dragId/interacting acá: eso arrancaba
+        // `cal-month--interacting` (pointer-events:none en los chips, css:249) en el
+        // pointerdown mismo y se comía el click de todo evento FUTURO arrastrable —
+        // el chip nunca veía el click nativo. Se arma un candidato nada más; el
+        // commit real ocurre en `trackDrag` al cruzar DRAG_THRESHOLD_PX.
         e.stopPropagation();
-        this.dragId = id;
+        this.dragArmedId = id;
+        this.dragStartPointer = { x: e.clientX, y: e.clientY };
+    }
+    /** Arma → activa el drag al cruzar el umbral (ver DRAG_THRESHOLD_PX). Antes de
+     * eso no toca dragId/interacting, así el click nativo del chip sigue vivo. */
+    trackDrag(e) {
+        if (!this.dragArmedId || this.dragId)
+            return;
+        const sp = this.dragStartPointer;
+        if (!sp)
+            return;
+        if (Math.hypot(e.clientX - sp.x, e.clientY - sp.y) < DRAG_THRESHOLD_PX$1)
+            return;
+        this.dragId = this.dragArmedId;
+        this.dragArmedId = null;
         this.dragOverDate = null;
         this.setInteracting(true);
     }
     finishDrag() {
+        // pointerup habiendo solo ARMADO (sin cruzar el umbral) = fue un click, no un
+        // drag: desarmar en silencio y dejar pasar el click nativo → abre el popover.
+        if (this.dragArmedId && !this.dragId) {
+            this.dragArmedId = null;
+            this.dragStartPointer = null;
+            return;
+        }
         const id = this.dragId;
         const target = this.dragOverDate;
         this.dragId = null;
         this.dragOverDate = null;
+        this.dragStartPointer = null;
         this.setInteracting(false);
         if (!id || !target)
             return;
@@ -522,6 +571,10 @@ const CoCalendarMonth = class {
             return;
         if (!this.isDayInteractable(target))
             return;
+        this.suppressNextClick = true;
+        // Clear on the next macrotask: a same-target synthetic click fires before this
+        // (and is suppressed); a later unrelated click is not.
+        setTimeout(() => { this.suppressNextClick = false; }, 0);
         const shifted = shiftEventByDays(ev, deltaDays, this.timeZone);
         this.coEventDrop.emit({
             id,
@@ -613,6 +666,10 @@ const CoCalendarMonth = class {
                 'cal-chip--cancelled': ev.responseState === 'cancelled' || ev.responseState === 'declined',
             }, style: style, title: ev.title, "aria-label": ev.title, onClick: (e) => {
                 e.stopPropagation();
+                if (this.suppressNextClick) {
+                    this.suppressNextClick = false;
+                    return;
+                }
                 this.activateEvent(ev.id, e.currentTarget.getBoundingClientRect());
             }, onDblClick: (e) => {
                 e.stopPropagation();
@@ -626,7 +683,7 @@ const CoCalendarMonth = class {
         const short = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'short');
         const long = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'long');
         const today = todayYMD();
-        return (h("div", { key: 'f8bcb53b7ef7c47a1ff59caee0305dfc1a3f1fc2', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '11acf9973a13ad661590a04dd934c86ceaa10f5d', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
+        return (h("div", { key: '7cb63a84f7005ee7b5552a5d9b88c598f579b7be', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '70281a5799b9b95957d152e15a374001a2ec8fa2', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
             var _a;
             return (h("div", { class: "cal-month__week", role: "row" }, h("div", { class: "cal-month__days" }, week.map((date) => {
                 const ymd = parseISO(date);

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-CrtiywTB.js';
 
-const coCheckboxCss = () => `:host{display:inline-flex;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-checkbox-row{display:flex;align-items:center;gap:var(--co-spacing-sm2);cursor:pointer}.co-checkbox-row--disabled{cursor:not-allowed}.co-checkbox__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;user-select:none}.co-checkbox-row--disabled .co-checkbox__label{color:var(--co-semantic-text-disabled)}.co-checkbox{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:none;outline:none;padding:0;overflow:hidden;flex-shrink:0;box-sizing:border-box;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out),     border-color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-checkbox--small{width:16px;height:16px;border-radius:var(--co-border-radius-xxs);}.co-checkbox--medium{width:20px;height:20px;border-radius:var(--co-spacing-sm);}.co-checkbox--large{width:24px;height:24px;border-radius:var(--co-spacing-sm);}.co-checkbox:not(.co-checkbox--checked){background:color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent)}.co-checkbox--checked{background:var(--co-semantic-surface-primary);border:none}.co-checkbox--indeterminate{background:var(--co-semantic-surface-primary);border:none}.co-checkbox--disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-checkbox--overlay{border-radius:6px}.co-checkbox--overlay.co-checkbox--small{width:20px;height:20px;border-radius:6px}.co-checkbox--overlay.co-checkbox--medium,.co-checkbox--overlay.co-checkbox--large{width:22px;height:22px;border-radius:6px}.co-checkbox--overlay:not(.co-checkbox--checked):not(.co-checkbox--indeterminate){background:rgba(255, 255, 255, 0.9);box-shadow:inset 0 0 0 1px var(--co-color-opacity-negro-16, rgba(31, 28, 27, 0.16));border:none}.co-checkbox--overlay.co-checkbox--checked,.co-checkbox--overlay.co-checkbox--indeterminate{background:var(--co-color-primary-azul, #2563eb);border:none;box-shadow:none}.co-checkbox__glyph{display:block;pointer-events:none}.co-checkbox__glyph path{stroke:var(--co-semantic-on-primary);stroke-dasharray:1;stroke-dashoffset:1;opacity:0}.co-checkbox--checked .co-checkbox__check,.co-checkbox--indeterminate .co-checkbox__dash{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-checkbox--small .co-checkbox__glyph{width:12px;height:12px}.co-checkbox--medium .co-checkbox__glyph{width:14px;height:14px}.co-checkbox--large .co-checkbox__glyph{width:18px;height:18px}.co-checkbox--small .co-checkbox__check{stroke-width:2;}.co-checkbox--medium .co-checkbox__check{stroke-width:1.714;}.co-checkbox--large .co-checkbox__check{stroke-width:1.333;}.co-checkbox--small .co-checkbox__dash{stroke-width:2;}.co-checkbox--medium .co-checkbox__dash{stroke-width:2;}.co-checkbox--large .co-checkbox__dash{stroke-width:1.778;}.co-checkbox--overlay .co-checkbox__glyph{width:100%;height:100%}.co-checkbox--overlay .co-checkbox__glyph path{stroke:#fff;stroke-width:2.2}@supports not (background: color-mix(in srgb, red, transparent)){.co-checkbox:not(.co-checkbox--checked){background:transparent}}`;
+const coCheckboxCss = () => `:host{display:inline-flex;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-checkbox-row{display:flex;align-items:center;gap:var(--co-spacing-sm2);cursor:pointer}.co-checkbox-row--disabled{cursor:not-allowed}.co-checkbox__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;user-select:none}.co-checkbox-row--disabled .co-checkbox__label{color:var(--co-semantic-text-disabled)}.co-checkbox{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:none;outline:none;padding:0;overflow:hidden;flex-shrink:0;box-sizing:border-box;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out),     border-color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-checkbox--small{width:16px;height:16px;border-radius:var(--co-border-radius-xxs);}.co-checkbox--medium{width:20px;height:20px;border-radius:var(--co-spacing-sm);}.co-checkbox--large{width:24px;height:24px;border-radius:var(--co-spacing-sm);}.co-checkbox:not(.co-checkbox--checked){background:color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent)}.co-checkbox--checked{background:var(--co-semantic-surface-primary);border:none}.co-checkbox--indeterminate{background:var(--co-semantic-surface-primary);border:none}.co-checkbox--disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-checkbox--overlay{border-radius:6px}.co-checkbox--overlay.co-checkbox--small{width:20px;height:20px;border-radius:6px}.co-checkbox--overlay.co-checkbox--medium,.co-checkbox--overlay.co-checkbox--large{width:22px;height:22px;border-radius:6px}.co-checkbox--overlay:not(.co-checkbox--checked):not(.co-checkbox--indeterminate){background:rgba(255, 255, 255, 0.9);box-shadow:inset 0 0 0 1px var(--co-color-opacity-negro-16, rgba(31, 28, 27, 0.16));border:none}.co-checkbox--overlay.co-checkbox--checked,.co-checkbox--overlay.co-checkbox--indeterminate{background:var(--co-color-primary-azul, #2563eb);border:none;box-shadow:none}.co-checkbox__glyph{display:block;pointer-events:none}.co-checkbox__glyph path{stroke:var(--co-semantic-on-primary);stroke-dasharray:1;stroke-dashoffset:1;opacity:0}.co-checkbox--checked .co-checkbox__check,.co-checkbox--indeterminate .co-checkbox__dash{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-checkbox--small .co-checkbox__glyph{width:12px;height:12px}.co-checkbox--medium .co-checkbox__glyph{width:14px;height:14px}.co-checkbox--large .co-checkbox__glyph{width:18px;height:18px}.co-checkbox--small .co-checkbox__check{stroke-width:2;}.co-checkbox--medium .co-checkbox__check{stroke-width:1.714;}.co-checkbox--large .co-checkbox__check{stroke-width:1.333;}.co-checkbox--small .co-checkbox__dash{stroke-width:2;}.co-checkbox--medium .co-checkbox__dash{stroke-width:2;}.co-checkbox--large .co-checkbox__dash{stroke-width:1.778;}.co-checkbox--overlay .co-checkbox__glyph{width:100%;height:100%}.co-checkbox--overlay .co-checkbox__glyph path{stroke:#fff;stroke-width:2.2}@supports not (background: color-mix(in srgb, red, transparent)){.co-checkbox:not(.co-checkbox--checked){background:transparent}}.co-checkbox.co-checkbox:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus)}`;
 
 const CoCheckbox = class {
     constructor(hostRef) {
@@ -35,6 +35,12 @@ const CoCheckbox = class {
                 }
             }
         };
+        this.handleKeyDown = (e) => {
+            if (e.key === ' ') {
+                e.preventDefault(); // Space no debe scrollear la página
+                this.handleClick(); // ya guarda disabled y resuelve indeterminate
+            }
+        };
     }
     render() {
         const isOverlay = this.appearance === 'overlay';
@@ -42,17 +48,17 @@ const CoCheckbox = class {
         // Only override the fill when a custom color is provided AND the box is "on".
         // Leaving this undefined keeps the default appearance byte-identical to before.
         const boxStyle = this.onColor && isOn ? { background: this.onColor } : undefined;
-        return (h("div", { key: '31690de633689da0b273e3c88cc200cabb4cee75', class: {
+        return (h("div", { key: 'caf200e3c53efa2a00d28db0e149da953e4432da', class: {
                 'co-checkbox-row': true,
                 'co-checkbox-row--disabled': this.disabled,
-            }, onClick: this.handleClick }, h("span", { key: '2b0c4ebbe4c7a7a8046cf726e682a3d42ae3ebbe', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || '', class: {
+            }, onClick: this.handleClick }, h("span", { key: 'a8fe01958d81587129f304ce33f1f5fef882dd9f', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || '', "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, class: {
                 'co-checkbox': true,
                 [`co-checkbox--${this.size}`]: true,
                 'co-checkbox--overlay': isOverlay,
                 'co-checkbox--checked': this.checked && !this.indeterminate,
                 'co-checkbox--indeterminate': this.indeterminate,
                 'co-checkbox--disabled': this.disabled,
-            }, style: boxStyle, part: "box" }, h("svg", { key: 'a127c176e0233460f14c4261d8d2157e657689a9', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'ad7dc0018cdae31156884cd04326bbcdba132b4f', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'dd665144b25aa51339cf9f6ce0e0edf65cfbe5a9', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: '08d6c695e2cbb8188564dc8bb5aab9b569c24838', class: "co-checkbox__label", part: "label" }, this.label))));
+            }, style: boxStyle, part: "box" }, h("svg", { key: 'd9ea60be2c2e58c227aeca8ae3b8e8f459f3522d', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'd25f835b95a2200d44b5e4afdeb727d758e0650f', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'b7a043b9910736a8bdd15720fd7857c01250086d', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: '2e256fb7fd1515bf9dbe3dc380a0d7d09d5347ac', class: "co-checkbox__label", part: "label" }, this.label))));
     }
 };
 CoCheckbox.style = coCheckboxCss();