@astryxdesign/core 0.7.7 → 0.7.8-canary.0588a13

package/dist/Resizable/createResizable.d.ts

@@ -0,0 +1,199 @@
+import type { SizeValue } from '../utils/types.js';
+import { type ResizableDirection } from './resizableModel.js';
+import { type ResizeGestureModel } from './resizeGesture.js';
+import type { ResizableSize } from './utils.js';
+export interface CreateResizableOptions {
+    /**
+     * Initial size. A number or an exact `Npx` is pixels, and an exact `N%` is
+     * a share of the basis. `percent(value, {min | max: pixel(value)})` adds one
+     * pixel floor or ceiling. A value that depends on the basis resolves once
+     * into pixels. @default 250
+     */
+    defaultSize?: ResizableSize | SizeValue;
+    /** The minimum size, in the same forms. @default 50 */
+    minSize?: ResizableSize;
+    /** The maximum size, in the same forms. Unbounded when omitted. */
+    maxSize?: ResizableSize;
+    /** Pixel values the region rests on; it can rest only on one of them. */
+    snaps?: number[];
+    /** Whether the region can collapse to 0. @default false */
+    collapsible?: boolean;
+    /** Size in px under which a drag collapses the region. @default 40 */
+    collapsedSize?: number;
+    /**
+     * The element a percentage is a share of, read as `containerRef.current`.
+     * Omitted, percentages are a share of the viewport. A plain `{current}`
+     * object serves outside React.
+     */
+    containerRef?: {
+        readonly current: HTMLElement | null;
+    };
+    /** The axis the region resizes along. @default 'horizontal' */
+    direction?: ResizableDirection;
+    /** Key under which the size and collapse state persist in localStorage. */
+    autoSaveId?: string;
+    /** Initial collapse state; a persisted entry wins over it. */
+    defaultIsCollapsed?: boolean;
+    /**
+     * Controlled collapse state. When set, the caller owns collapse. A collapse
+     * or expand request reports through `onCollapseChange`. Nothing changes
+     * until the caller passes the new value through `update`.
+     */
+    isCollapsed?: boolean;
+    /** Called when an interaction changes the size. */
+    onSizeChange?: (size: number) => void;
+    /** Called when an interaction collapses or expands the region. */
+    onCollapseChange?: (isCollapsed: boolean) => void;
+    /**
+     * The handle sits before the panel it resizes (the panel is at the end), so
+     * a drag toward the start grows it.
+     * @default false
+     */
+    isReversed?: boolean;
+    /**
+     * Ignores pointer and keyboard input and says so; a plain element keeps its
+     * tab stop.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * A plain element's accessible name, when it has none of its own. Without
+     * it, the factory uses the message catalog's English message.
+     * @default 'Resize handle'
+     */
+    label?: string;
+    /**
+     * Replaces the catalog's "Collapsed" that the handle announces as its
+     * `aria-valuetext` while the region is collapsed. Absent, the factory
+     * announces the shipped English message.
+     * @default 'Collapsed'
+     */
+    collapsedLabel?: string;
+}
+export interface ResizableController {
+    /** The region's size in px, 0 while collapsed. */
+    readonly size: number;
+    readonly isCollapsed: boolean;
+    /** Collapses the region, when it is collapsible. */
+    collapse(): void;
+    /** Expands the region to the size it had before it collapsed. */
+    expand(): void;
+    /** Resizes the region to `size` px, within its bounds. */
+    resize(size: number): void;
+    /**
+     * Takes the full set of options, as a new render does: an option left out
+     * returns to its default. The region keeps its size and collapse state,
+     * within the new options.
+     */
+    update(options: CreateResizableOptions): void;
+    /**
+     * Calls `listener` after every change to `size` or `isCollapsed`, a
+     * correction a newly measured basis makes included. Returns the function
+     * that stops it.
+     */
+    subscribe(listener: () => void): () => void;
+    /**
+     * Removes every listener, observer and attribute the factory added and the
+     * body's drag cursor; a drag in flight ends as cancelled.
+     */
+    destroy(): void;
+}
+/**
+ * The state a region with `options` starts in, before its handle exists: the
+ * server's render and a hook's first render. A container is not measured
+ * yet, so a percentage of it resolves against the deterministic 1200px basis
+ * until the factory measures it. `'server'` reads the state the server
+ * rendered, for a render that hydrates it: the 1200px basis for a viewport
+ * percentage too, and nothing saved.
+ */
+export declare function readInitialResizableState(options?: CreateResizableOptions, environment?: 'client' | 'server'): ResizableSnapshot;
+/**
+ * What a React form of the region renders. A change to any part replaces it
+ * as a whole. It holds the size (0 while collapsed), the collapse state, the
+ * size as expanded, and the bounds the handle announces.
+ */
+export interface ResizableSnapshot {
+    readonly size: number;
+    readonly isCollapsed: boolean;
+    readonly expandedSize: number;
+    readonly minPx: number;
+    readonly maxPx: number;
+    /** The maximum the handle reports: a configured one, or a measured extent. */
+    readonly effectiveMaxPx: number | undefined;
+}
+/**
+ * The package's own channel into a factory, for useResizable: kept off the
+ * exported ResizableController, so it adds no public member.
+ */
+interface ResizableInternals {
+    snapshot(): ResizableSnapshot;
+    /** Calls `listener` after every change to the snapshot. */
+    subscribeSnapshot(listener: () => void): () => void;
+    /**
+     * Follows the element behind `containerRef` when it has changed without
+     * new options, as a React caller's commit may have swapped it.
+     */
+    syncContainer(): void;
+    /**
+     * Lets go of the page and keeps the region. A gesture in flight ends as
+     * cancelled, and the handle's listeners, its attributes and the observers
+     * go. Collapse, expand and resize still apply and report. For a React caller
+     * whose component unmounts or an `<Activity>` hides.
+     */
+    suspend(): void;
+    /** Takes the page back after `suspend`: the handle, and the observers. */
+    resume(): void;
+    /**
+     * The region's side of a gesture the factory does not own: the drag and
+     * keys of a ResizeHandle given the configuration object's props.
+     */
+    model: ResizeGestureModel;
+}
+/** The factory's internal channel, or undefined for anything else. */
+export declare function readResizableInternals(controller: ResizableController): ResizableInternals | undefined;
+/**
+ * Make `handle` a window splitter that resizes a region. The factory never
+ * sizes the panel: it reports the size, and the caller applies it.
+ *
+ * It gives the handle `role="separator"`, its orientation and its value. It
+ * adds a tab stop and an accessible name when the handle has none. It answers
+ * a pointer drag, the arrow keys, Home and End, and holds the pointer for a
+ * whole drag. Enter and a double-click collapse and restore. A horizontal
+ * region resizes along the inline axis, and under right-to-left the drag
+ * follows the pointer. `destroy` takes all of it away. With a null handle the
+ * region still answers collapse, expand, resize and subscribe, and touches no
+ * element. Outside a provider, its name and its collapsed text are the
+ * shipped English messages. `label` names it, and `collapsedLabel` replaces
+ * its collapsed text in another language.
+ *
+ * @example
+ * ```
+ * const sidebar = document.querySelector('#sidebar');
+ * const resizable = createResizable(document.querySelector('#divider'), {
+ *   defaultSize: 260,
+ *   minSize: 180,
+ *   maxSize: 480,
+ *   collapsible: true,
+ *   autoSaveId: 'sidebar',
+ * });
+ * const paint = () => {
+ *   sidebar.style.width = `${resizable.size}px`;
+ * };
+ * paint();
+ * resizable.subscribe(paint);
+ * ```
+ */
+export declare function createResizable(handle: HTMLElement | null, options?: CreateResizableOptions): ResizableController;
+/**
+ * Who a factory's development warnings speak for: the bare factory, or the
+ * configuration-object useResizable built on it, whose warnings keep the
+ * hook's name and words.
+ */
+export type ResizableWarningSource = 'createResizable' | 'useResizable';
+/**
+ * createResizable, with its development warnings in the words of `source`:
+ * the package's own entry, for useResizable.
+ */
+export declare function createResizableAs(source: ResizableWarningSource, handle: HTMLElement | null, options?: CreateResizableOptions): ResizableController;
+export {};
+//# sourceMappingURL=createResizable.d.ts.map

package/dist/Resizable/createResizable.d.ts.map

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