react-cheminfo 0.3.0 → 0.4.0

package/lib/help/ui/HelpIcon.d.ts

@@ -0,0 +1,33 @@
+import type { ReactElement } from 'react';
+import type { HelpContent } from './HelpBody.tsx';
+/** What {@link HelpIcon} explains, and how big the glyph is. */
+export interface HelpIconProps {
+    /** The help the glyph reveals. */
+    content: HelpContent;
+    /**
+     * Size of the glyph in pixels, so it sits on the line of the label it
+     * follows.
+     * @default 13
+     */
+    size?: number;
+    /**
+     * Which side the help opens on.
+     * @default 'right'
+     */
+    placement?: 'top' | 'right' | 'bottom' | 'left';
+    /**
+     * Class the glyph carries, in addition to `help-icon`.
+     * @default undefined
+     */
+    className?: string;
+}
+/**
+ * The small question mark that sits beside a field label.
+ *
+ * It is reachable by tab, so the explanation is not reserved to whoever is
+ * holding a pointer.
+ * @param props - See {@link HelpIconProps}.
+ * @returns The glyph and its help.
+ */
+export declare function HelpIcon(props: HelpIconProps): ReactElement;
+//# sourceMappingURL=HelpIcon.d.ts.map

package/lib/help/ui/HelpIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpIcon.d.ts","sourceRoot":"","sources":["../../../src/help/ui/HelpIcon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,gEAAgE;AAChE,MAAM,WAAW,aAAa;IAC5B,kCAAkC;IAClC,OAAO,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAChD;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,YAAY,CAgB3D"}

package/lib/help/ui/HelpIcon.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from '@blueprintjs/core';
+import { HelpTooltip } from "./HelpTooltip.js";
+/**
+ * The small question mark that sits beside a field label.
+ *
+ * It is reachable by tab, so the explanation is not reserved to whoever is
+ * holding a pointer.
+ * @param props - See {@link HelpIconProps}.
+ * @returns The glyph and its help.
+ */
+export function HelpIcon(props) {
+    const { content, size = 13, placement = 'right', className } = props;
+    return (_jsx(HelpTooltip, { content: content, placement: placement, children: _jsx(Icon, { icon: "help", size: size, tabIndex: 0, "aria-label": content.title, className: className === undefined ? 'help-icon' : `help-icon ${className}` }) }));
+}
+//# sourceMappingURL=HelpIcon.js.map

package/lib/help/ui/HelpIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpIcon.js","sourceRoot":"","sources":["../../../src/help/ui/HelpIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAIzC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAmB,CAAC;AAwBhD;;;;;;;GAOG;AACH,MAAM,UAAU,QAAQ,CAAC,KAAoB;IAC3C,MAAM,EAAE,OAAO,EAAE,IAAI,GAAG,EAAE,EAAE,SAAS,GAAG,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAErE,OAAO,CACL,KAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,YACjD,KAAC,IAAI,IACH,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,gBACC,OAAO,CAAC,KAAK,EACzB,SAAS,EACP,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,SAAS,EAAE,GAElE,GACU,CACf,CAAC;AACJ,CAAC"}

package/lib/help/ui/HelpToolbarButton.d.ts

@@ -0,0 +1,45 @@
+import type { IconName } from '@blueprintjs/core';
+import type { ReactElement } from 'react';
+import type { HelpContent } from './HelpBody.tsx';
+/** What {@link HelpToolbarButton} explains, and what pressing it does. */
+export interface HelpToolbarButtonProps {
+    /** The help the button reveals on hover. */
+    content: HelpContent;
+    /**
+     * What pressing the button does — usually opening the guide the tooltip
+     * summarises. Left out for a button that only explains itself.
+     * @default undefined — the button does nothing when pressed
+     */
+    onClick?: () => void;
+    /**
+     * Text beside the glyph. Left out for a toolbar that has run out of room.
+     * @default undefined — the button is reduced to its glyph
+     */
+    label?: string;
+    /**
+     * Glyph of the button.
+     * @default 'help'
+     */
+    icon?: IconName;
+    /**
+     * Whether the button is the small size a dense toolbar needs.
+     * @default false
+     */
+    small?: boolean;
+    /**
+     * Class the button carries.
+     * @default undefined
+     */
+    className?: string;
+}
+/**
+ * The help entry of a toolbar: a glyph that explains itself on hover and opens
+ * the full guide when pressed.
+ *
+ * It shows the same body as the glyph beside a field and as any other mention
+ * of that help, so a construct is documented in one place.
+ * @param props - See {@link HelpToolbarButtonProps}.
+ * @returns The toolbar button and its help.
+ */
+export declare function HelpToolbarButton(props: HelpToolbarButtonProps): ReactElement;
+//# sourceMappingURL=HelpToolbarButton.d.ts.map

package/lib/help/ui/HelpToolbarButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpToolbarButton.d.ts","sourceRoot":"","sources":["../../../src/help/ui/HelpToolbarButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,0EAA0E;AAC1E,MAAM,WAAW,sBAAsB;IACrC,4CAA4C;IAC5C,OAAO,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,CAuB7E"}

package/lib/help/ui/HelpToolbarButton.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from '@blueprintjs/core';
+import { HelpTooltip } from "./HelpTooltip.js";
+/**
+ * The help entry of a toolbar: a glyph that explains itself on hover and opens
+ * the full guide when pressed.
+ *
+ * It shows the same body as the glyph beside a field and as any other mention
+ * of that help, so a construct is documented in one place.
+ * @param props - See {@link HelpToolbarButtonProps}.
+ * @returns The toolbar button and its help.
+ */
+export function HelpToolbarButton(props) {
+    const { content, onClick, label, icon = 'help', small = false, className, } = props;
+    return (_jsx(HelpTooltip, { content: content, placement: "bottom", children: _jsx(Button, { variant: "minimal", size: small ? 'small' : 'medium', icon: icon, text: label, "aria-label": label ?? content.title, className: className, onClick: onClick }) }));
+}
+//# sourceMappingURL=HelpToolbarButton.js.map

package/lib/help/ui/HelpToolbarButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpToolbarButton.js","sourceRoot":"","sources":["../../../src/help/ui/HelpToolbarButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAI3C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAmB,CAAC;AAkChD;;;;;;;;GAQG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAA6B;IAC7D,MAAM,EACJ,OAAO,EACP,OAAO,EACP,KAAK,EACL,IAAI,GAAG,MAAM,EACb,KAAK,GAAG,KAAK,EACb,SAAS,GACV,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,KAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,QAAQ,YAC/C,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAChC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,KAAK,gBACC,KAAK,IAAI,OAAO,CAAC,KAAK,EAClC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB,GACU,CACf,CAAC;AACJ,CAAC"}

package/lib/help/ui/HelpTooltip.d.ts

@@ -0,0 +1,36 @@
+import type { TooltipProps } from '@blueprintjs/core';
+import type { ReactElement, ReactNode } from 'react';
+import type { HelpContent } from './HelpBody.tsx';
+/** What {@link HelpTooltip} wraps, and what it says about it. */
+export interface HelpTooltipProps {
+    /** The help shown when the pointer rests on the target. */
+    content: HelpContent;
+    /** What the help is about. */
+    children: ReactNode;
+    /**
+     * Which side the tooltip opens on.
+     * @default 'top'
+     */
+    placement?: TooltipProps['placement'];
+    /**
+     * How wide the body is allowed to be, in pixels.
+     * @default 280
+     */
+    width?: number;
+    /**
+     * Class the tooltip popover carries, in addition to `help-tooltip`.
+     * @default undefined
+     */
+    popoverClassName?: string;
+}
+/**
+ * A piece of help attached to whatever it explains.
+ *
+ * The delay before it opens is long enough that sweeping the pointer across a
+ * row of controls opens nothing, and help carrying a link stays open long
+ * enough for the pointer to reach the link.
+ * @param props - See {@link HelpTooltipProps}.
+ * @returns The target, with its help.
+ */
+export declare function HelpTooltip(props: HelpTooltipProps): ReactElement;
+//# sourceMappingURL=HelpTooltip.d.ts.map

package/lib/help/ui/HelpTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpTooltip.d.ts","sourceRoot":"","sources":["../../../src/help/ui/HelpTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,iEAAiE;AACjE,MAAM,WAAW,gBAAgB;IAC/B,2DAA2D;IAC3D,OAAO,EAAE,WAAW,CAAC;IACrB,8BAA8B;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IACtC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;;;;;GAQG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CA2BjE"}

package/lib/help/ui/HelpTooltip.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tooltip } from '@blueprintjs/core';
+import { HelpBody } from "./HelpBody.js";
+/**
+ * A piece of help attached to whatever it explains.
+ *
+ * The delay before it opens is long enough that sweeping the pointer across a
+ * row of controls opens nothing, and help carrying a link stays open long
+ * enough for the pointer to reach the link.
+ * @param props - See {@link HelpTooltipProps}.
+ * @returns The target, with its help.
+ */
+export function HelpTooltip(props) {
+    const { content, children, placement = 'top', width, popoverClassName, } = props;
+    const hasLink = content.link !== undefined;
+    return (_jsx(Tooltip, { content: _jsx(HelpBody, { content: content, width: width }), placement: placement, hoverOpenDelay: HOVER_OPEN_DELAY, hoverCloseDelay: hasLink ? HOVER_CLOSE_DELAY : 0, interactionKind: hasLink ? 'hover' : 'hover-target', targetTagName: "span", popoverClassName: popoverClassName === undefined
+            ? 'help-tooltip'
+            : `help-tooltip ${popoverClassName}`, children: children }));
+}
+// Long enough that sweeping the pointer across a row of controls opens nothing.
+const HOVER_OPEN_DELAY = 250;
+// Help carrying a link has to outlive the pointer leaving its target.
+const HOVER_CLOSE_DELAY = 300;
+//# sourceMappingURL=HelpTooltip.js.map

package/lib/help/ui/HelpTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelpTooltip.js","sourceRoot":"","sources":["../../../src/help/ui/HelpTooltip.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAI5C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAgB,CAAC;AAyB1C;;;;;;;;GAQG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,MAAM,EACJ,OAAO,EACP,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,KAAK,EACL,gBAAgB,GACjB,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,OAAO,CAAC,IAAI,KAAK,SAAS,CAAC;IAE3C,OAAO,CACL,KAAC,OAAO,IACN,OAAO,EAAE,KAAC,QAAQ,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAI,EACrD,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,gBAAgB,EAChC,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,EAChD,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,cAAc,EACnD,aAAa,EAAC,MAAM,EACpB,gBAAgB,EACd,gBAAgB,KAAK,SAAS;YAC5B,CAAC,CAAC,cAAc;YAChB,CAAC,CAAC,gBAAgB,gBAAgB,EAAE,YAGvC,QAAQ,GACD,CACX,CAAC;AACJ,CAAC;AAED,gFAAgF;AAChF,MAAM,gBAAgB,GAAG,GAAG,CAAC;AAC7B,sEAAsE;AACtE,MAAM,iBAAiB,GAAG,GAAG,CAAC"}

package/lib/help/ui/index.d.ts

@@ -0,0 +1,9 @@
+export type { HelpBodyProps, HelpContent, HelpExample } from './HelpBody.tsx';
+export { HelpBody } from './HelpBody.tsx';
+export type { HelpIconProps } from './HelpIcon.tsx';
+export { HelpIcon } from './HelpIcon.tsx';
+export type { HelpToolbarButtonProps } from './HelpToolbarButton.tsx';
+export { HelpToolbarButton } from './HelpToolbarButton.tsx';
+export type { HelpTooltipProps } from './HelpTooltip.tsx';
+export { HelpTooltip } from './HelpTooltip.tsx';
+//# sourceMappingURL=index.d.ts.map

package/lib/help/ui/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/help/ui/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC"}

package/lib/help/ui/index.js

@@ -0,0 +1,5 @@
+export { HelpBody } from "./HelpBody.js";
+export { HelpIcon } from "./HelpIcon.js";
+export { HelpToolbarButton } from "./HelpToolbarButton.js";
+export { HelpTooltip } from "./HelpTooltip.js";
+//# sourceMappingURL=index.js.map

package/lib/help/ui/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/help/ui/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAgB,CAAC;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAgB,CAAC;AAE1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAyB,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAmB,CAAC"}

package/lib/hooks/ui/index.d.ts

@@ -0,0 +1,7 @@
+export { useContainerSize } from './useContainerSize.ts';
+export { useDebouncedValue } from './useDebouncedValue.ts';
+export type { ListKeyboardNavigationOptions } from './useListKeyboardNavigation.ts';
+export { useListKeyboardNavigation } from './useListKeyboardNavigation.ts';
+export type { ElementSize } from './useResizeObserver.ts';
+export { useResizeObserver } from './useResizeObserver.ts';
+//# sourceMappingURL=index.d.ts.map

package/lib/hooks/ui/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AACpF,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,YAAY,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC"}

package/lib/hooks/ui/index.js

@@ -0,0 +1,5 @@
+export { useContainerSize } from "./useContainerSize.js";
+export { useDebouncedValue } from "./useDebouncedValue.js";
+export { useListKeyboardNavigation } from "./useListKeyboardNavigation.js";
+export { useResizeObserver } from "./useResizeObserver.js";
+//# sourceMappingURL=index.js.map

package/lib/hooks/ui/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hooks/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAE3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC"}

package/lib/hooks/ui/listNavigation.d.ts

@@ -0,0 +1,54 @@
+/** The default number of entries `PageUp` and `PageDown` move by. */
+export declare const DEFAULT_PAGE_STEP = 10;
+/** How a list stands when a key reaches it. */
+export interface ListNavigationOptions {
+    /** Number of entries currently displayed. */
+    length: number;
+    /** Index of the selected entry, or `-1` when nothing is selected. */
+    selectedIndex: number;
+    /**
+     * How many entries `PageUp` and `PageDown` move by. A value below one, or
+     * one that is not a number, falls back to the default.
+     * @default 10
+     */
+    pageStep?: number;
+}
+/** The subset of a keyboard event list navigation reads. */
+export interface ListNavigationKeyEvent {
+    /** The key that was pressed. */
+    key: string;
+    /** What the event was aimed at, used to leave typing alone. */
+    target?: EventTarget | null;
+    /** Stops the browser scrolling the page under the list. */
+    preventDefault: () => void;
+}
+/** What {@link handleListNavigationKey} needs on top of the list's shape. */
+export interface ListNavigationHandlerOptions extends ListNavigationOptions {
+    /** Called with the index the key moved the selection to. */
+    onSelect: (index: number) => void;
+}
+/**
+ * The entry a navigation key selects.
+ *
+ * `ArrowDown` and `ArrowUp` move one step, `PageDown` and `PageUp` move
+ * `pageStep`, `Home` and `End` jump to the ends, and every result is clamped
+ * into the list. With nothing selected, moving down enters at the top and
+ * moving up enters at the bottom.
+ * @param key - The `key` of the keyboard event.
+ * @param options - See {@link ListNavigationOptions}.
+ * @returns The index to select — which may be the current one — or `null` when
+ *   the key means nothing to a list.
+ */
+export declare function nextSelectedIndex(key: string, options: ListNavigationOptions): number | null;
+/**
+ * Move a list's selection from a keyboard event.
+ *
+ * A key that reaches a text field, a select or an editable region is left
+ * alone, so typing a filter inside the list never moves the selection. A key
+ * the list acts on has its default suppressed even when the selection does not
+ * move, so the page never scrolls out from under the last entry.
+ * @param event - The keyboard event, synthetic or native.
+ * @param options - See {@link ListNavigationHandlerOptions}.
+ */
+export declare function handleListNavigationKey(event: ListNavigationKeyEvent, options: ListNavigationHandlerOptions): void;
+//# sourceMappingURL=listNavigation.d.ts.map

package/lib/hooks/ui/listNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"listNavigation.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/listNavigation.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,eAAO,MAAM,iBAAiB,KAAK,CAAC;AAEpC,+CAA+C;AAC/C,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,MAAM,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,aAAa,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,4DAA4D;AAC5D,MAAM,WAAW,sBAAsB;IACrC,gCAAgC;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,+DAA+D;IAC/D,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,2DAA2D;IAC3D,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,6EAA6E;AAC7E,MAAM,WAAW,4BAA6B,SAAQ,qBAAqB;IACzE,4DAA4D;IAC5D,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAC/B,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,qBAAqB,GAC7B,MAAM,GAAG,IAAI,CAmCf;AAED;;;;;;;;;GASG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,sBAAsB,EAC7B,OAAO,EAAE,4BAA4B,GACpC,IAAI,CAMN"}

package/lib/hooks/ui/listNavigation.js

@@ -0,0 +1,77 @@
+/** The default number of entries `PageUp` and `PageDown` move by. */
+export const DEFAULT_PAGE_STEP = 10;
+/**
+ * The entry a navigation key selects.
+ *
+ * `ArrowDown` and `ArrowUp` move one step, `PageDown` and `PageUp` move
+ * `pageStep`, `Home` and `End` jump to the ends, and every result is clamped
+ * into the list. With nothing selected, moving down enters at the top and
+ * moving up enters at the bottom.
+ * @param key - The `key` of the keyboard event.
+ * @param options - See {@link ListNavigationOptions}.
+ * @returns The index to select — which may be the current one — or `null` when
+ *   the key means nothing to a list.
+ */
+export function nextSelectedIndex(key, options) {
+    const { length, selectedIndex, pageStep } = options;
+    if (!Number.isFinite(length) || length <= 0)
+        return null;
+    const step = typeof pageStep === 'number' && Number.isFinite(pageStep) && pageStep >= 1
+        ? Math.floor(pageStep)
+        : DEFAULT_PAGE_STEP;
+    const current = selectedIndex >= 0 && selectedIndex < length ? selectedIndex : -1;
+    let target;
+    switch (key) {
+        case 'ArrowDown':
+            target = current === -1 ? 0 : current + 1;
+            break;
+        case 'ArrowUp':
+            target = current === -1 ? length - 1 : current - 1;
+            break;
+        case 'PageDown':
+            target = Math.max(current, 0) + step;
+            break;
+        case 'PageUp':
+            target = (current === -1 ? length - 1 : current) - step;
+            break;
+        case 'Home':
+            target = 0;
+            break;
+        case 'End':
+            target = length - 1;
+            break;
+        default:
+            return null;
+    }
+    return Math.min(length - 1, Math.max(0, target));
+}
+/**
+ * Move a list's selection from a keyboard event.
+ *
+ * A key that reaches a text field, a select or an editable region is left
+ * alone, so typing a filter inside the list never moves the selection. A key
+ * the list acts on has its default suppressed even when the selection does not
+ * move, so the page never scrolls out from under the last entry.
+ * @param event - The keyboard event, synthetic or native.
+ * @param options - See {@link ListNavigationHandlerOptions}.
+ */
+export function handleListNavigationKey(event, options) {
+    if (isTextEntryTarget(event.target))
+        return;
+    const next = nextSelectedIndex(event.key, options);
+    if (next === null)
+        return;
+    event.preventDefault();
+    if (next !== options.selectedIndex)
+        options.onSelect(next);
+}
+const TEXT_ENTRY_TAGS = new Set(['INPUT', 'TEXTAREA', 'SELECT']);
+function isTextEntryTarget(target) {
+    if (target === null || target === undefined)
+        return false;
+    const element = target;
+    if (element.isContentEditable === true)
+        return true;
+    return (typeof element.tagName === 'string' && TEXT_ENTRY_TAGS.has(element.tagName));
+}
+//# sourceMappingURL=listNavigation.js.map

package/lib/hooks/ui/listNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listNavigation.js","sourceRoot":"","sources":["../../../src/hooks/ui/listNavigation.ts"],"names":[],"mappings":"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"}

package/lib/hooks/ui/useContainerSize.d.ts

@@ -0,0 +1,15 @@
+import type { RefObject } from 'react';
+import type { ElementSize } from './useResizeObserver.ts';
+/**
+ * The current content-box size of an element, as state.
+ *
+ * The state form of {@link useResizeObserver}, for a chart or a canvas that
+ * has to be laid out from the measurement rather than told about it. Both
+ * numbers are zero until the element is first measured, and the state is left
+ * untouched when a resize reports the same numbers, so a component that sizes
+ * itself from the value cannot loop.
+ * @param ref - Ref holding the element to measure.
+ * @returns Its width and height in CSS pixels.
+ */
+export declare function useContainerSize(ref: RefObject<Element | null>): ElementSize;
+//# sourceMappingURL=useContainerSize.d.ts.map

package/lib/hooks/ui/useContainerSize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContainerSize.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/useContainerSize.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAK1D;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,WAAW,CAY5E"}

package/lib/hooks/ui/useContainerSize.js

@@ -0,0 +1,24 @@
+import { useState } from 'react';
+import { useResizeObserver } from "./useResizeObserver.js";
+const EMPTY_SIZE = { width: 0, height: 0 };
+/**
+ * The current content-box size of an element, as state.
+ *
+ * The state form of {@link useResizeObserver}, for a chart or a canvas that
+ * has to be laid out from the measurement rather than told about it. Both
+ * numbers are zero until the element is first measured, and the state is left
+ * untouched when a resize reports the same numbers, so a component that sizes
+ * itself from the value cannot loop.
+ * @param ref - Ref holding the element to measure.
+ * @returns Its width and height in CSS pixels.
+ */
+export function useContainerSize(ref) {
+    const [size, setSize] = useState(EMPTY_SIZE);
+    useResizeObserver(ref, (next) => {
+        setSize((current) => current.width === next.width && current.height === next.height
+            ? current
+            : next);
+    });
+    return size;
+}
+//# sourceMappingURL=useContainerSize.js.map

package/lib/hooks/ui/useContainerSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContainerSize.js","sourceRoot":"","sources":["../../../src/hooks/ui/useContainerSize.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,UAAU,GAAgB,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;AAExD;;;;;;;;;;GAUG;AACH,MAAM,UAAU,gBAAgB,CAAC,GAA8B;IAC7D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAc,UAAU,CAAC,CAAC;IAE1D,iBAAiB,CAAC,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;QAC9B,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAClB,OAAO,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,IAAI,OAAO,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM;YAC5D,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CACT,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,IAAI,CAAC;AACd,CAAC"}

package/lib/hooks/ui/useDebouncedValue.d.ts

@@ -0,0 +1,12 @@
+/**
+ * A debounced echo of a fast-changing value.
+ *
+ * The returned value only catches up once the source has been still for
+ * `delayMs`, so a memo, a request or a canvas redraw downstream runs when the
+ * user pauses instead of on every keystroke or slider step.
+ * @param value - The live value to follow.
+ * @param delayMs - Quiet period, in milliseconds, before the value settles. Defaults to `250`.
+ * @returns The value as it stood `delayMs` after the last change.
+ */
+export declare function useDebouncedValue<TValue>(value: TValue, delayMs?: number): TValue;
+//# sourceMappingURL=useDebouncedValue.d.ts.map

package/lib/hooks/ui/useDebouncedValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedValue.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/useDebouncedValue.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EACtC,KAAK,EAAE,MAAM,EACb,OAAO,SAAM,GACZ,MAAM,CAaR"}

package/lib/hooks/ui/useDebouncedValue.js

@@ -0,0 +1,24 @@
+import { useEffect, useState } from 'react';
+/**
+ * A debounced echo of a fast-changing value.
+ *
+ * The returned value only catches up once the source has been still for
+ * `delayMs`, so a memo, a request or a canvas redraw downstream runs when the
+ * user pauses instead of on every keystroke or slider step.
+ * @param value - The live value to follow.
+ * @param delayMs - Quiet period, in milliseconds, before the value settles. Defaults to `250`.
+ * @returns The value as it stood `delayMs` after the last change.
+ */
+export function useDebouncedValue(value, delayMs = 250) {
+    const [debounced, setDebounced] = useState(value);
+    useEffect(() => {
+        const handle = setTimeout(() => {
+            setDebounced(value);
+        }, delayMs);
+        return () => {
+            clearTimeout(handle);
+        };
+    }, [value, delayMs]);
+    return debounced;
+}
+//# sourceMappingURL=useDebouncedValue.js.map

package/lib/hooks/ui/useDebouncedValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedValue.js","sourceRoot":"","sources":["../../../src/hooks/ui/useDebouncedValue.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C;;;;;;;;;GASG;AACH,MAAM,UAAU,iBAAiB,CAC/B,KAAa,EACb,OAAO,GAAG,GAAG;IAEb,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,MAAM,GAAG,UAAU,CAAC,GAAG,EAAE;YAC7B,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,EAAE,OAAO,CAAC,CAAC;QACZ,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,MAAM,CAAC,CAAC;QACvB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IAErB,OAAO,SAAS,CAAC;AACnB,CAAC"}

package/lib/hooks/ui/useListKeyboardNavigation.d.ts

@@ -0,0 +1,17 @@
+import type { KeyboardEvent } from 'react';
+import type { ListNavigationHandlerOptions } from './listNavigation.ts';
+/** See {@link ListNavigationHandlerOptions}. */
+export type ListKeyboardNavigationOptions = ListNavigationHandlerOptions;
+/**
+ * Keyboard navigation for a list or a table whose selection lives outside it.
+ *
+ * Put the returned handler on the scrolling container — which needs a
+ * `tabIndex` so it can hold the focus — and `ArrowUp` / `ArrowDown` move one
+ * entry, `PageUp` / `PageDown` move `pageStep`, and `Home` / `End` jump to the
+ * ends. Nothing is stored in the hook: the selection stays wherever the page
+ * already keeps it, and `onSelect` fires only when the index actually changes.
+ * @param options - See {@link ListNavigationHandlerOptions}.
+ * @returns The `onKeyDown` handler for the container.
+ */
+export declare function useListKeyboardNavigation(options: ListKeyboardNavigationOptions): (event: KeyboardEvent<HTMLElement>) => void;
+//# sourceMappingURL=useListKeyboardNavigation.d.ts.map

package/lib/hooks/ui/useListKeyboardNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListKeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/useListKeyboardNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,qBAAqB,CAAC;AAGxE,gDAAgD;AAChD,MAAM,MAAM,6BAA6B,GAAG,4BAA4B,CAAC;AAEzE;;;;;;;;;;GAUG;AACH,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,6BAA6B,GACrC,CAAC,KAAK,EAAE,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAc7C"}

package/lib/hooks/ui/useListKeyboardNavigation.js

@@ -0,0 +1,25 @@
+import { useCallback } from 'react';
+import { handleListNavigationKey } from "./listNavigation.js";
+/**
+ * Keyboard navigation for a list or a table whose selection lives outside it.
+ *
+ * Put the returned handler on the scrolling container — which needs a
+ * `tabIndex` so it can hold the focus — and `ArrowUp` / `ArrowDown` move one
+ * entry, `PageUp` / `PageDown` move `pageStep`, and `Home` / `End` jump to the
+ * ends. Nothing is stored in the hook: the selection stays wherever the page
+ * already keeps it, and `onSelect` fires only when the index actually changes.
+ * @param options - See {@link ListNavigationHandlerOptions}.
+ * @returns The `onKeyDown` handler for the container.
+ */
+export function useListKeyboardNavigation(options) {
+    const { length, selectedIndex, onSelect, pageStep } = options;
+    return useCallback((event) => {
+        handleListNavigationKey(event, {
+            length,
+            selectedIndex,
+            onSelect,
+            pageStep,
+        });
+    }, [length, selectedIndex, onSelect, pageStep]);
+}
+//# sourceMappingURL=useListKeyboardNavigation.js.map

package/lib/hooks/ui/useListKeyboardNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListKeyboardNavigation.js","sourceRoot":"","sources":["../../../src/hooks/ui/useListKeyboardNavigation.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAGpC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAK9D;;;;;;;;;;GAUG;AACH,MAAM,UAAU,yBAAyB,CACvC,OAAsC;IAEtC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC;IAE9D,OAAO,WAAW,CAChB,CAAC,KAAiC,EAAE,EAAE;QACpC,uBAAuB,CAAC,KAAK,EAAE;YAC7B,MAAM;YACN,aAAa;YACb,QAAQ;YACR,QAAQ;SACT,CAAC,CAAC;IACL,CAAC,EACD,CAAC,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAC5C,CAAC;AACJ,CAAC"}

package/lib/hooks/ui/useResizeObserver.d.ts

@@ -0,0 +1,20 @@
+import type { RefObject } from 'react';
+/** The content-box size of an element, in CSS pixels. */
+export interface ElementSize {
+    /** Content-box width. */
+    width: number;
+    /** Content-box height. */
+    height: number;
+}
+/**
+ * Call `callback` whenever the observed element's content box changes size.
+ *
+ * The callback is read through a ref, so an inline arrow function may be
+ * passed on every render without tearing the observer down and setting it up
+ * again. Nothing is observed where `ResizeObserver` is missing — a server
+ * render, or a test rendering to a string — so the hook is safe to call there.
+ * @param ref - Ref holding the element to watch.
+ * @param callback - Receives the new content-box size.
+ */
+export declare function useResizeObserver(ref: RefObject<Element | null>, callback: (size: ElementSize) => void): void;
+//# sourceMappingURL=useResizeObserver.d.ts.map

package/lib/hooks/ui/useResizeObserver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizeObserver.d.ts","sourceRoot":"","sources":["../../../src/hooks/ui/useResizeObserver.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,yDAAyD;AACzD,MAAM,WAAW,WAAW;IAC1B,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,0BAA0B;IAC1B,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;GASG;AACH,wBAAgB,iBAAiB,CAC/B,GAAG,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,EAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,GACpC,IAAI,CAyBN"}

package/lib/hooks/ui/useResizeObserver.js

@@ -0,0 +1,37 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Call `callback` whenever the observed element's content box changes size.
+ *
+ * The callback is read through a ref, so an inline arrow function may be
+ * passed on every render without tearing the observer down and setting it up
+ * again. Nothing is observed where `ResizeObserver` is missing — a server
+ * render, or a test rendering to a string — so the hook is safe to call there.
+ * @param ref - Ref holding the element to watch.
+ * @param callback - Receives the new content-box size.
+ */
+export function useResizeObserver(ref, callback) {
+    const callbackRef = useRef(callback);
+    useEffect(() => {
+        callbackRef.current = callback;
+    });
+    useEffect(() => {
+        const element = ref.current;
+        const Observer = globalThis.ResizeObserver;
+        if (element === null || Observer === undefined)
+            return;
+        const observer = new Observer((entries) => {
+            const entry = entries.at(-1);
+            if (entry === undefined)
+                return;
+            callbackRef.current({
+                width: entry.contentRect.width,
+                height: entry.contentRect.height,
+            });
+        });
+        observer.observe(element);
+        return () => {
+            observer.disconnect();
+        };
+    }, [ref]);
+}
+//# sourceMappingURL=useResizeObserver.js.map

package/lib/hooks/ui/useResizeObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizeObserver.js","sourceRoot":"","sources":["../../../src/hooks/ui/useResizeObserver.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAU1C;;;;;;;;;GASG;AACH,MAAM,UAAU,iBAAiB,CAC/B,GAA8B,EAC9B,QAAqC;IAErC,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;QAC5B,MAAM,QAAQ,GAAG,UAAU,CAAC,cACO,CAAC;QACpC,IAAI,OAAO,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS;YAAE,OAAO;QACvD,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,CAAC,OAAO,EAAE,EAAE;YACxC,MAAM,KAAK,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;YAC7B,IAAI,KAAK,KAAK,SAAS;gBAAE,OAAO;YAChC,WAAW,CAAC,OAAO,CAAC;gBAClB,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,KAAK;gBAC9B,MAAM,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM;aACjC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAC1B,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AACZ,CAAC"}