@allxsmith/bestax-bulma 5.60.0 → 5.62.0

package/dist/esm/helpers/useTreeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTreeView.js","sources":["../../../src/helpers/useTreeView.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport { useCallback, useEffect, useReducer, useRef, useState } from 'react';\nimport type React from 'react';\nimport type { TreeViewSelectionMode } from '../components/TreeView';\nimport { useClientLayoutEffect } from './useClientLayoutEffect';\nimport { getActiveElementInTree } from './shadowDom';\nimport { typeaheadMatch, typeaheadText, useTypeahead } from './typeahead';\n\n/** What an item tells the tree about itself when it registers. */\nexport interface TreeViewItemRecord {\n  /** The value of the item it's in, or `null` at the top. */\n  parent: string | null;\n  disabled: boolean;\n  /** It has children, or `hasChildren` says it will. */\n  isParent: boolean;\n}\n\n/** An item as a key or a click on it sees it. */\nexport interface TreeViewItemInfo extends TreeViewItemRecord {\n  value: string;\n  open: boolean;\n  /**\n   * A failed load's row: what Enter, Space and a click on it do, in place of\n   * what the mode says.\n   */\n  retry?: () => void;\n}\n\n/** A box's state: checked, unchecked or mixed. */\nexport type TreeViewCheckState = boolean | 'mixed';\n\n/**\n * Where an item sits among the items beside it, for its `aria-posinset` and\n * `aria-setsize`: its number, from 1, and how many there are.\n */\nexport interface TreeViewPosition {\n  posinset: number;\n  setsize: number;\n}\n\n/**\n * What an item shows of the selection: `selected` in a `single` tree,\n * `checked` in a `checkbox` or `checkbox-independent` tree, and neither with\n * `none`.\n */\nexport interface TreeViewItemState {\n  selected?: boolean;\n  checked?: TreeViewCheckState;\n}\n\ntype Action = 'open' | 'select' | 'check';\n\n/** What Enter, Space and a click on the row do in a mode. */\ninterface ModeActions {\n  enter: Action[];\n  space: Action[];\n  click: Action[];\n}\n\n/** The keys and clicks of both checkbox modes, which differ only in what a check reaches. */\nconst CHECKBOX_ACTIONS: ModeActions = {\n  enter: ['open'],\n  space: ['check'],\n  click: ['check'],\n};\n\n/**\n * What Enter, Space and a click on the row do in each mode, from the tables\n * in #1096, with `checkbox-independent` from #1430. `open` opens or closes a\n * parent and does nothing on a leaf. A click on the chevron only ever opens\n * or closes.\n */\nconst MODES: Record<TreeViewSelectionMode, ModeActions> = {\n  none: { enter: ['open'], space: ['open'], click: ['open'] },\n  single: { enter: ['select'], space: ['select'], click: ['select', 'open'] },\n  checkbox: CHECKBOX_ACTIONS,\n  'checkbox-independent': CHECKBOX_ACTIONS,\n};\n\n/** Left and Right, swapped for a right-to-left page. */\nconst MIRRORED: Record<string, string> = {\n  ArrowLeft: 'ArrowRight',\n  ArrowRight: 'ArrowLeft',\n};\n\n/** An IME is composing, so the key belongs to it (`keyCode` 229 is Safari's word for it). */\nconst isComposing = (event: React.KeyboardEvent): boolean =>\n  event.nativeEvent.isComposing || event.nativeEvent.keyCode === 229;\n\n/**\n * The items a tree knows, and their elements while they're on the page. A\n * loading item's row, or a failed load's, hands over its element under a key\n * of its own and has no record, so the keys reach it and nothing else counts it.\n */\ninterface Registry {\n  records: Map<string, TreeViewItemRecord>;\n  // By value, for an item whose ref lets go, which hands over no element.\n  elements: Map<string, HTMLLIElement>;\n  // Weak, so an element that leaves the page needn't be forgotten by hand.\n  values: WeakMap<Element, string>;\n}\n\n/** The registry's items on the page, in document order. */\nconst shownIn = (tree: Element, { values }: Registry): HTMLElement[] =>\n  Array.from(tree.querySelectorAll<HTMLElement>('[role=\"treeitem\"]')).filter(\n    element => values.has(element)\n  );\n\n/** The item an item on the page sits in: its group's `<li>`, or none at the top. */\nfunction parentItemOf(element: Element): HTMLElement | null {\n  const group = element.parentElement!;\n  return group.getAttribute('role') === 'group' ? group.parentElement : null;\n}\n\n/** No positions: on the server, and until the tree has mounted. */\nconst NO_POSITIONS = new Map<string, TreeViewPosition>();\n\n/**\n * Each item's place among the items beside it, by its key, read off the\n * items on the page: the ones in the same group, or at the top. A loading or\n * failed load's row counts, as it does for a browser that works positions\n * out for itself, so the declared ones say what a browser would.\n */\nfunction positionsOf(\n  shown: HTMLElement[],\n  { values }: Registry\n): Map<string, TreeViewPosition> {\n  const sets = new Map<Element | null, HTMLElement[]>();\n  shown.forEach(element => {\n    const set = sets.get(element.parentElement);\n    if (set) set.push(element);\n    else sets.set(element.parentElement, [element]);\n  });\n  const positions = new Map<string, TreeViewPosition>();\n  sets.forEach(set =>\n    set.forEach((element, at) =>\n      positions.set(values.get(element)!, {\n        posinset: at + 1,\n        setsize: set.length,\n      })\n    )\n  );\n  return positions;\n}\n\n/** Whether two sets of positions say the same for every item. */\nfunction samePositions(\n  a: Map<string, TreeViewPosition>,\n  b: Map<string, TreeViewPosition>\n): boolean {\n  return (\n    a.size === b.size &&\n    Array.from(a).every(([key, { posinset, setsize }]) => {\n      const other = b.get(key);\n      return other?.posinset === posinset && other.setsize === setsize;\n    })\n  );\n}\n\n/** The values of the items an item on the page is in, from the top. */\nfunction pathOf(element: Element, { values }: Registry): string[] {\n  const path: string[] = [];\n  for (let at = parentItemOf(element); at; at = parentItemOf(at)) {\n    path.unshift(values.get(at)!);\n  }\n  return path;\n}\n\n/**\n * Every known item's check state, by the rules in #1096:\n *\n * - a disabled item is checked only when its own value is listed;\n * - an enabled item with no enabled items anywhere under it is checked when\n *   it, or any item above it, is listed;\n * - any other enabled item follows the items of that second kind in its\n *   branch: checked when they all are, unchecked when none is, mixed between.\n *\n * Also returns the items of the second kind, which are what a toggle sets.\n */\nfunction readChecks(\n  records: Map<string, TreeViewItemRecord>,\n  listed: Set<string>\n): { states: Map<string, TreeViewCheckState>; ends: string[] } {\n  const kids = new Map<string | null, string[]>();\n  records.forEach(({ parent }, value) => {\n    kids.set(parent, [...(kids.get(parent) ?? []), value]);\n  });\n  const states = new Map<string, TreeViewCheckState>();\n  const ends: string[] = [];\n  // How many enabled ends the branch holds, and how many are checked.\n  const visit = (value: string, above: boolean): [number, number] => {\n    const marked = above || listed.has(value);\n    let total = 0;\n    let on = 0;\n    for (const kid of kids.get(value) ?? []) {\n      const [t, o] = visit(kid, marked);\n      total += t;\n      on += o;\n    }\n    if (records.get(value)!.disabled) {\n      states.set(value, listed.has(value));\n      return [total, on];\n    }\n    if (total === 0) {\n      states.set(value, marked);\n      ends.push(value);\n      return [1, marked ? 1 : 0];\n    }\n    states.set(value, on === total ? true : on > 0 && 'mixed');\n    return [total, on];\n  };\n  for (const top of kids.get(null) ?? []) visit(top, false);\n  return { states, ends };\n}\n\n/**\n * The list a toggle of `value` leaves: it and every enabled item under it\n * take the opposite of its state (a mixed one checks), and the rest is read\n * back by the rules. That's every item that shows checked, parents\n * included, plus any listed value no item has.\n */\nfunction toggledList(\n  records: Map<string, TreeViewItemRecord>,\n  list: string[],\n  value: string\n): string[] {\n  const { states, ends } = readChecks(records, new Set(list));\n  const to = states.get(value) !== true;\n  // An end was reached from the top, so everything above it is known.\n  const under = (end: string) => {\n    for (let at: string | null = end; at !== null;) {\n      if (at === value) return true;\n      at = records.get(at)!.parent;\n    }\n    return false;\n  };\n  const seed = new Set(\n    ends.filter(end => (under(end) ? to : states.get(end) === true))\n  );\n  records.forEach(({ disabled }, item) => {\n    if (disabled && states.get(item) === true) seed.add(item);\n  });\n  const after = readChecks(records, seed).states;\n  return [\n    ...Array.from(after)\n      .filter(([, state]) => state === true)\n      .map(([item]) => item),\n    ...list.filter(item => !records.has(item)),\n  ];\n}\n\n/** A value the caller holds, or one this hook holds when the caller doesn't. */\nfunction useControlled<T>(controlled: T | undefined, initial: T) {\n  const [own, setOwn] = useState(initial);\n  const isControlled = controlled !== undefined;\n  const set = (next: T) => {\n    if (!isControlled) setOwn(next);\n  };\n  return [isControlled ? controlled : own, set] as const;\n}\n\n/**\n * The list with `value` added at the end, or, when it's `present`, with\n * every copy of it taken out. Everything else stays as it was, in its order.\n */\nfunction addedOrRemoved(\n  list: string[],\n  value: string,\n  present: boolean\n): string[] {\n  return present ? list.filter(v => v !== value) : [...list, value];\n}\n\n/** Options for `useTreeView`: the TreeView's own props. */\nexport interface TreeViewOptions {\n  mode: TreeViewSelectionMode;\n  selected?: string | null;\n  defaultSelected: string | null;\n  onSelectedChange?: (value: string) => void;\n  checked?: string[];\n  defaultChecked: string[];\n  onCheckedChange?: (checked: string[]) => void;\n  expanded?: string[];\n  defaultExpanded: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n}\n\n/** What `useTreeView` hands the root and its items. */\nexport interface TreeViewEngine {\n  /** For the `<ul role=\"tree\">`. */\n  treeRef: React.MutableRefObject<HTMLUListElement | null>;\n  /**\n   * Whether a closed item still renders its children, drawing nothing, so a\n   * check knows everything under it. Only a `checkbox` tree needs to: a check\n   * in a `checkbox-independent` tree reaches nothing under it.\n   */\n  rendersClosed: boolean;\n  /** Whether any number of items can be checked, in either checkbox mode. */\n  multiselectable: boolean;\n  /** The item that holds `tabIndex={0}`. */\n  tabStop: string | null;\n  isOpen: (value: string) => boolean;\n  /**\n   * What the item shows of the selection. `path` is the values of the items\n   * above it, which decide its box until the items have registered, as on\n   * the server.\n   */\n  stateOf: (\n    value: string,\n    path: string[],\n    disabled: boolean\n  ) => TreeViewItemState;\n  /**\n   * Where the item with this key sits among the items beside it, read off\n   * the page after each render and whenever items move. Nothing until the\n   * tree has mounted, as on the server.\n   */\n  positionOf: (key: string) => TreeViewPosition | undefined;\n  /** Records an item from its layout effect. Returns the function that forgets it. */\n  register: (value: string, record: TreeViewItemRecord) => () => void;\n  /** For each item's `<li>` ref: records it, and notices focus leaving with it. */\n  setElement: (value: string, element: HTMLLIElement | null) => void;\n  /** Focus arrived on the item's own `<li>`. */\n  onFocus: (value: string, element: HTMLLIElement) => void;\n  /** Focus left the item's own `<li>`. */\n  onBlur: () => void;\n  /** A key on the item's `<li>`, after its own `onKeyDown`. */\n  onKeyDown: (\n    event: React.KeyboardEvent<HTMLLIElement>,\n    item: TreeViewItemInfo\n  ) => void;\n  /**\n   * A click on the item's row, or with `onToggle` on its chevron. Focus and\n   * the tab stop move to the item.\n   */\n  onClick: (\n    element: HTMLLIElement,\n    item: TreeViewItemInfo,\n    onToggle: boolean\n  ) => void;\n}\n\n/**\n * The open state, the selection, the keys, the tab stop, the positions and\n * the registry of a TreeView (#1096). Focus moves for real, with a roving\n * tabindex, rather than through `aria-activedescendant`. Each item's\n * position among the items beside it is declared rather than left to the\n * browser (#1171), read off the page once the tree has mounted.\n *\n * Every item registers its value, its parent and whether it's disabled from\n * a layout effect. In a `checkbox` tree a closed item's children still\n * render and register while drawing nothing, so the registry knows every item\n * and a check reaches all of them. A `checkbox-independent` tree reads each\n * box off the checked list alone, so a check adds or takes out its own value\n * and nothing else. The keys read the items on the page, in document order,\n * each time they need them.\n *\n * @function useTreeView\n * @param options - The TreeView's props.\n * @returns The state and handlers the root and its items wire up.\n */\nexport function useTreeView(options: TreeViewOptions): TreeViewEngine {\n  // An own key only, so a name every object inherits, like `toString`, is a\n  // mode the tree doesn't know too.\n  const mode = Object.prototype.hasOwnProperty.call(MODES, options.mode)\n    ? options.mode\n    : 'none';\n  const actions = MODES[mode];\n\n  const [expanded, setExpanded] = useControlled(\n    options.expanded,\n    options.defaultExpanded\n  );\n  const [selection, setSelection] = useControlled(\n    options.selected,\n    options.defaultSelected\n  );\n  const [checkedList, setChecked] = useControlled(\n    options.checked,\n    options.defaultChecked\n  );\n  // In a `checkbox` tree a check reaches the items under it, by the rules. In\n  // a `checkbox-independent` one each box is its own item's, read off the list.\n  const cascade = mode === 'checkbox';\n  const independent = mode === 'checkbox-independent';\n  // A box on every item, in either checkbox tree.\n  const boxed = cascade || independent;\n  // Each is read in its own mode only.\n  const selected = mode === 'single' ? selection : null;\n  const listed = new Set(boxed ? checkedList : []);\n\n  const treeRef = useRef<HTMLUListElement | null>(null);\n  const registryRef = useRef<Registry>({\n    records: new Map(),\n    elements: new Map(),\n    values: new WeakMap(),\n  });\n  // Items register from their own effects, so they ask for a render to be read.\n  const [, refresh] = useReducer((n: number) => n + 1, 0);\n  const typeahead = useTypeahead();\n\n  // The item with focus, and where the stop rests while focus is elsewhere:\n  // `undefined` until the tree has mounted. With the values above it, for\n  // when it goes away.\n  const [focused, setFocused] = useState<string | null>(null);\n  const [resting, setResting] = useState<string | null | undefined>();\n  const restingPathRef = useRef<string[]>([]);\n  // The values above an item that left the page with focus in it.\n  const lostRef = useRef<string[] | null>(null);\n  // Each item's place among the items beside it, by its key.\n  const [positions, setPositions] = useState(NO_POSITIONS);\n\n  const { records } = registryRef.current;\n  const checks = cascade\n    ? // eslint-disable-next-line react-hooks/refs -- read in render on purpose: items write the registry from their layout effects and then ask for this render with `refresh`\n      readChecks(records, listed).states\n    : undefined;\n  const tabStop = focused ?? (resting === undefined ? selected : resting);\n\n  // An item's box, decided here alone, so the box drawn, the tab stop and a\n  // toggle agree: off the list in a `checkbox-independent` tree, and by the\n  // rules in a `checkbox` one, where it's `undefined` until the item\n  // registers. `undefined` in a tree with no boxes.\n  const checkOf = (value: string): TreeViewCheckState | undefined =>\n    independent ? listed.has(value) : checks?.get(value);\n\n  const isOpen = (value: string) => expanded.includes(value);\n\n  const stateOf = (\n    value: string,\n    path: string[],\n    disabled: boolean\n  ): TreeViewItemState => {\n    if (mode === 'single') {\n      return disabled ? {} : { selected: value === selected };\n    }\n    if (boxed) {\n      // Until the items register in a `checkbox` tree, a value stands for\n      // its branch, and a parent can't know it's mixed.\n      return {\n        checked:\n          checkOf(value) ??\n          (listed.has(value) || (!disabled && path.some(v => listed.has(v)))),\n      };\n    }\n    return {};\n  };\n\n  const changeOpen = (next: string[]) => {\n    setExpanded(next);\n    options.onExpandedChange?.(next);\n  };\n\n  const run: Record<Action, (item: TreeViewItemInfo) => void> = {\n    open: ({ value, isParent, open }) => {\n      if (isParent) changeOpen(addedOrRemoved(expanded, value, open));\n    },\n    select: ({ value }) => {\n      if (value === selected) return;\n      setSelection(value);\n      options.onSelectedChange?.(value);\n    },\n    check: ({ value }) => {\n      // A `checkbox-independent` box is its own item's alone, so its value\n      // comes or goes and the rest of the list stays as it was.\n      const next = independent\n        ? addedOrRemoved(checkedList, value, checkOf(value) === true)\n        : toggledList(records, checkedList, value);\n      setChecked(next);\n      options.onCheckedChange?.(next);\n    },\n  };\n\n  /** Disabled items are never selected, checked, opened or closed. */\n  const act = (item: TreeViewItemInfo, list: Action[]) => {\n    if (!item.disabled) list.forEach(action => run[action](item));\n  };\n\n  /** Enter, Space and a click on the row: a failed load's row retries. */\n  const press = (item: TreeViewItemInfo, list: Action[]) => {\n    if (item.retry) item.retry();\n    else act(item, list);\n  };\n\n  // After every render, read each item's position off the page, and put the\n  // stop where it belongs. While focus is in the tree it's the focused item.\n  // Otherwise it's the selected item, or the first checked one on the page,\n  // and failing that it stays where it was. An item that goes away hands it\n  // to its nearest ancestor on the page, or to the first item, and focus goes\n  // with it if it had focus.\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- after every render on purpose: it reads the page, and sets state only when what it reads has changed\n  useClientLayoutEffect(() => {\n    const tree = treeRef.current!;\n    const registry = registryRef.current;\n    // Each item's element is read off the page with its value, rather than\n    // out of `elements`, which holds one element per value: two items\n    // sharing a value, which they shouldn't, can leave it without one the\n    // page still has.\n    const shown = shownIn(tree, registry);\n    const placed = positionsOf(shown, registry);\n    if (!samePositions(positions, placed)) setPositions(placed);\n    const onPage = shown.map(element => registry.values.get(element)!);\n    const elementOf = (value: string) => shown[onPage.indexOf(value)];\n    const isShown = (value: string | null | undefined): value is string =>\n      value != null && onPage.includes(value);\n    const heir = (path: string[]) =>\n      [...path].reverse().find(isShown) ?? onPage[0] ?? null;\n\n    const lost = lostRef.current;\n    lostRef.current = null;\n    if (lost && !tree.contains(getActiveElementInTree(tree))) {\n      const to = heir(lost);\n      if (to) elementOf(to).focus();\n      return;\n    }\n    if (focused !== null && !isShown(focused)) setFocused(null);\n\n    const preferred = onPage.find(\n      value => value === selected || checkOf(value) === true\n    );\n    const next =\n      preferred ?? (isShown(resting) ? resting : heir(restingPathRef.current));\n    if (next !== resting) {\n      setResting(next);\n      restingPathRef.current = next ? pathOf(elementOf(next), registry) : [];\n    }\n  });\n\n  // Items can also move without the tree rendering, such as children that a\n  // component of the app sorts with state of its own. That changes no record,\n  // so the page is watched for items coming, going and moving, and the\n  // positions are read again.\n  useEffect(() => {\n    const tree = treeRef.current!;\n    const observer = new MutationObserver(() => {\n      const registry = registryRef.current;\n      const placed = positionsOf(shownIn(tree, registry), registry);\n      setPositions(current =>\n        samePositions(current, placed) ? current : placed\n      );\n    });\n    observer.observe(tree, { childList: true, subtree: true });\n    return () => observer.disconnect();\n  }, []);\n\n  const register = useCallback((value: string, record: TreeViewItemRecord) => {\n    const { records: known } = registryRef.current;\n    known.set(value, record);\n    refresh();\n    return () => {\n      if (known.get(value) !== record) return;\n      known.delete(value);\n      refresh();\n    };\n  }, []);\n\n  const setElement = useCallback(\n    (value: string, element: HTMLLIElement | null) => {\n      const registry = registryRef.current;\n      if (element) {\n        registry.elements.set(value, element);\n        registry.values.set(element, value);\n        return;\n      }\n      const gone = registry.elements.get(value);\n      if (!gone) return;\n      // The ref lets go before the element leaves the page, so it can still\n      // say whether focus was in it, and where it sat.\n      if (!lostRef.current && gone.contains(getActiveElementInTree(gone))) {\n        lostRef.current = [...pathOf(gone, registry), value];\n      }\n      registry.elements.delete(value);\n    },\n    []\n  );\n\n  const onFocus = (value: string, element: HTMLLIElement) => {\n    setFocused(value);\n    setResting(value);\n    restingPathRef.current = pathOf(element, registryRef.current);\n  };\n\n  const onBlur = () => setFocused(null);\n\n  const onKeyDown = (\n    event: React.KeyboardEvent<HTMLLIElement>,\n    item: TreeViewItemInfo\n  ) => {\n    const element = event.currentTarget;\n    // A key on an item inside this one bubbles here too, and is its own.\n    if (\n      event.target !== element ||\n      event.defaultPrevented ||\n      event.altKey ||\n      event.ctrlKey ||\n      event.metaKey ||\n      isComposing(event)\n    ) {\n      return;\n    }\n    const registry = registryRef.current;\n    const items = shownIn(treeRef.current!, registry);\n    const at = items.indexOf(element);\n    const rtl = getComputedStyle(element).direction === 'rtl';\n    const key = (rtl && MIRRORED[event.key]) || event.key;\n\n    switch (key) {\n      case 'ArrowDown':\n        items[at + 1]?.focus();\n        break;\n      case 'ArrowUp':\n        items[at - 1]?.focus();\n        break;\n      case 'Home':\n        items[0].focus();\n        break;\n      case 'End':\n        items[items.length - 1].focus();\n        break;\n      case 'ArrowRight': {\n        const next = items[at + 1];\n        if (!item.open) act(item, ['open']);\n        else if (next && parentItemOf(next) === element) next.focus();\n        break;\n      }\n      case 'ArrowLeft':\n        if (item.open && !item.disabled) act(item, ['open']);\n        else parentItemOf(element)?.focus();\n        break;\n      // A held key acts once.\n      case 'Enter':\n        if (!event.repeat) press(item, actions.enter);\n        break;\n      case ' ':\n        if (!event.repeat) press(item, actions.space);\n        break;\n      case '*': {\n        const closed: string[] = [];\n        registry.records.forEach((record, value) => {\n          if (\n            record.parent === item.parent &&\n            record.isParent &&\n            !record.disabled &&\n            !expanded.includes(value)\n          ) {\n            closed.push(value);\n          }\n        });\n        if (closed.length) changeOpen([...expanded, ...closed]);\n        break;\n      }\n      default:\n        // Type-ahead takes a printable character. Anything else, Escape and\n        // Tab included, is left to whatever is around the tree.\n        if (event.key.length !== 1) return;\n        typeaheadMatch(items, typeahead.type(event.key), at, el =>\n          typeaheadText(el.firstElementChild!)\n        )?.focus();\n    }\n    event.preventDefault();\n  };\n\n  const onClick = (\n    element: HTMLLIElement,\n    item: TreeViewItemInfo,\n    onToggle: boolean\n  ) => {\n    element.focus();\n    if (onToggle) act(item, ['open']);\n    else press(item, actions.click);\n  };\n\n  return {\n    treeRef,\n    rendersClosed: cascade,\n    multiselectable: boxed,\n    tabStop,\n    isOpen,\n    stateOf,\n    positionOf: key => positions.get(key),\n    register,\n    setElement,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    onClick,\n  };\n}\n"],"names":["isComposing"],"mappings":"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"}
+{"version":3,"file":"useTreeView.js","sources":["../../../src/helpers/useTreeView.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport {\n  createContext,\n  useCallback,\n  useEffect,\n  useReducer,\n  useRef,\n  useState,\n} from 'react';\nimport type React from 'react';\nimport type { TreeViewSelectionMode } from '../components/TreeView';\nimport { useClientLayoutEffect } from './useClientLayoutEffect';\nimport { useControlled } from './useControlled';\nimport { getActiveElementInTree } from './shadowDom';\nimport { typeaheadMatch, typeaheadText, useTypeahead } from './typeahead';\n\n/** What an item tells the tree about itself when it registers. */\nexport interface TreeViewItemRecord {\n  /** The value of the item it's in, or `null` at the top. */\n  parent: string | null;\n  disabled: boolean;\n  /** It has children, or `hasChildren` says it will. */\n  isParent: boolean;\n}\n\n/** An item as a key or a click on it sees it. */\nexport interface TreeViewItemInfo extends TreeViewItemRecord {\n  value: string;\n  open: boolean;\n  /**\n   * A failed load's row: what Enter, Space and a click on it do, in place of\n   * what the mode says.\n   */\n  retry?: () => void;\n}\n\n/** A box's state: checked, unchecked or mixed. */\nexport type TreeViewCheckState = boolean | 'mixed';\n\n/**\n * Where an item sits among the items beside it, for its `aria-posinset` and\n * `aria-setsize`: its number, from 1, and how many there are.\n */\nexport interface TreeViewPosition {\n  posinset: number;\n  setsize: number;\n}\n\n/**\n * What an item shows of the selection: `selected` in a `single` tree,\n * `checked` in a `checkbox` or `checkbox-independent` tree, and neither with\n * `none`.\n */\nexport interface TreeViewItemState {\n  selected?: boolean;\n  checked?: TreeViewCheckState;\n}\n\ntype Action = 'open' | 'select' | 'check';\n\n/** What Enter, Space and a click on the row do in a mode. */\ninterface ModeActions {\n  enter: Action[];\n  space: Action[];\n  click: Action[];\n}\n\n/** The keys and clicks of both checkbox modes, which differ only in what a check reaches. */\nconst CHECKBOX_ACTIONS: ModeActions = {\n  enter: ['open'],\n  space: ['check'],\n  click: ['check'],\n};\n\n/**\n * What Enter, Space and a click on the row do in each mode, from the tables\n * in #1096, with `checkbox-independent` from #1430. `open` opens or closes a\n * parent and does nothing on a leaf. A click on the chevron only ever opens\n * or closes.\n */\nconst MODES: Record<TreeViewSelectionMode, ModeActions> = {\n  none: { enter: ['open'], space: ['open'], click: ['open'] },\n  single: { enter: ['select'], space: ['select'], click: ['select', 'open'] },\n  checkbox: CHECKBOX_ACTIONS,\n  'checkbox-independent': CHECKBOX_ACTIONS,\n};\n\n/** Left and Right, swapped for a right-to-left page. */\nconst MIRRORED: Record<string, string> = {\n  ArrowLeft: 'ArrowRight',\n  ArrowRight: 'ArrowLeft',\n};\n\n/** An IME is composing, so the key belongs to it (`keyCode` 229 is Safari's word for it). */\nconst isComposing = (event: React.KeyboardEvent): boolean =>\n  event.nativeEvent.isComposing || event.nativeEvent.keyCode === 229;\n\n/**\n * The items a tree knows, and their elements while they're on the page. A\n * loading item's row, or a failed load's, hands over its element under a key\n * of its own and has no record, so the keys reach it and nothing else counts it.\n */\ninterface Registry {\n  records: Map<string, TreeViewItemRecord>;\n  // By value, for an item whose ref lets go, which hands over no element.\n  elements: Map<string, HTMLLIElement>;\n  // Weak, so an element that leaves the page needn't be forgotten by hand.\n  values: WeakMap<Element, string>;\n}\n\n/** The registry's items on the page, in document order. */\nconst shownIn = (tree: Element, { values }: Registry): HTMLElement[] =>\n  Array.from(tree.querySelectorAll<HTMLElement>('[role=\"treeitem\"]')).filter(\n    element => values.has(element)\n  );\n\n/** The item an item on the page sits in: its group's `<li>`, or none at the top. */\nfunction parentItemOf(element: Element): HTMLElement | null {\n  const group = element.parentElement!;\n  return group.getAttribute('role') === 'group' ? group.parentElement : null;\n}\n\n/** No positions: on the server, and until the tree has mounted. */\nconst NO_POSITIONS = new Map<string, TreeViewPosition>();\n\n/**\n * Each item's place among the items beside it, by its key, read off the\n * items on the page: the ones in the same group, or at the top. A loading or\n * failed load's row counts, as it does for a browser that works positions\n * out for itself, so the declared ones say what a browser would.\n */\nfunction positionsOf(\n  shown: HTMLElement[],\n  { values }: Registry\n): Map<string, TreeViewPosition> {\n  const sets = new Map<Element | null, HTMLElement[]>();\n  shown.forEach(element => {\n    const set = sets.get(element.parentElement);\n    if (set) set.push(element);\n    else sets.set(element.parentElement, [element]);\n  });\n  const positions = new Map<string, TreeViewPosition>();\n  sets.forEach(set =>\n    set.forEach((element, at) =>\n      positions.set(values.get(element)!, {\n        posinset: at + 1,\n        setsize: set.length,\n      })\n    )\n  );\n  return positions;\n}\n\n/** Whether two sets of positions say the same for every item. */\nfunction samePositions(\n  a: Map<string, TreeViewPosition>,\n  b: Map<string, TreeViewPosition>\n): boolean {\n  return (\n    a.size === b.size &&\n    Array.from(a).every(([key, { posinset, setsize }]) => {\n      const other = b.get(key);\n      return other?.posinset === posinset && other.setsize === setsize;\n    })\n  );\n}\n\n/** The values of the items an item on the page is in, from the top. */\nfunction pathOf(element: Element, { values }: Registry): string[] {\n  const path: string[] = [];\n  for (let at = parentItemOf(element); at; at = parentItemOf(at)) {\n    path.unshift(values.get(at)!);\n  }\n  return path;\n}\n\n/**\n * The values of the items a tree hides while they stay in it, as TreeSelect's\n * search hides the items that don't match. A hidden item renders as one under\n * a closed parent does: nothing on the page, and in a `checkbox` tree it and\n * its children still register, so a check still reaches them. Internal, for\n * the components that put a TreeView inside them.\n */\nexport const TreeViewHiddenContext = createContext<ReadonlySet<string>>(\n  new Set()\n);\n\n/**\n * Every known item's check state, by the rules in #1096:\n *\n * - a disabled item is checked only when its own value is listed;\n * - an enabled item with no enabled items anywhere under it is checked when\n *   it, or any item above it, is listed;\n * - any other enabled item follows the items of that second kind in its\n *   branch: checked when they all are, unchecked when none is, mixed between.\n *\n * Also returns the items of the second kind, which are what a toggle sets.\n */\nexport function readChecks(\n  records: Map<string, TreeViewItemRecord>,\n  listed: Set<string>\n): { states: Map<string, TreeViewCheckState>; ends: string[] } {\n  const kids = new Map<string | null, string[]>();\n  records.forEach(({ parent }, value) => {\n    kids.set(parent, [...(kids.get(parent) ?? []), value]);\n  });\n  const states = new Map<string, TreeViewCheckState>();\n  const ends: string[] = [];\n  // How many enabled ends the branch holds, and how many are checked.\n  const visit = (value: string, above: boolean): [number, number] => {\n    const marked = above || listed.has(value);\n    let total = 0;\n    let on = 0;\n    for (const kid of kids.get(value) ?? []) {\n      const [t, o] = visit(kid, marked);\n      total += t;\n      on += o;\n    }\n    if (records.get(value)!.disabled) {\n      states.set(value, listed.has(value));\n      return [total, on];\n    }\n    if (total === 0) {\n      states.set(value, marked);\n      ends.push(value);\n      return [1, marked ? 1 : 0];\n    }\n    states.set(value, on === total ? true : on > 0 && 'mixed');\n    return [total, on];\n  };\n  for (const top of kids.get(null) ?? []) visit(top, false);\n  return { states, ends };\n}\n\n/**\n * The list a toggle of `value` leaves: it and every enabled item under it\n * take the opposite of its state (a mixed one checks), and the rest is read\n * back by the rules. That's every item that shows checked, parents\n * included, plus any listed value no item has.\n */\nexport function toggledList(\n  records: Map<string, TreeViewItemRecord>,\n  list: string[],\n  value: string\n): string[] {\n  const { states, ends } = readChecks(records, new Set(list));\n  const to = states.get(value) !== true;\n  // An end was reached from the top, so everything above it is known.\n  const under = (end: string) => {\n    for (let at: string | null = end; at !== null;) {\n      if (at === value) return true;\n      at = records.get(at)!.parent;\n    }\n    return false;\n  };\n  const seed = new Set(\n    ends.filter(end => (under(end) ? to : states.get(end) === true))\n  );\n  records.forEach(({ disabled }, item) => {\n    if (disabled && states.get(item) === true) seed.add(item);\n  });\n  const after = readChecks(records, seed).states;\n  return [\n    ...Array.from(after)\n      .filter(([, state]) => state === true)\n      .map(([item]) => item),\n    ...list.filter(item => !records.has(item)),\n  ];\n}\n\n/**\n * The list with `value` added at the end, or, when it's `present`, with\n * every copy of it taken out. Everything else stays as it was, in its order.\n */\nfunction addedOrRemoved(\n  list: string[],\n  value: string,\n  present: boolean\n): string[] {\n  return present ? list.filter(v => v !== value) : [...list, value];\n}\n\n/** Options for `useTreeView`: the TreeView's own props. */\nexport interface TreeViewOptions {\n  mode: TreeViewSelectionMode;\n  selected?: string | null;\n  defaultSelected: string | null;\n  onSelectedChange?: (value: string) => void;\n  checked?: string[];\n  defaultChecked: string[];\n  onCheckedChange?: (checked: string[]) => void;\n  expanded?: string[];\n  defaultExpanded: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n}\n\n/** What `useTreeView` hands the root and its items. */\nexport interface TreeViewEngine {\n  /** For the `<ul role=\"tree\">`. */\n  treeRef: React.MutableRefObject<HTMLUListElement | null>;\n  /**\n   * Whether a closed item still renders its children, drawing nothing, so a\n   * check knows everything under it. Only a `checkbox` tree needs to: a check\n   * in a `checkbox-independent` tree reaches nothing under it.\n   */\n  rendersClosed: boolean;\n  /** Whether any number of items can be checked, in either checkbox mode. */\n  multiselectable: boolean;\n  /** The item that holds `tabIndex={0}`. */\n  tabStop: string | null;\n  isOpen: (value: string) => boolean;\n  /**\n   * What the item shows of the selection. `path` is the values of the items\n   * above it, which decide its box until the items have registered, as on\n   * the server.\n   */\n  stateOf: (\n    value: string,\n    path: string[],\n    disabled: boolean\n  ) => TreeViewItemState;\n  /**\n   * Where the item with this key sits among the items beside it, read off\n   * the page after each render and whenever items move. Nothing until the\n   * tree has mounted, as on the server.\n   */\n  positionOf: (key: string) => TreeViewPosition | undefined;\n  /** Records an item from its layout effect. Returns the function that forgets it. */\n  register: (value: string, record: TreeViewItemRecord) => () => void;\n  /** For each item's `<li>` ref: records it, and notices focus leaving with it. */\n  setElement: (value: string, element: HTMLLIElement | null) => void;\n  /** Focus arrived on the item's own `<li>`. */\n  onFocus: (value: string, element: HTMLLIElement) => void;\n  /** Focus left the item's own `<li>`. */\n  onBlur: () => void;\n  /** A key on the item's `<li>`, after its own `onKeyDown`. */\n  onKeyDown: (\n    event: React.KeyboardEvent<HTMLLIElement>,\n    item: TreeViewItemInfo\n  ) => void;\n  /**\n   * A click on the item's row, or with `onToggle` on its chevron. Focus and\n   * the tab stop move to the item.\n   */\n  onClick: (\n    element: HTMLLIElement,\n    item: TreeViewItemInfo,\n    onToggle: boolean\n  ) => void;\n}\n\n/**\n * The open state, the selection, the keys, the tab stop, the positions and\n * the registry of a TreeView (#1096). Focus moves for real, with a roving\n * tabindex, rather than through `aria-activedescendant`. Each item's\n * position among the items beside it is declared rather than left to the\n * browser (#1171), read off the page once the tree has mounted.\n *\n * Every item registers its value, its parent and whether it's disabled from\n * a layout effect. In a `checkbox` tree a closed item's children still\n * render and register while drawing nothing, so the registry knows every item\n * and a check reaches all of them. A `checkbox-independent` tree reads each\n * box off the checked list alone, so a check adds or takes out its own value\n * and nothing else. The keys read the items on the page, in document order,\n * each time they need them.\n *\n * @function useTreeView\n * @param options - The TreeView's props.\n * @returns The state and handlers the root and its items wire up.\n */\nexport function useTreeView(options: TreeViewOptions): TreeViewEngine {\n  // An own key only, so a name every object inherits, like `toString`, is a\n  // mode the tree doesn't know too.\n  const mode = Object.prototype.hasOwnProperty.call(MODES, options.mode)\n    ? options.mode\n    : 'none';\n  const actions = MODES[mode];\n\n  const [expanded, setExpanded] = useControlled(\n    options.expanded,\n    options.defaultExpanded\n  );\n  const [selection, setSelection] = useControlled(\n    options.selected,\n    options.defaultSelected\n  );\n  const [checkedList, setChecked] = useControlled(\n    options.checked,\n    options.defaultChecked\n  );\n  // In a `checkbox` tree a check reaches the items under it, by the rules. In\n  // a `checkbox-independent` one each box is its own item's, read off the list.\n  const cascade = mode === 'checkbox';\n  const independent = mode === 'checkbox-independent';\n  // A box on every item, in either checkbox tree.\n  const boxed = cascade || independent;\n  // Each is read in its own mode only.\n  const selected = mode === 'single' ? selection : null;\n  const listed = new Set(boxed ? checkedList : []);\n\n  const treeRef = useRef<HTMLUListElement | null>(null);\n  const registryRef = useRef<Registry>({\n    records: new Map(),\n    elements: new Map(),\n    values: new WeakMap(),\n  });\n  // Items register from their own effects, so they ask for a render to be read.\n  const [, refresh] = useReducer((n: number) => n + 1, 0);\n  const typeahead = useTypeahead();\n\n  // The item with focus, and where the stop rests while focus is elsewhere:\n  // `undefined` until the tree has mounted. With the values above it, for\n  // when it goes away.\n  const [focused, setFocused] = useState<string | null>(null);\n  const [resting, setResting] = useState<string | null | undefined>();\n  const restingPathRef = useRef<string[]>([]);\n  // The values above an item that left the page with focus in it.\n  const lostRef = useRef<string[] | null>(null);\n  // Each item's place among the items beside it, by its key.\n  const [positions, setPositions] = useState(NO_POSITIONS);\n\n  const { records } = registryRef.current;\n  const checks = cascade\n    ? // eslint-disable-next-line react-hooks/refs -- read in render on purpose: items write the registry from their layout effects and then ask for this render with `refresh`\n      readChecks(records, listed).states\n    : undefined;\n  const tabStop = focused ?? (resting === undefined ? selected : resting);\n\n  // An item's box, decided here alone, so the box drawn, the tab stop and a\n  // toggle agree: off the list in a `checkbox-independent` tree, and by the\n  // rules in a `checkbox` one, where it's `undefined` until the item\n  // registers. `undefined` in a tree with no boxes.\n  const checkOf = (value: string): TreeViewCheckState | undefined =>\n    independent ? listed.has(value) : checks?.get(value);\n\n  const isOpen = (value: string) => expanded.includes(value);\n\n  const stateOf = (\n    value: string,\n    path: string[],\n    disabled: boolean\n  ): TreeViewItemState => {\n    if (mode === 'single') {\n      return disabled ? {} : { selected: value === selected };\n    }\n    if (boxed) {\n      // Until the items register in a `checkbox` tree, a value stands for\n      // its branch, and a parent can't know it's mixed.\n      return {\n        checked:\n          checkOf(value) ??\n          (listed.has(value) || (!disabled && path.some(v => listed.has(v)))),\n      };\n    }\n    return {};\n  };\n\n  const changeOpen = (next: string[]) => {\n    setExpanded(next);\n    options.onExpandedChange?.(next);\n  };\n\n  const run: Record<Action, (item: TreeViewItemInfo) => void> = {\n    open: ({ value, isParent, open }) => {\n      if (isParent) changeOpen(addedOrRemoved(expanded, value, open));\n    },\n    select: ({ value }) => {\n      if (value === selected) return;\n      setSelection(value);\n      options.onSelectedChange?.(value);\n    },\n    check: ({ value }) => {\n      // A `checkbox-independent` box is its own item's alone, so its value\n      // comes or goes and the rest of the list stays as it was.\n      const next = independent\n        ? addedOrRemoved(checkedList, value, checkOf(value) === true)\n        : toggledList(records, checkedList, value);\n      setChecked(next);\n      options.onCheckedChange?.(next);\n    },\n  };\n\n  /** Disabled items are never selected, checked, opened or closed. */\n  const act = (item: TreeViewItemInfo, list: Action[]) => {\n    if (!item.disabled) list.forEach(action => run[action](item));\n  };\n\n  /** Enter, Space and a click on the row: a failed load's row retries. */\n  const press = (item: TreeViewItemInfo, list: Action[]) => {\n    if (item.retry) item.retry();\n    else act(item, list);\n  };\n\n  // After every render, read each item's position off the page, and put the\n  // stop where it belongs. While focus is in the tree it's the focused item.\n  // Otherwise it's the selected item, or the first checked one on the page,\n  // and failing that it stays where it was. An item that goes away hands it\n  // to its nearest ancestor on the page, or to the first item, and focus goes\n  // with it if it had focus.\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- after every render on purpose: it reads the page, and sets state only when what it reads has changed\n  useClientLayoutEffect(() => {\n    const tree = treeRef.current!;\n    const registry = registryRef.current;\n    // Each item's element is read off the page with its value, rather than\n    // out of `elements`, which holds one element per value: two items\n    // sharing a value, which they shouldn't, can leave it without one the\n    // page still has.\n    const shown = shownIn(tree, registry);\n    const placed = positionsOf(shown, registry);\n    if (!samePositions(positions, placed)) setPositions(placed);\n    const onPage = shown.map(element => registry.values.get(element)!);\n    const elementOf = (value: string) => shown[onPage.indexOf(value)];\n    const isShown = (value: string | null | undefined): value is string =>\n      value != null && onPage.includes(value);\n    const heir = (path: string[]) =>\n      [...path].reverse().find(isShown) ?? onPage[0] ?? null;\n\n    const lost = lostRef.current;\n    lostRef.current = null;\n    if (lost && !tree.contains(getActiveElementInTree(tree))) {\n      const to = heir(lost);\n      if (to) elementOf(to).focus();\n      return;\n    }\n    if (focused !== null && !isShown(focused)) setFocused(null);\n\n    const preferred = onPage.find(\n      value => value === selected || checkOf(value) === true\n    );\n    const next =\n      preferred ?? (isShown(resting) ? resting : heir(restingPathRef.current));\n    if (next !== resting) {\n      setResting(next);\n      restingPathRef.current = next ? pathOf(elementOf(next), registry) : [];\n    }\n  });\n\n  // Items can also move without the tree rendering, such as children that a\n  // component of the app sorts with state of its own. That changes no record,\n  // so the page is watched for items coming, going and moving, and the\n  // positions are read again.\n  useEffect(() => {\n    const tree = treeRef.current!;\n    const observer = new MutationObserver(() => {\n      const registry = registryRef.current;\n      const placed = positionsOf(shownIn(tree, registry), registry);\n      setPositions(current =>\n        samePositions(current, placed) ? current : placed\n      );\n    });\n    observer.observe(tree, { childList: true, subtree: true });\n    return () => observer.disconnect();\n  }, []);\n\n  const register = useCallback((value: string, record: TreeViewItemRecord) => {\n    const { records: known } = registryRef.current;\n    known.set(value, record);\n    refresh();\n    return () => {\n      if (known.get(value) !== record) return;\n      known.delete(value);\n      refresh();\n    };\n  }, []);\n\n  const setElement = useCallback(\n    (value: string, element: HTMLLIElement | null) => {\n      const registry = registryRef.current;\n      if (element) {\n        registry.elements.set(value, element);\n        registry.values.set(element, value);\n        return;\n      }\n      const gone = registry.elements.get(value);\n      if (!gone) return;\n      // The ref lets go before the element leaves the page, so it can still\n      // say whether focus was in it, and where it sat.\n      if (!lostRef.current && gone.contains(getActiveElementInTree(gone))) {\n        lostRef.current = [...pathOf(gone, registry), value];\n      }\n      registry.elements.delete(value);\n    },\n    []\n  );\n\n  const onFocus = (value: string, element: HTMLLIElement) => {\n    setFocused(value);\n    setResting(value);\n    restingPathRef.current = pathOf(element, registryRef.current);\n  };\n\n  const onBlur = () => setFocused(null);\n\n  const onKeyDown = (\n    event: React.KeyboardEvent<HTMLLIElement>,\n    item: TreeViewItemInfo\n  ) => {\n    const element = event.currentTarget;\n    // A key on an item inside this one bubbles here too, and is its own.\n    if (\n      event.target !== element ||\n      event.defaultPrevented ||\n      event.altKey ||\n      event.ctrlKey ||\n      event.metaKey ||\n      isComposing(event)\n    ) {\n      return;\n    }\n    const registry = registryRef.current;\n    const items = shownIn(treeRef.current!, registry);\n    const at = items.indexOf(element);\n    const rtl = getComputedStyle(element).direction === 'rtl';\n    const key = (rtl && MIRRORED[event.key]) || event.key;\n\n    switch (key) {\n      case 'ArrowDown':\n        items[at + 1]?.focus();\n        break;\n      case 'ArrowUp':\n        items[at - 1]?.focus();\n        break;\n      case 'Home':\n        items[0].focus();\n        break;\n      case 'End':\n        items[items.length - 1].focus();\n        break;\n      case 'ArrowRight': {\n        const next = items[at + 1];\n        if (!item.open) act(item, ['open']);\n        else if (next && parentItemOf(next) === element) next.focus();\n        break;\n      }\n      case 'ArrowLeft':\n        if (item.open && !item.disabled) act(item, ['open']);\n        else parentItemOf(element)?.focus();\n        break;\n      // A held key acts once.\n      case 'Enter':\n        if (!event.repeat) press(item, actions.enter);\n        break;\n      case ' ':\n        if (!event.repeat) press(item, actions.space);\n        break;\n      case '*': {\n        // The siblings on the page: not the ones a component around the\n        // tree hides, which stay registered.\n        const closed: string[] = [];\n        registry.records.forEach((record, value) => {\n          if (\n            record.parent === item.parent &&\n            record.isParent &&\n            !record.disabled &&\n            !expanded.includes(value) &&\n            registry.elements.has(value)\n          ) {\n            closed.push(value);\n          }\n        });\n        if (closed.length) changeOpen([...expanded, ...closed]);\n        break;\n      }\n      default:\n        // Type-ahead takes a printable character. Anything else, Escape and\n        // Tab included, is left to whatever is around the tree.\n        if (event.key.length !== 1) return;\n        typeaheadMatch(items, typeahead.type(event.key), at, el =>\n          typeaheadText(el.firstElementChild!)\n        )?.focus();\n    }\n    event.preventDefault();\n  };\n\n  const onClick = (\n    element: HTMLLIElement,\n    item: TreeViewItemInfo,\n    onToggle: boolean\n  ) => {\n    element.focus();\n    if (onToggle) act(item, ['open']);\n    else press(item, actions.click);\n  };\n\n  return {\n    treeRef,\n    rendersClosed: cascade,\n    multiselectable: boxed,\n    tabStop,\n    isOpen,\n    stateOf,\n    positionOf: key => positions.get(key),\n    register,\n    setElement,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    onClick,\n  };\n}\n"],"names":["isComposing"],"mappings":"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"}

package/dist/esm/layout/AppFrame.js

@@ -0,0 +1,438 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import React, { createContext, forwardRef, useContext, useRef, useCallback, useEffect, useState, useId, useMemo } from 'react';
+import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
+import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
+import { withSubComponents } from '../helpers/withSubComponents.js';
+import { flattenChildren } from '../helpers/flattenChildren.js';
+import { useLatestRef } from '../helpers/useLatestRef.js';
+import { useOverlayStack, useOverlayEscape } from '../helpers/overlayStack.js';
+import { useScrollLock } from '../helpers/scrollLock.js';
+import { useInertSiblings } from '../helpers/useInertSiblings.js';
+import { trapTab } from '../helpers/useFocusTrap.js';
+import { useOverlayFocus } from '../helpers/useOverlayFocus.js';
+import { useOutsidePress } from '../helpers/useOutsidePress.js';
+import { getActiveElementInTree } from '../helpers/shadowDom.js';
+import { useBulmaBreakpoint } from '../helpers/useBulmaViewport.js';
+import { warnOnce } from '../helpers/devWarnings.js';
+import { NavbarBurger } from '../components/Navbar.js';
+import { Delete } from '../elements/Delete.js';
+
+const FrameContext = createContext(null);
+/** A width prop as CSS: a number is pixels. */
+const cssLength = (value) => typeof value === 'number' ? `${value}px` : value;
+/**
+ * Hands `node` to a part's own ref and to the one forwarded to it. A
+ * forwarded callback that returns a cleanup, as React 19 allows, has it held
+ * in `cleanup` and run on detach in place of a call with `null`, on React 18
+ * as well.
+ */
+function setRefs(node, own, forwarded, cleanup) {
+    own.current = node;
+    if (typeof forwarded === 'function') {
+        if (node === null) {
+            const detach = cleanup.current;
+            cleanup.current = null;
+            if (detach)
+                detach();
+            else
+                forwarded(null);
+            return;
+        }
+        const returned = forwarded(node);
+        cleanup.current =
+            typeof returned === 'function' ? returned : null;
+    }
+    else if (forwarded) {
+        forwarded.current = node;
+    }
+}
+/**
+ * Warns when a part has an `id` the frame couldn't read, because it isn't a
+ * direct child, so the skip link or the burger points at the wrong one.
+ */
+function warnOnUnreadId(part, id, expected) {
+    if (id && id !== expected) {
+        warnOnce(`AppFrame:${part}-id`, `[bestax-bulma] <AppFrame.${part}> has an id <AppFrame> can't read, ` +
+            `so ${part === 'Main' ? 'the skip link' : "the burger's aria-controls"} ` +
+            `misses it. Put AppFrame.${part} directly inside AppFrame.`);
+    }
+}
+/**
+ * The top bar of an AppFrame, which sticks while the page scrolls.
+ *
+ * @function
+ * @param {AppFrameHeaderProps} props - Props for AppFrame.Header.
+ * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<header>`.
+ * @returns {JSX.Element} The rendered header.
+ */
+const AppFrameHeader = forwardRef(({ className, children, ...props }, ref) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const headerClass = usePrefixedClassNames('app-frame-header');
+    return (jsx("header", { ref: ref, className: classNames(headerClass, bulmaHelperClasses, className), ...rest, children: children }));
+});
+AppFrameHeader.displayName = 'AppFrame.Header';
+/**
+ * The navigation of an AppFrame: a column beside the page from the breakpoint up, and a drawer below it.
+ *
+ * @function
+ * @param {AppFrameNavProps} props - Props for AppFrame.Nav.
+ * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<nav>`.
+ * @returns {JSX.Element} The rendered nav, and the drawer's backdrop.
+ */
+const AppFrameNav = forwardRef(({ className, style, width, overlay = true, closeOnEscape = true, closeOnClickOutside = true, closeOnNavigate = true, onClick, onPointerDownCapture, children, ...props }, ref) => {
+    const frame = useContext(FrameContext);
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const navClass = usePrefixedClassNames('app-frame-nav');
+    const closeClass = usePrefixedClassNames('app-frame-close');
+    const backdropClass = usePrefixedClassNames('app-frame-backdrop');
+    const activeClass = usePrefixedClassNames('is-active');
+    const navRef = useRef(null);
+    const backdropRef = useRef(null);
+    const navCleanupRef = useRef(null);
+    const navRefs = useCallback((node) => setRefs(node, navRef, ref, navCleanupRef), [ref]);
+    const navId = rest.id || frame?.state.navId;
+    if (frame)
+        warnOnUnreadId('Nav', rest.id, frame.state.navId);
+    // The drawer is open only below the breakpoint. Above it the nav is a
+    // column, and none of what follows applies.
+    const isDrawer = !!frame?.state.isDrawer;
+    const open = isDrawer && !!frame?.state.navOpen;
+    // The open drawer is Bulma's active state, on the nav as on a navbar's
+    // menu, and on its backdrop.
+    const shown = { [activeClass]: !!frame?.state.navOpen };
+    const modal = open && overlay;
+    const close = () => frame?.state.setNavOpen(false);
+    // The rest of the frame goes inert: the header, the page, the aside and
+    // the footer, but not the backdrop, which takes the presses outside the
+    // drawer rather than let them through to what's under it. Not the whole
+    // page, since a Modal or a toast renders beside the frame, often into an
+    // element that's there before the drawer opens, and a Modal opened from
+    // the drawer has to stay usable. First, so that as the drawer closes it
+    // lets go before focus goes back to the burger: an inert element can't
+    // take focus.
+    useInertSiblings(navRef, modal, false, backdropRef);
+    const isTopmost = useOverlayStack(open, overlay);
+    useScrollLock(modal);
+    // Tab stays inside while the drawer is the topmost modal overlay, as in
+    // Sidebar, so a Modal opened from the drawer holds Tab until it closes.
+    useEffect(() => {
+        if (!modal)
+            return undefined;
+        return trapTab(() => navRef.current, window, () => isTopmost('modal'));
+    }, [modal, isTopmost]);
+    useOverlayEscape(open && closeOnEscape, isTopmost, close);
+    // Without an overlay there's no backdrop: a press outside the drawer
+    // closes it, as Popover's does, while it's the topmost overlay, so a
+    // press in a Modal opened over it is the Modal's. A press on a control
+    // that names the nav in its `aria-controls`, such as the burger, is left
+    // to that control, which toggles it.
+    const markInsidePress = useOutsidePress(navRef, open && !overlay && closeOnClickOutside, e => {
+        const id = navRef.current?.id;
+        const controlsNav = (node) => !!node
+            .getAttribute?.('aria-controls')
+            ?.split(/\s+/)
+            .includes(id);
+        if (!isTopmost() || e.composedPath().some(controlsNav))
+            return;
+        close();
+    });
+    // Focus moves to the drawer's first tab stop, the close button, as it
+    // opens, and back to whatever had it as it closes, unless it has left
+    // the drawer. After a press outside, the press's own mousedown then takes
+    // it wherever the press goes. When the window widened, the drawer is the
+    // column again, and focus on its links stays; the close button hides
+    // there, so focus on it, or dropped from it to <body>, goes back too.
+    const isDrawerRef = useLatestRef(isDrawer);
+    useOverlayFocus(navRef, open, {
+        modal: overlay,
+        restore: () => {
+            if (isDrawerRef.current)
+                return true;
+            const nav = navRef.current;
+            const active = getActiveElementInTree(nav);
+            return (!nav.contains(active) || !!active?.classList.contains(closeClass));
+        },
+    });
+    const handleClick = (e) => {
+        onClick?.(e);
+        if (!open ||
+            !closeOnNavigate ||
+            e.button !== 0 ||
+            e.metaKey ||
+            e.ctrlKey ||
+            e.shiftKey ||
+            e.altKey) {
+            return;
+        }
+        // Not skipped for a click whose default was prevented: a router's
+        // link prevents it to navigate without a page load. Only a link the nav
+        // holds: one in a Modal portaled from it is the Modal's.
+        const link = e.target.closest('a[href]');
+        if (!link || !navRef.current?.contains(link))
+            return;
+        if (link.hasAttribute('download'))
+            return;
+        const target = link.getAttribute('target');
+        if (target && target !== '_self')
+            return;
+        close();
+    };
+    const navStyle = width === undefined
+        ? style
+        : {
+            ...style,
+            '--bulma-app-frame-nav-width': cssLength(width),
+        };
+    return (jsxs(Fragment, { children: [jsxs("nav", { ref: navRefs, className: classNames(navClass, shown, bulmaHelperClasses, className), style: navStyle, onClick: handleClick, onPointerDownCapture: e => {
+                    onPointerDownCapture?.(e);
+                    markInsidePress(e);
+                }, ...rest, id: navId, "aria-label": rest['aria-label'] ||
+                    (rest['aria-labelledby'] ? undefined : frame?.labels.nav), children: [frame && (jsx(Delete, { className: closeClass, size: "medium", ariaLabel: frame.labels.closeNav, onClick: close })), children] }), frame && overlay && (jsx("div", { ref: backdropRef, className: classNames(backdropClass, shown), "aria-hidden": "true", onClick: closeOnClickOutside
+                    ? () => {
+                        // Not under an overlay opened over the drawer.
+                        if (isTopmost())
+                            close();
+                    }
+                    : undefined }))] }));
+});
+AppFrameNav.displayName = 'AppFrame.Nav';
+/**
+ * The page's main content in an AppFrame, which the skip link moves focus to.
+ *
+ * @function
+ * @param {AppFrameMainProps} props - Props for AppFrame.Main.
+ * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<main>`.
+ * @returns {JSX.Element} The rendered main.
+ */
+const AppFrameMain = forwardRef(({ className, children, ...props }, ref) => {
+    const frame = useContext(FrameContext);
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const mainClass = usePrefixedClassNames('app-frame-main');
+    if (frame)
+        warnOnUnreadId('Main', rest.id, frame.mainId);
+    return (jsx("main", { ref: ref, tabIndex: -1, className: classNames(mainClass, bulmaHelperClasses, className), ...rest, id: rest.id || frame?.mainId, children: children }));
+});
+AppFrameMain.displayName = 'AppFrame.Main';
+/**
+ * Content beside the page in an AppFrame, which moves under it below the breakpoint.
+ *
+ * @function
+ * @param {AppFrameAsideProps} props - Props for AppFrame.Aside.
+ * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<aside>`.
+ * @returns {JSX.Element} The rendered aside.
+ */
+const AppFrameAside = forwardRef(({ className, style, width, children, ...props }, ref) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const asideClass = usePrefixedClassNames('app-frame-aside');
+    const asideStyle = width === undefined
+        ? style
+        : {
+            ...style,
+            '--bulma-app-frame-aside-width': cssLength(width),
+        };
+    return (jsx("aside", { ref: ref, className: classNames(asideClass, bulmaHelperClasses, className), style: asideStyle, ...rest, children: children }));
+});
+AppFrameAside.displayName = 'AppFrame.Aside';
+/**
+ * The bottom of an AppFrame, under the page.
+ *
+ * @function
+ * @param {AppFrameFooterProps} props - Props for AppFrame.Footer.
+ * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<footer>`.
+ * @returns {JSX.Element} The rendered footer.
+ */
+const AppFrameFooter = forwardRef(({ className, children, ...props }, ref) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const footerClass = usePrefixedClassNames('app-frame-footer');
+    return (jsx("footer", { ref: ref, className: classNames(footerClass, bulmaHelperClasses, className), ...rest, children: children }));
+});
+AppFrameFooter.displayName = 'AppFrame.Footer';
+/**
+ * The button that opens the drawer, or collapses the column from the breakpoint up: Navbar.Burger, wired to the frame.
+ *
+ * @function
+ * @param {AppFrameBurgerProps} props - Props for AppFrame.Burger.
+ * @param {React.Ref<HTMLButtonElement>} ref - Forwarded ref to the `<button>`.
+ * @returns {JSX.Element} The rendered burger.
+ */
+const AppFrameBurger = forwardRef(({ className, onClick, ...props }, ref) => {
+    // Outside a frame it's a Navbar.Burger that controls nothing.
+    const frame = useContext(FrameContext);
+    const burgerClass = usePrefixedClassNames('app-frame-burger');
+    const state = frame?.state;
+    // Until the frame knows whether the nav is a drawer, the burger says
+    // nothing it can't stand behind: no `aria-expanded`, and its bars. It can't
+    // act before then anyway, since that's before hydration. Outside a frame
+    // it's a plain Navbar.Burger.
+    const known = !!frame?.modeKnown;
+    const expanded = known && !!state && (state.isDrawer ? state.navOpen : !state.navCollapsed);
+    return (jsx(NavbarBurger, { ref: ref, ...props, className: classNames(burgerClass, className), "aria-label": props['aria-label'] || frame?.labels.burger, active: expanded, "aria-expanded": frame && !known ? null : expanded, "aria-controls": state?.navId, onClick: e => {
+            onClick?.(e);
+            if (e.defaultPrevented || !frame)
+                return;
+            // Safari, and Firefox on a Mac, don't focus a button that's pressed.
+            // Focused, it's the element the drawer hands focus back to.
+            e.currentTarget.focus();
+            frame.state.toggleNav();
+        } }));
+});
+AppFrameBurger.displayName = 'AppFrame.Burger';
+const isMain = (child) => React.isValidElement(child) && child.type === AppFrameMain;
+const isNav = (child) => React.isValidElement(child) && child.type === AppFrameNav;
+/**
+ * The `AppFrame` component lays out an app's pages: a header across the top, a navigation column down the side, the page, and an aside and a footer, with the nav a drawer behind a burger on narrow screens.
+ *
+ * The header and the column stick while the document scrolls, and a skip
+ * link comes first. The layout is CSS, so the server renders it as the
+ * browser does. It holds two states, each yours to control: whether the
+ * drawer is open, and whether the column is collapsed. `AppFrame.Burger`
+ * and `useAppFrame()` toggle whichever applies at the current width.
+ *
+ * @function
+ * @param {AppFrameProps} props - Props for the AppFrame component.
+ * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the root `<div>`.
+ * @returns {JSX.Element} The rendered frame.
+ *
+ * @example
+ * <AppFrame>
+ *   <AppFrame.Header>
+ *     <Navbar aria-label="Site">
+ *       <Navbar.Brand>
+ *         <Navbar.Item href="/">Acme</Navbar.Item>
+ *         <AppFrame.Burger />
+ *       </Navbar.Brand>
+ *     </Navbar>
+ *   </AppFrame.Header>
+ *   <AppFrame.Nav>
+ *     <Menu>…</Menu>
+ *   </AppFrame.Nav>
+ *   <AppFrame.Main>…</AppFrame.Main>
+ * </AppFrame>
+ */
+const AppFrameRoot = forwardRef(({ className, textColor, bgColor, breakpoint = 'desktop', navOpen: navOpenProp, defaultNavOpen = false, onNavOpenChange, navCollapsed: navCollapsedProp, defaultNavCollapsed = false, onNavCollapsedChange, skipLink = true, labels, children, ...props }, ref) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses({
+        color: textColor,
+        backgroundColor: bgColor,
+        ...props,
+    });
+    const rootRef = useRef(null);
+    const rootCleanupRef = useRef(null);
+    const rootRefs = useCallback((node) => setRefs(node, rootRef, ref, rootCleanupRef), [ref]);
+    const [openState, setOpenState] = useState(defaultNavOpen);
+    const [collapsedState, setCollapsedState] = useState(defaultNavCollapsed);
+    const navOpen = navOpenProp ?? openState;
+    const navCollapsed = navCollapsedProp ?? collapsedState;
+    const openControlled = navOpenProp !== undefined;
+    const collapsedControlled = navCollapsedProp !== undefined;
+    const onNavOpenChangeRef = useLatestRef(onNavOpenChange);
+    const onNavCollapsedChangeRef = useLatestRef(onNavCollapsedChange);
+    const setNavOpen = useCallback((open) => {
+        onNavOpenChangeRef.current?.(open);
+        if (!openControlled)
+            setOpenState(open);
+    }, [openControlled, onNavOpenChangeRef]);
+    const setNavCollapsed = useCallback((collapsed) => {
+        onNavCollapsedChangeRef.current?.(collapsed);
+        if (!collapsedControlled)
+            setCollapsedState(collapsed);
+    }, [collapsedControlled, onNavCollapsedChangeRef]);
+    // The layout switches in the stylesheet. The script needs the width
+    // only to know which state the burger toggles, and to close the drawer
+    // once the window is at or past the breakpoint.
+    const wide = useBulmaBreakpoint(breakpoint);
+    const isDrawer = wide === false;
+    const isWide = wide === true;
+    useEffect(() => {
+        // eslint-disable-next-line react-hooks/set-state-in-effect -- the width is known only in the browser, and the drawer closes in answer to it
+        if (isWide && navOpen)
+            setNavOpen(false);
+    }, [isWide, navOpen, setNavOpen]);
+    const toggleNav = useCallback(() => {
+        if (isDrawer)
+            setNavOpen(!navOpen);
+        else
+            setNavCollapsed(!navCollapsed);
+    }, [isDrawer, navOpen, navCollapsed, setNavOpen, setNavCollapsed]);
+    // The ids of the parts the skip link and the burger point at, read off
+    // the children so the server renders them too.
+    const baseId = useId();
+    const parts = flattenChildren(children);
+    const mainId = parts.find(isMain)?.props.id || `${baseId}-main`;
+    const navId = parts.find(isNav)?.props.id || `${baseId}-nav`;
+    const { skipLink: skipText, nav, closeNav, burger } = labels ?? {};
+    const value = useMemo(() => ({
+        state: {
+            navOpen,
+            setNavOpen,
+            navCollapsed,
+            setNavCollapsed,
+            isDrawer,
+            toggleNav,
+            navId,
+        },
+        labels: {
+            skipLink: skipText || 'Skip to main content',
+            nav: nav || 'Sections',
+            closeNav: closeNav || 'Close navigation',
+            burger: burger || undefined,
+        },
+        mainId,
+        modeKnown: wide !== null,
+    }), [
+        navOpen,
+        setNavOpen,
+        navCollapsed,
+        setNavCollapsed,
+        isDrawer,
+        toggleNav,
+        navId,
+        skipText,
+        nav,
+        closeNav,
+        burger,
+        mainId,
+        wide,
+    ]);
+    // Its header and footer are the page's banner and contentinfo only
+    // outside `main` and sectioning content, as HTML-AAM maps them.
+    useEffect(() => {
+        const host = rootRef.current?.parentElement?.closest('main, article, aside, nav, section');
+        if (host) {
+            warnOnce('AppFrame:nested', `[bestax-bulma] <AppFrame> sits inside a <${host.localName}>, where ` +
+                "its header and footer are no longer the page's banner and " +
+                'contentinfo landmarks. Put AppFrame at the top of the page.');
+        }
+    }, []);
+    const rootClass = usePrefixedClassNames('app-frame', {
+        [`is-${breakpoint}`]: true,
+        'is-nav-collapsed': navCollapsed,
+    });
+    const skipClass = usePrefixedClassNames('app-frame-skip-link');
+    return (jsxs("div", { ref: rootRefs, className: classNames(rootClass, bulmaHelperClasses, className), ...rest, children: [skipLink && (jsx("a", { className: skipClass, href: `#${mainId}`, children: value.labels.skipLink })), jsx(FrameContext.Provider, { value: value, children: children })] }));
+});
+/**
+ * The frame's state, for a control of your own inside it: whether the
+ * drawer is open and the column collapsed, setters that go through the
+ * frame's callbacks, and `toggleNav()`, which does what the burger does.
+ * Outside an AppFrame it's `null`, as the library's other context hooks
+ * are, so a control that can sit outside one renders a fallback or nothing.
+ *
+ * @function useAppFrame
+ * @returns The frame's state, or `null` outside an AppFrame.
+ */
+function useAppFrame() {
+    return useContext(FrameContext)?.state ?? null;
+}
+const AppFrame = withSubComponents(AppFrameRoot, {
+    Header: AppFrameHeader,
+    Nav: AppFrameNav,
+    Main: AppFrameMain,
+    Aside: AppFrameAside,
+    Footer: AppFrameFooter,
+    Burger: AppFrameBurger,
+}, 'AppFrame');
+
+export { AppFrame, AppFrameAside, AppFrameBurger, AppFrameFooter, AppFrameHeader, AppFrameMain, AppFrameNav, useAppFrame };
+//# sourceMappingURL=AppFrame.js.map