@luxalgo/vela 0.5.0

package/dist/ui.d.cts

@@ -0,0 +1,188 @@
+import { c as VelaTheme } from './options-Q-576hIi.cjs';
+import { MachineSchema, Service, Machine } from '@zag-js/core';
+export { a as KeyBindingDescriptor, K as KeymapManager, b as KeymapOptions, R as ResolvedBinding } from './keymap-CGOz5F5f.cjs';
+import * as tooltip from '@zag-js/tooltip';
+import * as menu from '@zag-js/menu';
+import * as dialog from '@zag-js/dialog';
+export { i as iconMarkup, r as registerIcon, s as svg16, a as svg24 } from './icons-BZYbJXSV.cjs';
+export { normalizeProps, spreadProps } from '@zag-js/vanilla';
+
+/** Apply an alpha to any parseable color → an `rgba(...)` string. Unparseable input is
+ *  returned unchanged so callers can pass through `transparent`, `currentColor`, etc. */
+declare function withAlpha(color: string, alpha: number): string;
+
+/** A ready-to-insert element rendering the icon (empty span when unknown). */
+declare function iconEl(id: string, doc?: Document): HTMLElement;
+
+/** Inject a stylesheet once per root (document or shadow root). Idempotent by id. */
+declare function injectStyles(id: string, css: string, root?: Document | ShadowRoot): void;
+
+/** Write the theme-derived custom properties onto a host element (the widget root and
+ *  every floating layer — menus/tooltips portal outside the root, so layers re-apply). */
+declare function applyThemeTokens(el: HTMLElement, t: VelaTheme): void;
+/** Re-token a chart-overlay host (statusline, watermark, toast, context menu — chrome
+ *  floating OVER the plot) from the LIVE plot surface: a config edit can recolor the
+ *  plot background independently of the app theme (a white plot typed into settings on
+ *  the dark theme), and the overlay ink must stay readable either way. `config` is the
+ *  renderer's `getConfig()` snapshot; a missing/shapeless one falls back to the base
+ *  app theme. */
+declare function applyPlotOverlayTokens(host: HTMLElement, base: VelaTheme, config: unknown): void;
+/** Mark an element as a kit host: static token sheet + the `.vela-ui` class. */
+declare function ensureUIHost(el: HTMLElement, theme?: VelaTheme): void;
+
+interface MachineHandle<T extends MachineSchema> {
+    service: Service<T>;
+    /** Re-run the view projection now (e.g. after external DOM swaps). */
+    flush(): void;
+    stop(): void;
+}
+/** Start a machine and keep `render(service)` in sync with every transition.
+ *  `render` runs once immediately (initial projection) and on each machine notification. */
+declare function runMachine<T extends MachineSchema>(machine: Machine<T>, props: Partial<T['props']> | (() => Partial<T['props']>), render: (service: Service<T>) => void): MachineHandle<T>;
+/** Unique ids for machine instances (Zag keys its DOM lookups on them). */
+declare function nextUid(prefix: string): string;
+
+interface TooltipControllerOptions {
+    placement?: tooltip.Placement;
+    /** ms before opening on hover (default 0 — the reference tooltips are instant). */
+    openDelay?: number;
+    closeDelay?: number;
+    /** Keep open while the pointer is over the content (rich tooltips). */
+    interactive?: boolean;
+    /** Share the trigger's DOM id with other machines composed on the SAME element
+     *  (each Zag machine otherwise stamps its own id — last one wins and breaks the rest). */
+    triggerId?: string;
+}
+type TooltipService = tooltip.Service;
+type TooltipApi = tooltip.Api;
+interface TooltipController {
+    machine: typeof tooltip.machine;
+    props: Partial<tooltip.Props>;
+    connect(service: TooltipService): TooltipApi;
+}
+declare function tooltipController(opts?: TooltipControllerOptions): TooltipController;
+
+interface TooltipOptions extends TooltipControllerOptions {
+    content: string | Node | (() => Node);
+    host?: HTMLElement;
+}
+declare class Tooltip {
+    private readonly positioner;
+    private readonly content;
+    private readonly handle;
+    private readonly trigger;
+    constructor(trigger: HTMLElement, opts: TooltipOptions);
+    setContent(content: string | Node | (() => Node)): void;
+    destroy(): void;
+}
+
+/** One menu entry. `id` is the selection value reported to `onSelect`. */
+interface MenuItemDescriptor {
+    id: string;
+    label: string;
+    disabled?: boolean;
+    /** Draw a separator line above this item. */
+    separatorBefore?: boolean;
+    /** Right-aligned hint (e.g. a shortcut display from KeymapManager). */
+    hint?: string;
+    /** Selected state (undefined = plain item). A plain checked item renders as a
+     *  highlighted row (brighter surface + bright ink). */
+    checked?: boolean;
+    /** Render as a SWITCH row (a right-aligned toggle pill reflecting `checked`)
+     *  instead of the selected-row highlight, and keep the menu OPEN on selection —
+     *  the shape for boolean settings living inside a dropdown. */
+    toggle?: boolean;
+    /** Icon id (see the `vela/ui` icon registry) rendered before the label. */
+    icon?: string;
+    /** Nested entries — the row becomes a submenu trigger opening its own list to the side.
+     *  A branch is not selectable itself: `onSelect` only ever reports leaf ids. */
+    submenu?: readonly MenuItemDescriptor[];
+}
+interface MenuControllerOptions {
+    items: readonly MenuItemDescriptor[];
+    onSelect?: (id: string) => void;
+    placement?: menu.Props['positioning'] extends infer P | undefined ? P extends {
+        placement?: infer PL;
+    } ? PL : never : never;
+    onOpenChange?: (open: boolean) => void;
+    /** Share the trigger's DOM id with other machines composed on the same element. */
+    triggerId?: string;
+    /** Pin the machine's own id instead of taking a fresh one. A parent registers its
+     *  submenus under this key, so rebuilding a branch replaces its entry rather than
+     *  piling a new one on top. */
+    id?: string;
+}
+type MenuService = menu.Service;
+type MenuApi = menu.Api;
+interface MenuController {
+    machine: typeof menu.machine;
+    props: Partial<menu.Props>;
+    connect(service: MenuService): MenuApi;
+}
+declare function menuController(opts: MenuControllerOptions): MenuController;
+
+interface MenuOptions extends MenuControllerOptions {
+    /** Element that opens the menu on click (gets the machine's trigger props). */
+    trigger?: HTMLElement;
+    host?: HTMLElement;
+    /** Override the root list's min-width (the stylesheet default suits full-word labels;
+     *  compact lists like the timeframe dropdown pass something snug). Submenus keep the
+     *  default. */
+    minWidth?: string;
+}
+declare class Menu {
+    private readonly root;
+    constructor(opts: MenuOptions);
+    get api(): menu.Api;
+    open(): void;
+    /** Open anchored to a viewport point (context menus). */
+    openAt(clientX: number, clientY: number): void;
+    close(): void;
+    /** Swap the item descriptors (e.g. checked states) and re-project. */
+    setItems(items: readonly MenuItemDescriptor[]): void;
+    destroy(): void;
+}
+
+interface DialogControllerOptions {
+    /** Trap focus + backdrop (default true). Non-modal = floating panel. */
+    modal?: boolean;
+    closeOnEscape?: boolean;
+    closeOnInteractOutside?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+type DialogService = dialog.Service;
+type DialogApi = dialog.Api;
+interface DialogController {
+    machine: typeof dialog.machine;
+    props: Partial<dialog.Props>;
+    connect(service: DialogService): DialogApi;
+}
+declare function dialogController(opts?: DialogControllerOptions): DialogController;
+
+interface DialogOptions extends DialogControllerOptions {
+    title?: string;
+    content?: Node | ((body: HTMLElement) => void);
+    host?: HTMLElement;
+    /** Drag the dialog by its header (the reference dialogs move; search stays fixed). */
+    draggable?: boolean;
+    /** Darken the page behind the dialog (default false — the chart stays readable while
+     *  dialogs edit live content). Pass true for a dimming scrim; the backdrop still
+     *  catches interact-outside dismissal either way. */
+    dimBackdrop?: boolean;
+}
+declare class Dialog {
+    /** Caller-owned content area — append your form/panel here. */
+    readonly body: HTMLElement;
+    private readonly backdrop;
+    private readonly positioner;
+    private readonly panel;
+    private readonly handle;
+    private readonly ctrl;
+    constructor(opts?: DialogOptions);
+    get open(): boolean;
+    show(): void;
+    hide(): void;
+    destroy(): void;
+}
+
+export { Dialog, type DialogApi, type DialogControllerOptions, type DialogOptions, type DialogService, type MachineHandle, Menu, type MenuApi, type MenuControllerOptions, type MenuItemDescriptor, type MenuOptions, type MenuService, Tooltip, type TooltipApi, type TooltipControllerOptions, type TooltipOptions, type TooltipService, applyPlotOverlayTokens, applyThemeTokens, dialogController, ensureUIHost, iconEl, injectStyles, menuController, nextUid, runMachine, tooltipController, withAlpha };

package/dist/ui.d.ts

@@ -0,0 +1,188 @@
+import { c as VelaTheme } from './options-Q-576hIi.js';
+import { MachineSchema, Service, Machine } from '@zag-js/core';
+export { a as KeyBindingDescriptor, K as KeymapManager, b as KeymapOptions, R as ResolvedBinding } from './keymap-CGOz5F5f.js';
+import * as tooltip from '@zag-js/tooltip';
+import * as menu from '@zag-js/menu';
+import * as dialog from '@zag-js/dialog';
+export { i as iconMarkup, r as registerIcon, s as svg16, a as svg24 } from './icons-BZYbJXSV.js';
+export { normalizeProps, spreadProps } from '@zag-js/vanilla';
+
+/** Apply an alpha to any parseable color → an `rgba(...)` string. Unparseable input is
+ *  returned unchanged so callers can pass through `transparent`, `currentColor`, etc. */
+declare function withAlpha(color: string, alpha: number): string;
+
+/** A ready-to-insert element rendering the icon (empty span when unknown). */
+declare function iconEl(id: string, doc?: Document): HTMLElement;
+
+/** Inject a stylesheet once per root (document or shadow root). Idempotent by id. */
+declare function injectStyles(id: string, css: string, root?: Document | ShadowRoot): void;
+
+/** Write the theme-derived custom properties onto a host element (the widget root and
+ *  every floating layer — menus/tooltips portal outside the root, so layers re-apply). */
+declare function applyThemeTokens(el: HTMLElement, t: VelaTheme): void;
+/** Re-token a chart-overlay host (statusline, watermark, toast, context menu — chrome
+ *  floating OVER the plot) from the LIVE plot surface: a config edit can recolor the
+ *  plot background independently of the app theme (a white plot typed into settings on
+ *  the dark theme), and the overlay ink must stay readable either way. `config` is the
+ *  renderer's `getConfig()` snapshot; a missing/shapeless one falls back to the base
+ *  app theme. */
+declare function applyPlotOverlayTokens(host: HTMLElement, base: VelaTheme, config: unknown): void;
+/** Mark an element as a kit host: static token sheet + the `.vela-ui` class. */
+declare function ensureUIHost(el: HTMLElement, theme?: VelaTheme): void;
+
+interface MachineHandle<T extends MachineSchema> {
+    service: Service<T>;
+    /** Re-run the view projection now (e.g. after external DOM swaps). */
+    flush(): void;
+    stop(): void;
+}
+/** Start a machine and keep `render(service)` in sync with every transition.
+ *  `render` runs once immediately (initial projection) and on each machine notification. */
+declare function runMachine<T extends MachineSchema>(machine: Machine<T>, props: Partial<T['props']> | (() => Partial<T['props']>), render: (service: Service<T>) => void): MachineHandle<T>;
+/** Unique ids for machine instances (Zag keys its DOM lookups on them). */
+declare function nextUid(prefix: string): string;
+
+interface TooltipControllerOptions {
+    placement?: tooltip.Placement;
+    /** ms before opening on hover (default 0 — the reference tooltips are instant). */
+    openDelay?: number;
+    closeDelay?: number;
+    /** Keep open while the pointer is over the content (rich tooltips). */
+    interactive?: boolean;
+    /** Share the trigger's DOM id with other machines composed on the SAME element
+     *  (each Zag machine otherwise stamps its own id — last one wins and breaks the rest). */
+    triggerId?: string;
+}
+type TooltipService = tooltip.Service;
+type TooltipApi = tooltip.Api;
+interface TooltipController {
+    machine: typeof tooltip.machine;
+    props: Partial<tooltip.Props>;
+    connect(service: TooltipService): TooltipApi;
+}
+declare function tooltipController(opts?: TooltipControllerOptions): TooltipController;
+
+interface TooltipOptions extends TooltipControllerOptions {
+    content: string | Node | (() => Node);
+    host?: HTMLElement;
+}
+declare class Tooltip {
+    private readonly positioner;
+    private readonly content;
+    private readonly handle;
+    private readonly trigger;
+    constructor(trigger: HTMLElement, opts: TooltipOptions);
+    setContent(content: string | Node | (() => Node)): void;
+    destroy(): void;
+}
+
+/** One menu entry. `id` is the selection value reported to `onSelect`. */
+interface MenuItemDescriptor {
+    id: string;
+    label: string;
+    disabled?: boolean;
+    /** Draw a separator line above this item. */
+    separatorBefore?: boolean;
+    /** Right-aligned hint (e.g. a shortcut display from KeymapManager). */
+    hint?: string;
+    /** Selected state (undefined = plain item). A plain checked item renders as a
+     *  highlighted row (brighter surface + bright ink). */
+    checked?: boolean;
+    /** Render as a SWITCH row (a right-aligned toggle pill reflecting `checked`)
+     *  instead of the selected-row highlight, and keep the menu OPEN on selection —
+     *  the shape for boolean settings living inside a dropdown. */
+    toggle?: boolean;
+    /** Icon id (see the `vela/ui` icon registry) rendered before the label. */
+    icon?: string;
+    /** Nested entries — the row becomes a submenu trigger opening its own list to the side.
+     *  A branch is not selectable itself: `onSelect` only ever reports leaf ids. */
+    submenu?: readonly MenuItemDescriptor[];
+}
+interface MenuControllerOptions {
+    items: readonly MenuItemDescriptor[];
+    onSelect?: (id: string) => void;
+    placement?: menu.Props['positioning'] extends infer P | undefined ? P extends {
+        placement?: infer PL;
+    } ? PL : never : never;
+    onOpenChange?: (open: boolean) => void;
+    /** Share the trigger's DOM id with other machines composed on the same element. */
+    triggerId?: string;
+    /** Pin the machine's own id instead of taking a fresh one. A parent registers its
+     *  submenus under this key, so rebuilding a branch replaces its entry rather than
+     *  piling a new one on top. */
+    id?: string;
+}
+type MenuService = menu.Service;
+type MenuApi = menu.Api;
+interface MenuController {
+    machine: typeof menu.machine;
+    props: Partial<menu.Props>;
+    connect(service: MenuService): MenuApi;
+}
+declare function menuController(opts: MenuControllerOptions): MenuController;
+
+interface MenuOptions extends MenuControllerOptions {
+    /** Element that opens the menu on click (gets the machine's trigger props). */
+    trigger?: HTMLElement;
+    host?: HTMLElement;
+    /** Override the root list's min-width (the stylesheet default suits full-word labels;
+     *  compact lists like the timeframe dropdown pass something snug). Submenus keep the
+     *  default. */
+    minWidth?: string;
+}
+declare class Menu {
+    private readonly root;
+    constructor(opts: MenuOptions);
+    get api(): menu.Api;
+    open(): void;
+    /** Open anchored to a viewport point (context menus). */
+    openAt(clientX: number, clientY: number): void;
+    close(): void;
+    /** Swap the item descriptors (e.g. checked states) and re-project. */
+    setItems(items: readonly MenuItemDescriptor[]): void;
+    destroy(): void;
+}
+
+interface DialogControllerOptions {
+    /** Trap focus + backdrop (default true). Non-modal = floating panel. */
+    modal?: boolean;
+    closeOnEscape?: boolean;
+    closeOnInteractOutside?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+type DialogService = dialog.Service;
+type DialogApi = dialog.Api;
+interface DialogController {
+    machine: typeof dialog.machine;
+    props: Partial<dialog.Props>;
+    connect(service: DialogService): DialogApi;
+}
+declare function dialogController(opts?: DialogControllerOptions): DialogController;
+
+interface DialogOptions extends DialogControllerOptions {
+    title?: string;
+    content?: Node | ((body: HTMLElement) => void);
+    host?: HTMLElement;
+    /** Drag the dialog by its header (the reference dialogs move; search stays fixed). */
+    draggable?: boolean;
+    /** Darken the page behind the dialog (default false — the chart stays readable while
+     *  dialogs edit live content). Pass true for a dimming scrim; the backdrop still
+     *  catches interact-outside dismissal either way. */
+    dimBackdrop?: boolean;
+}
+declare class Dialog {
+    /** Caller-owned content area — append your form/panel here. */
+    readonly body: HTMLElement;
+    private readonly backdrop;
+    private readonly positioner;
+    private readonly panel;
+    private readonly handle;
+    private readonly ctrl;
+    constructor(opts?: DialogOptions);
+    get open(): boolean;
+    show(): void;
+    hide(): void;
+    destroy(): void;
+}
+
+export { Dialog, type DialogApi, type DialogControllerOptions, type DialogOptions, type DialogService, type MachineHandle, Menu, type MenuApi, type MenuControllerOptions, type MenuItemDescriptor, type MenuOptions, type MenuService, Tooltip, type TooltipApi, type TooltipControllerOptions, type TooltipOptions, type TooltipService, applyPlotOverlayTokens, applyThemeTokens, dialogController, ensureUIHost, iconEl, injectStyles, menuController, nextUid, runMachine, tooltipController, withAlpha };

package/dist/ui.js

@@ -0,0 +1,3 @@
+export { Dialog, KeymapManager, Menu, Tooltip, applyPlotOverlayTokens, applyThemeTokens, dialogController, ensureUIHost, menuController, nextUid, normalizeProps, runMachine, spreadProps, tooltipController } from './chunk-RHIDOUFL.js';
+import './chunk-KM6LHB3Y.js';
+export { iconEl, iconMarkup, injectStyles, registerIcon, svg16, svg24, withAlpha } from './chunk-GYD2THPV.js';