@prolibu-suite/cobalt-core 0.1.1 → 0.2.0

package/dist/types/components/co-date-picker/co-date-picker.d.ts

@@ -0,0 +1,92 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { Placement } from '../../utils/positioning';
+/**
+ * Single-date picker: composes `co-date-field` (manual typing) + `co-popover`
+ * (floating panel, outside-click) + `co-calendar` (visual selection, keyboard).
+ *
+ * The committed value is a date-only "YYYY-MM-DD" string (or null). Manual
+ * typing and calendar selection both flow into the same value; the calendar is
+ * an aid, never the only input.
+ *
+ * Interaction:
+ *   - Click the field → opens the calendar (focus stays in the input to type).
+ *   - ArrowDown in the field → moves focus into the calendar grid.
+ *   - Enter/click a day → selects, commits, closes (closeOnSelect), focus returns.
+ *   - Escape → closes and returns focus to the field.
+ *   - Outside click → closes (handled by co-popover).
+ *
+ * Escape is owned here (co-popover `closeOnEscape=false`) so focus can return to
+ * the field; outside-click stays with co-popover.
+ */
+export declare class CoDatePicker {
+    el: HTMLElement;
+    /** Committed value, "YYYY-MM-DD" or null. */
+    value: string | null;
+    min?: string;
+    max?: string;
+    disabledDates?: string[] | string;
+    disabledDaysOfWeek?: number[] | string;
+    locale: string;
+    displayFormat: string;
+    firstDayOfWeek: number;
+    label?: string;
+    placeholder?: string;
+    /** Field size, forwarded to the inner co-date-field. */
+    size: 's' | 'sm' | 'md' | 'lg';
+    name?: string;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    clearable: boolean;
+    invalid: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /** Popover placement relative to the field. */
+    placement: Placement;
+    /** Close the popover when a day is selected. */
+    closeOnSelect: boolean;
+    /** Whether the calendar popover is open. */
+    open: boolean;
+    /** Max viewport width (px) that renders the calendar as a bottom sheet. */
+    mobileBreakpoint: number;
+    /** True when the viewport is at/under `mobileBreakpoint`. */
+    isMobile: boolean;
+    coInput: EventEmitter<string>;
+    coChange: EventEmitter<string | null>;
+    coInvalid: EventEmitter<{
+        raw: string;
+    }>;
+    coClear: EventEmitter<void>;
+    coFocus: EventEmitter<void>;
+    coBlur: EventEmitter<void>;
+    coOpen: EventEmitter<void>;
+    coClose: EventEmitter<void>;
+    private internalInvalid;
+    private fieldEl?;
+    private calendarEl?;
+    private pendingFocusGrid;
+    private pendingFocusField;
+    private mql?;
+    private mqlHandler;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private get isInvalid();
+    private setOpen;
+    private onFieldChange;
+    private onFieldInput;
+    private onFieldInvalid;
+    private onFieldClear;
+    private onFieldKeyDown;
+    private onCalendarSelect;
+    private onPopoverOpen;
+    private onPopoverClose;
+    private onRootKeyDown;
+    private focusGridSoon;
+    componentDidRender(): void;
+    private renderField;
+    private renderCalendar;
+    private renderHelper;
+    render(): any;
+}

package/dist/types/components/co-date-range/co-date-range.d.ts

@@ -1,70 +1,32 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-export interface DateRangeValue {
-    from: string | null;
-    to: string | null;
-}
+import type { DateRangeValue } from '../co-date-range-picker/co-date-range-picker';
 /**
- * Date range picker. Renders an input-style trigger and, on open, a popover
- * with optional preset chips + a single-month calendar.
- *
- * Selection model:
- *   - first click  → sets `from`
- *   - second click → sets `to` (auto-swaps if before `from`)
- *   - third click  → restarts (sets new `from`, clears `to`)
- *   - hover over a day with `from` set → previews the range
+ * @deprecated Use `<co-date-range-picker>` instead.
  *
- * `value` is a JSON string `{"from":"YYYY-MM-DD","to":"YYYY-MM-DD"}` (or empty
- * for unset) so it survives JSX attribute serialization. `coChange` fires
- * with `{from, to}` only when the user clicks "Apply".
+ * Thin compatibility shim kept for one release: it renders the canonical
+ * `<co-date-range-picker>` (accessible, manual input, presets, timezone-safe)
+ * and re-emits its `coApply` as the legacy `coChange`. The legacy per-preset
+ * label props are no longer honored — preset labels now come from `locale`.
  */
 export declare class CoDateRange {
     el: HTMLElement;
-    /** JSON `{from, to}` or empty string. */
+    /** JSON `{from,to}` or empty string. */
     value: string;
     label: string;
     placeholder: string;
     disabled: boolean;
     clearable: boolean;
     presets: boolean;
-    status: 'default' | 'error' | 'success';
     helperText: string;
-    /** BCP-47 locale tag used by Intl.DateTimeFormat. */
+    /** BCP-47 locale. */
     locale: string;
-    presetTodayLabel: string;
-    presetThisWeekLabel: string;
-    presetThisMonthLabel: string;
-    presetLast30DaysLabel: string;
-    presetLast90DaysLabel: string;
-    presetThisYearLabel: string;
-    applyLabel: string;
-    clearLabel: string;
+    applyLabel?: string;
+    clearLabel?: string;
+    /** Fires (with `{from,to}`) when the user applies a range. */
     coChange: EventEmitter<DateRangeValue>;
     coClear: EventEmitter<void>;
-    isOpen: boolean;
-    draftFrom: string | null;
-    draftTo: string | null;
-    hoverDay: string | null;
-    viewMonth: number;
-    viewYear: number;
-    onValueChange(): void;
-    componentWillLoad(): void;
+    private warned;
     connectedCallback(): void;
-    disconnectedCallback(): void;
-    private parseValue;
-    private formatISO;
-    private handleTriggerClick;
-    private handleDocumentClick;
-    private handleCancel;
-    private handleDayClick;
-    private handleDayHover;
-    private handlePresetClick;
     private handleApply;
-    private handleClear;
-    private prevMonth;
-    private nextMonth;
-    private renderTriggerLabel;
-    private inRange;
-    private renderCalendar;
-    private renderPresets;
     render(): any;
 }

package/dist/types/components/co-date-range-picker/co-date-range-picker.d.ts

@@ -0,0 +1,112 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { Placement } from '../../utils/positioning';
+export interface DateRangeValue {
+    from: string | null;
+    to: string | null;
+}
+/**
+ * Date range picker: two manual date fields (Desde/Hasta) + a range calendar +
+ * quick presets, inside a popover with a Cancel/Clear/Apply footer.
+ *
+ * Value is a JSON string `{"from":"YYYY-MM-DD","to":"YYYY-MM-DD"}` (or '' when
+ * unset) so it survives JSX attribute serialization. The trigger shows the
+ * COMMITTED range; the popover edits a draft that only commits on Apply (or, if
+ * `applyOnSelect`, debounced once both ends are chosen — for table filters).
+ */
+export declare class CoDateRangePicker {
+    el: HTMLElement;
+    /** JSON `{from,to}` or '' (empty). */
+    value: string;
+    min?: string;
+    max?: string;
+    locale: string;
+    displayFormat: string;
+    firstDayOfWeek: number;
+    /** Show the quick-preset column. */
+    presets: boolean;
+    /**
+     * Which presets to show, from the built-in catalog: today, yesterday,
+     * last7Days, last14Days, last30Days, last90Days, thisWeek, thisMonth,
+     * lastMonth, thisYear, lastYear, custom. Labels come from `locale`; dates are
+     * computed tz-safe. Accepts a string[] or JSON/comma string. Defaults to a
+     * sensible set when omitted.
+     */
+    presetIds?: string[] | string;
+    /** Allow from === to. */
+    allowSameDay: boolean;
+    /** Minimum span (inclusive days). */
+    minRangeDays?: number;
+    /** Maximum span (inclusive days). */
+    maxRangeDays?: number;
+    clearable: boolean;
+    /** Commit (emit coApply) as soon as a full valid range is picked, debounced. */
+    applyOnSelect: boolean;
+    disabled: boolean;
+    readonly: boolean;
+    invalid: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    label?: string;
+    /** Whether the field is required (renders a required marker on the label). */
+    required: boolean;
+    placeholder?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /** Trigger size (mirrors co-input): s 28 / sm 32 / md 40 / lg 48. */
+    size: 's' | 'sm' | 'md' | 'lg';
+    placement: Placement;
+    open: boolean;
+    applyLabel?: string;
+    cancelLabel?: string;
+    clearLabel?: string;
+    fromLabel?: string;
+    toLabel?: string;
+    /** Max viewport width (px) that renders the picker as a bottom sheet. */
+    mobileBreakpoint: number;
+    coRangeStartChange: EventEmitter<string | null>;
+    coRangeEndChange: EventEmitter<string | null>;
+    coRangeChange: EventEmitter<DateRangeValue>;
+    coApply: EventEmitter<DateRangeValue>;
+    coCancel: EventEmitter<void>;
+    coClear: EventEmitter<void>;
+    coOpen: EventEmitter<void>;
+    coClose: EventEmitter<void>;
+    /** Working range while the popover is open (commits on Apply). */
+    draftFrom: string | null;
+    draftTo: string | null;
+    /** True when the viewport is at/under `mobileBreakpoint`. */
+    isMobile: boolean;
+    private applyTimer?;
+    private mql?;
+    private mqlHandler;
+    componentWillLoad(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    onValueChange(): void;
+    private parseValue;
+    private get committed();
+    private inclusiveDays;
+    private get canApply();
+    private syncDraftFromValue;
+    private onPopoverOpen;
+    private onPopoverClose;
+    private onRootKeyDown;
+    private updateDraft;
+    private onCalendarRange;
+    private onFromChange;
+    private onToChange;
+    private scheduleApply;
+    /** Open the mobile bottom sheet (desktop opens via co-popover's trigger click). */
+    private openSheet;
+    private handleApply;
+    private handleCancel;
+    private handleClear;
+    private applyPreset;
+    private get hasCommitted();
+    private triggerText;
+    private presetItems;
+    private renderTriggerChildren;
+    private renderPanel;
+    private renderHelper;
+    render(): any;
+}

package/dist/types/components/co-drawer/co-drawer.d.ts

@@ -15,6 +15,10 @@ export declare class CoDrawer {
     size: 'sm' | 'md' | 'lg' | 'xl' | 'full';
     /** Drawer title (used when `header` slot is empty) */
     heading: string;
+    /** Optional description shown below the heading */
+    description: string;
+    /** Optional Phosphor icon name shown before the heading */
+    icon: string;
     /** Show close (X) button in header */
     closable: boolean;
     /** Close when clicking the backdrop */

package/dist/types/components/co-file-field/co-file-field.d.ts

@@ -0,0 +1,146 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export interface FileItem {
+    /** Server reference id (once uploaded). */
+    id?: string;
+    /** Optimistic local id while uploading. */
+    tempId?: string;
+    name: string;
+    size?: number;
+    url?: string;
+    thumbnail?: string;
+    /** Server file code (enables host-side deletion of the File record). */
+    fileCode?: string;
+    /** 0–100 when the host reports determinate progress. */
+    progress?: number;
+    status: 'uploading' | 'done' | 'error';
+    error?: string;
+}
+/**
+ * Host-driven file selector — renders a drop-zone + previews + a file list with
+ * upload progress, but performs NO upload itself. When the user picks/drops
+ * files it emits `coFilesSelected` carrying the raw `File` objects (via the
+ * in-memory CustomEvent detail, never a serialized attribute); the host uploads
+ * them and feeds the resulting state back through the controlled `files` prop.
+ * This mirrors `co-ref-field` (the WC emits intent, the host does the I/O).
+ *
+ * @part wrapper - Root container
+ * @part label - The field label
+ * @part dropzone - The drag-and-drop / browse area
+ * @part upload-button - The pill CTA button inside the dropzone
+ * @part actions - Container of the host-provided `actions` slot
+ * @part uploaded-title - The "Uploaded files (n)" heading
+ * @part previews - The image previews grid
+ * @part preview - A single image preview card
+ * @part list - The uploaded/in-progress file list
+ * @part row - A single file row
+ * @part drag-handle - The reorder handle of a row
+ * @part helper - The helper/error text row
+ *
+ * @slot actions - Extra host actions rendered inside the dropzone (e.g. paste
+ *                 from clipboard, pick from cloud drive).
+ */
+export declare class CoFileField {
+    el: HTMLElement;
+    label?: string;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    multiple: boolean;
+    /** Accepted formats: comma list of extensions/mime (e.g. ".pdf,.png" or a JSON array). */
+    accept?: string;
+    /** Max number of files (multiple mode). */
+    maxFiles: number;
+    /** Max bytes per file. */
+    maxBytes?: number;
+    /** External validation status (e.g. from a form controller). */
+    status: 'default' | 'error' | 'success' | 'warning';
+    /** Helper text shown below the field. */
+    helperText?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /** BCP-47 locale for the built-in UI strings (es/en/pt). */
+    locale?: string;
+    /** Override for the dropzone CTA button text. */
+    uploadButtonText?: string;
+    /** Main drag-and-drop hint in the dropzone (defaults to the locale string). */
+    dropText?: string;
+    /** Override for the uploaded-files heading (count is appended). */
+    uploadedTitle?: string;
+    /** Allow drag-reordering of the uploaded list (multiple mode). */
+    reorderable: boolean;
+    /** Controlled file list, JSON array of {@link FileItem} (owned by the host). */
+    files: string;
+    /** Emitted when the user picks/drops valid files. Detail carries the raw Files. */
+    coFilesSelected: EventEmitter<{
+        files: File[];
+        tempIds: string[];
+    }>;
+    /** Emitted to remove a file (id or tempId). */
+    coRemove: EventEmitter<string>;
+    /** Emitted to clear all files. */
+    coClear: EventEmitter<void>;
+    /** Emitted after a drag-reorder with the full ordered list of keys (id ?? tempId). */
+    coReorder: EventEmitter<string[]>;
+    /** Emitted when a file URL is copied to the clipboard. */
+    coCopy: EventEmitter<{
+        id: string;
+        url: string;
+    }>;
+    /** Emitted when an image preview is opened. */
+    coPreviewOpen: EventEmitter<{
+        id: string;
+        url: string;
+    }>;
+    dragOver: boolean;
+    localError: string;
+    copiedKey: string;
+    /** Row key armed for dragging (handle pressed). */
+    armedKey: string;
+    /** Row key currently being dragged. */
+    dragKey: string;
+    /** Row key currently hovered as drop target. */
+    overKey: string;
+    failedPreviews: Set<string>;
+    private inputEl?;
+    private tempSeq;
+    private copiedTimer?;
+    private lastFilesStr;
+    private lastParsed;
+    private lightboxEl?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private get parsedFiles();
+    private get strings();
+    private get acceptList();
+    private get isInvalid();
+    private get inputAccept();
+    private extOf;
+    private validate;
+    private handleFiles;
+    /** True when the event originates from the host's `actions` slot content. */
+    private fromActionsSlot;
+    private handleDragOver;
+    private handleDragLeave;
+    private handleDrop;
+    private handleBrowse;
+    private handleInputChange;
+    private keyFor;
+    private handleCopy;
+    /**
+     * Opens the clicked image in a co-lightbox with the SAME gallery the
+     * previews grid shows. The lightbox is created imperatively on
+     * `document.body`: an open co-drawer keeps `transform: translateX(0)`,
+     * which would trap a `position: fixed` overlay rendered inline here.
+     */
+    private handlePreviewOpen;
+    private closeLightbox;
+    private handlePreviewError;
+    private disarmDrag;
+    private handleRowDragStart;
+    private handleRowDragOver;
+    private handleRowDrop;
+    private handleRowDragEnd;
+    private resetDragState;
+    private capacityHint;
+    render(): any;
+}

package/dist/types/components/co-file-field/co-file-field.utils.d.ts

@@ -0,0 +1,18 @@
+import type { FileItem } from './co-file-field';
+/** Format bytes like the Figma spec: "59.25 KB" (base 1024, up to 2 decimals). */
+export declare function formatBytes(bytes: number | undefined): string;
+/**
+ * Left-truncate long file names ("....nshot from 2024-07-12.png"), keeping the
+ * tail where the date/extension lives — same convention as the V1 selector.
+ * The CSS rtl+ellipsis trick is avoided on purpose: bidi reorders leading
+ * digits/punctuation, and file names start with digits all the time.
+ */
+export declare function truncateLeft(name: string, max?: number): string;
+/** An item renders in the previews grid when it's a stored image we can show. */
+export declare function isImage(item: FileItem): boolean;
+/**
+ * Best lightbox source: the original `url` only when it is itself an image —
+ * a PDF that entered the grid via its server-generated thumbnail must open
+ * the thumbnail (an `<img>` can't render the PDF).
+ */
+export declare function previewSrc(item: FileItem): string | undefined;

package/dist/types/components/co-icon-button/co-icon-button.d.ts

@@ -3,7 +3,7 @@ export declare class CoIconButton {
      * filled = dark background (negro), outlined = light background (blanco + border)
      * Matches Figma: Secundario → filled, Primario → outlined
      */
-    variant: 'filled' | 'outlined';
+    variant: 'filled' | 'outlined' | 'ghost';
     /** Shape: pill or straight corners */
     shape: 'rounded' | 'square';
     /**

package/dist/types/components/co-input/co-input.d.ts

@@ -13,7 +13,8 @@ export declare class CoInput {
     label?: string;
     /** Secondary label displayed on the right side */
     secondaryLabel?: string;
-    /** Placeholder text */
+    /** Placeholder text. Empty by default — a literal "Placeholder" leaking into
+     *  product UIs when the consumer forgets the prop is worse than no hint. */
     placeholder: string;
     /** Current value */
     value: string;
@@ -41,6 +42,8 @@ export declare class CoInput {
     autocomplete?: string;
     /** Validation status */
     status: 'default' | 'error' | 'success' | 'warning' | 'info';
+    /** Size variant: s (28px), sm (32px), md (40px, default), lg (48px) */
+    size: 's' | 'sm' | 'md' | 'lg';
     /** Label for the integrated action button (Botón variant) */
     actionLabel?: string;
     /** Phosphor icon name for the integrated action button */

package/dist/types/components/co-json-field/co-json-field.d.ts

@@ -0,0 +1,66 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Multiline JSON / arbitrary-object editor — a `<textarea>` with inline JSON
+ * validation. It is the renderer for schema fields whose type is `mixed`
+ * (free-form object value). The committed `value` is the raw JSON *text*; the
+ * consuming form renderer is responsible for parsing it to an object (keeping
+ * this component framework-agnostic and string-only, like `co-ref-field`).
+ *
+ * Emits `coInput` on every keystroke, `coChange` with the committed text on blur
+ * (so half-typed invalid JSON never reaches the form), and `coValidity` whenever
+ * the parse status changes.
+ *
+ * Visually mirrors `co-input` / `co-date-field`.
+ *
+ * @part wrapper - Root container
+ * @part label - The field label
+ * @part field - The bordered textarea wrapper
+ * @part input - The native textarea
+ * @part helper - The helper/error text row
+ */
+export declare class CoJsonField {
+    el: HTMLElement;
+    /** Committed JSON text. */
+    value: string;
+    label?: string;
+    placeholder: string;
+    name?: string;
+    required: boolean;
+    disabled: boolean;
+    readonly: boolean;
+    rows: number;
+    /** External validation status (e.g. from a form controller). */
+    status: 'default' | 'error' | 'success' | 'warning';
+    /** Helper text shown below the field. */
+    helperText?: string;
+    /** Message shown when the typed JSON cannot be parsed. */
+    invalidMessage: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /** Emitted on every keystroke with the raw text. */
+    coInput: EventEmitter<string>;
+    /** Emitted with the committed text on blur. */
+    coChange: EventEmitter<string>;
+    /** Emitted whenever the internal JSON parse status changes. */
+    coValidity: EventEmitter<{
+        valid: boolean;
+        message?: string;
+    }>;
+    coFocus: EventEmitter<void>;
+    coBlur: EventEmitter<void>;
+    /** Raw text in the textarea. */
+    draft: string;
+    /** Internal JSON parse-failure flag. */
+    internalInvalid: boolean;
+    hasFocus: boolean;
+    componentWillLoad(): void;
+    onValueChange(): void;
+    private get isInvalid();
+    /** Re-evaluate JSON validity; emit coValidity when it changes. */
+    private validate;
+    private tryParse;
+    private handleInput;
+    private handleFocus;
+    private handleBlur;
+    render(): any;
+}

package/dist/types/components/co-lightbox/co-lightbox.d.ts

@@ -0,0 +1,95 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export interface LightboxImage {
+    /** Full-size image URL. */
+    src: string;
+    /** Optional smaller preview (unused while rendering, kept for hosts). */
+    thumbnail?: string;
+    /** Caption / aria text (usually the file name). */
+    alt?: string;
+}
+/**
+ * Fullscreen image 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
+ * navigate, +/- zoom, 0 resets.
+ *
+ * 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
+ * containing block and traps the overlay. When opening from inside such a
+ * context, create the element imperatively on `document.body` instead of
+ * rendering it declaratively (this is what co-file-field does).
+ *
+ * @part overlay - Fullscreen scrim container
+ * @part toolbar - Top bar (caption + zoom controls + actions)
+ * @part image - The active image element
+ * @part prev - Previous-image arrow button
+ * @part next - Next-image arrow button
+ * @part counter - The "i / n" indicator
+ * @part close - The close button
+ */
+export declare class CoLightbox {
+    el: HTMLElement;
+    /** JSON array of {@link LightboxImage} (controlled by the host). */
+    images: string;
+    /** Index shown when the viewer opens. */
+    startIndex: number;
+    /** Whether the viewer is visible. */
+    open: boolean;
+    /** BCP-47 locale for the built-in aria strings (es/en/pt). */
+    locale?: string;
+    /** Emitted when the viewer requests to close (backdrop, X, Escape). */
+    coClose: EventEmitter<void>;
+    /** Emitted when the active image changes (prev/next/keyboard). */
+    coChange: EventEmitter<number>;
+    index: number;
+    scale: number;
+    tx: number;
+    ty: number;
+    dragging: boolean;
+    private stageEl?;
+    private imgEl?;
+    private closeBtnEl?;
+    private lastImagesStr;
+    private lastParsed;
+    private dragStart;
+    /** Element to give focus back to when the viewer closes. */
+    private previouslyFocused?;
+    /** Focus the close button on the render that follows opening. */
+    private pendingFocus;
+    private get parsedImages();
+    componentWillLoad(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentDidRender(): void;
+    onOpenChange(open: boolean): void;
+    onStartIndexChange(v: number): void;
+    onImagesChange(): void;
+    private attachKeyListener;
+    private detachKeyListener;
+    private handleKey;
+    /** Minimal focus trap: Tab cycles through the viewer's own buttons. */
+    private trapTab;
+    private clampIndex;
+    private resetView;
+    private requestClose;
+    private goTo;
+    private preloadNeighbors;
+    /** Pan is clamped so the scaled image can't be dragged fully off-stage. */
+    private clampPan;
+    /**
+     * Zoom keeping the stage point (px,py — relative to the stage center) fixed:
+     * t' = p − (p − t)·(s'/s), with transform-origin at the center.
+     */
+    private zoomAt;
+    private stagePoint;
+    private handleWheel;
+    private handleDblClick;
+    private handlePointerDown;
+    private handlePointerMove;
+    private handlePointerUp;
+    private openOriginal;
+    private stop;
+    render(): any;
+}

package/dist/types/components/co-list-item/co-list-item.d.ts

@@ -22,5 +22,6 @@ export declare class CoListItem {
     /** Emitted when item is clicked */
     coSelect: EventEmitter<void>;
     private handleClick;
+    private handleKeyDown;
     render(): any;
 }

package/dist/types/components/co-modal/co-modal.d.ts

@@ -14,6 +14,10 @@ export declare class CoModal {
     closable: boolean;
     /** Close when clicking the overlay backdrop */
     closeOnOverlay: boolean;
+    /** Modal width: sm (400px), md (540px), lg (680px) */
+    size: 'sm' | 'md' | 'lg';
+    /** Hide body section and all border dividers (compact confirm dialogs) */
+    noDividers: boolean;
     /** Emitted when the modal requests to close */
     coClose: EventEmitter<void>;
     private handleOverlayClick;