@exegia/corpora-ui 2.0.0 → 3.1.0

package/src/components/blocks/scaffold/scaffold-atom.ts

@@ -1,427 +0,0 @@
-/**
- * Scaffold state — Jotai atom families keyed by a scaffold id.
- *
- * Same layout as the tree (`components/composed/tree/tree-atom.ts`), the
- * shell (`blocks/shell/shell-fit-atom.ts`) and the profile card: in-house
- * `keyed()` families per field, write-only action atoms, a composed
- * read-only state atom, and `removeScaffoldInstance` to drop an id from
- * every family.
- *
- * The visibility bookkeeping (`visibleOrder` / `autoHidden` / `userHidden`)
- * stays one atom on purpose — `reconcileVisibility` always settles the three
- * lists together, so splitting them would only invite half-written states.
- * The reconcile rule itself lives in `utils.ts`, and every action that moves
- * an input (ids, capacity, a toggle) settles the visibility before it
- * returns, so readers never see an interim state — the render-time settling
- * the old `usePanelVisibility` hook needed has no equivalent here.
- */
-
-import type { IScaffoldPanelLayout } from "./type"
-import { atom } from "jotai"
-import type { Atom, Getter, Setter } from "jotai"
-
-import { SCAFFOLD_PANEL_CAPACITY } from "./constants"
-import type {
-  IScaffoldConfig,
-  IScaffoldHandlers,
-  TScaffoldInstanceId,
-  IScaffoldPanelVisibility,
-  IScaffoldState,
-} from "./type"
-import {
-  EMPTY_SCAFFOLD_VISIBILITY,
-  getPanelCapacity,
-  reconcileVisibility,
-} from "./utils"
-
-const DEFAULT_CONFIG: IScaffoldConfig = { controlsInspector: false }
-const NO_HANDLERS: IScaffoldHandlers = {}
-const NO_PANEL_IDS: readonly string[] = []
-
-// ── families ───────────────────────────────────────────────────────────────
-
-type TFamily<AtomType> = ((id: TScaffoldInstanceId) => AtomType) & {
-  remove: (id: TScaffoldInstanceId) => void
-}
-
-const families: { remove: (id: TScaffoldInstanceId) => void }[] = []
-
-function keyed<AtomType>(create: (id: TScaffoldInstanceId) => AtomType) {
-  const cache = new Map<TScaffoldInstanceId, AtomType>()
-  const family = ((id: TScaffoldInstanceId) => {
-    let instance = cache.get(id)
-    if (instance === undefined) {
-      instance = create(id)
-      cache.set(id, instance)
-    }
-    return instance
-  }) as TFamily<AtomType>
-  family.remove = (id: TScaffoldInstanceId) => {
-    cache.delete(id)
-  }
-  families.push(family)
-  return family
-}
-
-function stateFamily<Value>(name: string, initialValue: Value) {
-  return keyed((id) => {
-    const instance = atom(initialValue)
-    instance.debugLabel = `scaffold/${id}/${name}`
-    return instance
-  })
-}
-
-function readFamily<Value>(
-  name: string,
-  read: (get: Getter, id: TScaffoldInstanceId) => Value
-) {
-  return keyed((id) => {
-    const instance = atom((get) => read(get, id))
-    instance.debugLabel = `scaffold/${id}/${name}`
-    return instance
-  })
-}
-
-function actionFamily<Args extends unknown[]>(
-  name: string,
-  write: (
-    get: Getter,
-    set: Setter,
-    id: TScaffoldInstanceId,
-    ...args: Args
-  ) => void
-) {
-  return keyed((id) => {
-    const instance = atom(null, (get, set, ...args: Args) =>
-      write(get, set, id, ...args)
-    )
-    instance.debugLabel = `scaffold/${id}/${name}`
-    return instance
-  })
-}
-
-/** A family keyed by scaffold AND panel, so a tab or a panel subscribes to
- * its own boolean and sits still when a sibling's changes — the per-node
- * rule from the tree, at panel scale. Removal drops a whole scaffold. */
-function panelFamily<Value>(
-  name: string,
-  read: (get: Getter, id: TScaffoldInstanceId, panelId: string) => Value
-) {
-  const cache = new Map<TScaffoldInstanceId, Map<string, Atom<Value>>>()
-  const family = (id: TScaffoldInstanceId, panelId: string): Atom<Value> => {
-    let panels = cache.get(id)
-    if (panels === undefined) {
-      panels = new Map()
-      cache.set(id, panels)
-    }
-    let instance = panels.get(panelId)
-    if (instance === undefined) {
-      const created = atom((get) => read(get, id, panelId))
-      created.debugLabel = `scaffold/${id}/${panelId}/${name}`
-      panels.set(panelId, created)
-      instance = created
-    }
-    return instance
-  }
-  families.push({
-    remove: (id: TScaffoldInstanceId) => {
-      cache.delete(id)
-    },
-  })
-  return family
-}
-
-// ── primitives ─────────────────────────────────────────────────────────────
-
-export const scaffoldInspectorOpenAtom = stateFamily<boolean>(
-  "inspectorOpen",
-  false
-)
-
-/** @internal The canvas's ordered panel ids, as registered each render. */
-export const scaffoldPanelIdsAtom = stateFamily<readonly string[]>(
-  "panelIds",
-  NO_PANEL_IDS
-)
-
-/** @internal The capacity derived from the canvas's measured width — the
- * derived number is stored, not the raw width, so resize storms only touch
- * the store when a panel actually gains or loses room. */
-export const scaffoldMeasuredCapacityAtom = stateFamily<number | null>(
-  "measuredCapacity",
-  null
-)
-
-/** @internal The three visibility lists, settled as one value. */
-export const scaffoldVisibilityAtom = stateFamily<IScaffoldPanelVisibility>(
-  "visibility",
-  EMPTY_SCAFFOLD_VISIBILITY
-)
-
-export const scaffoldHoveredPanelIdAtom = stateFamily<string | null>(
-  "hoveredPanelId",
-  null
-)
-
-/** @internal */
-export const scaffoldConfigAtom = stateFamily<IScaffoldConfig>(
-  "config",
-  DEFAULT_CONFIG
-)
-
-/** @internal */
-export const scaffoldHandlersAtom = stateFamily<IScaffoldHandlers>(
-  "handlers",
-  NO_HANDLERS
-)
-
-// ── derived ────────────────────────────────────────────────────────────────
-
-/** How many panels fit side by side; the cap while the canvas is unmeasured. */
-export const scaffoldPanelCapacityAtom = readFamily(
-  "panelCapacity",
-  (get, id) => get(scaffoldMeasuredCapacityAtom(id)) ?? SCAFFOLD_PANEL_CAPACITY
-)
-
-/** Ids of panels currently hidden (auto + user), for tabs to reflect. */
-export const scaffoldHiddenPanelIdsAtom = readFamily<readonly string[]>(
-  "hiddenPanelIds",
-  (get, id) => {
-    const visibility = get(scaffoldVisibilityAtom(id))
-    return [...visibility.autoHidden, ...visibility.userHidden]
-  }
-)
-
-/** Whether one panel is hidden. A tab subscribes here and sits still while
- * its siblings toggle. Empty `panelId` (a tab without one) reads false. */
-export const scaffoldPanelHiddenAtom = panelFamily(
-  "hidden",
-  (get, id, panelId) => {
-    if (panelId === "") return false
-    const visibility = get(scaffoldVisibilityAtom(id))
-    return (
-      visibility.autoHidden.includes(panelId) ||
-      visibility.userHidden.includes(panelId)
-    )
-  }
-)
-
-/** Whether one panel fades back while another panel's tab holds the
- * spotlight. Moving the hover between two tabs re-renders those panels
- * only — everyone else's boolean holds. */
-export const scaffoldPanelDimmedAtom = panelFamily(
-  "dimmed",
-  (get, id, panelId) => {
-    if (panelId === "") return false
-    const hovered = get(scaffoldHoveredPanelIdAtom(id))
-    return hovered !== null && hovered !== panelId
-  }
-)
-
-export const scaffoldPanelLayoutsAtom = stateFamily<
-  Record<string, IScaffoldPanelLayout>
->("panel-layouts", {})
-export const scaffoldActiveResizeAtom = stateFamily<string | null>(
-  "active-resize",
-  null
-)
-export const scaffoldInspectorWidthAtom = stateFamily<number | null>(
-  "inspector-width",
-  null
-)
-export const resizeScaffoldInspectorAtom = actionFamily<[number]>(
-  "resize-inspector",
-  (_get, set, id, width) => {
-    if (Number.isFinite(width))
-      set(scaffoldInspectorWidthAtom(id), Math.max(180, width))
-  }
-)
-export const updateScaffoldPanelLayoutAtom = actionFamily<
-  [string, Partial<IScaffoldPanelLayout>]
->("update-panel-layout", (get, set, id, panelId, patch) => {
-  const layouts = get(scaffoldPanelLayoutsAtom(id))
-  const safe = { ...patch }
-  if (safe.width !== undefined && Number.isFinite(safe.width))
-    set(scaffoldActiveResizeAtom(id), panelId)
-  if (safe.width !== undefined)
-    safe.width = Number.isFinite(safe.width)
-      ? Math.max(320, safe.width)
-      : undefined
-  if (safe.secondarySize !== undefined)
-    safe.secondarySize = Number.isFinite(safe.secondarySize)
-      ? Math.max(56, safe.secondarySize)
-      : undefined
-  set(scaffoldPanelLayoutsAtom(id), {
-    ...layouts,
-    [panelId]: { ...layouts[panelId], ...safe },
-  })
-})
-
-/** The whole state of one scaffold. This changes on every hover move, so a
- * component that reads one field should subscribe to that field's atom
- * instead: `useAtomValue(scaffoldInspectorOpenAtom("workspace"))`. */
-export const scaffoldStateAtom = readFamily<IScaffoldState>(
-  "state",
-  (get, id) => ({
-    inspectorOpen: get(scaffoldInspectorOpenAtom(id)),
-    inspectorWidth: get(scaffoldInspectorWidthAtom(id)),
-    panelLayouts: get(scaffoldPanelLayoutsAtom(id)),
-    panelCapacity: get(scaffoldPanelCapacityAtom(id)),
-    hiddenPanelIds: get(scaffoldHiddenPanelIdsAtom(id)),
-    hoveredPanelId: get(scaffoldHoveredPanelIdAtom(id)),
-  })
-)
-
-// ── visibility settling ────────────────────────────────────────────────────
-
-/** Re-settle the lists after any input moved. Inert when nothing changes —
- * `reconcileVisibility` returns `prev` untouched then. */
-function settleVisibility(get: Getter, set: Setter, id: TScaffoldInstanceId) {
-  const prev = get(scaffoldVisibilityAtom(id))
-  const settled = reconcileVisibility(
-    prev,
-    get(scaffoldPanelIdsAtom(id)),
-    get(scaffoldPanelCapacityAtom(id))
-  )
-  if (settled !== prev) set(scaffoldVisibilityAtom(id), settled)
-}
-
-// ── actions: inspector ─────────────────────────────────────────────────────
-
-/** Reports through `onInspectorOpenChange` always; writes the store only
- * when no `inspectorOpen` prop controls the root — the prop is truth then. */
-export const setScaffoldInspectorOpenAtom = actionFamily<[open: boolean]>(
-  "setInspectorOpen",
-  (get, set, id, open) => {
-    if (get(scaffoldInspectorOpenAtom(id)) === open) return
-    if (!get(scaffoldConfigAtom(id)).controlsInspector)
-      set(scaffoldInspectorOpenAtom(id), open)
-    get(scaffoldHandlersAtom(id)).onInspectorOpenChange?.(open)
-  }
-)
-
-export const toggleScaffoldInspectorAtom = actionFamily<[]>(
-  "toggleInspector",
-  (get, set, id) => {
-    set(setScaffoldInspectorOpenAtom(id), !get(scaffoldInspectorOpenAtom(id)))
-  }
-)
-
-// ── actions: panels ────────────────────────────────────────────────────────
-
-/** Show/hide an id'd panel. Showing past capacity auto-hides the
- * least-recently-activated visible panel; the last visible one never hides. */
-export const toggleScaffoldPanelAtom = actionFamily<[panelId: string]>(
-  "togglePanel",
-  (get, set, id, panelId) => {
-    const ids = get(scaffoldPanelIdsAtom(id))
-    if (!ids.includes(panelId)) return
-    const prev = get(scaffoldVisibilityAtom(id))
-    const hidden =
-      prev.autoHidden.includes(panelId) || prev.userHidden.includes(panelId)
-    if (!hidden && prev.visibleOrder.length <= 1) return
-
-    const next: IScaffoldPanelVisibility = hidden
-      ? {
-          // Showing: newest activation — reconcile evicts the oldest
-          // visible panel if the canvas can't fit one more.
-          visibleOrder: [...prev.visibleOrder, panelId],
-          autoHidden: prev.autoHidden.filter((other) => other !== panelId),
-          userHidden: prev.userHidden.filter((other) => other !== panelId),
-        }
-      : {
-          visibleOrder: prev.visibleOrder.filter((other) => other !== panelId),
-          autoHidden: prev.autoHidden,
-          userHidden: [...prev.userHidden, panelId],
-        }
-    set(
-      scaffoldVisibilityAtom(id),
-      reconcileVisibility(next, ids, get(scaffoldPanelCapacityAtom(id)))
-    )
-  }
-)
-
-/** @internal Tabs report pointer enter/leave on their label. Leaving clears
- * only its own id — a tab that unmounts mid-hover must not wipe out a hover
- * the pointer has already moved on to. */
-export const setScaffoldPanelHoveredAtom = actionFamily<
-  [panelId: string, hovered: boolean]
->("setPanelHovered", (get, set, id, panelId, hovered) => {
-  const prev = get(scaffoldHoveredPanelIdAtom(id))
-  if (hovered) {
-    if (prev !== panelId) set(scaffoldHoveredPanelIdAtom(id), panelId)
-    return
-  }
-  if (prev === panelId) set(scaffoldHoveredPanelIdAtom(id), null)
-})
-
-/** @internal Canvas reports its ordered panel ids each render. Inert when
- * the ids did not move; otherwise the visibility settles in the same write. */
-export const registerScaffoldPanelIdsAtom = actionFamily<
-  [ids: readonly string[]]
->("registerPanelIds", (get, set, id, ids) => {
-  const prev = get(scaffoldPanelIdsAtom(id))
-  if (prev.length === ids.length && prev.every((v, i) => v === ids[i])) return
-  set(scaffoldPanelIdsAtom(id), [...ids])
-  settleVisibility(get, set, id)
-})
-
-/** @internal Canvas reports its measured width. Only the derived capacity is
- * stored, so resize storms settle to at most one visibility change. */
-export const measureScaffoldCanvasAtom = actionFamily<[width: number]>(
-  "measureCanvas",
-  (get, set, id, width) => {
-    const capacity = getPanelCapacity(width)
-    if (get(scaffoldMeasuredCapacityAtom(id)) === capacity) return
-    set(scaffoldMeasuredCapacityAtom(id), capacity)
-    settleVisibility(get, set, id)
-  }
-)
-
-// ── internal projections ───────────────────────────────────────────────────
-
-/** @internal Projection of the mounted root's controlled props. */
-export const projectScaffoldPropsAtom = actionFamily<
-  [config: IScaffoldConfig, inspectorOpen: boolean | undefined]
->("projectProps", (_get, set, id, config, inspectorOpen) => {
-  set(scaffoldConfigAtom(id), config)
-  if (config.controlsInspector && inspectorOpen !== undefined)
-    set(scaffoldInspectorOpenAtom(id), inspectorOpen)
-})
-
-/** @internal */
-export const setScaffoldHandlersAtom = actionFamily<
-  [handlers: IScaffoldHandlers]
->("setHandlers", (_get, set, id, handlers) => {
-  set(scaffoldHandlersAtom(id), handlers)
-})
-
-/** @internal Seed the uncontrolled inspector on mount without firing
- * `onInspectorOpenChange`. */
-export const seedScaffoldInspectorAtom = actionFamily<[open: boolean]>(
-  "seedInspector",
-  (_get, set, id, open) => {
-    set(scaffoldInspectorOpenAtom(id), open)
-  }
-)
-
-// ── reset ──────────────────────────────────────────────────────────────────
-
-export const resetScaffoldAtom = actionFamily<[]>("reset", (_get, set, id) => {
-  set(scaffoldInspectorOpenAtom(id), false)
-  set(scaffoldInspectorWidthAtom(id), null)
-  set(scaffoldPanelLayoutsAtom(id), {})
-  set(scaffoldActiveResizeAtom(id), null)
-  set(scaffoldPanelIdsAtom(id), NO_PANEL_IDS)
-  set(scaffoldMeasuredCapacityAtom(id), null)
-  set(scaffoldVisibilityAtom(id), EMPTY_SCAFFOLD_VISIBILITY)
-  set(scaffoldHoveredPanelIdAtom(id), null)
-  set(scaffoldConfigAtom(id), DEFAULT_CONFIG)
-  set(scaffoldHandlersAtom(id), NO_HANDLERS)
-})
-
-/** Forget a scaffold entirely — every family drops the key so the store can
- * release its state. Call on teardown of a named instance. */
-export function removeScaffoldInstance(id: TScaffoldInstanceId): void {
-  for (const family of families) family.remove(id)
-}

package/src/components/blocks/scaffold/scaffold-canvas.tsx

@@ -1,162 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { useAtomValue, useSetAtom } from "jotai"
-
-import { cn } from "@/lib/utils"
-import {
-  measureScaffoldCanvasAtom,
-  registerScaffoldPanelIdsAtom,
-  scaffoldHiddenPanelIdsAtom,
-  scaffoldPanelLayoutsAtom,
-  scaffoldActiveResizeAtom,
-} from "./scaffold-atom"
-import { useScaffoldContext } from "./scaffold-context"
-import type { TScaffoldCanvasProps, IScaffoldPanelProps } from "./type"
-
-/** A canvas child's panel id when it opted into responsive hiding. */
-function panelIdOf(child: React.ReactNode): string | undefined {
-  if (!React.isValidElement<Pick<IScaffoldPanelProps, "id">>(child))
-    return undefined
-  const id = child.props.id
-  return typeof id === "string" ? id : undefined
-}
-
-/**
- * The panel row below the action cluster: 8px gutters, 8px gaps, panels
- * side by side. Key each `Scaffold.Panel` child so closes animate out.
- * Measures its own width and hides id'd panels (oldest activation first)
- * whenever it can't grant each one `SCAFFOLD_PANEL_MIN_WIDTH`.
- */
-export function ScaffoldCanvas({
-  className,
-  children,
-  ...rest
-}: TScaffoldCanvasProps): React.ReactElement {
-  const { scaffoldId } = useScaffoldContext()
-  const layouts = useAtomValue(scaffoldPanelLayoutsAtom(scaffoldId))
-  const activeResize = useAtomValue(scaffoldActiveResizeAtom(scaffoldId))
-  const hiddenPanelIds = useAtomValue(scaffoldHiddenPanelIdsAtom(scaffoldId))
-  const registerPanelIds = useSetAtom(registerScaffoldPanelIdsAtom(scaffoldId))
-  const measureCanvas = useSetAtom(measureScaffoldCanvasAtom(scaffoldId))
-  const [width, setWidth] = React.useState(0)
-  const ref = React.useRef<HTMLDivElement>(null)
-
-  React.useLayoutEffect(() => {
-    const element = ref.current
-    if (!element || typeof ResizeObserver === "undefined") return
-    const observer = new ResizeObserver(([entry]) => {
-      measureCanvas(entry.contentRect.width)
-      setWidth(entry.contentRect.width)
-    })
-    observer.observe(element)
-    return () => observer.disconnect()
-  }, [measureCanvas])
-
-  const childArray = React.Children.toArray(children)
-  const panelIds = childArray
-    .map(panelIdOf)
-    .filter((id): id is string => id !== undefined)
-  const idsKey = panelIds.join(" ")
-
-  // Passive on purpose: jotai (v3) readers subscribe in their own
-  // `useEffect`, so a layout-effect write at mount would land before any
-  // subscription exists and never notify them.
-  React.useEffect(() => {
-    registerPanelIds(panelIds)
-    // panelIds is rebuilt each render; idsKey carries its identity.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [idsKey, registerPanelIds])
-
-  const visibleChildren = childArray.filter((child) => {
-    const id = panelIdOf(child)
-    return id === undefined || !hiddenPanelIds.includes(id)
-  })
-
-  // With three columns, the center consumes the flexible space so Motion
-  // Panels has at most one sized surface on either side.
-  const fillChild =
-    visibleChildren.length > 2
-      ? visibleChildren[Math.floor(visibleChildren.length / 2)]
-      : ([...visibleChildren]
-          .reverse()
-          .find((child) => panelIdOf(child) !== activeResize) ??
-        visibleChildren.at(-1))
-  const count = visibleChildren.length
-  const equalWidth =
-    width > 0 ? (width - Math.max(0, count - 1) * 8) / Math.max(1, count) : 320
-  const sized = visibleChildren.filter((child) => child !== fillChild)
-  const fillRequest =
-    panelIdOf(fillChild) === activeResize
-      ? (layouts[activeResize ?? ""]?.width ?? 320)
-      : 320
-  const fillReserve = Math.max(
-    320,
-    Math.min(fillRequest, width - Math.max(0, count - 1) * 328)
-  )
-  const availableExtra = Math.max(
-    0,
-    width - Math.max(0, count - 1) * 8 - (count - 1) * 320 - fillReserve
-  )
-  const requestedExtra = sized.reduce<number>(
-    (sum, child) =>
-      sum +
-      Math.max(0, (layouts[panelIdOf(child) ?? ""]?.width ?? equalWidth) - 320),
-    0
-  )
-  const resizingFill = panelIdOf(fillChild) === activeResize
-  const ratio =
-    requestedExtra > 0 && (resizingFill || requestedExtra > availableExtra)
-      ? availableExtra / requestedExtra
-      : 1
-  const widths = new Map(
-    sized.map((child) => [
-      child,
-      320 +
-        (resizingFill && requestedExtra === 0
-          ? availableExtra / Math.max(1, sized.length)
-          : Math.max(
-              0,
-              (layouts[panelIdOf(child) ?? ""]?.width ?? equalWidth) - 320
-            ) * ratio),
-    ])
-  )
-
-  return (
-    <div
-      className={cn("min-h-0 gap-2 relative flex w-full flex-1", className)}
-      data-slot="scaffold-canvas"
-      data-motion-panels-fill=""
-      ref={ref}
-      {...rest}
-    >
-      {/* Keep folded panels mounted to preserve their content state. */}
-      {childArray.map((child) => {
-        if (!React.isValidElement(child)) return child
-        const hidden = !visibleChildren.includes(child)
-        return React.cloneElement(
-          child as React.ReactElement<Record<string, unknown>>,
-          {
-            _panelHidden: hidden,
-            _panelFill: child === fillChild,
-            _panelEnd:
-              childArray.indexOf(child) < childArray.indexOf(fillChild!),
-            _panelMax: Math.max(
-              320,
-              width -
-                Math.max(0, count - 1) * 8 -
-                320 -
-                sized
-                  .filter((other) => other !== child)
-                  .reduce<number>(
-                    (sum, other) => sum + (widths.get(other) ?? 320),
-                    0
-                  )
-            ),
-            _panelWidth: widths.get(child) ?? equalWidth,
-          }
-        )
-      })}
-    </div>
-  )
-}

package/src/components/blocks/scaffold/scaffold-context.ts

@@ -1,20 +0,0 @@
-"use client"
-
-import * as React from "react"
-
-import type { IScaffoldContextValue } from "./type"
-
-export const ScaffoldContext = React.createContext<IScaffoldContextValue | null>(
-  null
-)
-
-/** Read the scaffold's identity (`scaffoldId`, `inspectorWidth`); must run
- * under `Scaffold.Root`. State itself lives in the store — subscribe to the
- * atoms, or reach them by id through `useScaffoldState` / `useScaffoldActions`. */
-export function useScaffoldContext(): IScaffoldContextValue {
-  const context = React.useContext(ScaffoldContext)
-  if (!context) {
-    throw new Error("useScaffoldContext must be used within <Scaffold.Root>")
-  }
-  return context
-}