domma-js 0.56.0 → 0.58.0

package/assets/types/generated/src/components/split-pane.d.ts

@@ -0,0 +1,239 @@
+/**
+ * E.splitPane: one instance per container; calling it again updates the existing one.
+ * @param {Element} el
+ * @param {SplitPaneOptions} [options]
+ * @returns {SplitPane}
+ */
+export function splitPaneFor(el: Element, options?: SplitPaneOptions): SplitPane;
+/**
+ * A pane size limit: px as a number, or a percentage string such as '20%'.
+ * @typedef {number|string} SplitPaneSize
+ */
+/**
+ * @typedef {object} SplitPaneOptions
+ * @property {'horizontal'|'vertical'} [direction] - 'horizontal' = side by side (default), 'vertical' = stacked
+ * @property {number[]|null} [sizes] - Percentages, one per pane (scaled to add up to 100); equal by default
+ * @property {SplitPaneSize|SplitPaneSize[]} [minSize] - Minimum size, one value or one per pane (default 0)
+ * @property {SplitPaneSize|null|Array<SplitPaneSize|null>} [maxSize] - Maximum size, one value or one per pane (default none)
+ * @property {number} [gutterSize] - Gutter thickness in px (default 8)
+ * @property {number} [snapOffset] - Snap to a limit when dragged within this many px of it (default 0)
+ * @property {boolean|boolean[]} [collapsible] - Which panes the gutter gestures may collapse
+ * @property {SplitPaneSize|SplitPaneSize[]} [collapsedSize] - What a collapsed pane shrinks to (default 0)
+ * @property {boolean} [collapseButton] - A small toggle button in gutters next to a collapsible pane
+ * @property {string|null} [persistKey] - Remember sizes and collapse state with S under 'split-pane:<key>'
+ * @property {string|null} [cursor] - Gutter cursor (default col-resize / row-resize)
+ * @property {boolean} [disabled]
+ * @property {number} [step] - Percent per arrow key (default 1)
+ * @property {number} [largeStep] - Percent per Shift+arrow (default 10)
+ * @property {string} [gutterLabel] - The gutters' aria-label
+ * @property {((gutterIndex: number, event: PointerEvent) => boolean|void)|null} [onBeforeDrag] - Return false to refuse a drag
+ * @property {((sizes: number[], gutterIndex: number) => void)|null} [onDragStart]
+ * @property {((sizes: number[], gutterIndex: number) => void)|null} [onDrag]
+ * @property {((sizes: number[], gutterIndex: number) => void)|null} [onDragEnd]
+ * @property {((sizes: number[]) => void)|null} [onResize] - Any size change: drag, keys, setSizes, collapse
+ * @property {((paneIndex: number) => void)|null} [onCollapse]
+ * @property {((paneIndex: number) => void)|null} [onExpand]
+ */
+/** @typedef {SplitPane} SplitPaneInstance */
+export class SplitPane extends Component {
+    static defaults: {
+        direction: string;
+        sizes: any;
+        minSize: number;
+        maxSize: any;
+        gutterSize: number;
+        snapOffset: number;
+        collapsible: boolean;
+        collapsedSize: number;
+        collapseButton: boolean;
+        persistKey: any;
+        cursor: any;
+        disabled: boolean;
+        step: number;
+        largeStep: number;
+        gutterLabel: string;
+        onBeforeDrag: any;
+        onDragStart: any;
+        onDrag: any;
+        onDragEnd: any;
+        onResize: any;
+        onCollapse: any;
+        onExpand: any;
+    };
+    /**
+     * @param {string|HTMLElement} element - The container; its element children are the panes
+     * @param {SplitPaneOptions} [options]
+     */
+    constructor(element: string | HTMLElement, options?: SplitPaneOptions);
+    _gutters: any[];
+    _drag: {
+        index: any;
+        pointerId: any;
+        start: any;
+        startSize: any;
+        available: number;
+        sign: number;
+        gutter: any;
+    };
+    _collapsed: any[];
+    _restoreTo: any[];
+    _addedIds: any[];
+    _frame: number;
+    _containerStyle: string;
+    /** The pane elements. @type {HTMLElement[]} */
+    panes: HTMLElement[];
+    _paneStyles: string[];
+    get horizontal(): boolean;
+    _build(): void;
+    _sizes: any;
+    _observer: ResizeObserver;
+    _makeGutter(i: any): HTMLDivElement;
+    /** Settings that can change after set-up: disabled, gutter size, cursor, label, buttons. */
+    _applyOptions(): void;
+    _syncButton(gutter: any, i: any): void;
+    /** Sizes as percentages that add up to 100, one per pane. */
+    _normalise(sizes: any): any[];
+    /** Space shared by the panes: the container less its gutters, in px. */
+    _available(): number;
+    /** A px number or '%' string as a percentage of the shared space. */
+    _toPercent(value: any, available: any, fallback: any): any;
+    _limits(i: any, available?: number): {
+        min: any;
+        max: number;
+    };
+    /** Pull every pane inside its limits, moving the difference to its neighbours. */
+    _clampAll(sizes: any): any;
+    /** Pane indexes ordered by distance from i, nearest first. */
+    _neighbours(i: any): any[];
+    _apply(sizes: any): void;
+    _syncAria(): void;
+    /**
+     * Move the boundary between pane i and pane i + 1 so pane i is `want` percent,
+     * within both panes' limits.
+     */
+    _moveBoundary(i: any, want: any, { snap }?: {
+        snap?: boolean;
+    }): boolean;
+    _onPointerDown(e: any, i: any): void;
+    _onPointerMove: (e: any) => void;
+    _onPointerUp: (e: any) => void;
+    /** Dragging either side of a collapsed pane opens it from its collapsed size. */
+    _uncollapseForDrag(i: any): void;
+    _onKey(e: any, i: any): void;
+    _isCollapsible(i: any): boolean;
+    /** The pane a gutter collapses: the one before it if it may, else the one after. */
+    _collapseTarget(gutter: any): any;
+    _toggleFromGutter(i: any): void;
+    /**
+     * Collapse a pane toward the edge it sits against; the space goes to its neighbour.
+     * Works on any pane, collapsible or not (the option only governs the gutter's gestures).
+     * @param {number} i - pane index
+     * @returns {this}
+     */
+    collapse(i: number): this;
+    /**
+     * Restore a collapsed pane to the size it had, taking the space back from its neighbour.
+     * @param {number} i - pane index
+     * @returns {this}
+     */
+    expand(i: number): this;
+    /** @param {number} i @returns {boolean} whether pane i is collapsed */
+    isCollapsed(i: number): boolean;
+    /**
+     * The pane sizes, as percentages of the space the panes share (they add up to 100).
+     * @returns {number[]}
+     */
+    getSizes(): number[];
+    /**
+     * Set every pane's size. The array is scaled to add up to 100 and then pulled inside
+     * each pane's limits. Collapsed panes are expanded.
+     * @param {number[]} sizes - one per pane
+     * @returns {this}
+     */
+    setSizes(sizes: number[]): this;
+    _load(): {
+        sizes: any[];
+        collapsed: any;
+        restoreTo: any;
+    };
+    _save(): void;
+}
+export default SplitPane;
+/**
+ * A pane size limit: px as a number, or a percentage string such as '20%'.
+ */
+export type SplitPaneSize = number | string;
+export type SplitPaneOptions = {
+    /**
+     * - 'horizontal' = side by side (default), 'vertical' = stacked
+     */
+    direction?: "horizontal" | "vertical";
+    /**
+     * - Percentages, one per pane (scaled to add up to 100); equal by default
+     */
+    sizes?: number[] | null;
+    /**
+     * - Minimum size, one value or one per pane (default 0)
+     */
+    minSize?: SplitPaneSize | SplitPaneSize[];
+    /**
+     * - Maximum size, one value or one per pane (default none)
+     */
+    maxSize?: SplitPaneSize | null | Array<SplitPaneSize | null>;
+    /**
+     * - Gutter thickness in px (default 8)
+     */
+    gutterSize?: number;
+    /**
+     * - Snap to a limit when dragged within this many px of it (default 0)
+     */
+    snapOffset?: number;
+    /**
+     * - Which panes the gutter gestures may collapse
+     */
+    collapsible?: boolean | boolean[];
+    /**
+     * - What a collapsed pane shrinks to (default 0)
+     */
+    collapsedSize?: SplitPaneSize | SplitPaneSize[];
+    /**
+     * - A small toggle button in gutters next to a collapsible pane
+     */
+    collapseButton?: boolean;
+    /**
+     * - Remember sizes and collapse state with S under 'split-pane:<key>'
+     */
+    persistKey?: string | null;
+    /**
+     * - Gutter cursor (default col-resize / row-resize)
+     */
+    cursor?: string | null;
+    disabled?: boolean;
+    /**
+     * - Percent per arrow key (default 1)
+     */
+    step?: number;
+    /**
+     * - Percent per Shift+arrow (default 10)
+     */
+    largeStep?: number;
+    /**
+     * - The gutters' aria-label
+     */
+    gutterLabel?: string;
+    /**
+     * - Return false to refuse a drag
+     */
+    onBeforeDrag?: ((gutterIndex: number, event: PointerEvent) => boolean | void) | null;
+    onDragStart?: ((sizes: number[], gutterIndex: number) => void) | null;
+    onDrag?: ((sizes: number[], gutterIndex: number) => void) | null;
+    onDragEnd?: ((sizes: number[], gutterIndex: number) => void) | null;
+    /**
+     * - Any size change: drag, keys, setSizes, collapse
+     */
+    onResize?: ((sizes: number[]) => void) | null;
+    onCollapse?: ((paneIndex: number) => void) | null;
+    onExpand?: ((paneIndex: number) => void) | null;
+};
+export type SplitPaneInstance = SplitPane;
+import Component from '../component.js';

package/assets/types/generated/src/components/toast.d.ts

@@ -0,0 +1,284 @@
+/**
+ * Show a toast.
+ * @param {string|Node|ToastOptions} message - the text (or `{message, ...options}`)
+ * @param {ToastOptions} [options]
+ * @returns {Toast}
+ */
+export function showToast(message: string | Node | ToastOptions, options?: ToastOptions): Toast;
+/**
+ * An action button in a toast.
+ * @typedef {object} ToastAction
+ * @property {string} [label='OK'] - Button label (`text` is accepted too)
+ * @property {string} [text] - Alias of `label`
+ * @property {(event: MouseEvent, toast: ToastInstance) => void} [onClick] - Click handler
+ * @property {boolean} [closeOnClick=true] - Close toast on click
+ * @property {boolean} [primary] - Primary style
+ */
+/**
+ * @typedef {object} ToastOptions
+ * @property {string|Node} [message] - The message (text unless `html: true`)
+ * @property {string} [title] - Toast title
+ * @property {import('../elements.js').ToastType} [type='default'] - Toast type
+ * @property {import('../elements.js').ToastPosition} [position='top-right'] - Toast position
+ * @property {number} [duration=3000] - Auto-dismiss duration in ms (0 = no auto-dismiss)
+ * @property {boolean} [pauseOnHover=true] - Pause countdown on hover
+ * @property {boolean} [showProgress=true] - Show progress bar
+ * @property {'slide'|'fade'|(string & {})} [animation='slide'] - Animation style
+ * @property {number} [animationDuration=300] - Animation duration in ms
+ * @property {boolean} [closable=true] - Show close button
+ * @property {boolean} [html=false] - The message is HTML (sanitised unless `safe: false`)
+ * @property {boolean} [safe=true] - Sanitise HTML message / icon
+ * @property {string|Node|null} [icon] - Icon name (data-icon), HTML string or Node; the typed helpers default to the type's icon
+ * @property {ToastAction[]} [actions] - Action buttons
+ * @property {ToastAction} [action] - One action button (used when `actions` is empty)
+ * @property {number} [maxToasts=5] - Maximum number of toasts on screen; the oldest closes
+ * @property {string} [className] - Extra classes on the toast
+ * @property {((toast: ToastInstance) => void)|null} [onShow] - When the toast shows
+ * @property {((toast: ToastInstance) => void)|null} [onClose] - After the exit animation, just before removal
+ * @property {((toast: ToastInstance) => void)|null} [onPause] - The countdown paused (hover)
+ * @property {((toast: ToastInstance) => void)|null} [onResume] - The countdown resumed
+ * @property {((detail: {action: ToastAction, index: number}, toast: ToastInstance) => void)|null} [onAction] - An action button was clicked
+ */
+/** @typedef {Toast} ToastInstance */
+/**
+ * E.toast: show a toast, with typed helpers.
+ * @typedef {((message: string|Node|ToastOptions, options?: ToastOptions) => ToastInstance) & {
+ *     show(message: string|Node|ToastOptions, options?: ToastOptions): ToastInstance,
+ *     success(message: string|Node, options?: ToastOptions): ToastInstance,
+ *     error(message: string|Node, options?: ToastOptions): ToastInstance,
+ *     warning(message: string|Node, options?: ToastOptions): ToastInstance,
+ *     info(message: string|Node, options?: ToastOptions): ToastInstance,
+ *     closeAll(): void
+ * }} ToastStatic
+ */
+export class Toast extends Component {
+    static defaults: {
+        message: string;
+        title: string;
+        type: string;
+        position: string;
+        duration: number;
+        pauseOnHover: boolean;
+        showProgress: boolean;
+        animation: string;
+        animationDuration: number;
+        closable: boolean;
+        html: boolean;
+        safe: boolean;
+        icon: string;
+        actions: any[];
+        maxToasts: number;
+        className: string;
+        onShow: any;
+        onClose: any;
+        onPause: any;
+        onResume: any;
+        onAction: any;
+    };
+    /**
+     * @param {string|Node} [message]
+     * @param {ToastOptions} [options]
+     */
+    constructor(message?: string | Node, options?: ToastOptions);
+    _visible: boolean;
+    _timer: number;
+    _remaining: number;
+    _started: number;
+    _paused: boolean;
+    _render(): void;
+    _titleEl: HTMLDivElement;
+    _messageEl: HTMLDivElement;
+    _actionsEl: HTMLDivElement;
+    _bar: HTMLDivElement;
+    _writeMessage(): void;
+    _renderActions(): void;
+    _bind(): void;
+    _startTimer(): void;
+    _pause(): void;
+    _resume(): void;
+    /**
+     * Put the toast on screen (E.toast() does this).
+     * @returns {this}
+     */
+    open(): this;
+    /**
+     * Close the toast (removed after the exit animation).
+     * @returns {this}
+     */
+    close(): this;
+    /**
+     * Permanent alias of open(), by name.
+     * @returns {this}
+     */
+    show(...args: any[]): this;
+    /**
+     * Permanent alias of close(), by name.
+     * @returns {this}
+     */
+    hide(...args: any[]): this;
+    /** @returns {this} */
+    toggle(): this;
+    /** @returns {boolean} */
+    isVisible(): boolean;
+    /** @returns {boolean} */
+    isOpen(): boolean;
+    /**
+     * Update the message.
+     * @param {string|Node} message
+     * @returns {this}
+     */
+    setMessage(message: string | Node): this;
+    /**
+     * @param {string} title - Empty hides the title
+     * @returns {this}
+     */
+    setTitle(title: string): this;
+    /**
+     * @param {import('../elements.js').ToastType} type
+     * @returns {this}
+     */
+    setType(type: import("../elements.js").ToastType): this;
+    /**
+     * @param {ToastAction[]|null} actions
+     * @returns {this}
+     */
+    setActions(actions: ToastAction[] | null): this;
+    _applyOptions(): void;
+}
+/**
+ * The E.toast function with its statics.
+ * @type {ToastStatic}
+ */
+export const toast: ToastStatic;
+export default Toast;
+/**
+ * An action button in a toast.
+ */
+export type ToastAction = {
+    /**
+     * - Button label (`text` is accepted too)
+     */
+    label?: string;
+    /**
+     * - Alias of `label`
+     */
+    text?: string;
+    /**
+     * - Click handler
+     */
+    onClick?: (event: MouseEvent, toast: ToastInstance) => void;
+    /**
+     * - Close toast on click
+     */
+    closeOnClick?: boolean;
+    /**
+     * - Primary style
+     */
+    primary?: boolean;
+};
+export type ToastOptions = {
+    /**
+     * - The message (text unless `html: true`)
+     */
+    message?: string | Node;
+    /**
+     * - Toast title
+     */
+    title?: string;
+    /**
+     * - Toast type
+     */
+    type?: import("../elements.js").ToastType;
+    /**
+     * - Toast position
+     */
+    position?: import("../elements.js").ToastPosition;
+    /**
+     * - Auto-dismiss duration in ms (0 = no auto-dismiss)
+     */
+    duration?: number;
+    /**
+     * - Pause countdown on hover
+     */
+    pauseOnHover?: boolean;
+    /**
+     * - Show progress bar
+     */
+    showProgress?: boolean;
+    /**
+     * - Animation style
+     */
+    animation?: "slide" | "fade" | (string & {});
+    /**
+     * - Animation duration in ms
+     */
+    animationDuration?: number;
+    /**
+     * - Show close button
+     */
+    closable?: boolean;
+    /**
+     * - The message is HTML (sanitised unless `safe: false`)
+     */
+    html?: boolean;
+    /**
+     * - Sanitise HTML message / icon
+     */
+    safe?: boolean;
+    /**
+     * - Icon name (data-icon), HTML string or Node; the typed helpers default to the type's icon
+     */
+    icon?: string | Node | null;
+    /**
+     * - Action buttons
+     */
+    actions?: ToastAction[];
+    /**
+     * - One action button (used when `actions` is empty)
+     */
+    action?: ToastAction;
+    /**
+     * - Maximum number of toasts on screen; the oldest closes
+     */
+    maxToasts?: number;
+    /**
+     * - Extra classes on the toast
+     */
+    className?: string;
+    /**
+     * - When the toast shows
+     */
+    onShow?: ((toast: ToastInstance) => void) | null;
+    /**
+     * - After the exit animation, just before removal
+     */
+    onClose?: ((toast: ToastInstance) => void) | null;
+    /**
+     * - The countdown paused (hover)
+     */
+    onPause?: ((toast: ToastInstance) => void) | null;
+    /**
+     * - The countdown resumed
+     */
+    onResume?: ((toast: ToastInstance) => void) | null;
+    /**
+     * - An action button was clicked
+     */
+    onAction?: ((detail: {
+        action: ToastAction;
+        index: number;
+    }, toast: ToastInstance) => void) | null;
+};
+export type ToastInstance = Toast;
+/**
+ * E.toast: show a toast, with typed helpers.
+ */
+export type ToastStatic = ((message: string | Node | ToastOptions, options?: ToastOptions) => ToastInstance) & {
+    show(message: string | Node | ToastOptions, options?: ToastOptions): ToastInstance;
+    success(message: string | Node, options?: ToastOptions): ToastInstance;
+    error(message: string | Node, options?: ToastOptions): ToastInstance;
+    warning(message: string | Node, options?: ToastOptions): ToastInstance;
+    info(message: string | Node, options?: ToastOptions): ToastInstance;
+    closeAll(): void;
+};
+import Component from '../component.js';