@allxsmith/bestax-bulma 5.67.2 → 5.67.3

package/dist/esm/form/TreeSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeSelect.js","sources":["../../../src/form/TreeSelect.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { usePrefixedClassNames } from '../helpers/classNames';\nimport type { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { useLocaleMatcher } from '../helpers/localeFormat';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\nimport {\n  TreeViewHiddenContext,\n  readChecks,\n  toggledList,\n} from '../helpers/useTreeView';\nimport { useControlled } from '../helpers/useControlled';\nimport {\n  checkRecords,\n  checkedByStrategy,\n  childNodes,\n  indexTree,\n  isParentNode,\n  nodeLabel,\n  searchTree,\n} from '../helpers/treeData';\nimport { TreeView } from '../components/TreeView';\nimport type { FormFieldProps } from './fieldProps';\nimport { useFieldsetDisabled } from './FormContext';\nimport type { PickerPosition } from './_pickerInternals/pickerTypes';\nimport { DialogSelect } from './_selectInternals/DialogSelect';\nimport { ValueTags, tagIds } from './_selectInternals/ValueTags';\n\n/**\n * One node in a TreeSelect's `data`: Combobox's item fields plus\n * TreeView.Item's, with `children` for the nodes under it.\n */\nexport interface TreeItemData {\n  /** **Required.** What the value holds and `name` posts. Unique in the whole tree. */\n  value: string;\n  /** What the row, the field and the tags show, and what search matches. The `value` when it's left out. */\n  label?: string;\n  /** Reachable, but never picked, checked, opened or closed. */\n  disabled?: boolean;\n  /** A picture before the label: an `Icon` name, or a node. Hidden from assistive tech. */\n  icon?: React.ReactNode;\n  /** The nodes under this one. */\n  children?: TreeItemData[];\n  /** Shows the node as a parent before its children are known, for a branch that loads when it opens. */\n  hasChildren?: boolean;\n  /** Its children are on their way: an open branch ends in a row that says so, and the live region says it too. */\n  isLoading?: boolean;\n  /** Its children didn't load: an open branch ends in this message, with a Retry button when there's an `onRetry`. */\n  loadError?: React.ReactNode;\n  /** Called by the Retry button on a failed load's row. Set `isLoading` while the retry runs. */\n  onRetry?: () => void;\n}\n\n/** What a checked branch puts in the value a check makes. */\nexport type TreeSelectCheckedStrategy = 'child' | 'parent' | 'all';\n\n/** The visible and accessible strings, in your app's language. */\nexport interface TreeSelectLabels {\n  /**\n   * Names the panel and the tree in it.\n   * @defaultValue the field's label\n   */\n  choose?: string;\n  /**\n   * Names the search box.\n   * @defaultValue 'Search'\n   */\n  search?: string;\n  /**\n   * Names the clear button.\n   * @defaultValue 'Clear'\n   */\n  clear?: string;\n  /**\n   * What a loading branch's row says, as on TreeView.\n   * @defaultValue 'Loading…'\n   */\n  loading?: string;\n  /**\n   * The Retry button's text on a failed load's row, as on TreeView.\n   * @defaultValue 'Retry'\n   */\n  retry?: string;\n  /**\n   * What the live region says when an open branch starts loading, built\n   * from its name, as on TreeView.\n   * @defaultValue name => `Loading ${name}`\n   */\n  loadingAnnouncement?: (name: string) => string;\n  /**\n   * What the live region says when that load finishes, as on TreeView.\n   * @defaultValue name => `${name} loaded`\n   */\n  loadedAnnouncement?: (name: string) => string;\n}\n\n/**\n * What every TreeSelect takes. The helper props and the other attributes\n * land on the root `<div>`, as Combobox's do, and the `ref` on the field.\n */\ninterface TreeSelectBaseProps\n  extends\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      'color' | 'onChange' | 'defaultValue' | 'children'\n    >,\n    Omit<BulmaClassesProps, 'color'>,\n    FormFieldProps {\n  /** **Required.** The tree, as nodes nested through `children`. */\n  data: TreeItemData[];\n  /**\n   * The field's label, which names the field through `htmlFor`, and the\n   * panel and the tree in it through `aria-labelledby`. Dropped inside an\n   * outer `Field`, whose label names them instead.\n   */\n  label?: React.ReactNode;\n  /** The field's `id`, which the label then points at. The panel's is this one with `-panel` after it. */\n  id?: string;\n  /** Names the field, and the panel and the tree, in place of a `label`. */\n  'aria-label'?: string;\n  /** The ids of what names the field, and the panel and the tree, in place of a `label`. */\n  'aria-labelledby'?: string;\n  /** The ids of what describes the field, ahead of the tags. */\n  'aria-describedby'?: string;\n  /** The open branches' values when you hold the state, as TreeView's `expanded`. */\n  expanded?: string[];\n  /** The branches open to begin with, when TreeSelect holds its own state. */\n  defaultExpanded?: string[];\n  /**\n   * Called with the new list whenever a branch opens or closes, opening the\n   * panel on the picked item's branch included. Fetch a lazy branch's\n   * children from here. The branches a search opens aren't in it.\n   */\n  onExpandedChange?: (expanded: string[]) => void;\n  /** Whether the panel is open, controlled: opening and closing then only call `onOpenChange`. */\n  open?: boolean;\n  /** The panel is open to begin with. */\n  defaultOpen?: boolean;\n  /** Called with the new state when the panel opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Puts a search box at the top of the panel. It matches labels, keeps a\n   * match's ancestors and the nodes under it, and opens every branch with a\n   * match. A printable key on the field opens the panel with it in the box,\n   * and the search empties when the panel closes.\n   */\n  searchable?: boolean;\n  /** The search text when you hold the state. */\n  query?: string;\n  /** The search text to begin with. */\n  defaultQuery?: string;\n  /** Called with the search text as it changes. */\n  onQueryChange?: (query: string) => void;\n  /**\n   * Whether a node matches the search, in place of the locale-aware match on\n   * its label. It's handed the search text trimmed, the node, and its path\n   * from the top node down, the node last, as Cascader's `filter` is. A\n   * match's ancestors stay either way. The search runs again when the search\n   * text or `data` changes, not when only this does, so one written inline\n   * costs nothing.\n   */\n  filter?: (query: string, item: TreeItemData, path: TreeItemData[]) => boolean;\n  /** What the panel shows when the search matches nothing, such as \"No folders match\". Announced once. */\n  empty?: React.ReactNode;\n  /** Renders a row's content in place of its label. The field and the tags still show the label. */\n  itemTemplate?: (item: TreeItemData) => React.ReactNode;\n  /** What the field shows while nothing is picked. */\n  placeholder?: string;\n  /** A form field name. A hidden input posts the value, or one per value in the checkbox modes. */\n  name?: string;\n  /** The id of the form the hidden inputs belong to, when it isn't an ancestor. */\n  form?: string;\n  /**\n   * A value is needed: the field is `aria-required`, and the form won't\n   * submit while nothing is picked. The browser's message points at the\n   * field, which shows focus, and the next key goes to it.\n   */\n  required?: boolean;\n  /** The field can't be used: it can't be focused or opened, its tags lose their buttons, and its hidden inputs don't post. */\n  disabled?: boolean;\n  /**\n   * Shows a clear button at the field's inline end while something it can\n   * take off is picked. It leaves checked disabled items, which no control\n   * unchecks.\n   */\n  clearable?: boolean;\n  /** Bulma color modifier for the field. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** The field's size, which the tree in the panel follows. */\n  size?: 'small' | 'medium' | 'large';\n  /** Rounds the field's corners (Bulma's `is-rounded`). */\n  isRounded?: boolean;\n  /**\n   * Where the panel opens against the field, as on the pickers. Left out, it\n   * opens below and lines up with the field's start edge, which is its right\n   * edge on a right-to-left page. A corner you pass stays physical, so\n   * `bottom-left` lines up the left edges either way.\n   * @defaultValue 'bottom-left'\n   */\n  position?: PickerPosition;\n  /** Renders the panel through a portal, into a `ConfigProvider`'s `portalContainer`, `document.body` by default. */\n  appendToBody?: boolean;\n  /** The visible and accessible strings, in your app's language. */\n  labels?: TreeSelectLabels;\n}\n\n/** Props for a TreeSelect that picks one item. */\nexport interface TreeSelectSingleProps extends TreeSelectBaseProps {\n  /**\n   * `'single'`: one item, picked with Enter, Space or a click on its row.\n   * `'checkbox'`: any number, with a box on every item. A check reaches every\n   * enabled item under it, and a parent with some of them checked is mixed.\n   * `'checkbox-independent'`: any number, each box checking its own item, so\n   * a parent means the parent alone (Mantine's and Ant Design's\n   * `checkStrictly`). The checkbox modes show the value as tags.\n   */\n  selectionMode?: 'single';\n  /**\n   * The value when you hold the state: in `'single'` the picked item's\n   * value, or `null` for none, and in the checkbox modes the checked values.\n   * In `'checkbox'` a parent's value checks its whole branch, so the list any\n   * `checkedStrategy` gives checks the same boxes.\n   */\n  value?: string | null;\n  /** The value to begin with, when TreeSelect holds its own state: a value or `null`, or a list in the checkbox modes. */\n  defaultValue?: string | null;\n  /**\n   * Called with the new value: in `'single'` the picked item's value, or\n   * `null` when it's cleared, and in the checkbox modes the new list, after a\n   * check, an uncheck, a tag's button or the clear button, each shaped by\n   * `checkedStrategy`. A reset of the field's form calls it too, with\n   * `defaultValue` as it was given, or with `null` or `[]` when you hold\n   * the value, for you to set.\n   */\n  onChange?: (value: string | null) => void;\n  /**\n   * A parent's row picks the parent. `false` makes the row, Enter and Space\n   * open it instead, so only leaves are picked.\n   * @defaultValue true\n   */\n  parentsSelectable?: boolean;\n  /**\n   * Closes the panel after a pick and puts focus back on the field.\n   * @defaultValue true\n   */\n  closeOnSelect?: boolean;\n  /** Read with the checkbox modes only. */\n  checkedStrategy?: never;\n  /** Read with the checkbox modes only. */\n  ariaCloseLabel?: never;\n}\n\n/** Props for a TreeSelect with a box on every item. */\nexport interface TreeSelectCheckboxProps extends TreeSelectBaseProps {\n  /**\n   * `'checkbox'`: a check reaches every enabled item under it, and a parent\n   * with some of them checked is mixed. `'checkbox-independent'`: each box\n   * checks its own item, so a parent means the parent alone.\n   */\n  selectionMode: 'checkbox' | 'checkbox-independent';\n  /**\n   * The checked values when you hold the state. In `'checkbox'`, a parent's\n   * value checks its whole branch, so the list any `checkedStrategy` gives\n   * checks the same boxes.\n   */\n  value?: string[];\n  /** The values checked to begin with, when TreeSelect holds its own state. */\n  defaultValue?: string[];\n  /**\n   * Called with the new list after a check, an uncheck, a tag's button or\n   * the clear button, shaped by `checkedStrategy`, and after a reset of the\n   * field's form, with `defaultValue` as given, or `[]` when you hold the\n   * value.\n   */\n  onChange?: (value: string[]) => void;\n  /**\n   * What a checked branch puts in the value, in `'checkbox'`: `'child'` its\n   * leaves, `'parent'` its topmost checked item, `'all'` every checked item,\n   * parents included. A checked disabled item is in all three, since only\n   * its own value checks it. It shapes the value a check, an uncheck, a\n   * tag's button or the clear button makes, which `onChange` reports, and\n   * not `defaultValue`, a value you pass or the one a form reset puts back.\n   * The tags and the hidden\n   * inputs show the value as it's held, so a value you pass shows as you\n   * pass it, and a branch that loads later changes nothing the form posts.\n   * `'checkbox-independent'` always reports exactly the checked items.\n   * @defaultValue 'child'\n   */\n  checkedStrategy?: TreeSelectCheckedStrategy;\n  /** Names each tag's button, in place of \"Remove\" and the item's label, as on Combobox. */\n  ariaCloseLabel?: string;\n  /** Read with `'single'` only. */\n  parentsSelectable?: never;\n  /** Read with `'single'` only: the panel stays open while boxes are checked. */\n  closeOnSelect?: never;\n}\n\n/**\n * Props for the TreeSelect component. The helper props and the other\n * attributes land on the `div.tree-select` around the field, and the `ref`\n * on the field. It renders the `Field` and the label itself, unless an outer\n * `Field` already does.\n *\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the field, the read-only `<input role=\"combobox\">`.\n */\nexport type TreeSelectProps = TreeSelectSingleProps | TreeSelectCheckboxProps;\n\nconst NOTHING_HIDDEN: ReadonlySet<string> = new Set();\nconst noMatches = [{ id: 'empty' }];\nconst nothingToSay: Array<{ id: string }> = [];\n/** What takes focus as the panel opens. */\nconst INITIAL_FOCUS = '[data-initial-focus]';\n\n/** One value or several, as a list. */\nconst asList = (value: string | string[] | null | undefined): string[] =>\n  value == null ? [] : Array.isArray(value) ? value : [value];\n\n/** Whether two lists hold the same values, whatever their order and repeats. */\nconst sameValues = (a: string[], b: string[]): boolean => {\n  const inA = new Set(a);\n  const inB = new Set(b);\n  return inA.size === inB.size && [...inA].every(value => inB.has(value));\n};\n\n/** The list with every value of `more` it doesn't have added at the end. */\nconst withAll = (list: string[], more: string[]): string[] => [\n  ...list,\n  ...more.filter(value => !list.includes(value)),\n];\n\n/**\n * The `TreeSelect` component is a form field whose options are a tree, such as categories, places or teams: it opens a panel holding a real `TreeView`, picks one item or checks a branch at a time, and searches labels.\n *\n * The field is a read-only `role=\"combobox\"` that opens a dialog, wired as\n * DateInput's is, so focus moves into the tree for real and the tree keeps\n * TreeView's keys, type-ahead and spoken output. The tree is given as `data`,\n * so the field and the tags can name what's picked while the panel is shut,\n * and on the server.\n *\n * `selectionMode` picks the kind. `'single'` picks one item and closes. With\n * `'checkbox'`, a check reaches every enabled item under it, closed or hidden\n * by a search, and `checkedStrategy` decides what the value holds: the\n * leaves, the topmost checked items or every one. With\n * `'checkbox-independent'`, each box is its own item's, so a parent means\n * itself alone (Mantine's and Ant Design's `checkStrictly`). The value shows\n * as tags under the field.\n *\n * A value no node has is kept and shown as it is, with a warning in\n * development, so a value under a branch that hasn't loaded survives until\n * it does.\n *\n * @function\n * @param {TreeSelectProps} props - Props for the TreeSelect component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the field.\n * @returns {JSX.Element} The field, its tags and its panel, in a `Field` with the label unless one is around it.\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/combobox/ | APG Combobox Pattern}\n *\n * @example\n * <TreeSelect\n *   label=\"Save to\"\n *   data={[\n *     { value: 'docs', label: 'Documents', children: [{ value: 'invoices', label: 'Invoices' }] },\n *     { value: 'photos', label: 'Photos' },\n *   ]}\n *   searchable\n * />\n *\n * @example\n * <TreeSelect label=\"Regions\" selectionMode=\"checkbox\" checkedStrategy=\"parent\" data={regions} />\n */\nexport const TreeSelect = forwardRef<HTMLInputElement, TreeSelectProps>(\n  (props, ref) => {\n    const {\n      data,\n      expanded: expandedProp,\n      defaultExpanded = [],\n      onExpandedChange,\n      open: openProp,\n      defaultOpen = false,\n      onOpenChange,\n      searchable = false,\n      query: queryProp,\n      defaultQuery = '',\n      onQueryChange,\n      filter,\n      empty,\n      itemTemplate,\n      disabled: disabledProp,\n      clearable = false,\n      size,\n      labels,\n      selectionMode = 'single',\n      value: valueProp,\n      defaultValue,\n      // Called below through `props`, which knows which value it takes.\n      onChange: _onChange,\n      parentsSelectable = true,\n      closeOnSelect = true,\n      checkedStrategy = 'child',\n      ariaCloseLabel,\n      ...rest\n    } = props;\n    const disabled = useFieldsetDisabled(disabledProp);\n    const single = selectionMode === 'single';\n    const cascade = selectionMode === 'checkbox';\n\n    const index = useMemo(() => indexTree(data), [data]);\n    const records = useMemo(() => checkRecords(index), [index]);\n    const labelFor = (value: string) => {\n      const entry = index.get(value);\n      return entry ? nodeLabel(entry.node) : value;\n    };\n\n    // The value, as a list: none or one in `single`.\n    const [held, setHeld] = useControlled<string | string[] | null>(\n      valueProp,\n      defaultValue ?? null\n    );\n    const listed = asList(held);\n    const change = (next: string[]) => {\n      const value = single ? (next[0] ?? null) : next;\n      setHeld(value);\n      // The mode decides which of the two `onChange` takes.\n      const report = props.onChange as\n        ((value: string | string[] | null) => void) | undefined;\n      report?.(value);\n    };\n    // What the field, the tags and the hidden inputs show: the value as it's\n    // held. `checkedStrategy` shapes a new value as a check makes it, so a\n    // branch that loads later changes nothing the form posts.\n    const picked = single ? listed.slice(0, 1) : Array.from(new Set(listed));\n\n    const unknown = picked.find(value => !index.has(value));\n    useEffect(() => {\n      if (unknown !== undefined) {\n        warnOnce(\n          'TreeSelect:unknown-value',\n          `[bestax-bulma] <TreeSelect> was given the value \"${unknown}\", ` +\n            'which no node in its data has. It is kept and shown as it is, ' +\n            'as it should be for a node under a branch that has not loaded ' +\n            'yet. Otherwise, check the value against the data.'\n        );\n      }\n    }, [unknown]);\n\n    const [expanded, setExpanded] = useControlled(\n      expandedProp,\n      defaultExpanded\n    );\n    const changeExpanded = (next: string[]) => {\n      setExpanded(next);\n      onExpandedChange?.(next);\n    };\n\n    // The picked item focus goes to: the first in the tree's order.\n    const pickedSet = new Set(picked);\n    const target = Array.from(index.keys()).find(value => pickedSet.has(value));\n\n    const [query, setQueryState] = useControlled(queryProp, defaultQuery);\n    const setQuery = (next: string) => {\n      if (next === query) return;\n      setQueryState(next);\n      onQueryChange?.(next);\n    };\n\n    const [isOpen, setOpenState] = useControlled(openProp, defaultOpen);\n    const setOpen = (next: boolean) => {\n      if (next === isOpen) return;\n      if (next) {\n        // Opening shows the picked item, its branch open.\n        const path = (target !== undefined && index.get(target)?.path) || [];\n        if (path.some(value => !expanded.includes(value))) {\n          changeExpanded(withAll(expanded, path));\n        }\n      } else {\n        setQuery('');\n      }\n      setOpenState(next);\n      onOpenChange?.(next);\n    };\n\n    const matchText = useLocaleMatcher();\n    const typed = searchable ? query.trim() : '';\n    // Every item reads the hidden set, so it's only built again when the\n    // search text or the data changes.\n    const search = useMemo(\n      () =>\n        typed\n          ? searchTree(data, (node, path) => {\n              if (filter) return filter(typed, node, path);\n              const text = nodeLabel(node);\n              return matchText\n                ? matchText(text, typed)\n                : text.toLowerCase().includes(typed.toLowerCase());\n            })\n          : null,\n      // `filter` is read as it is when the text or the data changes: one\n      // written inline is a new function every render, and listing it would\n      // search again on each.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [data, typed, matchText]\n    );\n    // The branches a search opened that were closed during it, for the\n    // search text they were closed under: any new text, from the box or\n    // from a held `query`, starts over.\n    const [searchClosed, setSearchClosed] = useState({\n      query: typed,\n      values: [] as string[],\n    });\n    if (searchClosed.query !== typed) {\n      setSearchClosed({ query: typed, values: [] });\n    }\n    const closedHere = searchClosed.query === typed ? searchClosed.values : [];\n    // The branches a search opens show open over the ones you opened, and\n    // close again once it's cleared.\n    const forced = search\n      ? search.open.filter(value => !closedHere.includes(value))\n      : [];\n    const shownExpanded = withAll(expanded, forced);\n    // TreeView's click on a row selects it and opens it. A pick by click, as\n    // a pick by Enter, only picks, so the open the tree asks for right after\n    // one on a parent is dropped, and a lazy parent isn't fetched to be\n    // picked.\n    const clickPickedRef = useRef(false);\n    const onTreeExpandedChange = (next: string[]) => {\n      if (clickPickedRef.current) {\n        clickPickedRef.current = false;\n        return;\n      }\n      const closed = shownExpanded.filter(value => !next.includes(value));\n      const opened = next.filter(value => !shownExpanded.includes(value));\n      const closedForced = closed.filter(value => forced.includes(value));\n      if (closedForced.length > 0) {\n        setSearchClosed({\n          query: typed,\n          values: [...closedHere, ...closedForced],\n        });\n      }\n      if (opened.length > 0 || closed.some(value => expanded.includes(value))) {\n        changeExpanded([\n          ...expanded.filter(value => !closed.includes(value)),\n          ...opened,\n        ]);\n      }\n    };\n\n    // Whether an item is on the page with the panel open: every branch\n    // above it open, and the search not hiding it.\n    const visible = (value: string) =>\n      !search?.hidden.has(value) &&\n      index.get(value)!.path.every(above => shownExpanded.includes(above));\n    const focusTarget =\n      target !== undefined && visible(target)\n        ? target\n        : data.find(node => visible(node.value))?.value;\n\n    // Picking in `single`. TreeView shows `selected`, held here, and the\n    // picks are made from the rows' own keys and clicks, so a parent can\n    // open instead and a pick of the picked item still closes.\n    const pickable = (node: TreeItemData) =>\n      !node.disabled && (parentsSelectable || !isParentNode(node));\n    const pick = (value: string) => {\n      if (listed.length !== 1 || listed[0] !== value) change([value]);\n      if (closeOnSelect) setOpen(false);\n    };\n    const toggleClass = usePrefixedClassNames('tree-view-toggle');\n    const rowHandlers = (node: TreeItemData) =>\n      single\n        ? {\n            onKeyDown: (event: React.KeyboardEvent<HTMLLIElement>) => {\n              if (\n                event.target !== event.currentTarget ||\n                event.repeat ||\n                event.altKey ||\n                event.ctrlKey ||\n                event.metaKey ||\n                (event.key !== 'Enter' && event.key !== ' ')\n              ) {\n                return;\n              }\n              if (pickable(node)) {\n                pick(node.value);\n              } else if (!node.disabled && isParentNode(node)) {\n                // TreeView leaves a key that's been used alone.\n                event.preventDefault();\n                onTreeExpandedChange(\n                  shownExpanded.includes(node.value)\n                    ? shownExpanded.filter(value => value !== node.value)\n                    : [...shownExpanded, node.value]\n                );\n              }\n            },\n            onClick: (event: React.MouseEvent<HTMLLIElement>) => {\n              const item = event.currentTarget;\n              const target = event.target as Element;\n              // A click in this item's own row, where TreeView reads one,\n              // not one in the group of items inside it, and not on its\n              // chevron, which only opens it.\n              const inRow =\n                target === item || item.firstElementChild!.contains(target);\n              const onChevron =\n                isParentNode(node) && !!target.closest(`.${toggleClass}`);\n              if (inRow && !onChevron && pickable(node)) {\n                // TreeView opens a parent it's handed this click on, in\n                // this same click: the flag goes once the click is over.\n                clickPickedRef.current = isParentNode(node);\n                queueMicrotask(() => {\n                  clickPickedRef.current = false;\n                });\n                pick(node.value);\n              }\n            },\n          }\n        : undefined;\n\n    const renderNode = (node: TreeItemData): React.ReactNode => (\n      <TreeView.Item\n        key={node.value}\n        value={node.value}\n        label={itemTemplate ? itemTemplate(node) : nodeLabel(node)}\n        icon={node.icon}\n        hasChildren={node.hasChildren}\n        isLoading={node.isLoading}\n        loadError={node.loadError}\n        onRetry={node.onRetry}\n        disabled={node.disabled}\n        data-initial-focus={\n          !searchable && node.value === focusTarget ? '' : undefined\n        }\n        {...rowHandlers(node)}\n      >\n        {childNodes(node).map(renderNode)}\n      </TreeView.Item>\n    );\n\n    // In `checkbox`, TreeView reports every checked item, read here into\n    // the list `checkedStrategy` gives.\n    const shaped = (next: string[]) =>\n      cascade ? checkedByStrategy(records, next, checkedStrategy) : next;\n    const onCheckedChange = (next: string[]) => change(shaped(next));\n    // Every item's check state, read once a render, which the clear button\n    // and the tags' buttons decide from. Only `checkbox` reads TreeView's\n    // rules: in `checkbox-independent` a listed item is a checked one.\n    const listedKey = JSON.stringify(listed);\n    const checks = useMemo(\n      () => (cascade ? readChecks(records, new Set(listed)) : null),\n      // `listed` by what it holds, since a held list is a new array each\n      // render.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [cascade, records, listedKey]\n    );\n    const isDisabled = (value: string) => !!index.get(value)?.node.disabled;\n    // Read in `checkbox` only, where there are states to read.\n    const isChecked = (value: string) => checks!.states.get(value) === true;\n    // What a control can uncheck. In `checkbox`, that's each checked end no\n    // checked disabled item above it keeps checked, and every item above it,\n    // which takes it along; elsewhere it's each listed item that isn't\n    // disabled. A disabled item is checked only by its own value, so nothing\n    // unchecks it, or what it keeps checked.\n    const uncheckable = new Set<string>();\n    if (checks) {\n      for (const end of checks.ends) {\n        const { path } = index.get(end)!;\n        if (\n          isChecked(end) &&\n          !path.some(above => isDisabled(above) && isChecked(above))\n        ) {\n          uncheckable.add(end);\n          path.forEach(above => uncheckable.add(above));\n        }\n      }\n    } else if (!single) {\n      picked.forEach(value => !isDisabled(value) && uncheckable.add(value));\n    }\n    // A tag's button takes its value off where that changes what's checked,\n    // the way its box would. A value no node has can always go.\n    const removable = (value: string) =>\n      !index.has(value) || (!isDisabled(value) && uncheckable.has(value));\n    const without = (value: string) =>\n      cascade && records.has(value)\n        ? shaped(toggledList(records, listed, value))\n        : listed.filter(item => item !== value);\n    // What the clear button leaves: the checked disabled items, and in\n    // `checkbox` what they keep checked, shaped as a check's value is.\n    const cleared = single\n      ? []\n      : shaped(\n          checks\n            ? Array.from(records.keys()).filter(\n                value => isDisabled(value) && isChecked(value)\n              )\n            : picked.filter(isDisabled)\n        );\n    const canClear = single\n      ? picked.length > 0\n      : uncheckable.size > 0 || picked.some(value => !index.has(value));\n    const inputRef = useRef<HTMLInputElement | null>(null);\n    // A forwarded callback's cleanup, which React 19 lets it return, run on\n    // detach in place of a call with `null`, on React 18 as well.\n    const refCleanupRef = useRef<(() => void) | null>(null);\n    const fieldRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        inputRef.current = node;\n        if (typeof ref === 'function') {\n          if (node === null) {\n            const cleanup = refCleanupRef.current;\n            refCleanupRef.current = null;\n            if (cleanup) cleanup();\n            else ref(null);\n            return;\n          }\n          const cleanup: unknown = ref(node);\n          refCleanupRef.current =\n            typeof cleanup === 'function' ? (cleanup as () => void) : null;\n        } else if (ref) {\n          ref.current = node;\n        }\n      },\n      [ref]\n    );\n    const tagsId = useId();\n    const ids = tagIds(tagsId, picked);\n\n    const searchClass = usePrefixedClassNames('input', 'tree-select-search', {\n      [`is-${size}`]: !!size,\n    });\n    const emptyClass = usePrefixedClassNames('tree-select-empty');\n    const treeRef = useRef<HTMLUListElement>(null);\n    const emptyRef = useRef<HTMLDivElement>(null);\n    const nothingFound = !!search && !search.found;\n    // The region reads the text on screen, whatever `empty` renders.\n    const describeEmpty = useCallback(() => {\n      const node = emptyRef.current;\n      /* istanbul ignore if: it's only announced while it's on screen */\n      if (!node) return null;\n      return spokenText(node);\n    }, []);\n\n    return (\n      <DialogSelect\n        {...rest}\n        component=\"TreeSelect\"\n        rootClass=\"tree-select\"\n        panelClass=\"tree-select-panel\"\n        text={single && picked.length > 0 ? labelFor(picked[0]) : ''}\n        values={single ? [picked[0] ?? ''] : picked}\n        hasValue={picked.length > 0}\n        open={isOpen}\n        onOpenChange={setOpen}\n        onPrintableKey={\n          searchable\n            ? key => {\n                setQuery(key);\n                setOpen(true);\n                return true;\n              }\n            : undefined\n        }\n        onClear={() => change(cleared)}\n        clearable={clearable && canClear}\n        onFormReset={() => {\n          // Back to `defaultValue`, or to nothing for a held value, which\n          // its owner sets from `onChange`.\n          const back = valueProp === undefined ? asList(defaultValue) : [];\n          if (!sameValues(back, listed)) change(back);\n        }}\n        clearLabel={labels?.clear || 'Clear'}\n        chooseLabel={labels?.choose}\n        disabled={disabled}\n        size={size}\n        inputRef={inputRef}\n        fieldRef={fieldRef}\n        describedBy={single ? undefined : ids.join(' ')}\n        below={\n          single ? undefined : (\n            <ValueTags\n              values={picked}\n              ids={ids}\n              labelFor={labelFor}\n              disabled={disabled}\n              ariaCloseLabel={ariaCloseLabel}\n              removable={removable}\n              onRemove={value => {\n                change(without(value));\n                inputRef.current?.focus();\n              }}\n            />\n          )\n        }\n        initialFocusSelector={INITIAL_FOCUS}\n      >\n        {panelName => (\n          <>\n            {searchable && (\n              <input\n                className={searchClass}\n                type=\"search\"\n                aria-label={labels?.search || 'Search'}\n                autoComplete=\"off\"\n                value={query}\n                data-initial-focus=\"\"\n                onChange={event => setQuery(event.target.value)}\n                onFocus={event => {\n                  // A key that opened the panel is in the box: type after it.\n                  const { length } = event.currentTarget.value;\n                  event.currentTarget.setSelectionRange(length, length);\n                }}\n                onKeyDown={event => {\n                  if (event.key === 'Enter') {\n                    // The search box's Enter would submit the form.\n                    event.preventDefault();\n                  } else if (event.key === 'ArrowDown' && !event.altKey) {\n                    event.preventDefault();\n                    const tree = treeRef.current;\n                    (\n                      tree?.querySelector<HTMLElement>(\n                        '[role=\"treeitem\"][tabindex=\"0\"]'\n                      ) ?? tree?.querySelector<HTMLElement>('[role=\"treeitem\"]')\n                    )?.focus();\n                  }\n                }}\n              />\n            )}\n            {nothingFound ? (\n              empty && (\n                <div className={emptyClass} ref={emptyRef}>\n                  {empty}\n                </div>\n              )\n            ) : (\n              <TreeViewHiddenContext.Provider\n                value={search?.hidden ?? NOTHING_HIDDEN}\n              >\n                <TreeView\n                  {...panelName}\n                  ref={treeRef}\n                  // It scrolls, and Firefox makes a scroller a Tab stop of\n                  // its own: the roving one on its items is the tree's.\n                  tabIndex={-1}\n                  selectionMode={selectionMode}\n                  size={size}\n                  selected={single ? (picked[0] ?? null) : undefined}\n                  checked={single ? undefined : listed}\n                  onCheckedChange={onCheckedChange}\n                  expanded={shownExpanded}\n                  onExpandedChange={onTreeExpandedChange}\n                  loadingLabel={labels?.loading}\n                  retryLabel={labels?.retry}\n                  loadingAnnouncement={labels?.loadingAnnouncement}\n                  loadedAnnouncement={labels?.loadedAnnouncement}\n                >\n                  {data.map(renderNode)}\n                </TreeView>\n              </TreeViewHiddenContext.Provider>\n            )}\n            <StatusRegion\n              items={nothingFound && empty ? noMatches : nothingToSay}\n              describe={describeEmpty}\n            />\n          </>\n        )}\n      </DialogSelect>\n    );\n  }\n);\n\nTreeSelect.displayName = 'TreeSelect';\n\nexport default TreeSelect;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"TreeSelect.js","sources":["../../../src/form/TreeSelect.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { usePrefixedClassNames } from '../helpers/classNames';\nimport type { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { useLocaleMatcher } from '../helpers/localeFormat';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\nimport {\n  TreeViewHiddenContext,\n  readChecks,\n  toggledList,\n} from '../helpers/useTreeView';\nimport { useControlled } from '../helpers/useControlled';\nimport {\n  checkRecords,\n  checkedByStrategy,\n  childNodes,\n  indexTree,\n  isParentNode,\n  nodeLabel,\n  searchTree,\n} from '../helpers/treeData';\nimport { TreeView } from '../components/TreeView';\nimport type { FormFieldProps } from './fieldProps';\nimport { useFieldsetDisabled } from './FormContext';\nimport type { PickerPosition } from './_pickerInternals/pickerTypes';\nimport { DialogSelect } from './_selectInternals/DialogSelect';\nimport { ValueTags, tagIds } from './_selectInternals/ValueTags';\n\n/**\n * One node in a TreeSelect's `data`: Combobox's item fields plus\n * TreeView.Item's, with `children` for the nodes under it.\n */\nexport interface TreeItemData {\n  /** **Required.** What the value holds and `name` posts. Unique in the whole tree. */\n  value: string;\n  /** What the row, the field and the tags show, and what search matches. The `value` when it's left out. */\n  label?: string;\n  /** Reachable, but never picked, checked, opened or closed. */\n  disabled?: boolean;\n  /** A picture before the label: an `Icon` name, or a node. Hidden from assistive tech. */\n  icon?: React.ReactNode;\n  /** The nodes under this one. */\n  children?: TreeItemData[];\n  /** Shows the node as a parent before its children are known, for a branch that loads when it opens. */\n  hasChildren?: boolean;\n  /** Its children are on their way: an open branch ends in a row that says so, and the live region says it too. */\n  isLoading?: boolean;\n  /** Its children didn't load: an open branch ends in this message, with a Retry button when there's an `onRetry`. */\n  loadError?: React.ReactNode;\n  /** Called by the Retry button on a failed load's row. Set `isLoading` while the retry runs. */\n  onRetry?: () => void;\n}\n\n/** What a checked branch puts in the value a check makes. */\nexport type TreeSelectCheckedStrategy = 'child' | 'parent' | 'all';\n\n/** The visible and accessible strings, in your app's language. */\nexport interface TreeSelectLabels {\n  /**\n   * Names the panel and the tree in it.\n   * @defaultValue the field's label\n   */\n  choose?: string;\n  /**\n   * Names the search box.\n   * @defaultValue 'Search'\n   */\n  search?: string;\n  /**\n   * Names the clear button.\n   * @defaultValue 'Clear'\n   */\n  clear?: string;\n  /**\n   * What a loading branch's row says, as on TreeView.\n   * @defaultValue 'Loading…'\n   */\n  loading?: string;\n  /**\n   * The Retry button's text on a failed load's row, as on TreeView.\n   * @defaultValue 'Retry'\n   */\n  retry?: string;\n  /**\n   * What the live region says when an open branch starts loading, built\n   * from its name, as on TreeView.\n   * @defaultValue name => `Loading ${name}`\n   */\n  loadingAnnouncement?: (name: string) => string;\n  /**\n   * What the live region says when that load finishes, as on TreeView.\n   * @defaultValue name => `${name} loaded`\n   */\n  loadedAnnouncement?: (name: string) => string;\n}\n\n/**\n * What every TreeSelect takes. The helper props and the other attributes\n * land on the root `<div>`, as Combobox's do, and the `ref` on the field.\n */\ninterface TreeSelectBaseProps\n  extends\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      'color' | 'onChange' | 'defaultValue' | 'children'\n    >,\n    Omit<BulmaClassesProps, 'color'>,\n    FormFieldProps {\n  /** **Required.** The tree, as nodes nested through `children`. */\n  data: TreeItemData[];\n  /**\n   * The field's label, which names the field through `htmlFor`, and the\n   * panel and the tree in it through `aria-labelledby`. Dropped inside an\n   * outer `Field`, whose label names them instead.\n   */\n  label?: React.ReactNode;\n  /** The field's `id`, which the label then points at. The panel's is this one with `-panel` after it. */\n  id?: string;\n  /** Names the field, and the panel and the tree, in place of a `label`. */\n  'aria-label'?: string;\n  /** The ids of what names the field, and the panel and the tree, in place of a `label`. */\n  'aria-labelledby'?: string;\n  /** The ids of what describes the field, ahead of the tags. */\n  'aria-describedby'?: string;\n  /** The open branches' values when you hold the state, as TreeView's `expanded`. */\n  expanded?: string[];\n  /** The branches open to begin with, when TreeSelect holds its own state. */\n  defaultExpanded?: string[];\n  /**\n   * Called with the new list whenever a branch opens or closes, opening the\n   * panel on the picked item's branch included. Fetch a lazy branch's\n   * children from here. The branches a search opens aren't in it.\n   */\n  onExpandedChange?: (expanded: string[]) => void;\n  /** Whether the panel is open, controlled: opening and closing then only call `onOpenChange`. */\n  open?: boolean;\n  /** The panel is open to begin with. */\n  defaultOpen?: boolean;\n  /** Called with the new state when the panel opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Puts a search box at the top of the panel. It matches labels, keeps a\n   * match's ancestors and the nodes under it, and opens every branch with a\n   * match. A printable key on the field opens the panel with it in the box,\n   * and the search empties when the panel closes.\n   */\n  searchable?: boolean;\n  /** The search text when you hold the state. */\n  query?: string;\n  /** The search text to begin with. */\n  defaultQuery?: string;\n  /** Called with the search text as it changes. */\n  onQueryChange?: (query: string) => void;\n  /**\n   * Whether a node matches the search, in place of the locale-aware match on\n   * its label. It's handed the search text trimmed, the node, and its path\n   * from the top node down, the node last, as Cascader's `filter` is. A\n   * match's ancestors stay either way. The search runs again when the search\n   * text or `data` changes, not when only this does, so one written inline\n   * costs nothing.\n   */\n  filter?: (query: string, item: TreeItemData, path: TreeItemData[]) => boolean;\n  /** What the panel shows when the search matches nothing, such as \"No folders match\". Announced once. */\n  empty?: React.ReactNode;\n  /** Renders a row's content in place of its label. The field and the tags still show the label. */\n  itemTemplate?: (item: TreeItemData) => React.ReactNode;\n  /** What the field shows while nothing is picked. */\n  placeholder?: string;\n  /** A form field name. A hidden input posts the value, or one per value in the checkbox modes. */\n  name?: string;\n  /** The id of the form the hidden inputs belong to, when it isn't an ancestor. */\n  form?: string;\n  /**\n   * A value is needed: the field is `aria-required`, and the form won't\n   * submit while nothing is picked. The browser's message points at the\n   * field, which shows focus, and the next key goes to it.\n   */\n  required?: boolean;\n  /** The field can't be used: it can't be focused or opened, its tags lose their buttons, and its hidden inputs don't post. */\n  disabled?: boolean;\n  /**\n   * Shows a clear button at the field's inline end while something it can\n   * take off is picked. It leaves checked disabled items, which no control\n   * unchecks.\n   */\n  clearable?: boolean;\n  /** Bulma color modifier for the field. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** The field's size, which the tree in the panel follows. */\n  size?: 'small' | 'medium' | 'large';\n  /** Rounds the field's corners (Bulma's `is-rounded`). */\n  isRounded?: boolean;\n  /**\n   * Where the panel opens against the field, as on the pickers. Left out, it\n   * opens below and lines up with the field's start edge, which is its right\n   * edge on a right-to-left page. A corner you pass stays physical, so\n   * `bottom-left` lines up the left edges either way.\n   * @defaultValue 'bottom-left'\n   */\n  position?: PickerPosition;\n  /** Renders the panel through a portal, into a `ConfigProvider`'s `portalContainer`, else the `Modal`, `Dialog` or `Command.Dialog` it's in, else `document.body`. */\n  appendToBody?: boolean;\n  /** The visible and accessible strings, in your app's language. */\n  labels?: TreeSelectLabels;\n}\n\n/** Props for a TreeSelect that picks one item. */\nexport interface TreeSelectSingleProps extends TreeSelectBaseProps {\n  /**\n   * `'single'`: one item, picked with Enter, Space or a click on its row.\n   * `'checkbox'`: any number, with a box on every item. A check reaches every\n   * enabled item under it, and a parent with some of them checked is mixed.\n   * `'checkbox-independent'`: any number, each box checking its own item, so\n   * a parent means the parent alone (Mantine's and Ant Design's\n   * `checkStrictly`). The checkbox modes show the value as tags.\n   */\n  selectionMode?: 'single';\n  /**\n   * The value when you hold the state: in `'single'` the picked item's\n   * value, or `null` for none, and in the checkbox modes the checked values.\n   * In `'checkbox'` a parent's value checks its whole branch, so the list any\n   * `checkedStrategy` gives checks the same boxes.\n   */\n  value?: string | null;\n  /** The value to begin with, when TreeSelect holds its own state: a value or `null`, or a list in the checkbox modes. */\n  defaultValue?: string | null;\n  /**\n   * Called with the new value: in `'single'` the picked item's value, or\n   * `null` when it's cleared, and in the checkbox modes the new list, after a\n   * check, an uncheck, a tag's button or the clear button, each shaped by\n   * `checkedStrategy`. A reset of the field's form calls it too, with\n   * `defaultValue` as it was given, or with `null` or `[]` when you hold\n   * the value, for you to set.\n   */\n  onChange?: (value: string | null) => void;\n  /**\n   * A parent's row picks the parent. `false` makes the row, Enter and Space\n   * open it instead, so only leaves are picked.\n   * @defaultValue true\n   */\n  parentsSelectable?: boolean;\n  /**\n   * Closes the panel after a pick and puts focus back on the field.\n   * @defaultValue true\n   */\n  closeOnSelect?: boolean;\n  /** Read with the checkbox modes only. */\n  checkedStrategy?: never;\n  /** Read with the checkbox modes only. */\n  ariaCloseLabel?: never;\n}\n\n/** Props for a TreeSelect with a box on every item. */\nexport interface TreeSelectCheckboxProps extends TreeSelectBaseProps {\n  /**\n   * `'checkbox'`: a check reaches every enabled item under it, and a parent\n   * with some of them checked is mixed. `'checkbox-independent'`: each box\n   * checks its own item, so a parent means the parent alone.\n   */\n  selectionMode: 'checkbox' | 'checkbox-independent';\n  /**\n   * The checked values when you hold the state. In `'checkbox'`, a parent's\n   * value checks its whole branch, so the list any `checkedStrategy` gives\n   * checks the same boxes.\n   */\n  value?: string[];\n  /** The values checked to begin with, when TreeSelect holds its own state. */\n  defaultValue?: string[];\n  /**\n   * Called with the new list after a check, an uncheck, a tag's button or\n   * the clear button, shaped by `checkedStrategy`, and after a reset of the\n   * field's form, with `defaultValue` as given, or `[]` when you hold the\n   * value.\n   */\n  onChange?: (value: string[]) => void;\n  /**\n   * What a checked branch puts in the value, in `'checkbox'`: `'child'` its\n   * leaves, `'parent'` its topmost checked item, `'all'` every checked item,\n   * parents included. A checked disabled item is in all three, since only\n   * its own value checks it. It shapes the value a check, an uncheck, a\n   * tag's button or the clear button makes, which `onChange` reports, and\n   * not `defaultValue`, a value you pass or the one a form reset puts back.\n   * The tags and the hidden\n   * inputs show the value as it's held, so a value you pass shows as you\n   * pass it, and a branch that loads later changes nothing the form posts.\n   * `'checkbox-independent'` always reports exactly the checked items.\n   * @defaultValue 'child'\n   */\n  checkedStrategy?: TreeSelectCheckedStrategy;\n  /** Names each tag's button, in place of \"Remove\" and the item's label, as on Combobox. */\n  ariaCloseLabel?: string;\n  /** Read with `'single'` only. */\n  parentsSelectable?: never;\n  /** Read with `'single'` only: the panel stays open while boxes are checked. */\n  closeOnSelect?: never;\n}\n\n/**\n * Props for the TreeSelect component. The helper props and the other\n * attributes land on the `div.tree-select` around the field, and the `ref`\n * on the field. It renders the `Field` and the label itself, unless an outer\n * `Field` already does.\n *\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the field, the read-only `<input role=\"combobox\">`.\n */\nexport type TreeSelectProps = TreeSelectSingleProps | TreeSelectCheckboxProps;\n\nconst NOTHING_HIDDEN: ReadonlySet<string> = new Set();\nconst noMatches = [{ id: 'empty' }];\nconst nothingToSay: Array<{ id: string }> = [];\n/** What takes focus as the panel opens. */\nconst INITIAL_FOCUS = '[data-initial-focus]';\n\n/** One value or several, as a list. */\nconst asList = (value: string | string[] | null | undefined): string[] =>\n  value == null ? [] : Array.isArray(value) ? value : [value];\n\n/** Whether two lists hold the same values, whatever their order and repeats. */\nconst sameValues = (a: string[], b: string[]): boolean => {\n  const inA = new Set(a);\n  const inB = new Set(b);\n  return inA.size === inB.size && [...inA].every(value => inB.has(value));\n};\n\n/** The list with every value of `more` it doesn't have added at the end. */\nconst withAll = (list: string[], more: string[]): string[] => [\n  ...list,\n  ...more.filter(value => !list.includes(value)),\n];\n\n/**\n * The `TreeSelect` component is a form field whose options are a tree, such as categories, places or teams: it opens a panel holding a real `TreeView`, picks one item or checks a branch at a time, and searches labels.\n *\n * The field is a read-only `role=\"combobox\"` that opens a dialog, wired as\n * DateInput's is, so focus moves into the tree for real and the tree keeps\n * TreeView's keys, type-ahead and spoken output. The tree is given as `data`,\n * so the field and the tags can name what's picked while the panel is shut,\n * and on the server.\n *\n * `selectionMode` picks the kind. `'single'` picks one item and closes. With\n * `'checkbox'`, a check reaches every enabled item under it, closed or hidden\n * by a search, and `checkedStrategy` decides what the value holds: the\n * leaves, the topmost checked items or every one. With\n * `'checkbox-independent'`, each box is its own item's, so a parent means\n * itself alone (Mantine's and Ant Design's `checkStrictly`). The value shows\n * as tags under the field.\n *\n * A value no node has is kept and shown as it is, with a warning in\n * development, so a value under a branch that hasn't loaded survives until\n * it does.\n *\n * @function\n * @param {TreeSelectProps} props - Props for the TreeSelect component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the field.\n * @returns {JSX.Element} The field, its tags and its panel, in a `Field` with the label unless one is around it.\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/combobox/ | APG Combobox Pattern}\n *\n * @example\n * <TreeSelect\n *   label=\"Save to\"\n *   data={[\n *     { value: 'docs', label: 'Documents', children: [{ value: 'invoices', label: 'Invoices' }] },\n *     { value: 'photos', label: 'Photos' },\n *   ]}\n *   searchable\n * />\n *\n * @example\n * <TreeSelect label=\"Regions\" selectionMode=\"checkbox\" checkedStrategy=\"parent\" data={regions} />\n */\nexport const TreeSelect = forwardRef<HTMLInputElement, TreeSelectProps>(\n  (props, ref) => {\n    const {\n      data,\n      expanded: expandedProp,\n      defaultExpanded = [],\n      onExpandedChange,\n      open: openProp,\n      defaultOpen = false,\n      onOpenChange,\n      searchable = false,\n      query: queryProp,\n      defaultQuery = '',\n      onQueryChange,\n      filter,\n      empty,\n      itemTemplate,\n      disabled: disabledProp,\n      clearable = false,\n      size,\n      labels,\n      selectionMode = 'single',\n      value: valueProp,\n      defaultValue,\n      // Called below through `props`, which knows which value it takes.\n      onChange: _onChange,\n      parentsSelectable = true,\n      closeOnSelect = true,\n      checkedStrategy = 'child',\n      ariaCloseLabel,\n      ...rest\n    } = props;\n    const disabled = useFieldsetDisabled(disabledProp);\n    const single = selectionMode === 'single';\n    const cascade = selectionMode === 'checkbox';\n\n    const index = useMemo(() => indexTree(data), [data]);\n    const records = useMemo(() => checkRecords(index), [index]);\n    const labelFor = (value: string) => {\n      const entry = index.get(value);\n      return entry ? nodeLabel(entry.node) : value;\n    };\n\n    // The value, as a list: none or one in `single`.\n    const [held, setHeld] = useControlled<string | string[] | null>(\n      valueProp,\n      defaultValue ?? null\n    );\n    const listed = asList(held);\n    const change = (next: string[]) => {\n      const value = single ? (next[0] ?? null) : next;\n      setHeld(value);\n      // The mode decides which of the two `onChange` takes.\n      const report = props.onChange as\n        ((value: string | string[] | null) => void) | undefined;\n      report?.(value);\n    };\n    // What the field, the tags and the hidden inputs show: the value as it's\n    // held. `checkedStrategy` shapes a new value as a check makes it, so a\n    // branch that loads later changes nothing the form posts.\n    const picked = single ? listed.slice(0, 1) : Array.from(new Set(listed));\n\n    const unknown = picked.find(value => !index.has(value));\n    useEffect(() => {\n      if (unknown !== undefined) {\n        warnOnce(\n          'TreeSelect:unknown-value',\n          `[bestax-bulma] <TreeSelect> was given the value \"${unknown}\", ` +\n            'which no node in its data has. It is kept and shown as it is, ' +\n            'as it should be for a node under a branch that has not loaded ' +\n            'yet. Otherwise, check the value against the data.'\n        );\n      }\n    }, [unknown]);\n\n    const [expanded, setExpanded] = useControlled(\n      expandedProp,\n      defaultExpanded\n    );\n    const changeExpanded = (next: string[]) => {\n      setExpanded(next);\n      onExpandedChange?.(next);\n    };\n\n    // The picked item focus goes to: the first in the tree's order.\n    const pickedSet = new Set(picked);\n    const target = Array.from(index.keys()).find(value => pickedSet.has(value));\n\n    const [query, setQueryState] = useControlled(queryProp, defaultQuery);\n    const setQuery = (next: string) => {\n      if (next === query) return;\n      setQueryState(next);\n      onQueryChange?.(next);\n    };\n\n    const [isOpen, setOpenState] = useControlled(openProp, defaultOpen);\n    const setOpen = (next: boolean) => {\n      if (next === isOpen) return;\n      if (next) {\n        // Opening shows the picked item, its branch open.\n        const path = (target !== undefined && index.get(target)?.path) || [];\n        if (path.some(value => !expanded.includes(value))) {\n          changeExpanded(withAll(expanded, path));\n        }\n      } else {\n        setQuery('');\n      }\n      setOpenState(next);\n      onOpenChange?.(next);\n    };\n\n    const matchText = useLocaleMatcher();\n    const typed = searchable ? query.trim() : '';\n    // Every item reads the hidden set, so it's only built again when the\n    // search text or the data changes.\n    const search = useMemo(\n      () =>\n        typed\n          ? searchTree(data, (node, path) => {\n              if (filter) return filter(typed, node, path);\n              const text = nodeLabel(node);\n              return matchText\n                ? matchText(text, typed)\n                : text.toLowerCase().includes(typed.toLowerCase());\n            })\n          : null,\n      // `filter` is read as it is when the text or the data changes: one\n      // written inline is a new function every render, and listing it would\n      // search again on each.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [data, typed, matchText]\n    );\n    // The branches a search opened that were closed during it, for the\n    // search text they were closed under: any new text, from the box or\n    // from a held `query`, starts over.\n    const [searchClosed, setSearchClosed] = useState({\n      query: typed,\n      values: [] as string[],\n    });\n    if (searchClosed.query !== typed) {\n      setSearchClosed({ query: typed, values: [] });\n    }\n    const closedHere = searchClosed.query === typed ? searchClosed.values : [];\n    // The branches a search opens show open over the ones you opened, and\n    // close again once it's cleared.\n    const forced = search\n      ? search.open.filter(value => !closedHere.includes(value))\n      : [];\n    const shownExpanded = withAll(expanded, forced);\n    // TreeView's click on a row selects it and opens it. A pick by click, as\n    // a pick by Enter, only picks, so the open the tree asks for right after\n    // one on a parent is dropped, and a lazy parent isn't fetched to be\n    // picked.\n    const clickPickedRef = useRef(false);\n    const onTreeExpandedChange = (next: string[]) => {\n      if (clickPickedRef.current) {\n        clickPickedRef.current = false;\n        return;\n      }\n      const closed = shownExpanded.filter(value => !next.includes(value));\n      const opened = next.filter(value => !shownExpanded.includes(value));\n      const closedForced = closed.filter(value => forced.includes(value));\n      if (closedForced.length > 0) {\n        setSearchClosed({\n          query: typed,\n          values: [...closedHere, ...closedForced],\n        });\n      }\n      if (opened.length > 0 || closed.some(value => expanded.includes(value))) {\n        changeExpanded([\n          ...expanded.filter(value => !closed.includes(value)),\n          ...opened,\n        ]);\n      }\n    };\n\n    // Whether an item is on the page with the panel open: every branch\n    // above it open, and the search not hiding it.\n    const visible = (value: string) =>\n      !search?.hidden.has(value) &&\n      index.get(value)!.path.every(above => shownExpanded.includes(above));\n    const focusTarget =\n      target !== undefined && visible(target)\n        ? target\n        : data.find(node => visible(node.value))?.value;\n\n    // Picking in `single`. TreeView shows `selected`, held here, and the\n    // picks are made from the rows' own keys and clicks, so a parent can\n    // open instead and a pick of the picked item still closes.\n    const pickable = (node: TreeItemData) =>\n      !node.disabled && (parentsSelectable || !isParentNode(node));\n    const pick = (value: string) => {\n      if (listed.length !== 1 || listed[0] !== value) change([value]);\n      if (closeOnSelect) setOpen(false);\n    };\n    const toggleClass = usePrefixedClassNames('tree-view-toggle');\n    const rowHandlers = (node: TreeItemData) =>\n      single\n        ? {\n            onKeyDown: (event: React.KeyboardEvent<HTMLLIElement>) => {\n              if (\n                event.target !== event.currentTarget ||\n                event.repeat ||\n                event.altKey ||\n                event.ctrlKey ||\n                event.metaKey ||\n                (event.key !== 'Enter' && event.key !== ' ')\n              ) {\n                return;\n              }\n              if (pickable(node)) {\n                pick(node.value);\n              } else if (!node.disabled && isParentNode(node)) {\n                // TreeView leaves a key that's been used alone.\n                event.preventDefault();\n                onTreeExpandedChange(\n                  shownExpanded.includes(node.value)\n                    ? shownExpanded.filter(value => value !== node.value)\n                    : [...shownExpanded, node.value]\n                );\n              }\n            },\n            onClick: (event: React.MouseEvent<HTMLLIElement>) => {\n              const item = event.currentTarget;\n              const target = event.target as Element;\n              // A click in this item's own row, where TreeView reads one,\n              // not one in the group of items inside it, and not on its\n              // chevron, which only opens it.\n              const inRow =\n                target === item || item.firstElementChild!.contains(target);\n              const onChevron =\n                isParentNode(node) && !!target.closest(`.${toggleClass}`);\n              if (inRow && !onChevron && pickable(node)) {\n                // TreeView opens a parent it's handed this click on, in\n                // this same click: the flag goes once the click is over.\n                clickPickedRef.current = isParentNode(node);\n                queueMicrotask(() => {\n                  clickPickedRef.current = false;\n                });\n                pick(node.value);\n              }\n            },\n          }\n        : undefined;\n\n    const renderNode = (node: TreeItemData): React.ReactNode => (\n      <TreeView.Item\n        key={node.value}\n        value={node.value}\n        label={itemTemplate ? itemTemplate(node) : nodeLabel(node)}\n        icon={node.icon}\n        hasChildren={node.hasChildren}\n        isLoading={node.isLoading}\n        loadError={node.loadError}\n        onRetry={node.onRetry}\n        disabled={node.disabled}\n        data-initial-focus={\n          !searchable && node.value === focusTarget ? '' : undefined\n        }\n        {...rowHandlers(node)}\n      >\n        {childNodes(node).map(renderNode)}\n      </TreeView.Item>\n    );\n\n    // In `checkbox`, TreeView reports every checked item, read here into\n    // the list `checkedStrategy` gives.\n    const shaped = (next: string[]) =>\n      cascade ? checkedByStrategy(records, next, checkedStrategy) : next;\n    const onCheckedChange = (next: string[]) => change(shaped(next));\n    // Every item's check state, read once a render, which the clear button\n    // and the tags' buttons decide from. Only `checkbox` reads TreeView's\n    // rules: in `checkbox-independent` a listed item is a checked one.\n    const listedKey = JSON.stringify(listed);\n    const checks = useMemo(\n      () => (cascade ? readChecks(records, new Set(listed)) : null),\n      // `listed` by what it holds, since a held list is a new array each\n      // render.\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [cascade, records, listedKey]\n    );\n    const isDisabled = (value: string) => !!index.get(value)?.node.disabled;\n    // Read in `checkbox` only, where there are states to read.\n    const isChecked = (value: string) => checks!.states.get(value) === true;\n    // What a control can uncheck. In `checkbox`, that's each checked end no\n    // checked disabled item above it keeps checked, and every item above it,\n    // which takes it along; elsewhere it's each listed item that isn't\n    // disabled. A disabled item is checked only by its own value, so nothing\n    // unchecks it, or what it keeps checked.\n    const uncheckable = new Set<string>();\n    if (checks) {\n      for (const end of checks.ends) {\n        const { path } = index.get(end)!;\n        if (\n          isChecked(end) &&\n          !path.some(above => isDisabled(above) && isChecked(above))\n        ) {\n          uncheckable.add(end);\n          path.forEach(above => uncheckable.add(above));\n        }\n      }\n    } else if (!single) {\n      picked.forEach(value => !isDisabled(value) && uncheckable.add(value));\n    }\n    // A tag's button takes its value off where that changes what's checked,\n    // the way its box would. A value no node has can always go.\n    const removable = (value: string) =>\n      !index.has(value) || (!isDisabled(value) && uncheckable.has(value));\n    const without = (value: string) =>\n      cascade && records.has(value)\n        ? shaped(toggledList(records, listed, value))\n        : listed.filter(item => item !== value);\n    // What the clear button leaves: the checked disabled items, and in\n    // `checkbox` what they keep checked, shaped as a check's value is.\n    const cleared = single\n      ? []\n      : shaped(\n          checks\n            ? Array.from(records.keys()).filter(\n                value => isDisabled(value) && isChecked(value)\n              )\n            : picked.filter(isDisabled)\n        );\n    const canClear = single\n      ? picked.length > 0\n      : uncheckable.size > 0 || picked.some(value => !index.has(value));\n    const inputRef = useRef<HTMLInputElement | null>(null);\n    // A forwarded callback's cleanup, which React 19 lets it return, run on\n    // detach in place of a call with `null`, on React 18 as well.\n    const refCleanupRef = useRef<(() => void) | null>(null);\n    const fieldRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        inputRef.current = node;\n        if (typeof ref === 'function') {\n          if (node === null) {\n            const cleanup = refCleanupRef.current;\n            refCleanupRef.current = null;\n            if (cleanup) cleanup();\n            else ref(null);\n            return;\n          }\n          const cleanup: unknown = ref(node);\n          refCleanupRef.current =\n            typeof cleanup === 'function' ? (cleanup as () => void) : null;\n        } else if (ref) {\n          ref.current = node;\n        }\n      },\n      [ref]\n    );\n    const tagsId = useId();\n    const ids = tagIds(tagsId, picked);\n\n    const searchClass = usePrefixedClassNames('input', 'tree-select-search', {\n      [`is-${size}`]: !!size,\n    });\n    const emptyClass = usePrefixedClassNames('tree-select-empty');\n    const treeRef = useRef<HTMLUListElement>(null);\n    const emptyRef = useRef<HTMLDivElement>(null);\n    const nothingFound = !!search && !search.found;\n    // The region reads the text on screen, whatever `empty` renders.\n    const describeEmpty = useCallback(() => {\n      const node = emptyRef.current;\n      /* istanbul ignore if: it's only announced while it's on screen */\n      if (!node) return null;\n      return spokenText(node);\n    }, []);\n\n    return (\n      <DialogSelect\n        {...rest}\n        component=\"TreeSelect\"\n        rootClass=\"tree-select\"\n        panelClass=\"tree-select-panel\"\n        text={single && picked.length > 0 ? labelFor(picked[0]) : ''}\n        values={single ? [picked[0] ?? ''] : picked}\n        hasValue={picked.length > 0}\n        open={isOpen}\n        onOpenChange={setOpen}\n        onPrintableKey={\n          searchable\n            ? key => {\n                setQuery(key);\n                setOpen(true);\n                return true;\n              }\n            : undefined\n        }\n        onClear={() => change(cleared)}\n        clearable={clearable && canClear}\n        onFormReset={() => {\n          // Back to `defaultValue`, or to nothing for a held value, which\n          // its owner sets from `onChange`.\n          const back = valueProp === undefined ? asList(defaultValue) : [];\n          if (!sameValues(back, listed)) change(back);\n        }}\n        clearLabel={labels?.clear || 'Clear'}\n        chooseLabel={labels?.choose}\n        disabled={disabled}\n        size={size}\n        inputRef={inputRef}\n        fieldRef={fieldRef}\n        describedBy={single ? undefined : ids.join(' ')}\n        below={\n          single ? undefined : (\n            <ValueTags\n              values={picked}\n              ids={ids}\n              labelFor={labelFor}\n              disabled={disabled}\n              ariaCloseLabel={ariaCloseLabel}\n              removable={removable}\n              onRemove={value => {\n                change(without(value));\n                inputRef.current?.focus();\n              }}\n            />\n          )\n        }\n        initialFocusSelector={INITIAL_FOCUS}\n      >\n        {panelName => (\n          <>\n            {searchable && (\n              <input\n                className={searchClass}\n                type=\"search\"\n                aria-label={labels?.search || 'Search'}\n                autoComplete=\"off\"\n                value={query}\n                data-initial-focus=\"\"\n                onChange={event => setQuery(event.target.value)}\n                onFocus={event => {\n                  // A key that opened the panel is in the box: type after it.\n                  const { length } = event.currentTarget.value;\n                  event.currentTarget.setSelectionRange(length, length);\n                }}\n                onKeyDown={event => {\n                  if (event.key === 'Enter') {\n                    // The search box's Enter would submit the form.\n                    event.preventDefault();\n                  } else if (event.key === 'ArrowDown' && !event.altKey) {\n                    event.preventDefault();\n                    const tree = treeRef.current;\n                    (\n                      tree?.querySelector<HTMLElement>(\n                        '[role=\"treeitem\"][tabindex=\"0\"]'\n                      ) ?? tree?.querySelector<HTMLElement>('[role=\"treeitem\"]')\n                    )?.focus();\n                  }\n                }}\n              />\n            )}\n            {nothingFound ? (\n              empty && (\n                <div className={emptyClass} ref={emptyRef}>\n                  {empty}\n                </div>\n              )\n            ) : (\n              <TreeViewHiddenContext.Provider\n                value={search?.hidden ?? NOTHING_HIDDEN}\n              >\n                <TreeView\n                  {...panelName}\n                  ref={treeRef}\n                  // It scrolls, and Firefox makes a scroller a Tab stop of\n                  // its own: the roving one on its items is the tree's.\n                  tabIndex={-1}\n                  selectionMode={selectionMode}\n                  size={size}\n                  selected={single ? (picked[0] ?? null) : undefined}\n                  checked={single ? undefined : listed}\n                  onCheckedChange={onCheckedChange}\n                  expanded={shownExpanded}\n                  onExpandedChange={onTreeExpandedChange}\n                  loadingLabel={labels?.loading}\n                  retryLabel={labels?.retry}\n                  loadingAnnouncement={labels?.loadingAnnouncement}\n                  loadedAnnouncement={labels?.loadedAnnouncement}\n                >\n                  {data.map(renderNode)}\n                </TreeView>\n              </TreeViewHiddenContext.Provider>\n            )}\n            <StatusRegion\n              items={nothingFound && empty ? noMatches : nothingToSay}\n              describe={describeEmpty}\n            />\n          </>\n        )}\n      </DialogSelect>\n    );\n  }\n);\n\nTreeSelect.displayName = 'TreeSelect';\n\nexport default TreeSelect;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/esm/form/_pickerInternals/PickerPopover.js

@@ -5,7 +5,7 @@ import { useRef, useMemo, useEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { usePrefixedClassNames, classNames } from '../../helpers/classNames.js';
 import { useFocusTrap } from '../../helpers/useFocusTrap.js';
-import { usePortalContainer, usePortalProp } from '../../helpers/portal.js';
+import { usePopupContainer, usePortalProp, resolvePortalContainer } from '../../helpers/portal.js';
 import { LocalePortalScope } from '../../helpers/LocaleProvider.js';
 import { isEventInside } from '../../helpers/shadowDom.js';
 import { useLatestRef } from '../../helpers/useLatestRef.js';
@@ -14,7 +14,7 @@ import { useAnchoredPosition, marginGap } from '../../helpers/useAnchoredPositio
 const isBrowser = typeof window !== 'undefined';
 const PickerPopover = ({ isOpen, onClose, anchorRef, children, position, appendToBody = false, className, trapFocus = true, closeOnClickOutside = true, closeOnEscape = true, ariaLabel, ariaLabelledBy, role = 'dialog', id, restoreFocusRef, initialFocusSelector, localeScope, matchWidth = false, followContent = false, }) => {
     const panelRef = useRef(null);
-    const resolveContainer = usePortalContainer();
+    const popupContainer = usePopupContainer();
     // A portal has no server-rendered counterpart, so a panel open on the first
     // render stays in place on the server and while hydrating, and moves into
     // its portal once the client takes over, as Modal's `portal` does.
@@ -121,7 +121,7 @@ const PickerPopover = ({ isOpen, onClose, anchorRef, children, position, appendT
                 e.preventDefault();
         }, children: children }));
     if (isPortaled) {
-        const target = resolveContainer();
+        const target = resolvePortalContainer(popupContainer);
         return createPortal(jsx(LocalePortalScope, { target: target, scope: localeScope, children: panel }), target);
     }
     return panel;

package/dist/esm/form/_pickerInternals/PickerPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"PickerPopover.js","sources":["../../../../src/form/_pickerInternals/PickerPopover.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../../helpers/classNames';\nimport { useFocusTrap } from '../../helpers/useFocusTrap';\nimport { usePortalContainer, usePortalProp } from '../../helpers/portal';\nimport {\n  LocalePortalScope,\n  type PortalLocale,\n} from '../../helpers/LocaleProvider';\nimport { isEventInside } from '../../helpers/shadowDom';\nimport { useLatestRef } from '../../helpers/useLatestRef';\nimport {\n  marginGap,\n  useAnchoredPosition,\n} from '../../helpers/useAnchoredPosition';\nimport { PickerPosition } from './pickerTypes';\n\nexport interface PickerPopoverProps {\n  isOpen: boolean;\n  onClose: () => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n  children: React.ReactNode;\n  /**\n   * The corner it opens from. Left out, it's `bottom-left` lined up with the\n   * anchor's start edge: the stylesheet's `is-start-aligned` rule in place,\n   * and the anchor's direction when portaled.\n   */\n  position?: PickerPosition;\n  appendToBody?: boolean;\n  className?: string;\n  trapFocus?: boolean;\n  closeOnClickOutside?: boolean;\n  /** Close on Escape and on Alt+ArrowUp. Default `true`. */\n  closeOnEscape?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  role?: 'dialog' | 'group';\n  id?: string;\n  /**\n   * Where focus goes when the popover closes. Without it, focus goes back to\n   * whatever had it when the focus trap turned on, which is read after the\n   * panel's content mounts: a calendar that focuses a cell as it mounts\n   * would be recorded instead, and that cell leaves with the panel.\n   */\n  restoreFocusRef?: React.RefObject<HTMLElement | null>;\n  /**\n   * Selects the element in the panel that takes focus as it opens, such as a\n   * calendar's focused date rather than the first button in its header. When\n   * nothing matches, or the match can't take focus, the first tab stop does.\n   */\n  initialFocusSelector?: string;\n  /**\n   * The `dir` and `lang` the panel carries when it portals, in place of a\n   * `LocaleProvider`'s: the picker's own, from `usePickerLocaleScope`.\n   */\n  localeScope?: PortalLocale;\n  /**\n   * At least as wide as the anchor: in place through its partial's\n   * `has-anchor-width` rule, which needs the anchor to be the element it's\n   * placed against, and portaled through the anchor's width set inline.\n   */\n  matchWidth?: boolean;\n  /** Placed again after each render, for content that changes size while it's open. */\n  followContent?: boolean;\n}\n\nconst isBrowser = typeof window !== 'undefined';\n\nexport const PickerPopover: React.FC<PickerPopoverProps> = ({\n  isOpen,\n  onClose,\n  anchorRef,\n  children,\n  position,\n  appendToBody = false,\n  className,\n  trapFocus = true,\n  closeOnClickOutside = true,\n  closeOnEscape = true,\n  ariaLabel,\n  ariaLabelledBy,\n  role = 'dialog',\n  id,\n  restoreFocusRef,\n  initialFocusSelector,\n  localeScope,\n  matchWidth = false,\n  followContent = false,\n}) => {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const resolveContainer = usePortalContainer();\n  // A portal has no server-rendered counterpart, so a panel open on the first\n  // render stays in place on the server and while hydrating, and moves into\n  // its portal once the client takes over, as Modal's `portal` does.\n  const { isPortaled } = usePortalProp(appendToBody);\n  // Read as the trap turns on, once the panel's content has rendered.\n  const initialFocusRef = useMemo(\n    () =>\n      initialFocusSelector === undefined\n        ? undefined\n        : {\n            get current() {\n              return (\n                panelRef.current?.querySelector<HTMLElement>(\n                  initialFocusSelector\n                ) ?? null\n              );\n            },\n          },\n    [initialFocusSelector]\n  );\n  const resolved = useAnchoredPosition(anchorRef, panelRef, {\n    active: isOpen,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-picker-popover-offset` as a margin, in place\n    // or portaled, so the coordinates leave it out and `auto` reads it off\n    // the panel.\n    offset: 0,\n    styledGap: marginGap,\n    matchWidth,\n    followContent,\n  });\n\n  // Read when a press lands outside or a key arrives, so both listeners stay\n  // put while `onClose` changes identity, as an inline one does on every\n  // render of the field.\n  const onCloseRef = useLatestRef(onClose);\n\n  useEffect(() => {\n    if (!isOpen || !closeOnClickOutside || !isBrowser) return undefined;\n    // Listen on `pointerdown` (rather than `mousedown`) so touch starts\n    // outside the popover dismiss it on mobile — including swipe-from-outside\n    // gestures, where the synthetic mouse event would otherwise lag a few\n    // hundred ms behind the actual touch.\n    const handler = (e: PointerEvent) => {\n      const path = e.composedPath();\n      if (panelRef.current && path.includes(panelRef.current)) return;\n      if (anchorRef.current && path.includes(anchorRef.current)) return;\n      onCloseRef.current();\n    };\n    document.addEventListener('pointerdown', handler);\n    return () => document.removeEventListener('pointerdown', handler);\n  }, [isOpen, closeOnClickOutside, anchorRef, onCloseRef]);\n\n  // Escape closes it, and so does Alt+ArrowUp, the combobox's key for it,\n  // which the calendar and the time wheels inside leave to it. Escape closes\n  // it from anywhere, but the key is only the picker's when it was pressed in\n  // the panel or the field: then it's marked used, so a Modal or Sidebar\n  // around the picker stays open. From anywhere else, such as a dialog opened\n  // over the picker, the key goes on to whatever has focus.\n  useEffect(() => {\n    if (!isOpen || !closeOnEscape || !isBrowser) return undefined;\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        if (\n          isEventInside(e, panelRef.current) ||\n          isEventInside(e, anchorRef.current)\n        ) {\n          e.preventDefault();\n        }\n        onCloseRef.current();\n      } else if (e.altKey && e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        onCloseRef.current();\n      }\n    };\n    document.addEventListener('keydown', handler);\n    return () => document.removeEventListener('keydown', handler);\n  }, [isOpen, closeOnEscape, anchorRef, onCloseRef]);\n\n  useFocusTrap(panelRef, {\n    active: isOpen && trapFocus,\n    initialFocusRef,\n    restoreFocus: restoreFocusRef ?? true,\n  });\n\n  const panelClass = usePrefixedClassNames('picker-popover', {\n    'is-active': isOpen,\n    [`is-${resolved.position}`]: true,\n    // The default lines up with the field's inline start, so the stylesheet\n    // moves it to the right edge on a right-to-left page.\n    'is-start-aligned': position === undefined,\n    'is-portal': appendToBody,\n    'has-anchor-width': matchWidth,\n  });\n\n  if (!isOpen) return null;\n\n  const style: React.CSSProperties = appendToBody\n    ? {\n        position: 'fixed',\n        top: resolved.top,\n        left: resolved.left,\n        minWidth: resolved.minWidth,\n      }\n    : {};\n\n  const panel = (\n    <div\n      ref={panelRef}\n      id={id}\n      role={role}\n      aria-modal={role === 'dialog' ? 'false' : undefined}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={-1}\n      className={classNames(panelClass, className)}\n      style={style}\n      // An Escape pressed in the panel is the picker's, and the listener\n      // above claims it. A Dropdown menu around the picker hears Escape in a\n      // React handler, which runs before that listener, so the panel claims\n      // it here too, where React gets to it first.\n      onKeyDown={e => {\n        if (closeOnEscape && e.key === 'Escape') e.preventDefault();\n      }}\n    >\n      {children}\n    </div>\n  );\n\n  if (isPortaled) {\n    const target = resolveContainer();\n    return createPortal(\n      <LocalePortalScope target={target} scope={localeScope}>\n        {panel}\n      </LocalePortalScope>,\n      target\n    );\n  }\n  return panel;\n};\n\nPickerPopover.displayName = 'PickerPopover';\n\nexport default PickerPopover;\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"PickerPopover.js","sources":["../../../../src/form/_pickerInternals/PickerPopover.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../../helpers/classNames';\nimport { useFocusTrap } from '../../helpers/useFocusTrap';\nimport {\n  resolvePortalContainer,\n  usePopupContainer,\n  usePortalProp,\n} from '../../helpers/portal';\nimport {\n  LocalePortalScope,\n  type PortalLocale,\n} from '../../helpers/LocaleProvider';\nimport { isEventInside } from '../../helpers/shadowDom';\nimport { useLatestRef } from '../../helpers/useLatestRef';\nimport {\n  marginGap,\n  useAnchoredPosition,\n} from '../../helpers/useAnchoredPosition';\nimport { PickerPosition } from './pickerTypes';\n\nexport interface PickerPopoverProps {\n  isOpen: boolean;\n  onClose: () => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n  children: React.ReactNode;\n  /**\n   * The corner it opens from. Left out, it's `bottom-left` lined up with the\n   * anchor's start edge: the stylesheet's `is-start-aligned` rule in place,\n   * and the anchor's direction when portaled.\n   */\n  position?: PickerPosition;\n  appendToBody?: boolean;\n  className?: string;\n  trapFocus?: boolean;\n  closeOnClickOutside?: boolean;\n  /** Close on Escape and on Alt+ArrowUp. Default `true`. */\n  closeOnEscape?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  role?: 'dialog' | 'group';\n  id?: string;\n  /**\n   * Where focus goes when the popover closes. Without it, focus goes back to\n   * whatever had it when the focus trap turned on, which is read after the\n   * panel's content mounts: a calendar that focuses a cell as it mounts\n   * would be recorded instead, and that cell leaves with the panel.\n   */\n  restoreFocusRef?: React.RefObject<HTMLElement | null>;\n  /**\n   * Selects the element in the panel that takes focus as it opens, such as a\n   * calendar's focused date rather than the first button in its header. When\n   * nothing matches, or the match can't take focus, the first tab stop does.\n   */\n  initialFocusSelector?: string;\n  /**\n   * The `dir` and `lang` the panel carries when it portals, in place of a\n   * `LocaleProvider`'s: the picker's own, from `usePickerLocaleScope`.\n   */\n  localeScope?: PortalLocale;\n  /**\n   * At least as wide as the anchor: in place through its partial's\n   * `has-anchor-width` rule, which needs the anchor to be the element it's\n   * placed against, and portaled through the anchor's width set inline.\n   */\n  matchWidth?: boolean;\n  /** Placed again after each render, for content that changes size while it's open. */\n  followContent?: boolean;\n}\n\nconst isBrowser = typeof window !== 'undefined';\n\nexport const PickerPopover: React.FC<PickerPopoverProps> = ({\n  isOpen,\n  onClose,\n  anchorRef,\n  children,\n  position,\n  appendToBody = false,\n  className,\n  trapFocus = true,\n  closeOnClickOutside = true,\n  closeOnEscape = true,\n  ariaLabel,\n  ariaLabelledBy,\n  role = 'dialog',\n  id,\n  restoreFocusRef,\n  initialFocusSelector,\n  localeScope,\n  matchWidth = false,\n  followContent = false,\n}) => {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const popupContainer = usePopupContainer();\n  // A portal has no server-rendered counterpart, so a panel open on the first\n  // render stays in place on the server and while hydrating, and moves into\n  // its portal once the client takes over, as Modal's `portal` does.\n  const { isPortaled } = usePortalProp(appendToBody);\n  // Read as the trap turns on, once the panel's content has rendered.\n  const initialFocusRef = useMemo(\n    () =>\n      initialFocusSelector === undefined\n        ? undefined\n        : {\n            get current() {\n              return (\n                panelRef.current?.querySelector<HTMLElement>(\n                  initialFocusSelector\n                ) ?? null\n              );\n            },\n          },\n    [initialFocusSelector]\n  );\n  const resolved = useAnchoredPosition(anchorRef, panelRef, {\n    active: isOpen,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-picker-popover-offset` as a margin, in place\n    // or portaled, so the coordinates leave it out and `auto` reads it off\n    // the panel.\n    offset: 0,\n    styledGap: marginGap,\n    matchWidth,\n    followContent,\n  });\n\n  // Read when a press lands outside or a key arrives, so both listeners stay\n  // put while `onClose` changes identity, as an inline one does on every\n  // render of the field.\n  const onCloseRef = useLatestRef(onClose);\n\n  useEffect(() => {\n    if (!isOpen || !closeOnClickOutside || !isBrowser) return undefined;\n    // Listen on `pointerdown` (rather than `mousedown`) so touch starts\n    // outside the popover dismiss it on mobile — including swipe-from-outside\n    // gestures, where the synthetic mouse event would otherwise lag a few\n    // hundred ms behind the actual touch.\n    const handler = (e: PointerEvent) => {\n      const path = e.composedPath();\n      if (panelRef.current && path.includes(panelRef.current)) return;\n      if (anchorRef.current && path.includes(anchorRef.current)) return;\n      onCloseRef.current();\n    };\n    document.addEventListener('pointerdown', handler);\n    return () => document.removeEventListener('pointerdown', handler);\n  }, [isOpen, closeOnClickOutside, anchorRef, onCloseRef]);\n\n  // Escape closes it, and so does Alt+ArrowUp, the combobox's key for it,\n  // which the calendar and the time wheels inside leave to it. Escape closes\n  // it from anywhere, but the key is only the picker's when it was pressed in\n  // the panel or the field: then it's marked used, so a Modal or Sidebar\n  // around the picker stays open. From anywhere else, such as a dialog opened\n  // over the picker, the key goes on to whatever has focus.\n  useEffect(() => {\n    if (!isOpen || !closeOnEscape || !isBrowser) return undefined;\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        if (\n          isEventInside(e, panelRef.current) ||\n          isEventInside(e, anchorRef.current)\n        ) {\n          e.preventDefault();\n        }\n        onCloseRef.current();\n      } else if (e.altKey && e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        onCloseRef.current();\n      }\n    };\n    document.addEventListener('keydown', handler);\n    return () => document.removeEventListener('keydown', handler);\n  }, [isOpen, closeOnEscape, anchorRef, onCloseRef]);\n\n  useFocusTrap(panelRef, {\n    active: isOpen && trapFocus,\n    initialFocusRef,\n    restoreFocus: restoreFocusRef ?? true,\n  });\n\n  const panelClass = usePrefixedClassNames('picker-popover', {\n    'is-active': isOpen,\n    [`is-${resolved.position}`]: true,\n    // The default lines up with the field's inline start, so the stylesheet\n    // moves it to the right edge on a right-to-left page.\n    'is-start-aligned': position === undefined,\n    'is-portal': appendToBody,\n    'has-anchor-width': matchWidth,\n  });\n\n  if (!isOpen) return null;\n\n  const style: React.CSSProperties = appendToBody\n    ? {\n        position: 'fixed',\n        top: resolved.top,\n        left: resolved.left,\n        minWidth: resolved.minWidth,\n      }\n    : {};\n\n  const panel = (\n    <div\n      ref={panelRef}\n      id={id}\n      role={role}\n      aria-modal={role === 'dialog' ? 'false' : undefined}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={-1}\n      className={classNames(panelClass, className)}\n      style={style}\n      // An Escape pressed in the panel is the picker's, and the listener\n      // above claims it. A Dropdown menu around the picker hears Escape in a\n      // React handler, which runs before that listener, so the panel claims\n      // it here too, where React gets to it first.\n      onKeyDown={e => {\n        if (closeOnEscape && e.key === 'Escape') e.preventDefault();\n      }}\n    >\n      {children}\n    </div>\n  );\n\n  if (isPortaled) {\n    const target = resolvePortalContainer(popupContainer);\n    return createPortal(\n      <LocalePortalScope target={target} scope={localeScope}>\n        {panel}\n      </LocalePortalScope>,\n      target\n    );\n  }\n  return panel;\n};\n\nPickerPopover.displayName = 'PickerPopover';\n\nexport default PickerPopover;\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;AAsEA,MAAM,SAAS,GAAG,OAAO,MAAM,KAAK,WAAW;AAExC,MAAM,aAAa,GAAiC,CAAC,EAC1D,MAAM,EACN,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,GAAG,KAAK,EACpB,SAAS,EACT,SAAS,GAAG,IAAI,EAChB,mBAAmB,GAAG,IAAI,EAC1B,aAAa,GAAG,IAAI,EACpB,SAAS,EACT,cAAc,EACd,IAAI,GAAG,QAAQ,EACf,EAAE,EACF,eAAe,EACf,oBAAoB,EACpB,WAAW,EACX,UAAU,GAAG,KAAK,EAClB,aAAa,GAAG,KAAK,GACtB,KAAI;AACH,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAC7C,IAAA,MAAM,cAAc,GAAG,iBAAiB,EAAE;;;;IAI1C,MAAM,EAAE,UAAU,EAAE,GAAG,aAAa,CAAC,YAAY,CAAC;;IAElD,MAAM,eAAe,GAAG,OAAO,CAC7B,MACE,oBAAoB,KAAK;AACvB,UAAE;AACF,UAAE;AACE,YAAA,IAAI,OAAO,GAAA;AACT,gBAAA,QACE,QAAQ,CAAC,OAAO,EAAE,aAAa,CAC7B,oBAAoB,CACrB,IAAI,IAAI;YAEb,CAAC;AACF,SAAA,EACP,CAAC,oBAAoB,CAAC,CACvB;AACD,IAAA,MAAM,QAAQ,GAAG,mBAAmB,CAAC,SAAS,EAAE,QAAQ,EAAE;AACxD,QAAA,MAAM,EAAE,MAAM;QACd,QAAQ;AACR,QAAA,KAAK,EAAE,YAAY;;;;AAInB,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,SAAS,EAAE,SAAS;QACpB,UAAU;QACV,aAAa;AACd,KAAA,CAAC;;;;AAKF,IAAA,MAAM,UAAU,GAAG,YAAY,CAAC,OAAO,CAAC;IAExC,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,MAAM,IAAI,CAAC,mBAAmB,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,SAAS;;;;;AAKnE,QAAA,MAAM,OAAO,GAAG,CAAC,CAAe,KAAI;AAClC,YAAA,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE;YAC7B,IAAI,QAAQ,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC;gBAAE;YACzD,IAAI,SAAS,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC;gBAAE;YAC3D,UAAU,CAAC,OAAO,EAAE;AACtB,QAAA,CAAC;AACD,QAAA,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,CAAC;QACjD,OAAO,MAAM,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,OAAO,CAAC;IACnE,CAAC,EAAE,CAAC,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;;;;;;;IAQxD,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,MAAM,IAAI,CAAC,aAAa,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,SAAS;AAC7D,QAAA,MAAM,OAAO,GAAG,CAAC,CAAgB,KAAI;AACnC,YAAA,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE;AACtB,gBAAA,IACE,aAAa,CAAC,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC;oBAClC,aAAa,CAAC,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,EACnC;oBACA,CAAC,CAAC,cAAc,EAAE;gBACpB;gBACA,UAAU,CAAC,OAAO,EAAE;YACtB;iBAAO,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,EAAE;gBAC1C,CAAC,CAAC,cAAc,EAAE;gBAClB,CAAC,CAAC,eAAe,EAAE;gBACnB,UAAU,CAAC,OAAO,EAAE;YACtB;AACF,QAAA,CAAC;AACD,QAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC;QAC7C,OAAO,MAAM,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC;IAC/D,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;IAElD,YAAY,CAAC,QAAQ,EAAE;QACrB,MAAM,EAAE,MAAM,IAAI,SAAS;QAC3B,eAAe;QACf,YAAY,EAAE,eAAe,IAAI,IAAI;AACtC,KAAA,CAAC;AAEF,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,gBAAgB,EAAE;AACzD,QAAA,WAAW,EAAE,MAAM;AACnB,QAAA,CAAC,MAAM,QAAQ,CAAC,QAAQ,CAAA,CAAE,GAAG,IAAI;;;QAGjC,kBAAkB,EAAE,QAAQ,KAAK,SAAS;AAC1C,QAAA,WAAW,EAAE,YAAY;AACzB,QAAA,kBAAkB,EAAE,UAAU;AAC/B,KAAA,CAAC;AAEF,IAAA,IAAI,CAAC,MAAM;AAAE,QAAA,OAAO,IAAI;IAExB,MAAM,KAAK,GAAwB;AACjC,UAAE;AACE,YAAA,QAAQ,EAAE,OAAO;YACjB,GAAG,EAAE,QAAQ,CAAC,GAAG;YACjB,IAAI,EAAE,QAAQ,CAAC,IAAI;YACnB,QAAQ,EAAE,QAAQ,CAAC,QAAQ;AAC5B;UACD,EAAE;IAEN,MAAM,KAAK,IACTA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,QAAQ,EACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EAAA,YAAA,EACE,IAAI,KAAK,QAAQ,GAAG,OAAO,GAAG,SAAS,gBACvC,SAAS,EAAA,iBAAA,EACJ,cAAc,EAC/B,QAAQ,EAAE,EAAE,EACZ,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAC5C,KAAK,EAAE,KAAK;;;;;QAKZ,SAAS,EAAE,CAAC,IAAG;AACb,YAAA,IAAI,aAAa,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;gBAAE,CAAC,CAAC,cAAc,EAAE;AAC7D,QAAA,CAAC,EAAA,QAAA,EAEA,QAAQ,EAAA,CACL,CACP;IAED,IAAI,UAAU,EAAE;AACd,QAAA,MAAM,MAAM,GAAG,sBAAsB,CAAC,cAAc,CAAC;AACrD,QAAA,OAAO,YAAY,CACjBA,GAAA,CAAC,iBAAiB,EAAA,EAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAA,QAAA,EAClD,KAAK,GACY,EACpB,MAAM,CACP;IACH;AACA,IAAA,OAAO,KAAK;AACd;AAEA,aAAa,CAAC,WAAW,GAAG,eAAe;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Config.js","sources":["../../../src/helpers/Config.tsx"],"sourcesContent":["import React, { createContext, useContext, ReactNode } from 'react';\n\n/** Supported icon library identifiers. */\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Shape of the configuration context value.\n */\nexport interface ConfigContextProps {\n  /** Prefix applied to all Bulma class names. */\n  classPrefix?: string;\n  /** Default icon library for Icon components. */\n  iconLibrary?: IconLibrary;\n  /** Where portaled content goes when it has no target of its own. */\n  portalContainer?: string | HTMLElement;\n}\n\nconst ConfigContext = createContext<ConfigContextProps>({});\n\n/**\n * Hook to access the bulma-ui configuration context.\n *\n * @function\n * @returns {ConfigContextProps} The current configuration values.\n */\nexport const useConfig = () => useContext(ConfigContext);\n\n/**\n * Props for the ConfigProvider component.\n */\nexport interface ConfigProviderProps {\n  /** Child components to receive configuration. */\n  children: ReactNode;\n  /** Prefix applied to all Bulma class names. */\n  classPrefix?: string;\n  /** Default icon library for Icon components. */\n  iconLibrary?: IconLibrary;\n  /**\n   * Where portaled content goes when it has no target of its own: what a\n   * `Portal` without a `container` renders, and what the library's components\n   * portal, such as Popover's `appendToBody` panel, a `Modal` with `portal`\n   * set to `true`, or a `Toast`. An element, or a `document.querySelector`\n   * selector. Unset, or a selector that matches nothing, that content goes to\n   * `document.body`. A target a component is given, such as a `Toast`'s\n   * `container`, still wins, and nothing portals that would otherwise render\n   * in place.\n   *\n   * The overlays and panels this moves are `position: fixed`, so pick an\n   * element with no ancestor that has a `transform`, `filter`,\n   * `backdrop-filter`, `perspective`, `will-change: transform`, or a\n   * `contain` that includes `paint` or `layout`. That ancestor becomes their\n   * containing block, and they cover or line up against it instead of the\n   * viewport. An ancestor that starts a stacking context, with a `z-index` or\n   * `isolation: isolate`, keeps them inside it, under anything the page\n   * stacks above it. `NotificationContainer`'s status region moves too, so\n   * this also decides where its announcements come from, and an `aria-hidden`\n   * ancestor silences them.\n   *\n   * A selector can't find an element inside a shadow root, so pass the\n   * element itself there, held in state from a ref callback. Content that\n   * portals before the element is set goes to `document.body` and moves when\n   * it is, which remounts it, as `Portal`'s `container` describes.\n   */\n  portalContainer?: string | HTMLElement;\n}\n\n/**\n * ConfigProvider injects configuration into all child components via React context.\n *\n * A nested provider replaces the outer one's settings rather than adding to\n * them, so inside it any setting it leaves out is back to its default.\n *\n * @function\n * @param {ConfigProviderProps} props - Provider props.\n * @returns {JSX.Element} The context provider wrapping children.\n *\n * @example\n * <ConfigProvider classPrefix=\"my-\" iconLibrary=\"mdi\">\n *   <App />\n * </ConfigProvider>\n */\nexport const ConfigProvider: React.FC<ConfigProviderProps> = ({\n  classPrefix,\n  iconLibrary,\n  portalContainer,\n  children,\n}) => {\n  return (\n    <ConfigContext.Provider\n      value={{ classPrefix, iconLibrary, portalContainer }}\n    >\n      {children}\n    </ConfigContext.Provider>\n  );\n};\n\n/**\n * Utility hook to get the configured class prefix string.\n *\n * @function\n * @returns {string} The class prefix, or empty string if none configured.\n */\nexport const useClassPrefix = () => {\n  const { classPrefix } = useConfig();\n  return classPrefix || '';\n};\n\n/**\n * Hook that returns a function to prefix a class name with the configured prefix.\n *\n * @function\n * @returns {(className: string) => string} A function that applies the class prefix.\n */\nexport const usePrefixedClass = () => {\n  const { classPrefix } = useConfig();\n  return (className: string) =>\n    classPrefix ? `${classPrefix}${className}` : className;\n};\n\n/**\n * Hook to get the default icon library from configuration.\n *\n * @function\n * @returns {IconLibrary | undefined} The configured icon library, or undefined.\n */\nexport const useIconLibrary = () => {\n  const { iconLibrary } = useConfig();\n  return iconLibrary;\n};\n"],"names":["_jsx"],"mappings":";;;;;AAiBA,MAAM,aAAa,GAAG,aAAa,CAAqB,EAAE,CAAC;AAE3D;;;;;AAKG;AACI,MAAM,SAAS,GAAG,MAAM,UAAU,CAAC,aAAa;AAyCvD;;;;;;;;;;;;;;AAcG;AACI,MAAM,cAAc,GAAkC,CAAC,EAC5D,WAAW,EACX,WAAW,EACX,eAAe,EACf,QAAQ,GACT,KAAI;AACH,IAAA,QACEA,GAAA,CAAC,aAAa,CAAC,QAAQ,EAAA,EACrB,KAAK,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,eAAe,EAAE,YAEnD,QAAQ,EAAA,CACc;AAE7B;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;IACnC,OAAO,WAAW,IAAI,EAAE;AAC1B;AAEA;;;;;AAKG;AACI,MAAM,gBAAgB,GAAG,MAAK;AACnC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,CAAC,SAAiB,KACvB,WAAW,GAAG,CAAA,EAAG,WAAW,GAAG,SAAS,CAAA,CAAE,GAAG,SAAS;AAC1D;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,WAAW;AACpB;;"}
+{"version":3,"file":"Config.js","sources":["../../../src/helpers/Config.tsx"],"sourcesContent":["import React, { createContext, useContext, ReactNode } from 'react';\n\n/** Supported icon library identifiers. */\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Shape of the configuration context value.\n */\nexport interface ConfigContextProps {\n  /** Prefix applied to all Bulma class names. */\n  classPrefix?: string;\n  /** Default icon library for Icon components. */\n  iconLibrary?: IconLibrary;\n  /** Where portaled content goes when it has no target of its own. */\n  portalContainer?: string | HTMLElement;\n}\n\nconst ConfigContext = createContext<ConfigContextProps>({});\n\n/**\n * Hook to access the bulma-ui configuration context.\n *\n * @function\n * @returns {ConfigContextProps} The current configuration values.\n */\nexport const useConfig = () => useContext(ConfigContext);\n\n/**\n * Props for the ConfigProvider component.\n */\nexport interface ConfigProviderProps {\n  /** Child components to receive configuration. */\n  children: ReactNode;\n  /** Prefix applied to all Bulma class names. */\n  classPrefix?: string;\n  /** Default icon library for Icon components. */\n  iconLibrary?: IconLibrary;\n  /**\n   * Where portaled content goes when it has no target of its own: what a\n   * `Portal` without a `container` renders, and what the library's components\n   * portal, such as Popover's `appendToBody` panel, a `Modal` with `portal`\n   * set to `true`, or a `Toast`. An element, or a `document.querySelector`\n   * selector. Unset, or a selector that matches nothing, that content goes to\n   * `document.body`, except a popup, such as Popover's panel or a picker's,\n   * opened inside a `Modal`, `Dialog` or `Command.Dialog`: that goes into the\n   * dialog, where screen readers that honor its `aria-modal` reach it. Set,\n   * it takes those popups too. A target a component is given, such as a\n   * `Toast`'s `container`, still wins, and nothing portals that would\n   * otherwise render in place.\n   *\n   * The overlays and panels this moves are `position: fixed`, so pick an\n   * element with no ancestor that has a `transform`, `filter`,\n   * `backdrop-filter`, `perspective`, `will-change: transform`, or a\n   * `contain` that includes `paint` or `layout`. That ancestor becomes their\n   * containing block, and they cover or line up against it instead of the\n   * viewport. An ancestor that starts a stacking context, with a `z-index` or\n   * `isolation: isolate`, keeps them inside it, under anything the page\n   * stacks above it. `NotificationContainer`'s status region moves too, so\n   * this also decides where its announcements come from, and an `aria-hidden`\n   * ancestor silences them.\n   *\n   * A selector can't find an element inside a shadow root, so pass the\n   * element itself there, held in state from a ref callback. Content that\n   * portals before the element is set goes to `document.body` and moves when\n   * it is, which remounts it, as `Portal`'s `container` describes.\n   */\n  portalContainer?: string | HTMLElement;\n}\n\n/**\n * ConfigProvider injects configuration into all child components via React context.\n *\n * A nested provider replaces the outer one's settings rather than adding to\n * them, so inside it any setting it leaves out is back to its default.\n *\n * @function\n * @param {ConfigProviderProps} props - Provider props.\n * @returns {JSX.Element} The context provider wrapping children.\n *\n * @example\n * <ConfigProvider classPrefix=\"my-\" iconLibrary=\"mdi\">\n *   <App />\n * </ConfigProvider>\n */\nexport const ConfigProvider: React.FC<ConfigProviderProps> = ({\n  classPrefix,\n  iconLibrary,\n  portalContainer,\n  children,\n}) => {\n  return (\n    <ConfigContext.Provider\n      value={{ classPrefix, iconLibrary, portalContainer }}\n    >\n      {children}\n    </ConfigContext.Provider>\n  );\n};\n\n/**\n * Utility hook to get the configured class prefix string.\n *\n * @function\n * @returns {string} The class prefix, or empty string if none configured.\n */\nexport const useClassPrefix = () => {\n  const { classPrefix } = useConfig();\n  return classPrefix || '';\n};\n\n/**\n * Hook that returns a function to prefix a class name with the configured prefix.\n *\n * @function\n * @returns {(className: string) => string} A function that applies the class prefix.\n */\nexport const usePrefixedClass = () => {\n  const { classPrefix } = useConfig();\n  return (className: string) =>\n    classPrefix ? `${classPrefix}${className}` : className;\n};\n\n/**\n * Hook to get the default icon library from configuration.\n *\n * @function\n * @returns {IconLibrary | undefined} The configured icon library, or undefined.\n */\nexport const useIconLibrary = () => {\n  const { iconLibrary } = useConfig();\n  return iconLibrary;\n};\n"],"names":["_jsx"],"mappings":";;;;;AAiBA,MAAM,aAAa,GAAG,aAAa,CAAqB,EAAE,CAAC;AAE3D;;;;;AAKG;AACI,MAAM,SAAS,GAAG,MAAM,UAAU,CAAC,aAAa;AA4CvD;;;;;;;;;;;;;;AAcG;AACI,MAAM,cAAc,GAAkC,CAAC,EAC5D,WAAW,EACX,WAAW,EACX,eAAe,EACf,QAAQ,GACT,KAAI;AACH,IAAA,QACEA,GAAA,CAAC,aAAa,CAAC,QAAQ,EAAA,EACrB,KAAK,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,eAAe,EAAE,YAEnD,QAAQ,EAAA,CACc;AAE7B;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;IACnC,OAAO,WAAW,IAAI,EAAE;AAC1B;AAEA;;;;;AAKG;AACI,MAAM,gBAAgB,GAAG,MAAK;AACnC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,CAAC,SAAiB,KACvB,WAAW,GAAG,CAAA,EAAG,WAAW,GAAG,SAAS,CAAA,CAAE,GAAG,SAAS;AAC1D;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,WAAW;AACpB;;"}

package/dist/esm/helpers/elementType.js

@@ -0,0 +1,42 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
+import React from 'react';
+
+// INTERNAL: deliberately not exported from src/index.ts.
+/**
+ * Whether `type` is a lazy type, which `React.lazy` returns. The symbol is
+ * looked up here rather than when the module loads, which must do nothing.
+ */
+const isLazy = (type) => typeof type === 'object' &&
+    type !== null &&
+    type.$$typeof === Symbol.for('react.lazy') &&
+    typeof type._init === 'function';
+/**
+ * The component an element renders, read through a lazy type.
+ *
+ * A client component written in a React Server Component reaches the client
+ * as a client reference, whose element type is lazy rather than the
+ * component's own function, so `child.type === Part` is never true there
+ * (#1500). This resolves a lazy type the way React does when it renders one:
+ * a module that has loaded gives its component, one still loading throws, so
+ * the caller suspends at the boundary the element itself would have, and one
+ * that failed throws its error. A lazy type without those fields comes back
+ * as it is, so a part goes unrecognized, which is what happened before.
+ */
+function elementType(element) {
+    let type = element.type;
+    while (isLazy(type))
+        type = type._init(type._payload);
+    return type;
+}
+/**
+ * Whether `node` is an element of one of `types`, including one written in a
+ * Server Component. A parent tells its parts apart with this, never by
+ * comparing `child.type`.
+ */
+function isElementOf(node, ...types) {
+    return React.isValidElement(node) && types.includes(elementType(node));
+}
+
+export { elementType, isElementOf };
+//# sourceMappingURL=elementType.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"elementType.js","sources":["../../../src/helpers/elementType.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport React from 'react';\n\n/** A lazy type as React reads one. These fields are React's, not public. */\ninterface LazyType {\n  $$typeof: symbol;\n  _payload: unknown;\n  _init: (payload: unknown) => unknown;\n}\n\n/**\n * Whether `type` is a lazy type, which `React.lazy` returns. The symbol is\n * looked up here rather than when the module loads, which must do nothing.\n */\nconst isLazy = (type: unknown): type is LazyType =>\n  typeof type === 'object' &&\n  type !== null &&\n  (type as LazyType).$$typeof === Symbol.for('react.lazy') &&\n  typeof (type as LazyType)._init === 'function';\n\n/**\n * The component an element renders, read through a lazy type.\n *\n * A client component written in a React Server Component reaches the client\n * as a client reference, whose element type is lazy rather than the\n * component's own function, so `child.type === Part` is never true there\n * (#1500). This resolves a lazy type the way React does when it renders one:\n * a module that has loaded gives its component, one still loading throws, so\n * the caller suspends at the boundary the element itself would have, and one\n * that failed throws its error. A lazy type without those fields comes back\n * as it is, so a part goes unrecognized, which is what happened before.\n */\nexport function elementType(element: React.ReactElement): unknown {\n  let type: unknown = element.type;\n  while (isLazy(type)) type = type._init(type._payload);\n  return type;\n}\n\n/**\n * Whether `node` is an element of one of `types`, including one written in a\n * Server Component. A parent tells its parts apart with this, never by\n * comparing `child.type`.\n */\nexport function isElementOf<P = unknown>(\n  node: React.ReactNode,\n  ...types: readonly unknown[]\n): node is React.ReactElement<P> {\n  return React.isValidElement(node) && types.includes(elementType(node));\n}\n"],"names":[],"mappings":";;;;AAAA;AAUA;;;AAGG;AACH,MAAM,MAAM,GAAG,CAAC,IAAa,KAC3B,OAAO,IAAI,KAAK,QAAQ;AACxB,IAAA,IAAI,KAAK,IAAI;IACZ,IAAiB,CAAC,QAAQ,KAAK,MAAM,CAAC,GAAG,CAAC,YAAY,CAAC;AACxD,IAAA,OAAQ,IAAiB,CAAC,KAAK,KAAK,UAAU;AAEhD;;;;;;;;;;;AAWG;AACG,SAAU,WAAW,CAAC,OAA2B,EAAA;AACrD,IAAA,IAAI,IAAI,GAAY,OAAO,CAAC,IAAI;IAChC,OAAO,MAAM,CAAC,IAAI,CAAC;QAAE,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC;AACrD,IAAA,OAAO,IAAI;AACb;AAEA;;;;AAIG;SACa,WAAW,CACzB,IAAqB,EACrB,GAAG,KAAyB,EAAA;AAE5B,IAAA,OAAO,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;AACxE;;"}

package/dist/esm/helpers/portal.js

@@ -1,6 +1,7 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
 'use client';
 import { jsx, Fragment } from 'react/jsx-runtime';
+import { createContext, useContext } from 'react';
 import { createPortal } from 'react-dom';
 import { useIsHydrated } from './useIsHydrated.js';
 import { useConfig } from './Config.js';
@@ -48,6 +49,47 @@ function usePortalContainer() {
     const { portalContainer } = useConfig();
     return container => resolvePortalContainer(container || portalContainer);
 }
+/**
+ * The element the overlay around a popup hands it to portal into, `null`
+ * outside any, and inside one whose element hasn't mounted yet.
+ */
+const PortalScopeContext = createContext(null);
+/**
+ * INTERNAL, deliberately not exported from `src/index.ts`. Makes `node` where
+ * the popups inside it portal, unless a `ConfigProvider` sets a
+ * `portalContainer`. Modal, Dialog and Command.Dialog wrap their content in
+ * it, each with the element that carries their `aria-modal`, since a screen
+ * reader that honors it hides everything outside that element. The nearest
+ * one wins, so a Dialog's own box wins over the Modal it renders.
+ *
+ * @function PortalScope
+ * @param props - `node`, the element popups portal into, and `children`.
+ * @returns The children, inside the scope.
+ */
+function PortalScope({ node, children, }) {
+    return (jsx(PortalScopeContext.Provider, { value: node, children: children }));
+}
+/**
+ * INTERNAL. Where a popup portals, a panel a component opens against
+ * something on the page, such as Popover's: the `portalContainer` a
+ * `ConfigProvider` sets, else the overlay it's in (see `PortalScope`), else
+ * `undefined`, which `resolvePortalContainer` reads as `document.body`.
+ *
+ * The overlay's element only exists once it has mounted, so a popup open as
+ * the overlay first renders mounts in `document.body`, and moves into the
+ * overlay in the update that follows, before the browser paints. Moving
+ * remounts it, as any change of portal target does. It isn't held back
+ * instead, because the popups measure their panel against the trigger as
+ * they open, and a panel that isn't there yet is never placed.
+ *
+ * @function usePopupContainer
+ * @returns The popup's container, `undefined` for `document.body`.
+ */
+function usePopupContainer() {
+    const { portalContainer } = useConfig();
+    const scope = useContext(PortalScopeContext);
+    return portalContainer || scope || undefined;
+}
 /**
  * Reads Modal's `portal` prop (`boolean | string | HTMLElement`) for a
  * component that takes it: whether the content is in its portal yet, and
@@ -137,6 +179,20 @@ function Portal({ children, container, disabled = false }) {
     const target = resolveContainer(container);
     return createPortal(jsx(LocalePortalScope, { target: target, children: children }), target);
 }
+/**
+ * INTERNAL. `Portal` for a popup, into the container `usePopupContainer`
+ * names, so a popup opened inside a Modal, Dialog or Command.Dialog stays
+ * inside it. `disabled` renders the children in place, as `Portal`'s does.
+ *
+ * @function PopupPortal
+ * @param props - The children, and `disabled`.
+ * @returns The portal, the children in place when `disabled`, or nothing
+ * before hydration.
+ */
+function PopupPortal({ children, disabled = false, }) {
+    const container = usePopupContainer();
+    return (jsx(Portal, { disabled: disabled, container: container, children: children }));
+}
 
-export { Portal, resolvePortalContainer, usePortalContainer, usePortalProp };
+export { PopupPortal, Portal, PortalScope, resolvePortalContainer, usePopupContainer, usePortalContainer, usePortalProp };
 //# sourceMappingURL=portal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"portal.js","sources":["../../../src/helpers/portal.tsx"],"sourcesContent":["import React from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsHydrated } from './useIsHydrated';\nimport { useConfig } from './Config';\nimport { LocalePortalScope } from './LocaleProvider';\n\n/**\n * Resolves a portal target: an `HTMLElement` is used directly, a non-empty\n * `string` is treated as a `document.querySelector` selector (falling back to\n * `document.body` when it matches nothing), and any falsy value — `undefined`\n * or the empty string — resolves to `document.body`.\n *\n * The empty string is deliberately treated as \"no target\" rather than passed\n * through: `document.querySelector('')` throws a `SyntaxError`, and callers\n * building a selector from state can easily hand us `''`.\n *\n * @function resolvePortalContainer\n * @param container - The requested portal target, if any.\n * @returns The resolved DOM node to portal into.\n */\nexport function resolvePortalContainer(\n  container?: string | HTMLElement\n): HTMLElement {\n  if (!container) {\n    return document.body;\n  }\n  if (typeof container === 'string') {\n    return (\n      (document.querySelector(container) as HTMLElement | null) ?? document.body\n    );\n  }\n  return container;\n}\n\n/**\n * Where a component's portal goes, as a function to call when the portal is\n * created: the target the component was given, else the `portalContainer` a\n * `ConfigProvider` sets, else `document.body`, each read as\n * `resolvePortalContainer` reads it. A component that portals resolves its\n * target through this, so the provider's default reaches it.\n *\n * The hook only reads context, so it is safe to call on the server, ahead of\n * any early return. The function it returns reads the DOM, so call it only\n * where the portal is created, which the server never reaches.\n *\n * @function usePortalContainer\n * @returns A function that takes the component's own target, if any, and\n * returns the DOM node to portal into.\n */\nexport function usePortalContainer(): (\n  container?: string | HTMLElement\n) => HTMLElement {\n  const { portalContainer } = useConfig();\n  return container => resolvePortalContainer(container || portalContainer);\n}\n\n/**\n * What a component that takes Modal's `portal` prop does with it now. See\n * `usePortalProp`.\n */\nexport interface PortalPropState {\n  /**\n   * Whether the content renders in its portal: `portal` is set and\n   * hydration is over. Before that it renders in place.\n   */\n  isPortaled: boolean;\n  /**\n   * The target to pass `Portal` as its `container`: the selector or element\n   * `portal` names, or `undefined` for `true`, which leaves the choice to the\n   * `portalContainer` a `ConfigProvider` sets and then `document.body`.\n   */\n  container?: string | HTMLElement;\n  /**\n   * The `portalContainer` a `ConfigProvider` sets, while it's what places the\n   * content (portaled, with `portal` set to `true`), else `undefined`. A\n   * change to it moves the content, so effects that hold its nodes depend\n   * on it.\n   */\n  defaultTarget?: string | HTMLElement;\n}\n\n/**\n * Reads Modal's `portal` prop (`boolean | string | HTMLElement`) for a\n * component that takes it: whether the content is in its portal yet, and\n * where it goes.\n *\n * A portal has no server-rendered counterpart, so such a component renders in\n * place on the server and while hydrating, and moves into its portal once the\n * client takes over. Render the content in `Portal` with\n * `disabled={!isPortaled}` and this `container`. Moving remounts the content,\n * so an effect that holds one of its nodes depends on `isPortaled`, `portal`\n * and `defaultTarget`.\n *\n * @function usePortalProp\n * @param portal - The component's `portal` prop.\n * @returns Whether it's portaled now, its `container`, and the provider's\n * target while that places it.\n */\nexport function usePortalProp(\n  portal?: boolean | string | HTMLElement\n): PortalPropState {\n  const hydrated = useIsHydrated();\n  const { portalContainer } = useConfig();\n  const isPortaled = Boolean(portal) && hydrated;\n  return {\n    isPortaled,\n    container: typeof portal === 'boolean' ? undefined : portal,\n    defaultTarget: isPortaled && portal === true ? portalContainer : undefined,\n  };\n}\n\n/**\n * Props for the Portal component.\n */\nexport interface PortalProps {\n  /** Content to render into the container. */\n  children?: React.ReactNode;\n  /**\n   * Where the content goes: an element, or a `document.querySelector`\n   * selector. Omitted or empty, it goes to the `portalContainer` a\n   * `ConfigProvider` sets, and to `document.body` when none is set. A\n   * selector that matches nothing means `document.body` too. A selector is\n   * looked up again on each render, so the\n   * content follows the target when it changes. Moving to another target\n   * remounts the children and resets their state, which includes a selector\n   * that only starts matching after the content has shown in `document.body`.\n   * Render the target first, or pass the element once you have it.\n   */\n  container?: string | HTMLElement;\n  /**\n   * Render the children in place instead, on the server as well as the\n   * client. Lets a component that portals only sometimes keep a single code\n   * path.\n   * @defaultValue false\n   */\n  disabled?: boolean;\n}\n\n/**\n * Renders its children into another part of the page, `document.body` unless `container` or a `ConfigProvider` says otherwise, so floating content escapes an ancestor's `overflow`, `transform` or stacking context.\n *\n * React's server renderer can't render a portal, so `Portal` renders nothing\n * on the server and during hydration, and mounts its children in the commit\n * that follows. The first client render then matches the server markup. In an app\n * without server rendering it portals on the first render.\n *\n * React context, such as `ConfigProvider`'s class prefix, reaches the\n * portaled children, and their React events bubble through the React tree.\n * CSS inheritance follows the DOM instead: a scoped (non-`isRoot`) `Theme`\n * sets its variables on a wrapper element the portaled content has left, so\n * that content sees the page-level theme, and styles scoped to a shadow root\n * don't reach `document.body` at all. To keep them, portal into an element\n * inside the themed area or the shadow root: pass it as `container`, or as\n * the `portalContainer` of a `ConfigProvider` around that area. The second\n * also reaches what the library's components portal, such as Popover's\n * `appendToBody` panel or a `Modal` with `portal`.\n *\n * Inside a `LocaleProvider`, the children keep its `dir` and `lang`. A\n * container inside the provider's own wrapper takes the children as they\n * are, and they follow the provider through the page. Any other,\n * `document.body` included, gets them inside one `<div>` carrying the\n * provider's values, with `display: contents` so it adds no box. It is\n * still an element, so content that must be the container's direct child,\n * a `<tr>` in a `<tbody>`, or that a direct-child selector styles, belongs\n * in a container inside the provider. Which of the two is settled when the\n * children mount, so a change of locale updates them in place rather than\n * remounting them.\n *\n * Tab order and focus follow the DOM too. Content portaled from inside a\n * focus trap is no longer inside the trapped element, so the trap neither\n * reaches it nor holds focus there: render nested overlays inside the\n * trapped element, or give them a trap of their own. To trap portaled\n * content, put `useFocusTrap`'s ref on the element inside the `Portal`.\n *\n * @function\n * @param {PortalProps} props - Props for the Portal component.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n *\n * @example\n * <Portal>\n *   <div className=\"box\">Rendered at the end of document.body</div>\n * </Portal>\n *\n * @example\n * // Into a dedicated overlay root\n * <Portal container=\"#overlays\">\n *   <CommandPalette />\n * </Portal>\n */\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n  const hydrated = useIsHydrated();\n  const resolveContainer = usePortalContainer();\n  if (disabled) return <>{children}</>;\n  if (!hydrated) return null;\n  const target = resolveContainer(container);\n  return createPortal(\n    <LocalePortalScope target={target}>{children}</LocalePortalScope>,\n    target\n  );\n}\n"],"names":["_jsx","_Fragment"],"mappings":";;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,SAAU,sBAAsB,CACpC,SAAgC,EAAA;IAEhC,IAAI,CAAC,SAAS,EAAE;QACd,OAAO,QAAQ,CAAC,IAAI;IACtB;AACA,IAAA,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACjC,QAAA,QACG,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAwB,IAAI,QAAQ,CAAC,IAAI;IAE9E;AACA,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;AAcG;SACa,kBAAkB,GAAA;AAGhC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,OAAO,SAAS,IAAI,sBAAsB,CAAC,SAAS,IAAI,eAAe,CAAC;AAC1E;AA2BA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,aAAa,CAC3B,MAAuC,EAAA;AAEvC,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,QAAQ;IAC9C,OAAO;QACL,UAAU;AACV,QAAA,SAAS,EAAE,OAAO,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM;AAC3D,QAAA,aAAa,EAAE,UAAU,IAAI,MAAM,KAAK,IAAI,GAAG,eAAe,GAAG,SAAS;KAC3E;AACH;AA6BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDG;AACG,SAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAe,EAAA;AAC3E,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAG,kBAAkB,EAAE;AAC7C,IAAA,IAAI,QAAQ;QAAE,OAAOA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI;AACpC,IAAA,IAAI,CAAC,QAAQ;AAAE,QAAA,OAAO,IAAI;AAC1B,IAAA,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC;AAC1C,IAAA,OAAO,YAAY,CACjBD,GAAA,CAAC,iBAAiB,IAAC,MAAM,EAAE,MAAM,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAqB,EACjE,MAAM,CACP;AACH;;"}
+{"version":3,"file":"portal.js","sources":["../../../src/helpers/portal.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsHydrated } from './useIsHydrated';\nimport { useConfig } from './Config';\nimport { LocalePortalScope } from './LocaleProvider';\n\n/**\n * Resolves a portal target: an `HTMLElement` is used directly, a non-empty\n * `string` is treated as a `document.querySelector` selector (falling back to\n * `document.body` when it matches nothing), and any falsy value — `undefined`\n * or the empty string — resolves to `document.body`.\n *\n * The empty string is deliberately treated as \"no target\" rather than passed\n * through: `document.querySelector('')` throws a `SyntaxError`, and callers\n * building a selector from state can easily hand us `''`.\n *\n * @function resolvePortalContainer\n * @param container - The requested portal target, if any.\n * @returns The resolved DOM node to portal into.\n */\nexport function resolvePortalContainer(\n  container?: string | HTMLElement\n): HTMLElement {\n  if (!container) {\n    return document.body;\n  }\n  if (typeof container === 'string') {\n    return (\n      (document.querySelector(container) as HTMLElement | null) ?? document.body\n    );\n  }\n  return container;\n}\n\n/**\n * Where a component's portal goes, as a function to call when the portal is\n * created: the target the component was given, else the `portalContainer` a\n * `ConfigProvider` sets, else `document.body`, each read as\n * `resolvePortalContainer` reads it. A component that portals resolves its\n * target through this, so the provider's default reaches it.\n *\n * The hook only reads context, so it is safe to call on the server, ahead of\n * any early return. The function it returns reads the DOM, so call it only\n * where the portal is created, which the server never reaches.\n *\n * @function usePortalContainer\n * @returns A function that takes the component's own target, if any, and\n * returns the DOM node to portal into.\n */\nexport function usePortalContainer(): (\n  container?: string | HTMLElement\n) => HTMLElement {\n  const { portalContainer } = useConfig();\n  return container => resolvePortalContainer(container || portalContainer);\n}\n\n/**\n * The element the overlay around a popup hands it to portal into, `null`\n * outside any, and inside one whose element hasn't mounted yet.\n */\nconst PortalScopeContext = createContext<HTMLElement | null>(null);\n\n/**\n * INTERNAL, deliberately not exported from `src/index.ts`. Makes `node` where\n * the popups inside it portal, unless a `ConfigProvider` sets a\n * `portalContainer`. Modal, Dialog and Command.Dialog wrap their content in\n * it, each with the element that carries their `aria-modal`, since a screen\n * reader that honors it hides everything outside that element. The nearest\n * one wins, so a Dialog's own box wins over the Modal it renders.\n *\n * @function PortalScope\n * @param props - `node`, the element popups portal into, and `children`.\n * @returns The children, inside the scope.\n */\nexport function PortalScope({\n  node,\n  children,\n}: {\n  node: HTMLElement | null;\n  children?: React.ReactNode;\n}) {\n  return (\n    <PortalScopeContext.Provider value={node}>\n      {children}\n    </PortalScopeContext.Provider>\n  );\n}\n\n/**\n * INTERNAL. Where a popup portals, a panel a component opens against\n * something on the page, such as Popover's: the `portalContainer` a\n * `ConfigProvider` sets, else the overlay it's in (see `PortalScope`), else\n * `undefined`, which `resolvePortalContainer` reads as `document.body`.\n *\n * The overlay's element only exists once it has mounted, so a popup open as\n * the overlay first renders mounts in `document.body`, and moves into the\n * overlay in the update that follows, before the browser paints. Moving\n * remounts it, as any change of portal target does. It isn't held back\n * instead, because the popups measure their panel against the trigger as\n * they open, and a panel that isn't there yet is never placed.\n *\n * @function usePopupContainer\n * @returns The popup's container, `undefined` for `document.body`.\n */\nexport function usePopupContainer(): string | HTMLElement | undefined {\n  const { portalContainer } = useConfig();\n  const scope = useContext(PortalScopeContext);\n  return portalContainer || scope || undefined;\n}\n\n/**\n * What a component that takes Modal's `portal` prop does with it now. See\n * `usePortalProp`.\n */\nexport interface PortalPropState {\n  /**\n   * Whether the content renders in its portal: `portal` is set and\n   * hydration is over. Before that it renders in place.\n   */\n  isPortaled: boolean;\n  /**\n   * The target to pass `Portal` as its `container`: the selector or element\n   * `portal` names, or `undefined` for `true`, which leaves the choice to the\n   * `portalContainer` a `ConfigProvider` sets and then `document.body`.\n   */\n  container?: string | HTMLElement;\n  /**\n   * The `portalContainer` a `ConfigProvider` sets, while it's what places the\n   * content (portaled, with `portal` set to `true`), else `undefined`. A\n   * change to it moves the content, so effects that hold its nodes depend\n   * on it.\n   */\n  defaultTarget?: string | HTMLElement;\n}\n\n/**\n * Reads Modal's `portal` prop (`boolean | string | HTMLElement`) for a\n * component that takes it: whether the content is in its portal yet, and\n * where it goes.\n *\n * A portal has no server-rendered counterpart, so such a component renders in\n * place on the server and while hydrating, and moves into its portal once the\n * client takes over. Render the content in `Portal` with\n * `disabled={!isPortaled}` and this `container`. Moving remounts the content,\n * so an effect that holds one of its nodes depends on `isPortaled`, `portal`\n * and `defaultTarget`.\n *\n * @function usePortalProp\n * @param portal - The component's `portal` prop.\n * @returns Whether it's portaled now, its `container`, and the provider's\n * target while that places it.\n */\nexport function usePortalProp(\n  portal?: boolean | string | HTMLElement\n): PortalPropState {\n  const hydrated = useIsHydrated();\n  const { portalContainer } = useConfig();\n  const isPortaled = Boolean(portal) && hydrated;\n  return {\n    isPortaled,\n    container: typeof portal === 'boolean' ? undefined : portal,\n    defaultTarget: isPortaled && portal === true ? portalContainer : undefined,\n  };\n}\n\n/**\n * Props for the Portal component.\n */\nexport interface PortalProps {\n  /** Content to render into the container. */\n  children?: React.ReactNode;\n  /**\n   * Where the content goes: an element, or a `document.querySelector`\n   * selector. Omitted or empty, it goes to the `portalContainer` a\n   * `ConfigProvider` sets, and to `document.body` when none is set. A\n   * selector that matches nothing means `document.body` too. A selector is\n   * looked up again on each render, so the\n   * content follows the target when it changes. Moving to another target\n   * remounts the children and resets their state, which includes a selector\n   * that only starts matching after the content has shown in `document.body`.\n   * Render the target first, or pass the element once you have it.\n   */\n  container?: string | HTMLElement;\n  /**\n   * Render the children in place instead, on the server as well as the\n   * client. Lets a component that portals only sometimes keep a single code\n   * path.\n   * @defaultValue false\n   */\n  disabled?: boolean;\n}\n\n/**\n * Renders its children into another part of the page, `document.body` unless `container` or a `ConfigProvider` says otherwise, so floating content escapes an ancestor's `overflow`, `transform` or stacking context.\n *\n * React's server renderer can't render a portal, so `Portal` renders nothing\n * on the server and during hydration, and mounts its children in the commit\n * that follows. The first client render then matches the server markup. In an app\n * without server rendering it portals on the first render.\n *\n * React context, such as `ConfigProvider`'s class prefix, reaches the\n * portaled children, and their React events bubble through the React tree.\n * CSS inheritance follows the DOM instead: a scoped (non-`isRoot`) `Theme`\n * sets its variables on a wrapper element the portaled content has left, so\n * that content sees the page-level theme, and styles scoped to a shadow root\n * don't reach `document.body` at all. To keep them, portal into an element\n * inside the themed area or the shadow root: pass it as `container`, or as\n * the `portalContainer` of a `ConfigProvider` around that area. The second\n * also reaches what the library's components portal, such as Popover's\n * `appendToBody` panel or a `Modal` with `portal`.\n *\n * Inside a `LocaleProvider`, the children keep its `dir` and `lang`. A\n * container inside the provider's own wrapper takes the children as they\n * are, and they follow the provider through the page. Any other,\n * `document.body` included, gets them inside one `<div>` carrying the\n * provider's values, with `display: contents` so it adds no box. It is\n * still an element, so content that must be the container's direct child,\n * a `<tr>` in a `<tbody>`, or that a direct-child selector styles, belongs\n * in a container inside the provider. Which of the two is settled when the\n * children mount, so a change of locale updates them in place rather than\n * remounting them.\n *\n * Tab order and focus follow the DOM too. Content portaled from inside a\n * focus trap is no longer inside the trapped element, so the trap neither\n * reaches it nor holds focus there: render nested overlays inside the\n * trapped element, or give them a trap of their own. To trap portaled\n * content, put `useFocusTrap`'s ref on the element inside the `Portal`.\n *\n * @function\n * @param {PortalProps} props - Props for the Portal component.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n *\n * @example\n * <Portal>\n *   <div className=\"box\">Rendered at the end of document.body</div>\n * </Portal>\n *\n * @example\n * // Into a dedicated overlay root\n * <Portal container=\"#overlays\">\n *   <CommandPalette />\n * </Portal>\n */\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n  const hydrated = useIsHydrated();\n  const resolveContainer = usePortalContainer();\n  if (disabled) return <>{children}</>;\n  if (!hydrated) return null;\n  const target = resolveContainer(container);\n  return createPortal(\n    <LocalePortalScope target={target}>{children}</LocalePortalScope>,\n    target\n  );\n}\n\n/**\n * INTERNAL. `Portal` for a popup, into the container `usePopupContainer`\n * names, so a popup opened inside a Modal, Dialog or Command.Dialog stays\n * inside it. `disabled` renders the children in place, as `Portal`'s does.\n *\n * @function PopupPortal\n * @param props - The children, and `disabled`.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n */\nexport function PopupPortal({\n  children,\n  disabled = false,\n}: Omit<PortalProps, 'container'>) {\n  const container = usePopupContainer();\n  return (\n    <Portal disabled={disabled} container={container}>\n      {children}\n    </Portal>\n  );\n}\n"],"names":["_jsx","_Fragment"],"mappings":";;;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,SAAU,sBAAsB,CACpC,SAAgC,EAAA;IAEhC,IAAI,CAAC,SAAS,EAAE;QACd,OAAO,QAAQ,CAAC,IAAI;IACtB;AACA,IAAA,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACjC,QAAA,QACG,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAwB,IAAI,QAAQ,CAAC,IAAI;IAE9E;AACA,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;AAcG;SACa,kBAAkB,GAAA;AAGhC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,OAAO,SAAS,IAAI,sBAAsB,CAAC,SAAS,IAAI,eAAe,CAAC;AAC1E;AAEA;;;AAGG;AACH,MAAM,kBAAkB,GAAG,aAAa,CAAqB,IAAI,CAAC;AAElE;;;;;;;;;;;AAWG;SACa,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,GAIT,EAAA;AACC,IAAA,QACEA,GAAA,CAAC,kBAAkB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,IAAI,EAAA,QAAA,EACrC,QAAQ,EAAA,CACmB;AAElC;AAEA;;;;;;;;;;;;;;;AAeG;SACa,iBAAiB,GAAA;AAC/B,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;AACvC,IAAA,MAAM,KAAK,GAAG,UAAU,CAAC,kBAAkB,CAAC;AAC5C,IAAA,OAAO,eAAe,IAAI,KAAK,IAAI,SAAS;AAC9C;AA2BA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,aAAa,CAC3B,MAAuC,EAAA;AAEvC,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,QAAQ;IAC9C,OAAO;QACL,UAAU;AACV,QAAA,SAAS,EAAE,OAAO,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM;AAC3D,QAAA,aAAa,EAAE,UAAU,IAAI,MAAM,KAAK,IAAI,GAAG,eAAe,GAAG,SAAS;KAC3E;AACH;AA6BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDG;AACG,SAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAe,EAAA;AAC3E,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAG,kBAAkB,EAAE;AAC7C,IAAA,IAAI,QAAQ;QAAE,OAAOA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI;AACpC,IAAA,IAAI,CAAC,QAAQ;AAAE,QAAA,OAAO,IAAI;AAC1B,IAAA,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC;AAC1C,IAAA,OAAO,YAAY,CACjBD,GAAA,CAAC,iBAAiB,IAAC,MAAM,EAAE,MAAM,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAqB,EACjE,MAAM,CACP;AACH;AAEA;;;;;;;;;AASG;AACG,SAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,QAAQ,GAAG,KAAK,GACe,EAAA;AAC/B,IAAA,MAAM,SAAS,GAAG,iBAAiB,EAAE;AACrC,IAAA,QACEA,GAAA,CAAC,MAAM,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA,QAAA,EAC7C,QAAQ,EAAA,CACF;AAEb;;"}