optikos 0.0.0-stage → 0.1.0

package/dist/types/components/navigation/navmenu/navmenu.d.ts

@@ -0,0 +1,63 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+export interface NavItem {
+    id: string;
+    text: string;
+    icon?: string;
+    badge?: string | number;
+    items?: NavItem[];
+    disabled?: boolean;
+    hidden?: boolean;
+    /** Groups: start open. */
+    expanded?: boolean;
+    data?: unknown;
+}
+export interface NavMenuConfig extends ComponentConfig {
+    items?: NavItem[];
+    /** id of the active leaf. */
+    active?: string;
+    /** Rail: icons only. */
+    collapsed?: boolean;
+    /** Opening a group closes the others at its level. */
+    accordion?: boolean;
+}
+/** Sidebar tree: groups that open and close, one active leaf, badges, rail mode, filter and the APG tree keyboard model. */
+export declare class NavMenu extends Component<NavMenuConfig> {
+    protected baseCls: string;
+    protected tag: 'nav';
+    private items;
+    private open;
+    private active?;
+    private query;
+    private focusId?;
+    private root;
+    protected onRender(): void;
+    getItem(id: string, list?: NavItem[]): NavItem | undefined;
+    private parentsOf;
+    private openParents;
+    private matches;
+    /** Visible = not hidden, matches the filter, and a group has at least one visible child. */
+    private visible;
+    private isOpen;
+    private paint;
+    private node;
+    private activate;
+    private select;
+    /** Marks a leaf as the active page (and opens its parents). Does not emit `select`. */
+    setActive(id: string | undefined): void;
+    getActive(): NavItem | undefined;
+    expand(id: string): void;
+    collapse(id: string): void;
+    toggle(id: string): void;
+    private siblings;
+    expandAll(): void;
+    collapseAll(): void;
+    setItems(items: NavItem[]): void;
+    /** Changes an item in place (a badge, a label, disabled...). */
+    updateItem(id: string, patch: Partial<NavItem>): void;
+    setCollapsed(collapsed: boolean): void;
+    /** Hides what does not match and opens the groups that have a match; empty text clears the filter. */
+    filter(text: string): void;
+    private rows;
+    private focusRow;
+    private onKey;
+}

package/dist/types/components/navigation/stepper/stepper.d.ts

@@ -0,0 +1,31 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+export interface Step {
+    id?: string;
+    title: string;
+    description?: string;
+    icon?: string;
+    optional?: boolean;
+}
+export type StepState = 'pending' | 'done' | 'error';
+export interface StepperConfig extends ComponentConfig {
+    steps?: Step[];
+    active?: number;
+    /** Steps can be clicked. Default true. */
+    clickable?: boolean;
+}
+/** Where you are in a multi-step process: numbered steps with done / current / error states. */
+export declare class Stepper extends Component<StepperConfig> {
+    protected baseCls: string;
+    protected tag: 'nav';
+    private list;
+    private active;
+    private states;
+    protected onRender(): void;
+    private steps;
+    private paint;
+    setActive(i: number): void;
+    getActive(): number;
+    setStepState(i: number, state: StepState): void;
+    getStepState(i: number): StepState;
+    setSteps(steps: Step[]): void;
+}

package/dist/types/components/navigation/tabs/tabs.d.ts

@@ -0,0 +1,49 @@
+import { Container, type ContainerConfig } from '../../../core/container.js';
+import { Component } from '../../../core/component.js';
+import { type AnyConfig } from '../../../core/registry.js';
+export interface TabsConfig extends ContainerConfig {
+    /** Initially active tab (index or id). */
+    active?: number | string;
+    position?: 'top' | 'left';
+    /** Build a panel's DOM only the first time its tab is activated. Default true. */
+    lazy?: boolean;
+    /** Default `closable` for tabs. */
+    closable?: boolean;
+}
+/**
+ * Items are the panels. Each may carry `title`, `icon`, `closable` and `disabled` for its tab header.
+ * Tabs reuse the `card` layout of Container for the panels.
+ */
+export declare class Tabs extends Container<TabsConfig> {
+    protected baseCls: string;
+    private barEl;
+    private panelsEl;
+    private tabs;
+    private pending;
+    private rover?;
+    constructor(config?: TabsConfig);
+    getBody(): HTMLElement;
+    protected build(): HTMLDivElement;
+    protected onRender(): void;
+    private forcing?;
+    /** Lazy panels (everything but the active one) are attached the first time they are activated. */
+    protected attach(p: Component, index: number): void;
+    /** Builds a pending panel's DOM now. */
+    private ensure;
+    private tabConfig;
+    private addHeader;
+    private syncHeaders;
+    getActive(): Component | undefined;
+    /** Activates a tab (instance, id or index). `before-change` can cancel. */
+    setActive(tab: Component | string | number): void;
+    insert(index: number, item: AnyConfig | Component | string): Component;
+    /** Closes a tab (`before-close` can cancel). The neighbor becomes active. */
+    closeTab(tab: Component | string | number): void;
+    remove(child: Component | string | number, destroy?: boolean): Component | undefined;
+    /** Marks a tab header: a badge with the number of errors in its panel and a dot while something in it changed. */
+    setTabState(tab: Component, state: {
+        errors?: number;
+        dirty?: boolean;
+    }): void;
+    setTitle(tab: Component, title: string): void;
+}

package/dist/types/components/navmenu.d.ts

@@ -0,0 +1 @@
+export * from '../components/navigation/navmenu/navmenu.js';

package/dist/types/components/numberfield.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/numberfield/numberfield.js';

package/dist/types/components/overlays/commandpalette/commandpalette.d.ts

@@ -0,0 +1,80 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+export interface Command {
+    id: string;
+    title: string;
+    /** Groups the command and gives it a filter chip. */
+    category?: string;
+    icon?: string;
+    description?: string;
+    /** Extra words that find the command. */
+    keywords?: string[];
+    /** Only displayed (the app binds the key itself). */
+    shortcut?: string;
+    disabled?: boolean;
+    hidden?: () => boolean;
+    /** Runs after the palette closed. Errors become the palette's `error` event. */
+    handler?: (ctx: {
+        palette: CommandPalette;
+        command: Command;
+    }) => unknown;
+    /** A second level: choosing this command shows these (Backspace on an empty field goes back). */
+    children?: Command[] | (() => Command[] | Promise<Command[]>);
+}
+export interface CommandPaletteConfig extends ComponentConfig {
+    commands?: Command[];
+    /** `mod` is Ctrl on Windows/Linux and ⌘ on macOS. `false` turns the global key off. Default `'mod+k'`. */
+    hotkey?: string | false;
+    placeholder?: string;
+    emptyText?: string;
+    maxResults?: number;
+    /** Order of the category groups; the others follow. */
+    categories?: string[];
+    /** Category chips under the field. Default true. */
+    filters?: boolean;
+}
+/**
+ * Command palette: Ctrl/⌘+K opens a searchable, categorized list of the actions the app registered. Choosing one closes
+ * the palette and runs it; a command with `children` opens a second level instead.
+ */
+export declare class CommandPalette extends Component<CommandPaletteConfig> {
+    protected baseCls: string;
+    private commands;
+    private levels;
+    private query;
+    private cat;
+    private shown;
+    private active;
+    private opened;
+    private opener;
+    private release;
+    private panel;
+    private input;
+    private filtersEl;
+    private listEl;
+    private live;
+    private crumb;
+    constructor(config?: CommandPaletteConfig);
+    protected build(): HTMLDivElement;
+    getCommands(): Command[];
+    setCommands(list: Command[]): void;
+    /** Adds commands; returns the function that removes them again. */
+    register(cmd: Command | Command[]): () => void;
+    /** Runs a command by id (searching every level that is not a submenu), without opening the palette. */
+    run(id: string): Promise<void>;
+    isOpen(): boolean;
+    toggle(): void;
+    open(): void;
+    close(): void;
+    protected onDestroy(): void;
+    private level;
+    /** Commands for the current query/filter, in display order. */
+    private results;
+    private paint;
+    private paintFilters;
+    private indexOf;
+    private setActive;
+    private onKey;
+    private back;
+    private choose;
+    private exec;
+}

package/dist/types/components/overlays/dropdown/dropdown.d.ts

@@ -0,0 +1,41 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+import { type AnyConfig } from '../../../core/registry.js';
+import { type Placement } from '../../../core/position.js';
+export interface DropdownConfig extends ComponentConfig {
+    anchor?: HTMLElement | Component | {
+        x: number;
+        y: number;
+    };
+    content?: HTMLElement | Component | AnyConfig;
+    placement?: Placement;
+    offset?: number;
+    flip?: boolean;
+    matchWidth?: boolean;
+    closeOnOutside?: boolean;
+    closeOnEsc?: boolean;
+    role?: string;
+    /** Move focus to the first focusable element of the content on open. */
+    autoFocus?: boolean;
+}
+/** Floating panel anchored to an element. Lives in the global layer; closes on outside click and Esc. */
+export declare class Dropdown extends Component<DropdownConfig> {
+    protected baseCls: string;
+    private content?;
+    private open_;
+    private release;
+    private leaving;
+    protected build(): HTMLDivElement;
+    getAnchor(): HTMLElement | undefined;
+    isOpen(): boolean;
+    open(): void;
+    close(): void;
+    toggle(): void;
+    reposition(): void;
+    setAnchor(anchor: HTMLElement | Component | {
+        x: number;
+        y: number;
+    }): void;
+    setPlacement(placement: Placement): void;
+    setContent(content: HTMLElement | Component): void;
+    protected onDestroy(): void;
+}

package/dist/types/components/overlays/menu/menu.d.ts

@@ -0,0 +1,41 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+import type { Placement } from '../../../core/position.js';
+export interface MenuItem {
+    text?: string;
+    icon?: string;
+    handler?: (item: MenuItem) => void;
+    disabled?: boolean;
+    /** Present (true/false) makes it a checkable item. */
+    checked?: boolean;
+    items?: MenuEntry[];
+}
+export type MenuEntry = MenuItem | '-';
+export interface MenuConfig extends ComponentConfig {
+    items?: MenuEntry[];
+}
+/** Floating menu with submenus. Use `showBy(button)` for button menus and `showAt(x, y)` for context menus. */
+export declare class Menu extends Component<MenuConfig> {
+    protected baseCls: string;
+    parentMenu?: Menu;
+    private dd?;
+    private sub?;
+    private subOwner?;
+    private opener;
+    private hoverCancel?;
+    protected build(): HTMLDivElement;
+    protected onRender(): void;
+    private entries;
+    private renderItems;
+    setItems(items: MenuEntry[]): void;
+    private activate;
+    private root;
+    private openSub;
+    isOpen(): boolean;
+    private focusFirst;
+    showBy(anchor: HTMLElement | Component, placement?: Placement, focus?: boolean): void;
+    showAt(x: number, y: number): void;
+    private open;
+    hide(): void;
+    closeAll(): void;
+    protected onDestroy(): void;
+}

package/dist/types/components/overlays/messagebox/messagebox.d.ts

@@ -0,0 +1,53 @@
+import { Window } from '../window/window.js';
+import { TextField } from '../../fields/textfield/textfield.js';
+import type { Validator } from '../../../core/validators.js';
+export interface MessageBoxButton {
+    id: string;
+    text: string;
+    variant?: 'default' | 'primary' | 'danger';
+}
+export interface MessageBoxConfig {
+    text: string;
+    title?: string;
+    icon?: string;
+    buttons: MessageBoxButton[];
+    /** Resolved when closed with Esc or the close button. */
+    cancelId?: string;
+    /** Adds a text input; `show` then resolves with the button id and the input is read by `prompt`. */
+    input?: {
+        value?: string;
+        placeholder?: string;
+        validators?: Validator<string>[];
+    };
+    /** Called with the pressed button id before closing; return `false` to keep the dialog open. */
+    beforeClose?: (id: string, win: Window, input?: TextField) => boolean | void;
+}
+declare function open(cfg: MessageBoxConfig): Promise<string>;
+export interface AlertOptions {
+    title?: string;
+    okText?: string;
+    icon?: string;
+}
+export interface ConfirmOptions {
+    title?: string;
+    okText?: string;
+    cancelText?: string;
+    danger?: boolean;
+    icon?: string;
+}
+export interface PromptOptions {
+    title?: string;
+    value?: string;
+    placeholder?: string;
+    okText?: string;
+    cancelText?: string;
+    validators?: Validator<string>[];
+}
+export declare const MessageBox: {
+    show: typeof open;
+    alert(text: string, o?: AlertOptions): Promise<void>;
+    confirm(text: string, o?: ConfirmOptions): Promise<boolean>;
+    /** Resolves with the text, or `null` when cancelled. The dialog stays open while the validators fail. */
+    prompt(text: string, o?: PromptOptions): Promise<string | null>;
+};
+export {};

package/dist/types/components/overlays/toast/toast.d.ts

@@ -0,0 +1,45 @@
+import { Component, type ComponentConfig } from '../../../core/component.js';
+export type ToastPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'top' | 'bottom';
+export interface ToastConfig extends ComponentConfig {
+    text?: string;
+    title?: string;
+    type?: 'info' | 'success' | 'warning' | 'error';
+    /** ms before it closes by itself; 0 keeps it until closed. Default 4000. */
+    duration?: number;
+    closable?: boolean;
+    position?: ToastPosition;
+}
+declare const defaults: {
+    duration: number;
+    position: ToastPosition;
+    max: number;
+};
+export declare class Toast extends Component<ToastConfig> {
+    protected baseCls: string;
+    private cancelTimer?;
+    private remaining;
+    private started;
+    protected build(): HTMLDivElement;
+    /** Puts the toast on screen and starts the timer. */
+    show(): void;
+    private pause;
+    private resume;
+    close(): void;
+}
+export interface ToastHandle {
+    close(): void;
+}
+/** `toast('Saved')` or `toast({ text, title, type, duration, closable, position })`. */
+export declare function toast(opts: string | ToastConfig): ToastHandle;
+export declare namespace toast {
+    var configure: (o: Partial<typeof defaults>) => {
+        duration: number;
+        position: ToastPosition;
+        max: number;
+    } & Partial<{
+        duration: number;
+        position: ToastPosition;
+        max: number;
+    }>;
+}
+export {};

package/dist/types/components/overlays/tooltip/tooltip.d.ts

@@ -0,0 +1,13 @@
+declare function show(t: HTMLElement): void;
+declare function hide(): void;
+export declare const Tooltip: {
+    /** Default delay (ms) before a hover tooltip shows. */
+    configure(o: {
+        delay?: number;
+    }): void;
+    show: typeof show;
+    hide: typeof hide;
+};
+/** Gives any element a tooltip (same as the `tooltip` config on components). */
+export declare function attachTooltip(target: HTMLElement, text: string): void;
+export {};

package/dist/types/components/overlays/widget/widget.d.ts

@@ -0,0 +1,48 @@
+import { Panel, type PanelConfig } from '../../layout/panel/panel.js';
+export type WidgetSide = 'right' | 'left' | 'top' | 'bottom';
+export interface WidgetConfig extends PanelConfig {
+    side?: WidgetSide;
+    /** Float above the page (default). `false`: an ordinary panel where the layout puts it. */
+    floating?: boolean;
+    /** Width on the sides, height on top/bottom (CSS length or px). */
+    size?: number | string;
+    /** Header buttons that let the user pick the side. */
+    sideSwitcher?: boolean;
+    /** Which sides the switcher offers. Default left, right, bottom. */
+    sides?: WidgetSide[];
+    closeOnEsc?: boolean;
+    autoFocus?: boolean;
+    /** The user can move it by its header (pointer drag, or Alt+arrow keys). A move frees it from the side; `setSide` docks it again. */
+    draggable?: boolean;
+}
+/** A panel that floats over the page, attached to one edge. Not modal: the page behind stays usable. */
+export declare class Widget extends Panel<WidgetConfig> {
+    protected baseCls: string;
+    private opened;
+    private opener;
+    private cancelHide?;
+    private userTools;
+    private pos?;
+    constructor(config?: WidgetConfig);
+    protected onRender(): void;
+    getSide(): WidgetSide;
+    setSide(side: WidgetSide): void;
+    private paintSide;
+    /** Where the user left it (viewport px), or undefined while it sits on its side. */
+    getPosition(): {
+        x: number;
+        y: number;
+    } | undefined;
+    /** Puts a dragged widget back on its side. */
+    resetPosition(): void;
+    private moveTo;
+    private initDrag;
+    setSize(size: number | string): void;
+    isOpen(): boolean;
+    open(): void;
+    /** Opens or closes (with no argument: the other one). `toggle()` stays the Panel's collapse. */
+    setOpen(open?: boolean): void;
+    show(): void;
+    hide(): void;
+    protected onDestroy(): void;
+}

package/dist/types/components/overlays/window/window.d.ts

@@ -0,0 +1,31 @@
+import { Panel, type PanelConfig } from '../../layout/panel/panel.js';
+export interface WindowConfig extends PanelConfig {
+    modal?: boolean;
+    draggable?: boolean;
+    closeOnEsc?: boolean;
+    closeOnBackdrop?: boolean;
+    /** Move focus inside on show. Default true. */
+    autoFocus?: boolean;
+}
+/** Floating dialog. Modal by default: the page behind becomes inert and Tab stays inside. */
+export declare class Window extends Panel<WindowConfig> {
+    protected baseCls: string;
+    private backdrop?;
+    private visible;
+    private cleanup;
+    private opener;
+    private moved;
+    private leaving;
+    constructor(config?: WindowConfig);
+    protected onRender(): void;
+    private initDrag;
+    isVisible(): boolean;
+    /** Centers in the viewport (also done on show and on resize until the user drags it). */
+    center(): void;
+    show(): void;
+    private focusFirst;
+    hide(): void;
+    /** Cleans up at once (the page is usable again) and takes the window off the screen: shrinking toward its opener, 20 % faster than it came. */
+    private release;
+    protected onDestroy(): void;
+}

package/dist/types/components/pagination.d.ts

@@ -0,0 +1 @@
+export * from '../components/data/pagination/pagination.js';

package/dist/types/components/panel.d.ts

@@ -0,0 +1 @@
+export * from '../components/layout/panel/panel.js';

package/dist/types/components/pickerfield.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/pickerfield/pickerfield.js';

package/dist/types/components/radiogroup.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/radiogroup/radiogroup.js';

package/dist/types/components/searchgrid.d.ts

@@ -0,0 +1 @@
+export * from '../components/data/searchgrid/searchgrid.js';

package/dist/types/components/secretfield.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/secretfield/secretfield.js';

package/dist/types/components/select.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/select/select.js';

package/dist/types/components/slider.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/slider/slider.js';

package/dist/types/components/spacer.d.ts

@@ -0,0 +1 @@
+export * from '../components/layout/spacer/spacer.js';

package/dist/types/components/spinner.d.ts

@@ -0,0 +1 @@
+export * from '../components/feedback/spinner/spinner.js';

package/dist/types/components/stepform.d.ts

@@ -0,0 +1 @@
+export * from '../components/form/stepform/stepform.js';

package/dist/types/components/stepper.d.ts

@@ -0,0 +1 @@
+export * from '../components/navigation/stepper/stepper.js';

package/dist/types/components/suggestfield.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/suggestfield/suggestfield.js';

package/dist/types/components/table.d.ts

@@ -0,0 +1 @@
+export * from '../components/data/table/table.js';

package/dist/types/components/tabs.d.ts

@@ -0,0 +1 @@
+export * from '../components/navigation/tabs/tabs.js';

package/dist/types/components/textarea.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/textarea/textarea.js';

package/dist/types/components/textfield.d.ts

@@ -0,0 +1 @@
+export * from '../components/fields/textfield/textfield.js';

package/dist/types/components/toast.d.ts

@@ -0,0 +1 @@
+export * from '../components/overlays/toast/toast.js';

package/dist/types/components/toolbar.d.ts

@@ -0,0 +1 @@
+export * from '../components/layout/toolbar/toolbar.js';

package/dist/types/components/tooltip.d.ts

@@ -0,0 +1 @@
+export * from '../components/overlays/tooltip/tooltip.js';

package/dist/types/components/viewmanager.d.ts

@@ -0,0 +1 @@
+export * from '../components/data/viewmanager/viewmanager.js';

package/dist/types/components/viewport.d.ts

@@ -0,0 +1 @@
+export * from '../components/layout/viewport/viewport.js';

package/dist/types/components/widget.d.ts

@@ -0,0 +1 @@
+export * from '../components/overlays/widget/widget.js';

package/dist/types/components/window.d.ts

@@ -0,0 +1 @@
+export * from '../components/overlays/window/window.js';