@ahrowe/ui 0.26.0 → 0.28.0

package/dist/types/package/common/configProvider/configProvider.types.d.ts

@@ -29,6 +29,9 @@ import { FlipProps } from '../flip/flip.types';
 import { OptionPickerProps } from '../optionPicker/optionPicker.types';
 import { TimerProps } from '../timer/timer.types';
 import { OtpInputProps } from '../otpInput/otpInput.types';
+import { MultiSelectProps } from '../multiSelect/multiSelect.types';
+import { PaginationProps } from '../pagination/pagination.types';
+import { TreeProps } from '../tree/tree.types';
 import { RoomDrawerProps } from '../roomDrawer/roomDrawer.types';
 import { RoomViewerProps } from '../roomViewer/roomViewer.types';
 import { FloatingMenuProps, Presentation } from '../floatingMenu/floatingMenu.types';
@@ -79,6 +82,9 @@ export interface ComponentDefaults {
     OptionPicker?: Partial<OptionPickerProps>;
     Timer?: Partial<TimerProps>;
     OtpInput?: Partial<OtpInputProps>;
+    MultiSelect?: Partial<MultiSelectProps>;
+    Pagination?: Partial<PaginationProps>;
+    Tree?: Partial<TreeProps>;
     RoomDrawer?: Partial<RoomDrawerProps>;
     RoomViewer?: Partial<RoomViewerProps>;
     FloatingMenu?: Partial<FloatingMenuProps>;

package/dist/types/package/common/floatingMenu/useFloatingPosition.d.ts

@@ -13,17 +13,15 @@ export interface UseFloatingPositionArgs {
     placement?: 'top' | 'bottom';
 }
 /**
- * Keeps a portaled, `position: fixed` popup anchored to a trigger element: tracks the
- * trigger across scroll/resize on every real scrolling ancestor, flips above the trigger
- * when there's no room below, and hides (not closes) the popup when the trigger itself
+ * Keeps a portaled, `position: fixed` popup anchored to a trigger element: flips above the
+ * trigger when there's no room below, and hides (not closes) the popup when the trigger itself
  * scrolls behind a clipping ancestor — matching Floating UI's autoUpdate + hide middleware.
  * It also shifts the popup horizontally to stay within the viewport: `align`/RTL-style CSS
  * only positions the panel relative to the anchor's own box and has no awareness of where
  * that box actually sits on screen, so a trigger near a screen edge would otherwise let the
  * panel overflow it with no correction.
  *
- * Position/visibility are written straight to the DOM via refs, not through React state:
- * going through setState -> re-render -> commit adds a round-trip that lags behind the
- * browser's own scroll painting by at least a frame.
+ * `useAnchorTracking` supplies the lifecycle around this: mount wait, ancestor resolution, and
+ * re-running on scroll, viewport resize and panel size changes.
  */
 export declare function useFloatingPosition({ isOpen, triggerRef, anchorRef, panelRef, flipClassName, placement }: UseFloatingPositionArgs): void;

package/dist/types/package/common/floorPlan/floorPlan.graph.d.ts

@@ -94,6 +94,51 @@ export interface DissolveNodeOptions {
 export declare function dissolveNode(floor: PlanFloor, nodeId: string, options?: DissolveNodeOptions): PlanEdit<{
     wallId: string;
 } | null>;
+export interface DetachWallResult {
+    /** The wall's end nodes after the detach, in `[a, b]` order. */
+    nodeIds: [string, string];
+    /** Connecting walls minted where an end was shared with a neighbour. */
+    connectorIds: string[];
+    /** Ends that became a straight seam once the wall left, and were dissolved away. */
+    dissolvedNodeIds: string[];
+}
+/**
+ * Pulls a wall off the nodes it shares with its neighbours and moves it by `delta`,
+ * leaving a connecting wall behind at each end that was shared.
+ *
+ * This is the extrude half of dragging a wall. A plain drag moves the shared end nodes,
+ * so everything meeting the wall follows it; here the neighbours keep their ends and
+ * only the new connectors grow, which is what you want when a partition joins the wall
+ * halfway along and should stay put.
+ *
+ * A free end is only moved: there is nothing there to detach from, and a connector would
+ * be zero length. For the same reason `delta` must be at least `MIN_WALL_LENGTH` long —
+ * below that the caller should `moveNode` both ends instead.
+ *
+ * The connector continues whatever was already at the corner (its thickness, type and
+ * heights) when exactly one wall was, so pulling a wall off a plain corner redraws
+ * exactly as a plain drag would: the seam that leaves behind is straight and is
+ * dissolved before returning. At a junction there is no single wall to continue, so the
+ * connector takes the dragged wall's own construction.
+ */
+export declare function detachWall(floor: PlanFloor, wallId: string, delta: PlanPoint): PlanEdit<DetachWallResult | null>;
+/**
+ * Collapses every wall shorter than `minLength` by merging its two ends together.
+ *
+ * Squashing a wall to nothing is the one thing a drag can do that the model forbids, and
+ * it is easy to do by accident: pushing a wall back onto the line it was detached from,
+ * or dragging a corner past the one next to it. Deleting the short wall is the wrong
+ * repair — it leaves two nodes sitting on the same point with the plan split between
+ * them, which reads as two corners stacked on top of each other and derives as two
+ * rooms. Merging is lossless, since the two ends are within `minLength` of each other by
+ * definition.
+ *
+ * The end with more walls on it survives, so the corner that was already there keeps its
+ * position and the one that arrived is the one that gives way.
+ */
+export declare function weldShortWalls(floor: PlanFloor, minLength?: number): PlanEdit<{
+    weldedWallIds: string[];
+}>;
 export declare function removeWall(floor: PlanFloor, wallId: string, opts?: {
     pruneOrphanNodes?: boolean;
     dissolveCollinear?: boolean;

package/dist/types/package/common/floorPlan/floorPlan.mesh.d.ts

@@ -0,0 +1,36 @@
+import { PlanFloor } from './floorPlan.types';
+export type PlanMeshPart = 'wall' | 'floor';
+export interface PlanMeshGroup {
+    part: PlanMeshPart;
+    /** Offset into `indices`, and how many of them. Draw ranges, or assign materials. */
+    start: number;
+    count: number;
+}
+export interface PlanMesh {
+    /** World-space xyz triples, in millimetres. */
+    positions: Float32Array;
+    /** Unit face normals, one per vertex. */
+    normals: Float32Array;
+    indices: Uint32Array;
+    groups: PlanMeshGroup[];
+}
+export interface BuildPlanMeshOptions {
+    /** Storey height for walls that do not carry their own. Defaults to the floor's. */
+    wallHeight?: number;
+    /** Lay a slab under each room. Default true. */
+    includeFloorSlab?: boolean;
+    /** Millimetres. The slab hangs below the floor level. Default 200. */
+    slabThickness?: number;
+    /**
+     * Lift everything by the floor's own elevation, so several storeys stack into one
+     * scene. Default true.
+     */
+    applyElevation?: boolean;
+}
+/**
+ * Triangles for one floor: every wall, with its openings cut out, and a slab per room.
+ *
+ * Call it per storey and concatenate to build a whole building; each floor already knows
+ * its own elevation.
+ */
+export declare function buildPlanMesh(floor: PlanFloor, options?: BuildPlanMeshOptions): PlanMesh;

package/dist/types/package/common/floorPlan/floorPlan.triangulate.d.ts

@@ -0,0 +1,11 @@
+import { PlanPoint } from './floorPlan.types';
+/**
+ * Triangulates a ring and its holes into index triples over the returned vertex list.
+ *
+ * The vertices come back as well as the indices because bridging a hole duplicates the
+ * two vertices it joins, so the caller cannot simply index into what it passed in.
+ */
+export declare function triangulate(outer: readonly PlanPoint[], holes?: readonly (readonly PlanPoint[])[]): {
+    vertices: PlanPoint[];
+    indices: number[];
+};

package/dist/types/package/common/floorPlan/index.d.ts

@@ -16,13 +16,15 @@ export { commitDerivation, derivePlan, pruneUnmatchedRooms, roomAtPoint } from '
 export type { CommitDerivationOptions } from './floorPlan.rooms';
 export { HIT_PX, HIT_PX_COARSE, hitTest, selectionsEqual, worldTolerances } from './floorPlan.hit';
 export type { HitTestOptions, HitTolerances } from './floorPlan.hit';
-export { DEFAULT_WALL_ATTRS, addOpening, addRect, addWall, cleanupPlan, dissolveNode, mergeNodes, moveNode, removeOpening, removeWall, scalePlan, splitWall, transformPlan, updateOpening, validatePlan, wallLength, } from './floorPlan.graph';
-export type { DissolveNodeOptions, ResolveNodeResult, SplitWallResult, WallAttrs, } from './floorPlan.graph';
+export { DEFAULT_WALL_ATTRS, addOpening, addRect, addWall, cleanupPlan, detachWall, dissolveNode, mergeNodes, moveNode, removeOpening, removeWall, scalePlan, splitWall, transformPlan, updateOpening, validatePlan, wallLength, weldShortWalls, } from './floorPlan.graph';
+export type { DetachWallResult, DissolveNodeOptions, ResolveNodeResult, SplitWallResult, WallAttrs, } from './floorPlan.graph';
 export { DEFAULT_SNAP_OPTIONS, SnapKind, clientToWorld, resolveSnap, screenScale } from './floorPlan.snap';
 export type { SnapContext, SnapGuide, SnapOptions, SnapResult } from './floorPlan.snap';
 export { buildWallPaths, openingGeometry, wallCentrelineSpans } from './floorPlan.path';
 export type { BuildWallPathsOptions, WallCapLine, WallCapReason, WallPathGroup, WallPathResult, } from './floorPlan.path';
 export { PLAN_FORMAT_VERSION, planFromJson, planToJson } from './floorPlan.json';
 export type { PlanParseResult } from './floorPlan.json';
+export { buildPlanMesh } from './floorPlan.mesh';
+export type { BuildPlanMeshOptions, PlanMesh, PlanMeshGroup, PlanMeshPart } from './floorPlan.mesh';
 export { planFromLegacySvg } from './legacySvg';
 export type { LegacyImportOptions } from './legacySvg';

package/dist/types/package/common/hooks/useAnchorTracking.d.ts

@@ -0,0 +1,40 @@
+import { RefObject } from 'react';
+export interface UseAnchorTrackingArgs {
+    isOpen: boolean;
+    /** The element the popup is anchored to. Its scrollable ancestors are what get tracked. */
+    triggerRef: RefObject<HTMLElement | null>;
+    /**
+     * Every element the positioning maths needs. Tracking starts only once all of them, plus the
+     * trigger, are mounted. Read fresh on each setup, so an inline array literal is fine.
+     */
+    elementRefs: RefObject<HTMLElement | null>[];
+    /**
+     * Positions the popup. Called once on setup and then on every scroll, resize and tracked size
+     * change. Reads the caller's own refs for everything beyond the two arguments.
+     */
+    update: (trigger: HTMLElement, ancestors: HTMLElement[]) => void;
+    /**
+     * Elements whose own size changes must re-run `update`: a popup whose content changes size
+     * while open (a filtered list shrinking, an async list loading in) otherwise keeps coordinates
+     * computed for its old height and ends up detached from the trigger. Re-read on every update,
+     * since a panel can mount a commit later than the element it hangs off.
+     */
+    resizeRefs?: RefObject<HTMLElement | null>[];
+    /** Hands the popup's elements back as they were found. Runs when tracking stops. */
+    teardown?: () => void;
+    /** Values that must restart tracking, and so re-run `update`, when they change. */
+    deps?: readonly unknown[];
+}
+/**
+ * The lifecycle half of anchoring a portaled, `position: fixed` popup to a trigger: waits for the
+ * elements to mount, resolves the trigger's scrolling ancestors once, and re-runs the caller's
+ * positioning on every scroll, viewport resize and tracked size change until it closes.
+ *
+ * Callers supply only the geometry (`update`) and the inline styles to clear again (`teardown`);
+ * `useFloatingPosition` and `usePopoverPosition` are both built on this.
+ *
+ * Position is deliberately written straight to the DOM by the caller rather than through React
+ * state: going through setState -> re-render -> commit adds a round-trip that lags behind the
+ * browser's own scroll painting by at least a frame.
+ */
+export declare function useAnchorTracking({ isOpen, triggerRef, elementRefs, update, resizeRefs, teardown, deps, }: UseAnchorTrackingArgs): void;

package/dist/types/package/common/inputDropdown/inputDropdown.types.d.ts

@@ -19,6 +19,12 @@ export interface InputDropdownProps extends Omit<HtmlProps, 'onSelect'> {
      * instead of only when an item is picked from the list.
      */
     allowCustomValue?: boolean;
+    /**
+     * Maximum number of filtered items rendered in the list. Matches beyond this
+     * are dropped (the user narrows by typing, not by scrolling). `0` renders all
+     * matches. Default `100`.
+     */
+    maxItems?: number;
     onSelect?: (value: string) => void;
     onChange?: (value: unknown) => void;
     placeholder?: string;

package/dist/types/package/common/multiSelect/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './multiSelect';
+export * from './multiSelect.types';

package/dist/types/package/common/multiSelect/multiSelect.d.ts

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { MultiSelectProps } from './multiSelect.types';
+declare function MultiSelect(props: MultiSelectProps): ReactElement;
+export default MultiSelect;

package/dist/types/package/common/multiSelect/multiSelect.types.d.ts

@@ -0,0 +1,62 @@
+import { CSSProperties } from 'react';
+import { FormValidator } from '../../services/formValidation';
+import { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';
+import { Presentation } from '../floatingMenu/floatingMenu.types';
+export type MultiSelectValue = string | number;
+export interface MultiSelectItem {
+    key: MultiSelectValue;
+    /** Visible text. A string, not a `ReactNode`, because it also renders inside a `Chip`. */
+    label: string;
+    /** Disable just this option. */
+    disabled?: boolean;
+}
+export type MultiSelectSlots = 'root' | 'label' | 'fieldset' | 'control' | 'values' | 'chip' | 'placeholder' | 'clearButton' | 'icon' | 'panel' | 'search' | 'options' | 'option' | 'optionCheck' | 'optionLabel' | 'empty';
+export interface MultiSelectProps extends Omit<HtmlProps<HTMLDivElement>, 'onChange' | 'value' | 'defaultValue'> {
+    /** The selectable options. */
+    items: MultiSelectItem[];
+    /** Controlled selection. Omit for uncontrolled. */
+    value?: MultiSelectValue[];
+    /** Initial selection when uncontrolled (default `[]`). */
+    defaultValue?: MultiSelectValue[];
+    /** Fires with the full new selection, in the order the items were picked. */
+    onChange?: (value: MultiSelectValue[]) => void;
+    /** Field label. Rests inside the control and floats up into the border notch, like `Input`. */
+    label?: string;
+    /** Keep the label floating even when the field is empty and unfocused (default `false`). */
+    alwaysFloatLabel?: boolean;
+    /** Shown while nothing is selected. With a `label`, only once the label has floated clear. */
+    placeholder?: string;
+    /** Show a search box in the panel that filters the options (default `false`). */
+    searchable?: boolean;
+    /**
+     * Let the user add a value that isn't in `items` by typing it and picking the "add" row that
+     * appears. Implies `searchable`, since the search box is where the value is typed. The new
+     * value becomes its own key, so `onChange` reports it as a plain string.
+     */
+    allowCustomValues?: boolean;
+    /** Label for the row that adds a typed value (default `Add "…"`). */
+    createLabel?: (value: string) => string;
+    /** Placeholder for the search box (default `'Search…'`). */
+    searchPlaceholder?: string;
+    /** Text shown in the panel when no option matches (default `'No matches'`). */
+    emptyLabel?: string;
+    /** Cap the number of selections. Unselected options disable once the cap is reached. */
+    maxSelected?: number;
+    /** Show a button that clears the whole selection (default `true`). */
+    clearable?: boolean;
+    disabled?: boolean;
+    /** Show the selection but allow no changes, without the dimming `disabled` applies. */
+    readOnly?: boolean;
+    /** Where the panel opens: anchored to the control, as a bottom sheet, or a sheet only on a
+     * small touch screen. Forwarded to `Popover`. */
+    presentation?: Presentation;
+    formValidator?: FormValidator | null;
+    /** Manual error message shown in a tooltip (used when there's no `formValidator`). */
+    errorMessage?: string;
+    /** Manual valid state when not using a `formValidator` (default `true`). */
+    isValid?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    classNames?: SlotClassNames<MultiSelectSlots>;
+    styles?: SlotStyles<MultiSelectSlots>;
+}

package/dist/types/package/common/pagination/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './pagination';
+export * from './pagination.types';

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

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { PaginationProps } from './pagination.types';
+declare function Pagination(props: PaginationProps): ReactElement | null;
+export default Pagination;

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

@@ -0,0 +1,30 @@
+import { CSSProperties } from 'react';
+import { IconContent } from '../types/icon.types';
+import { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';
+export type PaginationSlots = 'root' | 'item' | 'control' | 'ellipsis';
+export interface PaginationProps extends Omit<HtmlProps<HTMLElement>, 'onChange'> {
+    /** Total number of pages. Nothing renders below `1`. */
+    total: number;
+    /** Controlled current page, 1-based (omit for uncontrolled). */
+    page?: number;
+    /** Initial page when uncontrolled (default `1`). */
+    defaultPage?: number;
+    onChange?: (page: number) => void;
+    /** Pages shown either side of the current one (default `1`). */
+    siblings?: number;
+    /** Pages always shown at the start and end (default `1`). */
+    boundaries?: number;
+    /** Show the previous/next controls (default `true`). */
+    showControls?: boolean;
+    /** Show first/last jump controls outside the previous/next ones (default `false`). */
+    showEdges?: boolean;
+    disabled?: boolean;
+    previousIcon?: IconContent;
+    nextIcon?: IconContent;
+    firstIcon?: IconContent;
+    lastIcon?: IconContent;
+    className?: string;
+    style?: CSSProperties;
+    classNames?: SlotClassNames<PaginationSlots>;
+    styles?: SlotStyles<PaginationSlots>;
+}

package/dist/types/package/common/popover/usePopoverPosition.d.ts

@@ -17,7 +17,9 @@ export interface UsePopoverPositionArgs {
  * Positions a portaled, `position: fixed` popover on any of the four sides of its trigger with
  * start/center/end cross-axis alignment. Flips to the opposite side when the preferred one has no
  * room, shifts back on-screen along the cross axis, points the arrow at the trigger centre, and
- * hides (not closes) the panel once the trigger scrolls behind a clipping ancestor. Position is
- * written straight to the DOM via refs — going through setState lags the browser's scroll paint.
+ * hides (not closes) the panel once the trigger scrolls behind a clipping ancestor.
+ *
+ * `useAnchorTracking` supplies the lifecycle around this: mount wait, ancestor resolution, and
+ * re-running on scroll, viewport resize and panel size changes.
  */
 export declare function usePopoverPosition({ isOpen, placement, align, offset, triggerRef, floatingRef, panelRef, arrowRef, }: UsePopoverPositionArgs): void;

package/dist/types/package/common/tree/flattenTree.d.ts

@@ -0,0 +1,3 @@
+import { FlatTreeNode, TreeNode, TreeValue } from './tree.types';
+/** The visible nodes in render order. Flat, not nested, deliberately: see docs/Tree.md. */
+export declare function flattenTree(nodes: TreeNode[], expandedKeys: TreeValue[], level?: number, parentKey?: TreeValue | null): FlatTreeNode[];

package/dist/types/package/common/tree/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './tree';
+export { flattenTree } from './flattenTree';
+export * from './tree.types';

package/dist/types/package/common/tree/tree.d.ts

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { TreeProps } from './tree.types';
+declare function Tree(props: TreeProps): ReactElement;
+export default Tree;

package/dist/types/package/common/tree/tree.types.d.ts

@@ -0,0 +1,62 @@
+import { CSSProperties, ReactNode } from 'react';
+import { IconContent } from '../types/icon.types';
+import { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';
+export type TreeValue = string | number;
+export interface TreeNode {
+    key: TreeValue;
+    label: ReactNode;
+    /** Icon shown before the label. */
+    icon?: IconContent;
+    /** Child nodes. An empty array still renders a toggle, for a branch whose children load later. */
+    children?: TreeNode[];
+    disabled?: boolean;
+}
+/** One visible row produced by `flattenTree`. */
+export interface FlatTreeNode {
+    node: TreeNode;
+    /** Depth from the roots, 0-based. */
+    level: number;
+    parentKey: TreeValue | null;
+    isBranch: boolean;
+    isExpanded: boolean;
+    /** Number of siblings at this level, for `aria-setsize`. */
+    setSize: number;
+    /** 1-based position among those siblings, for `aria-posinset`. */
+    posInSet: number;
+}
+export type TreeSlots = 'root' | 'node' | 'toggle' | 'icon' | 'label' | 'empty';
+export interface TreeProps extends Omit<HtmlProps<HTMLDivElement>, 'onSelect'> {
+    nodes: TreeNode[];
+    /** Controlled set of expanded branch keys. Omit for uncontrolled. */
+    expandedKeys?: TreeValue[];
+    /** Branches expanded initially when uncontrolled (default `[]`). */
+    defaultExpandedKeys?: TreeValue[];
+    onExpandedChange?: (keys: TreeValue[]) => void;
+    /** Controlled selected key. Omit for uncontrolled. */
+    selectedKey?: TreeValue | null;
+    /** Key selected initially when uncontrolled. */
+    defaultSelectedKey?: TreeValue;
+    onSelect?: (key: TreeValue, node: TreeNode) => void;
+    /** Clicking a branch's label toggles it as well as selecting it (default `true`). */
+    expandOnSelect?: boolean;
+    /** Indent per level in px (default `20`). */
+    indent?: number;
+    /** Icon for the expand/collapse toggle. Rotates 90° when open (default a right chevron). */
+    toggleIcon?: IconContent;
+    /**
+     * Sets a fixed viewport height and windows the rows through `VirtualList`, so only the visible
+     * ones are in the DOM. Use it past a few hundred visible nodes. Rows must then be uniform
+     * height: set `--tree-node-height` rather than sizing individual rows.
+     */
+    height?: number | string;
+    /** Row height used by the windowed renderer before measurement (default `32`). */
+    estimatedRowHeight?: number;
+    /** Shown when `nodes` is empty (default `'Nothing here'`). */
+    emptyLabel?: string;
+    disabled?: boolean;
+    'aria-label'?: string;
+    className?: string;
+    style?: CSSProperties;
+    classNames?: SlotClassNames<TreeSlots>;
+    styles?: SlotStyles<TreeSlots>;
+}

package/dist/types/package/common/virtualList/virtualList.types.d.ts

@@ -83,6 +83,14 @@ export interface VirtualListProps<T> extends HtmlProps {
     renderRow?: (item: T, index: number) => ReactNode;
     /** Column definitions — presence enables table/header mode. */
     columns?: VirtualListColumn<T>[];
+    /**
+     * Replaces the roles put on the container and rows (default `list`/`listitem`, or `grid`/`row`
+     * with columns). Pass `'none'` for both when the rows carry their own semantics, as `Tree` does.
+     */
+    ariaRoles?: {
+        container: string;
+        row: string;
+    };
     /** Height of the scroll viewport. Defaults to '100%' to fill the parent container. */
     height?: number | string;
     /** Estimated row height before measurement. Default: 40. */

package/dist/types/package/common/virtualList/virtualRow.d.ts

@@ -14,7 +14,7 @@ export interface VirtualRowProps {
     ariaRowIndex?: number;
     ariaPosInSet?: number;
     ariaSetSize?: number;
-    rowRole: 'row' | 'listitem';
+    rowRole: string;
     reorderable?: boolean;
     /**
      * Native mouse DnD is active for the list. Distinct from `draggable`, which in

package/dist/types/package/index.d.ts

@@ -75,6 +75,8 @@ export * from './common/klipyPicker';
 export * from './common/loading';
 export { default as Modal } from './common/modal';
 export * from './common/modal';
+export { default as MultiSelect } from './common/multiSelect';
+export * from './common/multiSelect';
 export { default as NumberInput } from './common/numberInput';
 export * from './common/numberInput';
 export { default as OptionPicker } from './common/optionPicker';
@@ -83,6 +85,8 @@ export { default as OtpInput } from './common/otpInput';
 export * from './common/otpInput';
 export { default as Overscroll } from './common/overscroll';
 export * from './common/overscroll';
+export { default as Pagination } from './common/pagination';
+export * from './common/pagination';
 export { default as Popover } from './common/popover';
 export * from './common/popover';
 export { default as ProgressBar } from './common/progressBar';
@@ -138,6 +142,8 @@ export { default as ToastProvider } from './common/toast';
 export * from './common/toast';
 export { default as Tooltip } from './common/tooltip';
 export * from './common/tooltip';
+export { default as Tree } from './common/tree';
+export * from './common/tree';
 export { default as VirtualList } from './common/virtualList';
 export * from './common/virtualList';
 export { default as Wizard } from './common/wizard';

package/docs/CLAUDE.md

@@ -156,10 +156,12 @@ FontAwesome internals, so they still take an `IconDefinition` only.
 @KlipyPicker.md
 @Loading.md
 @Modal.md
+@MultiSelect.md
 @NumberInput.md
 @OptionPicker.md
 @OtpInput.md
 @Overscroll.md
+@Pagination.md
 @Popover.md
 @ProgressBar.md
 @RadioGroup.md
@@ -186,5 +188,6 @@ FontAwesome internals, so they still take an `IconDefinition` only.
 @Timer.md
 @Toast.md
 @Tooltip.md
+@Tree.md
 @VirtualList.md
 @Wizard.md

package/docs/FloorPlan.md

@@ -52,6 +52,8 @@ Every operation is pure and returns `PlanEdit<T>` = `{ floor, result, issues }`,
 | `splitWall(floor, wallId, at)` | Cuts a wall at a point or 0..1 parameter; redistributes its openings |
 | `mergeNodes(floor, keepId, removeId)` | Welds two nodes, deduplicating the walls that collapse together |
 | `dissolveNode(floor, nodeId)` | Rejoins two collinear same-construction walls; the inverse of `splitWall` |
+| `detachWall(floor, wallId, delta)` | Pulls a wall off its shared corners and moves it by `delta`, bridging each old corner to the new one |
+| `weldShortWalls(floor)` | Collapses every wall shorter than `MIN_WALL_LENGTH` by merging its two ends, so a squashed wall never leaves two corners stacked on one point |
 | `removeWall(floor, wallId, opts?)` | Removes a wall, its openings, and any node left orphaned |
 | `moveNode` / `transformPlan` / `scalePlan` | Move one node, translate everything, or rescale everything |
 | `addOpening` / `updateOpening` / `removeOpening` | Openings, clamped to fit their wall |
@@ -207,7 +209,43 @@ Feeding every legacy polygon edge through `addWall` is what collapses the old du
 
 ## Ready for 3D
 
-The model carries everything an extrusion needs and nothing it would have to invent: `PlanWall.thickness` / `height` / `baseHeight`, `PlanOpening.sill` / `head`, `PlanFloor.elevation` / `height`, and derived floor polygons. No 3D renderer ships today.
+`buildPlanMesh(floor, options?)` turns a storey into triangles: wall solids with their openings cut out, and a slab under each room.
+
+```ts
+import { buildPlanMesh } from '@ahrowe/ui';
+
+const mesh = buildPlanMesh(plan.floors[0]);
+// { positions: Float32Array, normals: Float32Array, indices: Uint32Array, groups }
+
+// three.js, for example — no adapter needed
+const g = new THREE.BufferGeometry();
+g.setAttribute('position', new THREE.BufferAttribute(mesh.positions, 3));
+g.setAttribute('normal', new THREE.BufferAttribute(mesh.normals, 3));
+g.setIndex(new THREE.BufferAttribute(mesh.indices, 1));
+```
+
+There is no renderer and no dependency: plain arrays are what every engine takes, so this feeds three.js, Babylon, a glTF writer or your own rasteriser without the package having an opinion. Call it per storey and concatenate for a whole building; each floor already knows its own `elevation`.
+
+**Axes.** Plan x becomes world x, plan y becomes world **z**, and world y is up. A plan is drawn in SVG's y-down space, so that mapping is a handedness flip — faces are wound here to suit, rather than inheriting the 2D rings' winding.
+
+**Openings are cut by splitting the wall, not by subtracting solids.** Every opening is an axis-aligned rectangle in its wall's own plane, so the wall falls into at most three prisms: under the sill, over the head, and the full-height stretches between openings. Exact, and no CSG library. A window leaves its upstand and lintel behind, which is what `sill` and `head` are carried for.
+
+**Storeys stack wall to wall.** `elevation` is the *finished floor level*, so a slab hangs below it and the walls start at the slab's underside — they clothe the floor plate the way a facade does, rather than stopping at it. A wall stays exactly `floor.height` tall, one storey's walls end precisely where the next storey's begin, and the slab sits inside them instead of showing as a band between the storeys. Build the walls from the level itself and their top face ends up coplanar with the slab above, which z-fights.
+
+A wall also drops a millimetre past the slab rather than landing flush on its underside. That is not arbitrary: a wall overlaps the slab it stands over, because the slab reaches the wall centrelines and the wall straddles them, so sharing a plane would leave two downward faces fighting for the same pixels and speckle the whole underside of the building. Wall heights and floor-to-floor spacing are unaffected.
+
+`groups` marks which triangles are wall and which are floor, so the two can take different materials in one draw.
+
+| Option | Default | |
+|---|---|---|
+| `wallHeight` | the floor's `height` | For walls with no `height` of their own |
+| `includeFloorSlab` | `true` | Lay a slab under each room |
+| `slabThickness` | `200` | Millimetres, hanging below floor level |
+| `applyElevation` | `true` | Lift by the floor's own elevation, so storeys stack |
+
+**Corners are mitred.** Two walls meeting at a corner both stop at the shared node, so left square they leave a gap of half a thickness on the outside of the turn — a notch cut through the full height of the wall. Their footprints are extended to where their edges actually cross instead, which is the same join the 2D renderer makes.
+
+An end stays square where there is no single corner to mitre to: a junction of three or more walls, a change of thickness across the node, an angle acute enough to send the mitre running away, and the reveals of an opening, which are square faces in their own right. Walls overlap slightly at those joints, which is invisible on an opaque solid but would show in a cutaway or through glass, and would double-count in a volume taken straight off the triangles.
 
 These are the fields that do nothing in 2D, and that is expected rather than a gap: a plan is a horizontal cut, so a window 900mm up the wall and a door at floor level are the same hole seen from above. `sill` is the height of an opening's bottom above the floor and `head` the height of its top; the drawer edits `sill` in its selection bar so the value is captured while the plan is being drawn, rather than having to be filled in for every opening afterwards.
 

package/docs/InputDropdown.md

@@ -58,6 +58,7 @@ interface InputDropdownItem {
 | `value` | `string` | Controlled value |
 | `items` | `InputDropdownItem[]` | Dropdown options |
 | `allowCustomValue` | `boolean` | Allow free-text values not in `items` — the typed text is emitted via `onChange` on every keystroke (default `false`) |
+| `maxItems` | `number` | Maximum number of filtered matches rendered in the list. Further matches are dropped, since the list is narrowed by typing rather than by scrolling. `0` renders all matches. Default `100` |
 | `onSelect` | `(value: string) => void` | Called when an item is picked from the list |
 | `onChange` | `(value: unknown) => void` | Called on every text change |
 | `placeholder` | `string` | |
@@ -68,4 +69,6 @@ interface InputDropdownItem {
 
 **Slots:** `root` `dropdown` `item`
 
+Long lists are handled by capping how many matches are rendered (`maxItems`, default `100`) rather than by virtualizing: only about six rows fit in the scroll box, so anything past the cap is DOM the user never sees. Raise `maxItems` (or set it to `0`) if a list is genuinely meant to be scrolled end to end. For lists too large to pass as `items` at all, fetch on the server, keep the results in your own state and feed them in as `items`.
+
 The list is rendered through a portal and tracks the trigger across scroll, so it always escapes clipping ancestors (cards, scroll containers, virtualized lists). It flips to open upward automatically when there's no room below, and shifts horizontally to stay within the viewport when the trigger sits near the left or right edge of the screen. It hides (without closing) if the trigger itself scrolls behind a clipping ancestor, reappearing once it's back in view. It also re-measures when its own content changes size while open, so a list that shrinks (e.g. filtered down to fewer entries) stays anchored to the trigger instead of hanging above it.