@prolibu-suite/cobalt-core 0.9.5 → 0.10.0

package/dist/types/components.d.ts

@@ -325,6 +325,11 @@ export namespace Components {
         "size": 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs';
     }
     interface CoBadge {
+        /**
+          * Pop de entrada al montar (spring + blur). Opt-in: un badge estático no debe animar al render. El host activa `animated` solo donde el énfasis de entrada se desea; un remonte por `:key` re-popea — comportamiento aceptado, no una regresión.
+          * @default false
+         */
+        "animated": boolean;
         /**
           * Color — maps to semantic status tokens
           * @default 'default'
@@ -834,6 +839,10 @@ export namespace Components {
           * @default false
          */
         "checked": boolean;
+        /**
+          * Accent fill color used when checked/indeterminate. Defaults to the current design token.
+         */
+        "checkedColor"?: string;
         /**
           * Disabled state
           * @default false
@@ -848,10 +857,6 @@ export namespace Components {
           * Label text displayed beside the checkbox
          */
         "label"?: string;
-        /**
-          * Accent fill color used when checked/indeterminate. Defaults to the current design token.
-         */
-        "onColor"?: string;
         /**
           * Size: small=16px, medium=20px, large=24px (overlay appearance: small=20px, medium/large=22px)
           * @default 'small'
@@ -996,10 +1001,17 @@ export namespace Components {
     }
     /**
      * Color picker with preset swatches. Shows a trigger with the current color
-     * swatch + hex value, and opens a popover panel with a grid of preset colors.
-     * The hex value is read-only (no manual editing) — a copy button lets the user
-     * copy the value to clipboard.
-     * @event coChange - Emits the selected hex string (e.g. "#0066FF").
+     * swatch + hex value, and opens a popover panel with a saturation/brightness
+     * area, a hue slider, a grid of preset colors and an editable hex field.
+     * The hex field previews while typing (`coInput`) and commits on gesture end
+     * — blur, Enter or panel close — like every other control in the panel. A
+     * pasted CSS color commits immediately; a copy button copies the current value.
+     * @event coInput - Live hex while a gesture is in flight — dragging the area or
+     * the hue slider, and typing a valid hex in the field (preview only, never a
+     * commit).
+     * @event coChange - Emits the committed hex string (e.g. "#0066FF"): pointer
+     * release, arrow key, swatch click, paste, and the end of a hex-field edit
+     * (blur, Enter or panel close).
      */
     interface CoColorPicker {
         /**
@@ -1020,6 +1032,11 @@ export namespace Components {
           * @default 'vertical'
          */
         "layout": 'vertical' | 'horizontal';
+        /**
+          * Idioma de los textos accesibles. Misma prop que co-file-field/co-date-picker.
+          * @default 'en'
+         */
+        "locale": string;
         /**
           * Field name for form submission.
          */
@@ -1784,8 +1801,10 @@ export namespace Components {
     }
     /**
      * Date + TIME picker: one field, one popover. Composes `co-popover` (floating
-     * panel, outside-click) + `co-calendar` (day grid) + a scrollable list of times
-     * beside it — the Google Calendar layout.
+     * panel, outside-click) + `co-calendar` (day grid) + a side panel with
+     * shortcuts (`presetIds`: morning/noon/afternoon/endOfDay/now) and a segmented
+     * `co-time-field` (hh:mm, PageUp/PageDown stepping by `stepMinutes`) for the
+     * exact hour, plus a "Listo" button.
      * VALUE CONTRACT — the committed `value` is a UTC ISO instant
      * ("2026-07-25T21:30:00.000Z"), never a wall-clock string. The wall clock the
      * user sees and edits is rendered in `timeZone` (IANA; browser zone when
@@ -1796,15 +1815,25 @@ export namespace Components {
      * `timeZone` at {@link DEFAULT_MINUTES} (09:00), never as UTC midnight (which
      * would shift the day west of UTC).
      * INTERACTION (Google):
-     *   - Click the field → opens. Picking a DAY commits and keeps the panel open
-     *     (you almost always want to set the hour next); picking a TIME commits and
-     *     closes. So there is no draft/apply step and no confirm button.
+     *   - Click the field → opens. Picking a DAY commits (with the current DRAFT
+     *     hour, not the previously committed one) and keeps the panel open — you
+     *     almost always want to set the hour next.
+     *   - The exact time is a DRAFT (`draftMinutes`) while `co-time-field` is
+     *     edited (`coInput`) — editing alone never commits. It only commits (and
+     *     closes) on: clicking a shortcut, Enter/`coCommit` from the time field,
+     *     or the "Listo" button.
+     *   - Outside click — and, on mobile, swiping the bottom sheet down — commits
+     *     the draft if it changed, then closes: the same "apply on blur" model a
+     *     text field uses.
+     *   - Escape is the opposite: an explicit DISCARD. It closes WITHOUT applying
+     *     the draft and returns focus to the trigger field.
      *   - ArrowDown on the field → moves focus into the calendar grid.
-     *   - The time list is a listbox: Arrow/Home/End/PageUp/PageDown move the active
-     *     option, Enter/Space selects it.
-     *   - Escape → closes and returns focus to the field. Outside click → closes.
-     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return to
-     * the field; outside-click stays with co-popover.
+     *   - Mobile (viewport ≤ `mobileBreakpoint`) renders the same panel as a
+     *     bottom sheet (`co-drawer position="bottom"`) instead of the desktop
+     *     popover; the draft/commit/discard model is identical.
+     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return
+     * to the field; outside-click/sheet-dismiss stay with co-popover/co-drawer and
+     * are handled by `closeApplyingDraft` (see its doc for the Escape asymmetry).
      */
     interface CoDateTimePicker {
         /**
@@ -1872,6 +1901,11 @@ export namespace Components {
           * @default 'bottom-start'
          */
         "placement": Placement;
+        /**
+          * Atajos del panel, en orden. Ids del catálogo: morning|noon|afternoon|endOfDay|now.
+          * @default ['morning', 'noon', 'afternoon', 'endOfDay', 'now']
+         */
+        "presetIds": string[] | string;
         /**
           * @default false
          */
@@ -1886,7 +1920,7 @@ export namespace Components {
          */
         "size": 's' | 'sm' | 'md' | 'lg';
         /**
-          * Minutes between consecutive options in the time list.
+          * Paso de PageUp/PageDown del campo de hora (antes: paso de la lista).
           * @default 15
          */
         "stepMinutes": number;
@@ -2507,6 +2541,15 @@ export namespace Components {
           * @default 'light'
          */
         "surface": 'light' | 'dark';
+        /**
+          * Second icon of the swap (play/pause, hamburger/x). With it set, `toggled` picks which one shows. ⚠️ The swap's crossfade drops the icon name as the accessible name source — with `toggleIcon` set, the consumer MUST pass `label` explicitly (the icon alone no longer describes the state).
+         */
+        "toggleIcon"?: string;
+        /**
+          * Swap state: false → `icon`, true → `toggleIcon`.
+          * @default false
+         */
+        "toggled": boolean;
         /**
           * filled = dark background (negro), outlined = light background (blanco + border), ghost = transparent background, no border, tinted hover (negro-8 on light / blanco-16 on dark). Matches Figma: Secundario → filled, Primario → outlined
           * @default 'filled'
@@ -2689,10 +2732,13 @@ export namespace Components {
         "value": string;
     }
     /**
-     * Fullscreen image viewer — dark scrim, zoom (wheel / buttons / double-click,
+     * Fullscreen media viewer — dark scrim, zoom (wheel / buttons / double-click,
      * anchored at the cursor), drag-to-pan while zoomed, and prev/next carousel
-     * when more than one image is provided. Keyboard: Escape closes, arrows
+     * when more than one item is provided. Keyboard: Escape closes, arrows
      * navigate, +/- zoom, 0 resets.
+     * An item with `kind: 'video'` mounts a `co-video` instead of an `<img>`:
+     * zoom/pan make no sense over a seek bar, so they are disabled (and their
+     * toolbar cluster hidden) for as long as that slide is active.
      * Controlled like co-modal: the host owns `open` and reacts to `coClose`.
      * CAVEAT: the root is `position: fixed`, so an ancestor with `transform`,
      * `filter` or `will-change: transform` (e.g. an OPEN co-drawer) becomes its
@@ -2912,6 +2958,10 @@ export namespace Components {
           * Optional second line under the label (muted, smaller) — e.g. what an export method means. The row auto-grows (min-height, not height).
          */
         "caption"?: string;
+        /**
+          * Cierra el submenú YA (sin delay de gracia). Público: lo invoca el hermano que se está abriendo, mismo patrón cross-elemento que `focusItem`.
+         */
+        "closeSubmenu": () => Promise<void>;
         /**
           * Tighter row metrics (32px instead of 36px).
           * @default false
@@ -3027,10 +3077,15 @@ export namespace Components {
          */
         "disabled": boolean;
         /**
-          * Display format. With 'rate' | 'percent' the `value` stays a DECIMAL (e.g. 0.15) but the field shows/edits the PERCENT (15) with a "%" suffix. value/min/max/step are always in the underlying (decimal) unit. Reflected so it survives lazy hydration when set via the Vue wrapper.
+          * Display format. With 'rate' | 'percent' the `value` stays a DECIMAL (e.g. 0.15) but the field shows/edits the PERCENT (15) with a "%" suffix. value/min/max/step are always in the underlying (decimal) unit. With 'amount' the field is a live money mask: thousands separators while typing (1234.5 shows 1,234.5), typing restricted to digits and dot, and paste normalized whatever the source locale ("1.234,56" and "1,234.56" both commit 1234.56). The emitted value is always the raw number. Reflected so it survives lazy hydration when set via the Vue wrapper.
          */
-        "format"?: 'rate' | 'percent';
+        "format"?: 'rate' | 'percent' | 'amount';
         "helperText"?: string;
+        /**
+          * Oculta los botones ± (campo numérico "plano": precio, tasa). Las flechas ↑↓ siguen escalonando. Reflejado para que el CSS del host lo lea.
+          * @default false
+         */
+        "hideControls": boolean;
         "label"?: string;
         /**
           * Label layout: vertical (label above) or horizontal (label beside)
@@ -3061,6 +3116,10 @@ export namespace Components {
           * @default 1
          */
         "step": number;
+        /**
+          * Sufijo de texto a la derecha del número (moneda, unidad). Reemplaza al "%" automático de `format`; cadena vacía = sin sufijo (útil cuando el slot `suffix` ya lleva el control que indica la unidad).
+         */
+        "suffix"?: string;
         /**
           * @default 0
          */
@@ -3188,6 +3247,11 @@ export namespace Components {
           * Re-toma el snapshot selected-first. El host la llama al abrir su panel.
          */
         "snapshotOrder": () => Promise<void>;
+        /**
+          * `end` pinta el suffix como columna a la derecha de la fila (precio/meta), sin el guion; `inline` = junto al label (default).
+          * @default 'inline'
+         */
+        "suffixAlign": 'inline' | 'end';
         /**
           * Total del server: deriva hasMore + hint "N more results".
           * @default 0
@@ -3830,7 +3894,7 @@ export namespace Components {
           * Toolbar layout variant.
           * @default 'basic'
          */
-        "variant": 'none' | 'compact' | 'compact-assets' | 'basic' | 'full';
+        "variant": 'none' | 'compact' | 'compact-assets' | 'basic' | 'notes' | 'full';
     }
     interface CoRichTextViewer {
         /**
@@ -4086,6 +4150,11 @@ export namespace Components {
           * @default ''
          */
         "height": string;
+        /**
+          * Handoff al contenido real: fade-out del shimmer; el host desmonta en coRevealEnd.
+          * @default false
+         */
+        "revealed": boolean;
         /**
           * rect (default) | text (radio menor) | circle
           * @default 'rect'
@@ -4385,6 +4454,46 @@ export namespace Components {
          */
         "variant": 'default' | 'flat';
     }
+    /**
+     * Campo de hora segmentado (patrón React Aria TimeField): una parte enfocable
+     * por unidad — hora, minuto y a. m./p. m. (solo `hour12`). El VALOR es
+     * minutos-del-día (0–1439), tz-free a propósito: la zona es problema del host.
+     * Editar NO committea: cada edición válida emite `coInput` (draft). Enter emite
+     * `coCommit`; Escape emite `coEscape`. El host decide qué hacer con cada uno
+     * (co-date-time-picker: coInput→draft, coCommit→commit+close).
+     * `coEscape` = anuncio de intención; el picker NO lo wirea — ver
+     * co-date-time-picker.tsx (Escape lo posee su root handler).
+     */
+    interface CoTimeField {
+        /**
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * aria-label del grupo cuando el host no pinta label visible.
+         */
+        "fieldLabel"?: string;
+        "focusInput": () => Promise<void>;
+        /**
+          * Reloj de 12 h. `false` = 00–23 sin segmento de período.
+          * @default true
+         */
+        "hour12": boolean;
+        /**
+          * @default 'es-CO'
+         */
+        "locale": string;
+        /**
+          * Paso de PageUp/PageDown sobre el minuto.
+          * @default 15
+         */
+        "pageStep": number;
+        /**
+          * Minutos del día (0–1439) o null (vacío).
+          * @default null
+         */
+        "value": number | null;
+    }
     interface CoToast {
         /**
           * Where action-slot content sits: inline with dismiss, or stacked on a new row below.
@@ -4530,7 +4639,7 @@ export namespace Components {
         "placement": Placement;
         /**
           * Delay in ms before showing the tooltip on hover.
-          * @default 300
+          * @default 80
          */
         "showDelay": number;
     }
@@ -4942,6 +5051,10 @@ export interface CoSidebarNavCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCoSidebarNavElement;
 }
+export interface CoSkeletonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCoSkeletonElement;
+}
 export interface CoSliderCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCoSliderElement;
@@ -4966,6 +5079,10 @@ export interface CoTextareaCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCoTextareaElement;
 }
+export interface CoTimeFieldCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLCoTimeFieldElement;
+}
 export interface CoToastCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLCoToastElement;
@@ -5401,13 +5518,21 @@ declare global {
     };
     interface HTMLCoColorPickerElementEventMap {
         "coChange": string;
+        "coInput": string;
     }
     /**
      * Color picker with preset swatches. Shows a trigger with the current color
-     * swatch + hex value, and opens a popover panel with a grid of preset colors.
-     * The hex value is read-only (no manual editing) — a copy button lets the user
-     * copy the value to clipboard.
-     * @event coChange - Emits the selected hex string (e.g. "#0066FF").
+     * swatch + hex value, and opens a popover panel with a saturation/brightness
+     * area, a hue slider, a grid of preset colors and an editable hex field.
+     * The hex field previews while typing (`coInput`) and commits on gesture end
+     * — blur, Enter or panel close — like every other control in the panel. A
+     * pasted CSS color commits immediately; a copy button copies the current value.
+     * @event coInput - Live hex while a gesture is in flight — dragging the area or
+     * the hue slider, and typing a valid hex in the field (preview only, never a
+     * commit).
+     * @event coChange - Emits the committed hex string (e.g. "#0066FF"): pointer
+     * release, arrow key, swatch click, paste, and the end of a hex-field edit
+     * (blur, Enter or panel close).
      */
     interface HTMLCoColorPickerElement extends Components.CoColorPicker, HTMLStencilElement {
         addEventListener<K extends keyof HTMLCoColorPickerElementEventMap>(type: K, listener: (this: HTMLCoColorPickerElement, ev: CoColorPickerCustomEvent<HTMLCoColorPickerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -5675,8 +5800,10 @@ declare global {
     }
     /**
      * Date + TIME picker: one field, one popover. Composes `co-popover` (floating
-     * panel, outside-click) + `co-calendar` (day grid) + a scrollable list of times
-     * beside it — the Google Calendar layout.
+     * panel, outside-click) + `co-calendar` (day grid) + a side panel with
+     * shortcuts (`presetIds`: morning/noon/afternoon/endOfDay/now) and a segmented
+     * `co-time-field` (hh:mm, PageUp/PageDown stepping by `stepMinutes`) for the
+     * exact hour, plus a "Listo" button.
      * VALUE CONTRACT — the committed `value` is a UTC ISO instant
      * ("2026-07-25T21:30:00.000Z"), never a wall-clock string. The wall clock the
      * user sees and edits is rendered in `timeZone` (IANA; browser zone when
@@ -5687,15 +5814,25 @@ declare global {
      * `timeZone` at {@link DEFAULT_MINUTES} (09:00), never as UTC midnight (which
      * would shift the day west of UTC).
      * INTERACTION (Google):
-     *   - Click the field → opens. Picking a DAY commits and keeps the panel open
-     *     (you almost always want to set the hour next); picking a TIME commits and
-     *     closes. So there is no draft/apply step and no confirm button.
+     *   - Click the field → opens. Picking a DAY commits (with the current DRAFT
+     *     hour, not the previously committed one) and keeps the panel open — you
+     *     almost always want to set the hour next.
+     *   - The exact time is a DRAFT (`draftMinutes`) while `co-time-field` is
+     *     edited (`coInput`) — editing alone never commits. It only commits (and
+     *     closes) on: clicking a shortcut, Enter/`coCommit` from the time field,
+     *     or the "Listo" button.
+     *   - Outside click — and, on mobile, swiping the bottom sheet down — commits
+     *     the draft if it changed, then closes: the same "apply on blur" model a
+     *     text field uses.
+     *   - Escape is the opposite: an explicit DISCARD. It closes WITHOUT applying
+     *     the draft and returns focus to the trigger field.
      *   - ArrowDown on the field → moves focus into the calendar grid.
-     *   - The time list is a listbox: Arrow/Home/End/PageUp/PageDown move the active
-     *     option, Enter/Space selects it.
-     *   - Escape → closes and returns focus to the field. Outside click → closes.
-     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return to
-     * the field; outside-click stays with co-popover.
+     *   - Mobile (viewport ≤ `mobileBreakpoint`) renders the same panel as a
+     *     bottom sheet (`co-drawer position="bottom"`) instead of the desktop
+     *     popover; the draft/commit/discard model is identical.
+     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return
+     * to the field; outside-click/sheet-dismiss stay with co-popover/co-drawer and
+     * are handled by `closeApplyingDraft` (see its doc for the Escape asymmetry).
      */
     interface HTMLCoDateTimePickerElement extends Components.CoDateTimePicker, HTMLStencilElement {
         addEventListener<K extends keyof HTMLCoDateTimePickerElementEventMap>(type: K, listener: (this: HTMLCoDateTimePickerElement, ev: CoDateTimePickerCustomEvent<HTMLCoDateTimePickerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -6035,10 +6172,13 @@ declare global {
         "coChange": number;
     }
     /**
-     * Fullscreen image viewer — dark scrim, zoom (wheel / buttons / double-click,
+     * Fullscreen media viewer — dark scrim, zoom (wheel / buttons / double-click,
      * anchored at the cursor), drag-to-pan while zoomed, and prev/next carousel
-     * when more than one image is provided. Keyboard: Escape closes, arrows
+     * when more than one item is provided. Keyboard: Escape closes, arrows
      * navigate, +/- zoom, 0 resets.
+     * An item with `kind: 'video'` mounts a `co-video` instead of an `<img>`:
+     * zoom/pan make no sense over a seek bar, so they are disabled (and their
+     * toolbar cluster hidden) for as long as that slide is active.
      * Controlled like co-modal: the host owns `open` and reacts to `coClose`.
      * CAVEAT: the root is `position: fixed`, so an ancestor with `transform`,
      * `filter` or `will-change: transform` (e.g. an OPEN co-drawer) becomes its
@@ -6338,6 +6478,7 @@ declare global {
     interface HTMLCoPopoverElementEventMap {
         "coOpen": void;
         "coClose": void;
+        "coPlacement": { placement: Placement };
     }
     interface HTMLCoPopoverElement extends Components.CoPopover, HTMLStencilElement {
         addEventListener<K extends keyof HTMLCoPopoverElementEventMap>(type: K, listener: (this: HTMLCoPopoverElement, ev: CoPopoverCustomEvent<HTMLCoPopoverElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -6617,11 +6758,22 @@ declare global {
         prototype: HTMLCoSidebarNavElement;
         new (): HTMLCoSidebarNavElement;
     };
+    interface HTMLCoSkeletonElementEventMap {
+        "coRevealEnd": void;
+    }
     /**
      * Placeholder de carga con shimmer (sweep). Componer apilando varios.
      * Respeta prefers-reduced-motion (sin animación).
      */
     interface HTMLCoSkeletonElement extends Components.CoSkeleton, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCoSkeletonElementEventMap>(type: K, listener: (this: HTMLCoSkeletonElement, ev: CoSkeletonCustomEvent<HTMLCoSkeletonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCoSkeletonElementEventMap>(type: K, listener: (this: HTMLCoSkeletonElement, ev: CoSkeletonCustomEvent<HTMLCoSkeletonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
     var HTMLCoSkeletonElement: {
         prototype: HTMLCoSkeletonElement;
@@ -6755,6 +6907,35 @@ declare global {
         prototype: HTMLCoTextareaElement;
         new (): HTMLCoTextareaElement;
     };
+    interface HTMLCoTimeFieldElementEventMap {
+        "coInput": number | null;
+        "coCommit": number;
+        "coEscape": void;
+    }
+    /**
+     * Campo de hora segmentado (patrón React Aria TimeField): una parte enfocable
+     * por unidad — hora, minuto y a. m./p. m. (solo `hour12`). El VALOR es
+     * minutos-del-día (0–1439), tz-free a propósito: la zona es problema del host.
+     * Editar NO committea: cada edición válida emite `coInput` (draft). Enter emite
+     * `coCommit`; Escape emite `coEscape`. El host decide qué hacer con cada uno
+     * (co-date-time-picker: coInput→draft, coCommit→commit+close).
+     * `coEscape` = anuncio de intención; el picker NO lo wirea — ver
+     * co-date-time-picker.tsx (Escape lo posee su root handler).
+     */
+    interface HTMLCoTimeFieldElement extends Components.CoTimeField, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLCoTimeFieldElementEventMap>(type: K, listener: (this: HTMLCoTimeFieldElement, ev: CoTimeFieldCustomEvent<HTMLCoTimeFieldElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLCoTimeFieldElementEventMap>(type: K, listener: (this: HTMLCoTimeFieldElement, ev: CoTimeFieldCustomEvent<HTMLCoTimeFieldElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLCoTimeFieldElement: {
+        prototype: HTMLCoTimeFieldElement;
+        new (): HTMLCoTimeFieldElement;
+    };
     interface HTMLCoToastElementEventMap {
         "coDismiss": void;
     }
@@ -6833,7 +7014,7 @@ declare global {
         "coPlay": void;
         "coPause": void;
         "coEnded": void;
-        "coReady": { duration: number };
+        "coReady": { duration: number; width: number; height: number };
         "coError": { code: number; message: string };
         "coTimeUpdate": { currentTime: number; duration: number; progressPercent: number };
         "coSeeked": { from: number; to: number };
@@ -6949,6 +7130,7 @@ declare global {
         "co-tab-group": HTMLCoTabGroupElement;
         "co-tags-field": HTMLCoTagsFieldElement;
         "co-textarea": HTMLCoTextareaElement;
+        "co-time-field": HTMLCoTimeFieldElement;
         "co-toast": HTMLCoToastElement;
         "co-toggle-button": HTMLCoToggleButtonElement;
         "co-toggle-button-group": HTMLCoToggleButtonGroupElement;
@@ -7257,6 +7439,11 @@ declare namespace LocalJSX {
         "size"?: 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs';
     }
     interface CoBadge {
+        /**
+          * Pop de entrada al montar (spring + blur). Opt-in: un badge estático no debe animar al render. El host activa `animated` solo donde el énfasis de entrada se desea; un remonte por `:key` re-popea — comportamiento aceptado, no una regresión.
+          * @default false
+         */
+        "animated"?: boolean;
         /**
           * Color — maps to semantic status tokens
           * @default 'default'
@@ -7827,6 +8014,10 @@ declare namespace LocalJSX {
           * @default false
          */
         "checked"?: boolean;
+        /**
+          * Accent fill color used when checked/indeterminate. Defaults to the current design token.
+         */
+        "checkedColor"?: string;
         /**
           * Disabled state
           * @default false
@@ -7845,10 +8036,6 @@ declare namespace LocalJSX {
           * Fired when the value changes
          */
         "onCoChange"?: (event: CoCheckboxCustomEvent<boolean>) => void;
-        /**
-          * Accent fill color used when checked/indeterminate. Defaults to the current design token.
-         */
-        "onColor"?: string;
         /**
           * Size: small=16px, medium=20px, large=24px (overlay appearance: small=20px, medium/large=22px)
           * @default 'small'
@@ -8005,10 +8192,17 @@ declare namespace LocalJSX {
     }
     /**
      * Color picker with preset swatches. Shows a trigger with the current color
-     * swatch + hex value, and opens a popover panel with a grid of preset colors.
-     * The hex value is read-only (no manual editing) — a copy button lets the user
-     * copy the value to clipboard.
-     * @event coChange - Emits the selected hex string (e.g. "#0066FF").
+     * swatch + hex value, and opens a popover panel with a saturation/brightness
+     * area, a hue slider, a grid of preset colors and an editable hex field.
+     * The hex field previews while typing (`coInput`) and commits on gesture end
+     * — blur, Enter or panel close — like every other control in the panel. A
+     * pasted CSS color commits immediately; a copy button copies the current value.
+     * @event coInput - Live hex while a gesture is in flight — dragging the area or
+     * the hue slider, and typing a valid hex in the field (preview only, never a
+     * commit).
+     * @event coChange - Emits the committed hex string (e.g. "#0066FF"): pointer
+     * release, arrow key, swatch click, paste, and the end of a hex-field edit
+     * (blur, Enter or panel close).
      */
     interface CoColorPicker {
         /**
@@ -8029,6 +8223,11 @@ declare namespace LocalJSX {
           * @default 'vertical'
          */
         "layout"?: 'vertical' | 'horizontal';
+        /**
+          * Idioma de los textos accesibles. Misma prop que co-file-field/co-date-picker.
+          * @default 'en'
+         */
+        "locale"?: string;
         /**
           * Field name for form submission.
          */
@@ -8037,6 +8236,10 @@ declare namespace LocalJSX {
           * Emits the selected hex color on change.
          */
         "onCoChange"?: (event: CoColorPickerCustomEvent<string>) => void;
+        /**
+          * Hex en vivo mientras se arrastra el área o el matiz. El host lo usa para previsualizar si quiere.  La partición con `coChange` es el contrato nuevo y existe por una razón concreta: un arrastre produce ~60 valores por segundo, y emitirlos todos como `coChange` ensucia la sesión del formulario en cada frame (un "cambios sin guardar" por píxel movido). `coChange` sigue significando exactamente lo que significaba —commit—, así que los consumidores actuales no cambian una línea.
+         */
+        "onCoInput"?: (event: CoColorPickerCustomEvent<string>) => void;
         /**
           * Placeholder text when no color is selected.
           * @default 'Select color'
@@ -8922,8 +9125,10 @@ declare namespace LocalJSX {
     }
     /**
      * Date + TIME picker: one field, one popover. Composes `co-popover` (floating
-     * panel, outside-click) + `co-calendar` (day grid) + a scrollable list of times
-     * beside it — the Google Calendar layout.
+     * panel, outside-click) + `co-calendar` (day grid) + a side panel with
+     * shortcuts (`presetIds`: morning/noon/afternoon/endOfDay/now) and a segmented
+     * `co-time-field` (hh:mm, PageUp/PageDown stepping by `stepMinutes`) for the
+     * exact hour, plus a "Listo" button.
      * VALUE CONTRACT — the committed `value` is a UTC ISO instant
      * ("2026-07-25T21:30:00.000Z"), never a wall-clock string. The wall clock the
      * user sees and edits is rendered in `timeZone` (IANA; browser zone when
@@ -8934,15 +9139,25 @@ declare namespace LocalJSX {
      * `timeZone` at {@link DEFAULT_MINUTES} (09:00), never as UTC midnight (which
      * would shift the day west of UTC).
      * INTERACTION (Google):
-     *   - Click the field → opens. Picking a DAY commits and keeps the panel open
-     *     (you almost always want to set the hour next); picking a TIME commits and
-     *     closes. So there is no draft/apply step and no confirm button.
+     *   - Click the field → opens. Picking a DAY commits (with the current DRAFT
+     *     hour, not the previously committed one) and keeps the panel open — you
+     *     almost always want to set the hour next.
+     *   - The exact time is a DRAFT (`draftMinutes`) while `co-time-field` is
+     *     edited (`coInput`) — editing alone never commits. It only commits (and
+     *     closes) on: clicking a shortcut, Enter/`coCommit` from the time field,
+     *     or the "Listo" button.
+     *   - Outside click — and, on mobile, swiping the bottom sheet down — commits
+     *     the draft if it changed, then closes: the same "apply on blur" model a
+     *     text field uses.
+     *   - Escape is the opposite: an explicit DISCARD. It closes WITHOUT applying
+     *     the draft and returns focus to the trigger field.
      *   - ArrowDown on the field → moves focus into the calendar grid.
-     *   - The time list is a listbox: Arrow/Home/End/PageUp/PageDown move the active
-     *     option, Enter/Space selects it.
-     *   - Escape → closes and returns focus to the field. Outside click → closes.
-     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return to
-     * the field; outside-click stays with co-popover.
+     *   - Mobile (viewport ≤ `mobileBreakpoint`) renders the same panel as a
+     *     bottom sheet (`co-drawer position="bottom"`) instead of the desktop
+     *     popover; the draft/commit/discard model is identical.
+     * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return
+     * to the field; outside-click/sheet-dismiss stay with co-popover/co-drawer and
+     * are handled by `closeApplyingDraft` (see its doc for the Escape asymmetry).
      */
     interface CoDateTimePicker {
         /**
@@ -9019,6 +9234,11 @@ declare namespace LocalJSX {
           * @default 'bottom-start'
          */
         "placement"?: Placement;
+        /**
+          * Atajos del panel, en orden. Ids del catálogo: morning|noon|afternoon|endOfDay|now.
+          * @default ['morning', 'noon', 'afternoon', 'endOfDay', 'now']
+         */
+        "presetIds"?: string[] | string;
         /**
           * @default false
          */
@@ -9033,7 +9253,7 @@ declare namespace LocalJSX {
          */
         "size"?: 's' | 'sm' | 'md' | 'lg';
         /**
-          * Minutes between consecutive options in the time list.
+          * Paso de PageUp/PageDown del campo de hora (antes: paso de la lista).
           * @default 15
          */
         "stepMinutes"?: number;
@@ -9771,6 +9991,15 @@ declare namespace LocalJSX {
           * @default 'light'
          */
         "surface"?: 'light' | 'dark';
+        /**
+          * Second icon of the swap (play/pause, hamburger/x). With it set, `toggled` picks which one shows. ⚠️ The swap's crossfade drops the icon name as the accessible name source — with `toggleIcon` set, the consumer MUST pass `label` explicitly (the icon alone no longer describes the state).
+         */
+        "toggleIcon"?: string;
+        /**
+          * Swap state: false → `icon`, true → `toggleIcon`.
+          * @default false
+         */
+        "toggled"?: boolean;
         /**
           * filled = dark background (negro), outlined = light background (blanco + border), ghost = transparent background, no border, tinted hover (negro-8 on light / blanco-16 on dark). Matches Figma: Secundario → filled, Primario → outlined
           * @default 'filled'
@@ -9987,10 +10216,13 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     /**
-     * Fullscreen image viewer — dark scrim, zoom (wheel / buttons / double-click,
+     * Fullscreen media viewer — dark scrim, zoom (wheel / buttons / double-click,
      * anchored at the cursor), drag-to-pan while zoomed, and prev/next carousel
-     * when more than one image is provided. Keyboard: Escape closes, arrows
+     * when more than one item is provided. Keyboard: Escape closes, arrows
      * navigate, +/- zoom, 0 resets.
+     * An item with `kind: 'video'` mounts a `co-video` instead of an `<img>`:
+     * zoom/pan make no sense over a seek bar, so they are disabled (and their
+     * toolbar cluster hidden) for as long as that slide is active.
      * Controlled like co-modal: the host owns `open` and reacts to `coClose`.
      * CAVEAT: the root is `position: fixed`, so an ancestor with `transform`,
      * `filter` or `will-change: transform` (e.g. an OPEN co-drawer) becomes its
@@ -10362,10 +10594,15 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * Display format. With 'rate' | 'percent' the `value` stays a DECIMAL (e.g. 0.15) but the field shows/edits the PERCENT (15) with a "%" suffix. value/min/max/step are always in the underlying (decimal) unit. Reflected so it survives lazy hydration when set via the Vue wrapper.
+          * Display format. With 'rate' | 'percent' the `value` stays a DECIMAL (e.g. 0.15) but the field shows/edits the PERCENT (15) with a "%" suffix. value/min/max/step are always in the underlying (decimal) unit. With 'amount' the field is a live money mask: thousands separators while typing (1234.5 shows 1,234.5), typing restricted to digits and dot, and paste normalized whatever the source locale ("1.234,56" and "1,234.56" both commit 1234.56). The emitted value is always the raw number. Reflected so it survives lazy hydration when set via the Vue wrapper.
          */
-        "format"?: 'rate' | 'percent';
+        "format"?: 'rate' | 'percent' | 'amount';
         "helperText"?: string;
+        /**
+          * Oculta los botones ± (campo numérico "plano": precio, tasa). Las flechas ↑↓ siguen escalonando. Reflejado para que el CSS del host lo lea.
+          * @default false
+         */
+        "hideControls"?: boolean;
         "label"?: string;
         /**
           * Label layout: vertical (label above) or horizontal (label beside)
@@ -10401,6 +10638,10 @@ declare namespace LocalJSX {
           * @default 1
          */
         "step"?: number;
+        /**
+          * Sufijo de texto a la derecha del número (moneda, unidad). Reemplaza al "%" automático de `format`; cadena vacía = sin sufijo (útil cuando el slot `suffix` ya lleva el control que indica la unidad).
+         */
+        "suffix"?: string;
         /**
           * @default 0
          */
@@ -10529,6 +10770,11 @@ declare namespace LocalJSX {
           * @default '[]'
          */
         "selectedItems"?: string | OptionListItem[];
+        /**
+          * `end` pinta el suffix como columna a la derecha de la fila (precio/meta), sin el guion; `inline` = junto al label (default).
+          * @default 'inline'
+         */
+        "suffixAlign"?: 'inline' | 'end';
         /**
           * Total del server: deriva hasMore + hint "N more results".
           * @default 0
@@ -10676,6 +10922,10 @@ declare namespace LocalJSX {
         "offset"?: number;
         "onCoClose"?: (event: CoPopoverCustomEvent<void>) => void;
         "onCoOpen"?: (event: CoPopoverCustomEvent<void>) => void;
+        /**
+          * El placement REAL con el que quedó el panel, ya pasado por el flip — que puede no ser el de la prop `placement`. Lo consume `co-menu-item` para que una cadena de submenús herede la dirección (ver utils/submenu.ts): sin esto, un submenú anidado vuelve a abrir hacia la derecha y se dibuja encima del menú padre del que salió.  Se emite SOLO cuando el lado cambia (mismo guard que la clase del panel), así el path de scroll/resize no dispara un evento por tick.
+         */
+        "onCoPlacement"?: (event: CoPopoverCustomEvent<{ placement: Placement }>) => void;
         /**
           * Whether the popover panel is visible.
           * @default false
@@ -11248,7 +11498,7 @@ declare namespace LocalJSX {
           * Toolbar layout variant.
           * @default 'basic'
          */
-        "variant"?: 'none' | 'compact' | 'compact-assets' | 'basic' | 'full';
+        "variant"?: 'none' | 'compact' | 'compact-assets' | 'basic' | 'notes' | 'full';
     }
     interface CoRichTextViewer {
         /**
@@ -11522,6 +11772,15 @@ declare namespace LocalJSX {
           * @default ''
          */
         "height"?: string;
+        /**
+          * El fade-out de reveal terminó — el host puede desmontar el skeleton.
+         */
+        "onCoRevealEnd"?: (event: CoSkeletonCustomEvent<void>) => void;
+        /**
+          * Handoff al contenido real: fade-out del shimmer; el host desmonta en coRevealEnd.
+          * @default false
+         */
+        "revealed"?: boolean;
         /**
           * rect (default) | text (radio menor) | circle
           * @default 'rect'
@@ -11869,6 +12128,57 @@ declare namespace LocalJSX {
          */
         "variant"?: 'default' | 'flat';
     }
+    /**
+     * Campo de hora segmentado (patrón React Aria TimeField): una parte enfocable
+     * por unidad — hora, minuto y a. m./p. m. (solo `hour12`). El VALOR es
+     * minutos-del-día (0–1439), tz-free a propósito: la zona es problema del host.
+     * Editar NO committea: cada edición válida emite `coInput` (draft). Enter emite
+     * `coCommit`; Escape emite `coEscape`. El host decide qué hacer con cada uno
+     * (co-date-time-picker: coInput→draft, coCommit→commit+close).
+     * `coEscape` = anuncio de intención; el picker NO lo wirea — ver
+     * co-date-time-picker.tsx (Escape lo posee su root handler).
+     */
+    interface CoTimeField {
+        /**
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * aria-label del grupo cuando el host no pinta label visible.
+         */
+        "fieldLabel"?: string;
+        /**
+          * Reloj de 12 h. `false` = 00–23 sin segmento de período.
+          * @default true
+         */
+        "hour12"?: boolean;
+        /**
+          * @default 'es-CO'
+         */
+        "locale"?: string;
+        /**
+          * Enter: el host committea y cierra.
+         */
+        "onCoCommit"?: (event: CoTimeFieldCustomEvent<number>) => void;
+        /**
+          * Escape: el host cierra sin aplicar.
+         */
+        "onCoEscape"?: (event: CoTimeFieldCustomEvent<void>) => void;
+        /**
+          * Draft: cada edición válida (dígitos, flechas, stepper, a/p). `null` = draft incompleto (el segmento quedó vaciado por Backspace/Delete); el host conserva su último draft válido en ese caso.
+         */
+        "onCoInput"?: (event: CoTimeFieldCustomEvent<number | null>) => void;
+        /**
+          * Paso de PageUp/PageDown sobre el minuto.
+          * @default 15
+         */
+        "pageStep"?: number;
+        /**
+          * Minutos del día (0–1439) o null (vacío).
+          * @default null
+         */
+        "value"?: number | null;
+    }
     interface CoToast {
         /**
           * Where action-slot content sits: inline with dismiss, or stacked on a new row below.
@@ -12020,7 +12330,7 @@ declare namespace LocalJSX {
         "placement"?: Placement;
         /**
           * Delay in ms before showing the tooltip on hover.
-          * @default 300
+          * @default 80
          */
         "showDelay"?: number;
     }
@@ -12122,7 +12432,10 @@ declare namespace LocalJSX {
         "onCoPipChange"?: (event: CoVideoCustomEvent<{ pip: boolean }>) => void;
         "onCoPlay"?: (event: CoVideoCustomEvent<void>) => void;
         "onCoPlaybackRateChange"?: (event: CoVideoCustomEvent<{ rate: number }>) => void;
-        "onCoReady"?: (event: CoVideoCustomEvent<{ duration: number }>) => void;
+        /**
+          * Metadata lista. Incluye el tamaño INTRÍNSECO del medio para que el host pueda ajustar su caja al frame (0 × 0 si el navegador aún no lo sabe).
+         */
+        "onCoReady"?: (event: CoVideoCustomEvent<{ duration: number; width: number; height: number }>) => void;
         "onCoSeeked"?: (event: CoVideoCustomEvent<{ from: number; to: number }>) => void;
         "onCoThresholdReached"?: (event: CoVideoCustomEvent<{ threshold: number; currentTime: number; duration: number }>) => void;
         "onCoTimeUpdate"?: (event: CoVideoCustomEvent<{ currentTime: number; duration: number; progressPercent: number }>) => void;
@@ -12283,6 +12596,7 @@ declare namespace LocalJSX {
     interface CoBadgeAttributes {
         "size": 'large' | 'small';
         "color": 'default' | 'success' | 'error' | 'warning' | 'info';
+        "animated": boolean;
     }
     interface CoBottomSheetAttributes {
         "open": boolean;
@@ -12396,7 +12710,7 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "label": string;
         "value": string;
-        "onColor": string;
+        "checkedColor": string;
         "appearance": 'default' | 'overlay';
     }
     interface CoCheckboxGroupAttributes {
@@ -12443,6 +12757,7 @@ declare namespace LocalJSX {
         "size": 's' | 'sm' | 'md' | 'lg';
         "name": string;
         "presets": string | ColorPreset[] | string[];
+        "locale": string;
     }
     interface CoColumnPickerAttributes {
         "label": string;
@@ -12632,6 +12947,7 @@ declare namespace LocalJSX {
         "value": string | null;
         "timeZone": string;
         "stepMinutes": number;
+        "presetIds": string[] | string;
         "hour12": boolean;
         "min": string;
         "max": string;
@@ -12793,6 +13109,8 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "label": string;
         "icon": string;
+        "toggleIcon": string;
+        "toggled": boolean;
         "iconWeight": 'regular' | 'thin' | 'light' | 'bold' | 'fill' | 'duotone';
     }
     interface CoInputAttributes {
@@ -12916,7 +13234,9 @@ declare namespace LocalJSX {
         "placeholder": string;
         "size": 's' | 'sm' | 'md' | 'lg';
         "clearable": boolean;
-        "format": 'rate' | 'percent';
+        "format": 'rate' | 'percent' | 'amount';
+        "hideControls": boolean;
+        "suffix": string;
     }
     interface CoOptionListAttributes {
         "items": string | OptionListItem[];
@@ -12942,6 +13262,7 @@ declare namespace LocalJSX {
         "highlightMatches": boolean;
         "highlightTerm": string;
         "avatarShape": 'circle' | 'square';
+        "suffixAlign": 'inline' | 'end';
         "autoHighlight": boolean;
     }
     interface CoOverlayAttributes {
@@ -13088,7 +13409,7 @@ declare namespace LocalJSX {
         "locale": string;
     }
     interface CoRichTextToolbarAttributes {
-        "variant": 'none' | 'compact' | 'compact-assets' | 'basic' | 'full';
+        "variant": 'none' | 'compact' | 'compact-assets' | 'basic' | 'notes' | 'full';
         "disabled": boolean;
         "locale": string;
         "attachmentsEnabled": boolean;
@@ -13160,6 +13481,7 @@ declare namespace LocalJSX {
         "variant": 'rect' | 'text' | 'circle';
         "width": string;
         "height": string;
+        "revealed": boolean;
     }
     interface CoSliderAttributes {
         "label": string;
@@ -13234,6 +13556,14 @@ declare namespace LocalJSX {
         "clearable": boolean;
         "resize": 'vertical' | 'none' | 'both';
     }
+    interface CoTimeFieldAttributes {
+        "value": number | null;
+        "hour12": boolean;
+        "locale": string;
+        "disabled": boolean;
+        "pageStep": number;
+        "fieldLabel": string;
+    }
     interface CoToastAttributes {
         "message": string;
         "description": string;
@@ -13404,6 +13734,7 @@ declare namespace LocalJSX {
         "co-tab-group": Omit<CoTabGroup, keyof CoTabGroupAttributes> & { [K in keyof CoTabGroup & keyof CoTabGroupAttributes]?: CoTabGroup[K] } & { [K in keyof CoTabGroup & keyof CoTabGroupAttributes as `attr:${K}`]?: CoTabGroupAttributes[K] } & { [K in keyof CoTabGroup & keyof CoTabGroupAttributes as `prop:${K}`]?: CoTabGroup[K] };
         "co-tags-field": Omit<CoTagsField, keyof CoTagsFieldAttributes> & { [K in keyof CoTagsField & keyof CoTagsFieldAttributes]?: CoTagsField[K] } & { [K in keyof CoTagsField & keyof CoTagsFieldAttributes as `attr:${K}`]?: CoTagsFieldAttributes[K] } & { [K in keyof CoTagsField & keyof CoTagsFieldAttributes as `prop:${K}`]?: CoTagsField[K] };
         "co-textarea": Omit<CoTextarea, keyof CoTextareaAttributes> & { [K in keyof CoTextarea & keyof CoTextareaAttributes]?: CoTextarea[K] } & { [K in keyof CoTextarea & keyof CoTextareaAttributes as `attr:${K}`]?: CoTextareaAttributes[K] } & { [K in keyof CoTextarea & keyof CoTextareaAttributes as `prop:${K}`]?: CoTextarea[K] };
+        "co-time-field": Omit<CoTimeField, keyof CoTimeFieldAttributes> & { [K in keyof CoTimeField & keyof CoTimeFieldAttributes]?: CoTimeField[K] } & { [K in keyof CoTimeField & keyof CoTimeFieldAttributes as `attr:${K}`]?: CoTimeFieldAttributes[K] } & { [K in keyof CoTimeField & keyof CoTimeFieldAttributes as `prop:${K}`]?: CoTimeField[K] };
         "co-toast": Omit<CoToast, keyof CoToastAttributes> & { [K in keyof CoToast & keyof CoToastAttributes]?: CoToast[K] } & { [K in keyof CoToast & keyof CoToastAttributes as `attr:${K}`]?: CoToastAttributes[K] } & { [K in keyof CoToast & keyof CoToastAttributes as `prop:${K}`]?: CoToast[K] };
         "co-toggle-button": Omit<CoToggleButton, keyof CoToggleButtonAttributes> & { [K in keyof CoToggleButton & keyof CoToggleButtonAttributes]?: CoToggleButton[K] } & { [K in keyof CoToggleButton & keyof CoToggleButtonAttributes as `attr:${K}`]?: CoToggleButtonAttributes[K] } & { [K in keyof CoToggleButton & keyof CoToggleButtonAttributes as `prop:${K}`]?: CoToggleButton[K] };
         "co-toggle-button-group": Omit<CoToggleButtonGroup, keyof CoToggleButtonGroupAttributes> & { [K in keyof CoToggleButtonGroup & keyof CoToggleButtonGroupAttributes]?: CoToggleButtonGroup[K] } & { [K in keyof CoToggleButtonGroup & keyof CoToggleButtonGroupAttributes as `attr:${K}`]?: CoToggleButtonGroupAttributes[K] } & { [K in keyof CoToggleButtonGroup & keyof CoToggleButtonGroupAttributes as `prop:${K}`]?: CoToggleButtonGroup[K] };
@@ -13524,10 +13855,17 @@ declare module "@stencil/core" {
             "co-chip": LocalJSX.IntrinsicElements["co-chip"] & JSXBase.HTMLAttributes<HTMLCoChipElement>;
             /**
              * Color picker with preset swatches. Shows a trigger with the current color
-             * swatch + hex value, and opens a popover panel with a grid of preset colors.
-             * The hex value is read-only (no manual editing) — a copy button lets the user
-             * copy the value to clipboard.
-             * @event coChange - Emits the selected hex string (e.g. "#0066FF").
+             * swatch + hex value, and opens a popover panel with a saturation/brightness
+             * area, a hue slider, a grid of preset colors and an editable hex field.
+             * The hex field previews while typing (`coInput`) and commits on gesture end
+             * — blur, Enter or panel close — like every other control in the panel. A
+             * pasted CSS color commits immediately; a copy button copies the current value.
+             * @event coInput - Live hex while a gesture is in flight — dragging the area or
+             * the hue slider, and typing a valid hex in the field (preview only, never a
+             * commit).
+             * @event coChange - Emits the committed hex string (e.g. "#0066FF"): pointer
+             * release, arrow key, swatch click, paste, and the end of a hex-field edit
+             * (blur, Enter or panel close).
              */
             "co-color-picker": LocalJSX.IntrinsicElements["co-color-picker"] & JSXBase.HTMLAttributes<HTMLCoColorPickerElement>;
             "co-column-picker": LocalJSX.IntrinsicElements["co-column-picker"] & JSXBase.HTMLAttributes<HTMLCoColumnPickerElement>;
@@ -13588,8 +13926,10 @@ declare module "@stencil/core" {
             "co-date-range-picker": LocalJSX.IntrinsicElements["co-date-range-picker"] & JSXBase.HTMLAttributes<HTMLCoDateRangePickerElement>;
             /**
              * Date + TIME picker: one field, one popover. Composes `co-popover` (floating
-             * panel, outside-click) + `co-calendar` (day grid) + a scrollable list of times
-             * beside it — the Google Calendar layout.
+             * panel, outside-click) + `co-calendar` (day grid) + a side panel with
+             * shortcuts (`presetIds`: morning/noon/afternoon/endOfDay/now) and a segmented
+             * `co-time-field` (hh:mm, PageUp/PageDown stepping by `stepMinutes`) for the
+             * exact hour, plus a "Listo" button.
              * VALUE CONTRACT — the committed `value` is a UTC ISO instant
              * ("2026-07-25T21:30:00.000Z"), never a wall-clock string. The wall clock the
              * user sees and edits is rendered in `timeZone` (IANA; browser zone when
@@ -13600,15 +13940,25 @@ declare module "@stencil/core" {
              * `timeZone` at {@link DEFAULT_MINUTES} (09:00), never as UTC midnight (which
              * would shift the day west of UTC).
              * INTERACTION (Google):
-             *   - Click the field → opens. Picking a DAY commits and keeps the panel open
-             *     (you almost always want to set the hour next); picking a TIME commits and
-             *     closes. So there is no draft/apply step and no confirm button.
+             *   - Click the field → opens. Picking a DAY commits (with the current DRAFT
+             *     hour, not the previously committed one) and keeps the panel open — you
+             *     almost always want to set the hour next.
+             *   - The exact time is a DRAFT (`draftMinutes`) while `co-time-field` is
+             *     edited (`coInput`) — editing alone never commits. It only commits (and
+             *     closes) on: clicking a shortcut, Enter/`coCommit` from the time field,
+             *     or the "Listo" button.
+             *   - Outside click — and, on mobile, swiping the bottom sheet down — commits
+             *     the draft if it changed, then closes: the same "apply on blur" model a
+             *     text field uses.
+             *   - Escape is the opposite: an explicit DISCARD. It closes WITHOUT applying
+             *     the draft and returns focus to the trigger field.
              *   - ArrowDown on the field → moves focus into the calendar grid.
-             *   - The time list is a listbox: Arrow/Home/End/PageUp/PageDown move the active
-             *     option, Enter/Space selects it.
-             *   - Escape → closes and returns focus to the field. Outside click → closes.
-             * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return to
-             * the field; outside-click stays with co-popover.
+             *   - Mobile (viewport ≤ `mobileBreakpoint`) renders the same panel as a
+             *     bottom sheet (`co-drawer position="bottom"`) instead of the desktop
+             *     popover; the draft/commit/discard model is identical.
+             * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return
+             * to the field; outside-click/sheet-dismiss stay with co-popover/co-drawer and
+             * are handled by `closeApplyingDraft` (see its doc for the Escape asymmetry).
              */
             "co-date-time-picker": LocalJSX.IntrinsicElements["co-date-time-picker"] & JSXBase.HTMLAttributes<HTMLCoDateTimePickerElement>;
             "co-drawer": LocalJSX.IntrinsicElements["co-drawer"] & JSXBase.HTMLAttributes<HTMLCoDrawerElement>;
@@ -13699,10 +14049,13 @@ declare module "@stencil/core" {
              */
             "co-json-field": LocalJSX.IntrinsicElements["co-json-field"] & JSXBase.HTMLAttributes<HTMLCoJsonFieldElement>;
             /**
-             * Fullscreen image viewer — dark scrim, zoom (wheel / buttons / double-click,
+             * Fullscreen media viewer — dark scrim, zoom (wheel / buttons / double-click,
              * anchored at the cursor), drag-to-pan while zoomed, and prev/next carousel
-             * when more than one image is provided. Keyboard: Escape closes, arrows
+             * when more than one item is provided. Keyboard: Escape closes, arrows
              * navigate, +/- zoom, 0 resets.
+             * An item with `kind: 'video'` mounts a `co-video` instead of an `<img>`:
+             * zoom/pan make no sense over a seek bar, so they are disabled (and their
+             * toolbar cluster hidden) for as long as that slide is active.
              * Controlled like co-modal: the host owns `open` and reacts to `coClose`.
              * CAVEAT: the root is `position: fixed`, so an ancestor with `transform`,
              * `filter` or `will-change: transform` (e.g. an OPEN co-drawer) becomes its
@@ -13892,6 +14245,17 @@ declare module "@stencil/core" {
              * `<textarea>` for multiline content (bios, descriptions, notes).
              */
             "co-textarea": LocalJSX.IntrinsicElements["co-textarea"] & JSXBase.HTMLAttributes<HTMLCoTextareaElement>;
+            /**
+             * Campo de hora segmentado (patrón React Aria TimeField): una parte enfocable
+             * por unidad — hora, minuto y a. m./p. m. (solo `hour12`). El VALOR es
+             * minutos-del-día (0–1439), tz-free a propósito: la zona es problema del host.
+             * Editar NO committea: cada edición válida emite `coInput` (draft). Enter emite
+             * `coCommit`; Escape emite `coEscape`. El host decide qué hacer con cada uno
+             * (co-date-time-picker: coInput→draft, coCommit→commit+close).
+             * `coEscape` = anuncio de intención; el picker NO lo wirea — ver
+             * co-date-time-picker.tsx (Escape lo posee su root handler).
+             */
+            "co-time-field": LocalJSX.IntrinsicElements["co-time-field"] & JSXBase.HTMLAttributes<HTMLCoTimeFieldElement>;
             "co-toast": LocalJSX.IntrinsicElements["co-toast"] & JSXBase.HTMLAttributes<HTMLCoToastElement>;
             "co-toggle-button": LocalJSX.IntrinsicElements["co-toggle-button"] & JSXBase.HTMLAttributes<HTMLCoToggleButtonElement>;
             "co-toggle-button-group": LocalJSX.IntrinsicElements["co-toggle-button-group"] & JSXBase.HTMLAttributes<HTMLCoToggleButtonGroupElement>;