@jcsoftdev/ui 0.0.0-stage → 0.1.0

package/dist/containers/data-grid/use-grid-layout.js

@@ -0,0 +1,99 @@
+"use client";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { sanitizePinned, setColumnPin } from "../table/pin.js";
+import {
+  clampWidth,
+  defaultWidth,
+  moveColumn,
+  moveColumnTo,
+  parseStoredLayout,
+  reconcileLayout
+} from "./model.js";
+function readStorage(key) {
+  try {
+    return window.localStorage.getItem(key);
+  } catch {
+    return null;
+  }
+}
+function writeStorage(key, value) {
+  try {
+    window.localStorage.setItem(key, value);
+  } catch {
+  }
+}
+function useGridLayout(columns, defaults, storageKey) {
+  const initial = useMemo(() => {
+    const order = columns.map((column) => column.id);
+    return {
+      order,
+      hidden: (defaults.hidden ?? []).filter((id) => order.includes(id)),
+      widths: Object.fromEntries(columns.map((column) => [column.id, defaultWidth(column)])),
+      pinned: sanitizePinned(defaults.pinned ?? {}, order),
+      density: defaults.density
+    };
+  }, [columns, defaults.hidden, defaults.pinned, defaults.density]);
+  const [layout, setLayout] = useState(initial);
+  const loaded = useRef(false);
+  const columnsKey = columns.map((column) => column.id).join("|");
+  useEffect(() => {
+    const stored = storageKey ? parseStoredLayout(readStorage(storageKey)) : null;
+    setLayout((previous) => {
+      if (!loaded.current) return reconcileLayout(columns, stored, initial);
+      const base = { ...previous, widths: { ...initial.widths, ...previous.widths } };
+      return reconcileLayout(columns, stored ?? base, base);
+    });
+    loaded.current = true;
+  }, [storageKey, columnsKey]);
+  useEffect(() => {
+    if (storageKey && loaded.current) writeStorage(storageKey, JSON.stringify(layout));
+  }, [layout, storageKey]);
+  const byId = useMemo(() => new Map(columns.map((column) => [column.id, column])), [columns]);
+  const setWidth = useCallback(
+    (id, width) => {
+      const column = byId.get(id);
+      if (!column) return;
+      setLayout((previous) => ({
+        ...previous,
+        widths: { ...previous.widths, [id]: clampWidth(width, column) }
+      }));
+    },
+    [byId]
+  );
+  const resetWidth = useCallback(
+    (id) => {
+      const column = byId.get(id);
+      if (column) setWidth(id, defaultWidth(column));
+    },
+    [byId, setWidth]
+  );
+  const move = useCallback((id, delta) => {
+    setLayout((previous) => ({ ...previous, order: moveColumn(previous.order, id, delta) }));
+  }, []);
+  const moveTo = useCallback((id, targetId, place) => {
+    setLayout((previous) => ({
+      ...previous,
+      order: moveColumnTo(previous.order, id, targetId, place)
+    }));
+  }, []);
+  const pin = useCallback((id, side) => {
+    setLayout((previous) => ({
+      ...previous,
+      pinned: setColumnPin(previous.pinned, id, side, previous.order)
+    }));
+  }, []);
+  const setHidden = useCallback((id, hidden) => {
+    setLayout((previous) => ({
+      ...previous,
+      hidden: hidden ? [.../* @__PURE__ */ new Set([...previous.hidden, id])] : previous.hidden.filter((x) => x !== id)
+    }));
+  }, []);
+  const setDensity = useCallback((density) => {
+    setLayout((previous) => ({ ...previous, density }));
+  }, []);
+  const reset = useCallback(() => setLayout(initial), [initial]);
+  return { layout, setWidth, resetWidth, move, moveTo, pin, setHidden, setDensity, reset };
+}
+export {
+  useGridLayout
+};

package/dist/containers/data-grid/virtual.d.ts

@@ -0,0 +1,53 @@
+export interface VirtualWindowInput {
+    count: number;
+    rowHeight: number;
+    /** Height available to body rows (scroll viewport minus sticky header and footer). */
+    viewportHeight: number;
+    scrollTop: number;
+    /** Extra rows rendered above and below the visible ones. */
+    overscan?: number;
+}
+export interface VirtualWindow {
+    /** First rendered index. */
+    start: number;
+    /** One past the last rendered index. */
+    end: number;
+    /** Height of the spacer above the rendered rows. */
+    padTop: number;
+    /** Height of the spacer below the rendered rows. */
+    padBottom: number;
+    totalHeight: number;
+}
+export declare function computeVirtualWindow({ count, rowHeight, viewportHeight, scrollTop, overscan, }: VirtualWindowInput): VirtualWindow;
+/** Scroll position that brings row `index` fully into view, moving as little as possible. */
+export declare function scrollTopToReveal(index: number, rowHeight: number, viewportHeight: number, scrollTop: number): number;
+/**
+ * Like `scrollTopToReveal` for a row at any `top` with any `height`, keeping it clear of rows that
+ * stay on screen on their own (pinned rows): `insetTop` / `insetBottom` px of the viewport.
+ */
+export declare function scrollTopToRevealSpan(top: number, height: number, viewportHeight: number, scrollTop: number, insetTop?: number, insetBottom?: number): number;
+/** Rows that fit in the viewport: the PageUp/PageDown step. */
+export declare function pageStep(rowHeight: number, viewportHeight: number): number;
+/**
+ * Horizontal scroll that reveals a scrolling (unpinned) column at `[left, left + width)` without
+ * it hiding under the pinned columns of either edge.
+ */
+export declare function scrollLeftToReveal(left: number, width: number, viewportWidth: number, scrollLeft: number, pinnedLeft: number, pinnedRight: number): number;
+export declare function pageCount(total: number, pageSize: number): number;
+export interface VariableWindow {
+    start: number;
+    end: number;
+    /** `offsets[i]` is the top of row `i`; the last entry is the total height. */
+    offsets: number[];
+    totalHeight: number;
+}
+/**
+ * Windowing for rows of different heights (detail panels between data rows). Same contract as
+ * `computeVirtualWindow`, with `heights` instead of a fixed `rowHeight`.
+ */
+export declare function computeVariableWindow(input: {
+    heights: readonly number[];
+    viewportHeight: number;
+    scrollTop: number;
+    overscan?: number;
+}): VariableWindow;

package/dist/containers/data-grid/virtual.js

@@ -0,0 +1,90 @@
+function computeVirtualWindow({
+  count,
+  rowHeight,
+  viewportHeight,
+  scrollTop,
+  overscan = 6
+}) {
+  const total = Math.max(0, count) * rowHeight;
+  if (count <= 0 || rowHeight <= 0) {
+    return { start: 0, end: 0, padTop: 0, padBottom: 0, totalHeight: 0 };
+  }
+  const maxScroll = Math.max(0, total - viewportHeight);
+  const top = Math.min(Math.max(0, scrollTop), maxScroll);
+  const firstVisible = Math.floor(top / rowHeight);
+  const visible = Math.ceil(Math.max(0, viewportHeight) / rowHeight) + 1;
+  const start = Math.max(0, firstVisible - overscan);
+  const end = Math.min(count, firstVisible + visible + overscan);
+  return {
+    start,
+    end,
+    padTop: start * rowHeight,
+    padBottom: (count - end) * rowHeight,
+    totalHeight: total
+  };
+}
+function scrollTopToReveal(index, rowHeight, viewportHeight, scrollTop) {
+  const top = index * rowHeight;
+  const bottom = top + rowHeight;
+  if (top < scrollTop) return top;
+  if (bottom > scrollTop + viewportHeight) return Math.max(0, bottom - viewportHeight);
+  return scrollTop;
+}
+function scrollTopToRevealSpan(top, height, viewportHeight, scrollTop, insetTop = 0, insetBottom = 0) {
+  const bottom = top + height;
+  if (top < scrollTop + insetTop) return Math.max(0, top - insetTop);
+  if (bottom > scrollTop + viewportHeight - insetBottom) {
+    return Math.max(0, bottom - viewportHeight + insetBottom);
+  }
+  return scrollTop;
+}
+function pageStep(rowHeight, viewportHeight) {
+  return Math.max(1, Math.floor(viewportHeight / rowHeight) - 1);
+}
+function scrollLeftToReveal(left, width, viewportWidth, scrollLeft, pinnedLeft, pinnedRight) {
+  const start = scrollLeft + pinnedLeft;
+  const end = scrollLeft + viewportWidth - pinnedRight;
+  if (left < start) return Math.max(0, left - pinnedLeft);
+  if (left + width > end) return Math.max(0, left + width - viewportWidth + pinnedRight);
+  return scrollLeft;
+}
+function pageCount(total, pageSize) {
+  return Math.max(1, Math.ceil(Math.max(0, total) / Math.max(1, pageSize)));
+}
+function computeVariableWindow(input) {
+  const { heights, viewportHeight, scrollTop, overscan = 6 } = input;
+  const offsets = new Array(heights.length + 1);
+  offsets[0] = 0;
+  for (let i = 0; i < heights.length; i += 1) {
+    offsets[i + 1] = offsets[i] + heights[i];
+  }
+  const totalHeight = offsets[heights.length];
+  if (heights.length === 0) return { start: 0, end: 0, offsets, totalHeight };
+  const top = Math.min(Math.max(0, scrollTop), Math.max(0, totalHeight - viewportHeight));
+  const bottom = top + Math.max(0, viewportHeight);
+  let low = 0;
+  let high = heights.length - 1;
+  while (low < high) {
+    const mid = low + high >> 1;
+    if (offsets[mid + 1] <= top) low = mid + 1;
+    else high = mid;
+  }
+  const first = low;
+  let last = first;
+  while (last < heights.length && offsets[last] < bottom) last += 1;
+  return {
+    start: Math.max(0, first - overscan),
+    end: Math.min(heights.length, last + overscan),
+    offsets,
+    totalHeight
+  };
+}
+export {
+  computeVariableWindow,
+  computeVirtualWindow,
+  pageCount,
+  pageStep,
+  scrollLeftToReveal,
+  scrollTopToReveal,
+  scrollTopToRevealSpan
+};

package/dist/containers/data-grid/xlsx-export.d.ts

@@ -0,0 +1,9 @@
+import type { XlsxSheet } from "../../xlsx/xlsx.js";
+import type { DataGridColumn } from "./types.js";
+/**
+ * Sheet with one column per grid column (header text, typed values) and one row per grid row.
+ * Numbers stay numbers, dates stay dates; pass the rows and columns as the CSV export does.
+ */
+export declare function gridToSheet<T>(rows: readonly T[], columns: readonly DataGridColumn<T>[], name: string): XlsxSheet;
+/** File name with the `.xlsx` extension. */
+export declare function xlsxFilename(name: string): string;

package/dist/containers/data-grid/xlsx-export.js

@@ -0,0 +1,39 @@
+import { columnAlign, getCellValue } from "./model.js";
+const ALIGN = { start: "left", center: "center", end: "right" };
+function hasTime(value) {
+  return value.getHours() !== 0 || value.getMinutes() !== 0 || value.getSeconds() !== 0;
+}
+function cellOf(value) {
+  if (value instanceof Date) return Number.isNaN(value.getTime()) ? null : value;
+  return value;
+}
+function formatOf(column, values) {
+  if (column.type === "currency") return "currency";
+  if (column.type === "date") {
+    return values.some((value) => value instanceof Date && hasTime(value)) ? "datetime" : "date";
+  }
+  if (column.type === "number") {
+    const numbers = values.filter((value) => typeof value === "number");
+    return numbers.length > 0 && numbers.every(Number.isInteger) ? "integer" : "decimal";
+  }
+  return "general";
+}
+function gridToSheet(rows, columns, name) {
+  const table = rows.map((row) => columns.map((column) => cellOf(getCellValue(row, column))));
+  const sheetColumns = columns.map((column, c) => ({
+    header: column.header,
+    format: formatOf(
+      column,
+      table.map((line) => line[c])
+    ),
+    align: ALIGN[columnAlign(column)]
+  }));
+  return { name, columns: sheetColumns, rows: table };
+}
+function xlsxFilename(name) {
+  return /\.xlsx$/i.test(name) ? name : `${name.replace(/\.[a-z0-9]+$/i, "")}.xlsx`;
+}
+export {
+  gridToSheet,
+  xlsxFilename
+};

package/dist/containers/description-list/description-list.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithoutRef } from "react";
+export type DescriptionListProps = ComponentPropsWithoutRef<"dl">;
+/**
+ * Two-column definition list (auto term / flexible value aligned right); stacks term over
+ * value when its own container is narrower than 24rem.
+ * Compose flat `<dt>`/`<dd>` pairs as children.
+ */
+export declare function DescriptionList({ className, ...props }: DescriptionListProps): import("react").JSX.Element;

package/dist/containers/description-list/description-list.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../utils/cn.js";
+function DescriptionList({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: "@container/dl min-w-0", children: /* @__PURE__ */ jsx(
+    "dl",
+    {
+      className: cn(
+        "grid grid-cols-[auto_minmax(0,1fr)] gap-x-4 gap-y-[9px] text-[13px]",
+        "[&_dt]:text-ink-3 [&_dd]:m-0 [&_dd]:min-w-0 [&_dd]:break-words [&_dd]:text-right [&_dd]:font-semibold",
+        "@max-sm/dl:grid-cols-1 @max-sm/dl:gap-y-0.5 @max-sm/dl:[&_dd]:mb-2 @max-sm/dl:[&_dd]:text-left",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+export {
+  DescriptionList
+};

package/dist/containers/description-list/index.d.ts

@@ -0,0 +1 @@
+export * from "./description-list.js";

package/dist/containers/description-list/index.js

@@ -0,0 +1 @@
+export * from "./description-list.js";

package/dist/containers/facts/facts.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithoutRef } from "react";
+export type FactsProps = ComponentPropsWithoutRef<"dl">;
+/**
+ * Three-column grid of key facts with a dashed top separator. Wrap each
+ * `<dt>`/`<dd>` pair in its own `<div>` (one grid cell). Collapses to one
+ * column when its own container is 560px wide or less.
+ */
+export declare function Facts({ className, ...props }: FactsProps): import("react").JSX.Element;

package/dist/containers/facts/facts.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../utils/cn.js";
+function Facts({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: "@container/facts min-w-0", children: /* @__PURE__ */ jsx(
+    "dl",
+    {
+      className: cn(
+        "mt-3.5 grid grid-cols-3 gap-3.5 border-t-divider border-dashed pt-3.5",
+        "[&_dt]:font-semibold [&_dt]:text-[11.5px] [&_dt]:text-ink-3",
+        "[&_dd]:mt-0.5 [&_dd]:font-[620] [&_dd]:text-[13px]",
+        "[&_dt]:break-words [&_dd]:break-words @max-[560px]/facts:grid-cols-1",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+export {
+  Facts
+};

package/dist/containers/facts/index.d.ts

@@ -0,0 +1 @@
+export * from "./facts.js";

package/dist/containers/facts/index.js

@@ -0,0 +1 @@
+export * from "./facts.js";

package/dist/containers/file-tree/file-tree.d.ts

@@ -0,0 +1,18 @@
+import { type FileTreeNode } from "./model.js";
+export interface FileTreeProps {
+    nodes: FileTreeNode[];
+    /** Accessible name of the tree. */
+    label: string;
+    selectedId?: string | null;
+    defaultSelectedId?: string | null;
+    onSelect?: (id: string, node: FileTreeNode) => void;
+    expandedIds?: string[];
+    defaultExpandedIds?: string[];
+    onExpandedChange?: (ids: string[]) => void;
+    className?: string;
+}
+/**
+ * Expandable tree following the WAI-ARIA tree pattern: one tab stop with roving focus,
+ * arrows to move and open/close, Home/End, type-ahead, Enter or Space to select.
+ */
+export declare function FileTree({ nodes, label, selectedId: selectedProp, defaultSelectedId, onSelect, expandedIds: expandedProp, defaultExpandedIds, onExpandedChange, className, }: FileTreeProps): import("react").JSX.Element;

package/dist/containers/file-tree/file-tree.js

@@ -0,0 +1,154 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  ChevronRight,
+  File,
+  FileCode,
+  FileImage,
+  FileText,
+  Folder,
+  FolderOpen
+} from "lucide-react";
+import { useMemo, useRef, useState } from "react";
+import { cn } from "../../utils/cn.js";
+import {
+  flattenTree,
+  treeStep,
+  typeahead
+} from "./model.js";
+const TREE_KEYS = [
+  "ArrowUp",
+  "ArrowDown",
+  "ArrowLeft",
+  "ArrowRight",
+  "Home",
+  "End"
+];
+function iconFor(name) {
+  const ext = name.split(".").pop()?.toLowerCase() ?? "";
+  if (["png", "jpg", "jpeg", "gif", "svg", "webp"].includes(ext)) return FileImage;
+  if (["ts", "tsx", "js", "jsx", "json", "css", "html"].includes(ext)) return FileCode;
+  if (["md", "txt", "csv", "pdf"].includes(ext)) return FileText;
+  return File;
+}
+function FileTree({
+  nodes,
+  label,
+  selectedId: selectedProp,
+  defaultSelectedId = null,
+  onSelect,
+  expandedIds: expandedProp,
+  defaultExpandedIds = [],
+  onExpandedChange,
+  className
+}) {
+  const [selectedState, setSelectedState] = useState(defaultSelectedId);
+  const [expandedState, setExpandedState] = useState(defaultExpandedIds);
+  const selected = selectedProp !== void 0 ? selectedProp : selectedState;
+  const expandedList = expandedProp ?? expandedState;
+  const expanded = useMemo(() => new Set(expandedList), [expandedList]);
+  const rows = useMemo(() => flattenTree(nodes, expanded), [nodes, expanded]);
+  const [focusId, setFocusId] = useState(null);
+  const listRef = useRef(null);
+  const typed = useRef({ text: "", at: 0 });
+  const tabStop = rows.find((r) => r.node.id === focusId)?.node.id ?? rows.find((r) => r.node.id === selected)?.node.id ?? rows[0]?.node.id;
+  const setExpanded = (ids) => {
+    if (expandedProp === void 0) setExpandedState(ids);
+    onExpandedChange?.(ids);
+  };
+  const toggle = (id, open) => {
+    const next = expandedList.filter((x) => x !== id);
+    if (open) next.push(id);
+    setExpanded(next);
+  };
+  const select = (row) => {
+    if (selectedProp === void 0) setSelectedState(row.node.id);
+    onSelect?.(row.node.id, row.node);
+  };
+  const focusRow = (id) => {
+    setFocusId(id);
+    listRef.current?.querySelector(`[data-node-id="${CSS.escape(id)}"]`)?.focus();
+  };
+  const onKeyDown = (event, row) => {
+    if (event.altKey || event.ctrlKey || event.metaKey) return;
+    if (TREE_KEYS.includes(event.key)) {
+      event.preventDefault();
+      const step = treeStep(rows, row.node.id, event.key);
+      if (!step) return;
+      if (step.type === "focus") focusRow(step.id);
+      else toggle(step.id, step.type === "expand");
+      return;
+    }
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      select(row);
+      if (row.isFolder) toggle(row.node.id, !row.expanded);
+      return;
+    }
+    if (event.key.length === 1 && /\S/.test(event.key)) {
+      const now = Date.now();
+      const state = typed.current;
+      state.text = now - state.at > 600 ? event.key : state.text + event.key;
+      state.at = now;
+      const match = typeahead(rows, row.node.id, state.text);
+      if (match) focusRow(match);
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { className: cn("@container/tree min-w-0", className), children: /* @__PURE__ */ jsx("div", { ref: listRef, role: "tree", "aria-label": label, className: "flex flex-col gap-0.5", children: rows.map((row) => {
+    const isSelected = row.node.id === selected;
+    const Icon = row.isFolder ? row.expanded ? FolderOpen : Folder : iconFor(row.node.name);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "treeitem",
+        "data-node-id": row.node.id,
+        tabIndex: row.node.id === tabStop ? 0 : -1,
+        "aria-level": row.depth,
+        "aria-posinset": row.position,
+        "aria-setsize": row.setSize,
+        "aria-expanded": row.isFolder ? row.expanded : void 0,
+        "aria-selected": isSelected,
+        onKeyDown: (event) => {
+          if (event.target === event.currentTarget) onKeyDown(event, row);
+        },
+        onFocus: (event) => {
+          if (event.target === event.currentTarget) setFocusId(row.node.id);
+        },
+        onClick: () => {
+          select(row);
+          if (row.isFolder) toggle(row.node.id, !row.expanded);
+          setFocusId(row.node.id);
+        },
+        style: { paddingInlineStart: `calc(${row.depth - 1} * 1rem + var(--pad-control-x))` },
+        className: cn(
+          "pressable flex min-h-control-sm min-w-0 cursor-pointer items-center gap-density-sm rounded-button pe-control-x text-body text-ink outline-none hover:bg-surface-2 focus-visible:focus-ring",
+          isSelected && "bg-accent-soft font-semibold text-accent-ink shadow-selected"
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center text-ink-3", children: row.isFolder ? /* @__PURE__ */ jsx(
+            ChevronRight,
+            {
+              "aria-hidden": "true",
+              className: cn(
+                "size-3.5 transition-transform duration-(--motion-duration) ease-style",
+                row.expanded && "rotate-90"
+              )
+            }
+          ) : null }),
+          /* @__PURE__ */ jsx(
+            Icon,
+            {
+              "aria-hidden": "true",
+              className: cn("size-4 shrink-0", row.isFolder ? "text-accent-ink" : "text-ink-3")
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: row.node.name })
+        ]
+      },
+      row.node.id
+    );
+  }) }) });
+}
+export {
+  FileTree
+};

package/dist/containers/file-tree/index.d.ts

@@ -0,0 +1,2 @@
+export { FileTree, type FileTreeProps } from "./file-tree.js";
+export { ancestorsOf, type FileTreeNode, type FlatRow, flattenTree, folderIds, type TreeKey, type TreeStep, treeStep, typeahead, } from "./model.js";

package/dist/containers/file-tree/index.js

@@ -0,0 +1,16 @@
+import { FileTree } from "./file-tree.js";
+import {
+  ancestorsOf,
+  flattenTree,
+  folderIds,
+  treeStep,
+  typeahead
+} from "./model.js";
+export {
+  FileTree,
+  ancestorsOf,
+  flattenTree,
+  folderIds,
+  treeStep,
+  typeahead
+};

package/dist/containers/file-tree/model.d.ts

@@ -0,0 +1,37 @@
+export interface FileTreeNode {
+    id: string;
+    name: string;
+    /** Present (even empty) for folders. */
+    children?: FileTreeNode[];
+}
+export interface FlatRow {
+    node: FileTreeNode;
+    depth: number;
+    parentId: string | null;
+    /** 1-based position among siblings, for aria-posinset. */
+    position: number;
+    setSize: number;
+    isFolder: boolean;
+    expanded: boolean;
+}
+/** Rows currently visible, in display order, given the set of expanded folder ids. */
+export declare function flattenTree(nodes: FileTreeNode[], expanded: ReadonlySet<string>): FlatRow[];
+export type TreeKey = "ArrowUp" | "ArrowDown" | "ArrowLeft" | "ArrowRight" | "Home" | "End";
+export type TreeStep = {
+    type: "focus";
+    id: string;
+} | {
+    type: "expand";
+    id: string;
+} | {
+    type: "collapse";
+    id: string;
+} | null;
+/** WAI-ARIA tree navigation: what a key does on the row `currentId`. */
+export declare function treeStep(rows: FlatRow[], currentId: string, key: TreeKey): TreeStep;
+/** Next row whose name starts with `query`, searching after `currentId` and wrapping. */
+export declare function typeahead(rows: FlatRow[], currentId: string, query: string): string | null;
+/** Ids of every folder (used to expand all by default). */
+export declare function folderIds(nodes: FileTreeNode[]): string[];
+/** Ancestors of `id`, root first; empty when unknown. */
+export declare function ancestorsOf(nodes: FileTreeNode[], id: string): string[];