@techzyapp/ui-library 1.0.44 → 1.0.45

package/dist/{useOptionMenu-BTt8t9SM.js.map → useOptionMenu-BkKiZ6Ax.js.map}

@@ -1 +1 @@
-{"version":3,"file":"useOptionMenu-BTt8t9SM.js","sources":["../src/components/OptionMenu/OptionMenu.tsx","../src/components/OptionMenu/useOptionMenu.ts"],"sourcesContent":["import type { KeyboardEvent, ReactNode, RefObject } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Icon } from '../Icon'\nimport { List, ListItem, type ListItemSize } from '../List'\nimport { Loader } from '../Loader'\nimport { Typography } from '../Typography'\nimport type { OptionMenuState, SelectOption } from './useOptionMenu'\nimport styles from './OptionMenu.module.css'\n\nexport interface OptionMenuProps {\n  /** The state from `useOptionMenu`. */\n  menu: OptionMenuState\n  /** What the panel anchors under (and matches the width of) — also excluded from outside-click. */\n  anchorRef: RefObject<HTMLElement | null>\n  /** Row size. */\n  size: ListItemSize\n  /** Search box placeholder + accessible label. Defaults to the localized \"Search…\". */\n  searchPlaceholder?: string\n  /** Show a loader row instead of the options (server-side search in flight). */\n  loading?: boolean\n  /** Text next to the loader. Defaults to the localized \"Loading…\". */\n  loadingText?: ReactNode\n  /** Empty-result content — a node or `(query) => node`. Defaults to the localized \"No Options\". */\n  noOptionsText?: ReactNode | ((query: string) => ReactNode)\n  /** Tick the selected option(s). Defaults to `true`. */\n  showSelectedTick?: boolean\n  /** `aria-multiselectable` on the listbox. */\n  multiselectable?: boolean\n  /** Labels the listbox (the field label id). */\n  labelledBy?: string\n  /** Accessible label for the listbox when there's no visible label. */\n  ariaLabel?: string\n  /** Wraps the search box's key handling (e.g. MultiSelect's Backspace-removes-a-chip). */\n  onSearchKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void\n  /** Extra class on the panel. */\n  className?: string\n}\n\n/**\n * The option popover shared by `Select`, `MultiSelect` and `PhoneField` (internal): a `FloatingPanel`\n * anchored under the field, an optional sticky search box (`role=\"combobox\"`, `aria-activedescendant`),\n * and a scrolling `role=\"listbox\"` of `ListItem` options — icon, label, the option's `trailing`, a tick\n * when selected, the keyboard highlight, disabled rows inert, `group`ed options under a labelled heading —\n * plus the loading and empty rows. All state\n * and keys live in `useOptionMenu`; this only renders it.\n */\nexport function OptionMenu({\n  menu,\n  anchorRef,\n  size,\n  searchPlaceholder,\n  loading = false,\n  loadingText,\n  noOptionsText,\n  showSelectedTick = true,\n  multiselectable = false,\n  labelledBy,\n  ariaLabel,\n  onSearchKeyDown,\n  className,\n}: OptionMenuProps) {\n  const t = useT()\n  const searchPh = searchPlaceholder ?? t('common.search')\n  const { filteredOptions, highlightedIndex } = menu\n\n  const renderOption = ({ opt, index }: { opt: SelectOption; index: number }) => {\n    const selected = menu.isSelected(opt)\n    const tick = selected && showSelectedTick\n    return (\n      <ListItem\n        key={opt.value}\n        id={menu.optionId(index)}\n        role=\"option\"\n        tabIndex={-1}\n        aria-selected={selected}\n        aria-current={undefined}\n        clickable\n        selected={selected}\n        disabled={opt.disabled}\n        icon={opt.icon}\n        className={clsx(index === highlightedIndex && styles.active)}\n        trailing={\n          opt.trailing != null || tick ? (\n            <span className={styles.trailing}>\n              {opt.trailing}\n              {tick && <Icon name=\"TickCircle\" size=\"sm\" />}\n            </span>\n          ) : undefined\n        }\n        onMouseEnter={() => !opt.disabled && menu.setHighlightedIndex(index)}\n        // keep focus where it is (trigger / search box) — a multi-select stays open and typing keeps\n        // working; a single-select refocuses its trigger on close anyway\n        onMouseDown={(e) => e.preventDefault()}\n        onClick={() => menu.pick(opt)}\n      >\n        {opt.label}\n      </ListItem>\n    )\n  }\n\n  // consecutive runs of the same `group` (the hook already gathered them) → a labelled role=\"group\"\n  // each; ungrouped runs render as plain rows\n  const renderRows = (rows: { opt: SelectOption; index: number }[]) => {\n    if (!rows.some((r) => r.opt.group != null)) return rows.map(renderOption)\n    const runs: { group: string | undefined; rows: typeof rows }[] = []\n    for (const row of rows) {\n      const last = runs[runs.length - 1]\n      if (last && last.group === row.opt.group) last.rows.push(row)\n      else runs.push({ group: row.opt.group, rows: [row] })\n    }\n    return runs.map((run, i) => {\n      if (run.group == null) return run.rows.map(renderOption)\n      const headingId = `${menu.listboxId}-group-${i}`\n      return (\n        <div key={`group-${i}`} role=\"group\" aria-labelledby={headingId} className={styles.group}>\n          <Typography\n            as=\"div\"\n            id={headingId}\n            role=\"presentation\"\n            variant=\"caption\"\n            color=\"muted\"\n            uppercase\n            className={styles.groupLabel}\n          >\n            {run.group}\n          </Typography>\n          {run.rows.map(renderOption)}\n        </div>\n      )\n    })\n  }\n\n  return (\n    <FloatingPanel\n      ref={menu.popoverRef}\n      open={menu.open}\n      triggerRef={anchorRef}\n      onClose={menu.closeMenu}\n      matchTriggerWidth\n      className={clsx(styles.popover, className)}\n    >\n      {menu.searchable && (\n        <div className={styles.search}>\n          <Icon name=\"SearchNormal\" size=\"sm\" className={styles.searchIcon} aria-hidden=\"true\" />\n          <input\n            ref={menu.searchInputRef}\n            className={styles.searchInput}\n            type=\"text\"\n            role=\"combobox\"\n            aria-expanded=\"true\"\n            aria-controls={menu.listboxId}\n            aria-activedescendant={menu.activeId}\n            aria-autocomplete=\"list\"\n            aria-label={searchPh}\n            placeholder={searchPh}\n            value={menu.searchQuery}\n            spellCheck={false}\n            autoComplete=\"off\"\n            onChange={(e) => menu.setSearchQuery(e.target.value)}\n            onKeyDown={onSearchKeyDown ?? menu.handleKeyDown}\n          />\n        </div>\n      )}\n\n      {/* the listbox always carries its id (even when empty) so aria-controls never dangles */}\n      <List\n        role=\"listbox\"\n        id={menu.listboxId}\n        aria-labelledby={labelledBy}\n        aria-label={labelledBy ? undefined : ariaLabel}\n        aria-multiselectable={multiselectable || undefined}\n        size={size}\n        className={styles.listbox}\n        // clear the mouse highlight when the pointer leaves the list (no lingering hover)\n        onMouseLeave={() => menu.setHighlightedIndex(-1)}\n      >\n        {loading ? (\n          <div className={styles.loading}>\n            <Loader size=\"sm\" />\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {loadingText ?? t('common.loading')}\n            </Typography>\n          </div>\n        ) : filteredOptions.length === 0 ? (\n          <div className={styles.noOptions}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {noOptionsText == null\n                ? t('select.noOptions')\n                : typeof noOptionsText === 'function'\n                  ? noOptionsText(menu.searchQuery)\n                  : noOptionsText}\n            </Typography>\n          </div>\n        ) : (\n          renderRows(filteredOptions.map((opt, index) => ({ opt, index })))\n        )}\n      </List>\n    </FloatingPanel>\n  )\n}\n","import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type RefObject,\n} from 'react'\nimport type { ReactNode } from 'react'\nimport type { IconName } from '../../icons/names'\n\n/** A single selectable option — shared by `Select`, `MultiSelect` and `PhoneField`. */\nexport interface SelectOption {\n  /** The value committed when this option is chosen. */\n  value: string\n  /** Display + search text. */\n  label: string\n  /** Greys out and blocks selecting this option. */\n  disabled?: boolean\n  /** Leading icon — a known `IconName` (rendered as `<Icon>`) or any node. */\n  icon?: IconName | ReactNode\n  /**\n   * Extra search terms matched alongside the label (case-insensitive, substring) — e.g. a currency's\n   * code (`'USD'`) or a country's calling code (`'995'`). Never shown.\n   */\n  keywords?: readonly string[]\n  /** Content on the right of the row, before the selected tick (e.g. a code or a count). */\n  trailing?: ReactNode\n  /**\n   * Group heading. Options sharing a `group` are listed together under it (groups in order of first\n   * appearance, options keeping their order within a group); options without one stay ungrouped.\n   */\n  group?: string\n}\n\n/**\n * Stable-group the options: each group gathered at its first appearance, order kept within a group. A\n * list with no `group` at all is returned untouched (the common case costs nothing).\n */\nexport function groupOptions<T extends SelectOption>(options: readonly T[]): readonly T[] {\n  if (!options.some((o) => o.group != null)) return options\n  const buckets = new Map<string | undefined, T[]>()\n  for (const o of options) {\n    const bucket = buckets.get(o.group)\n    if (bucket) bucket.push(o)\n    else buckets.set(o.group, [o])\n  }\n  return [...buckets.values()].flat()\n}\n\nexport interface UseOptionMenuOptions {\n  /** Base for the listbox / option ids (`${idBase}-listbox`, `${idBase}-opt-${i}`). */\n  idBase: string\n  options: readonly SelectOption[]\n  /** Whether an option is selected (drives the initial highlight when `highlightSelected`). */\n  isSelected: (option: SelectOption) => boolean\n  /** Called when an option is picked (Enter / Space / click). */\n  onPick: (option: SelectOption) => void\n  /** Close the menu after a pick (single-select) or keep it open (multi-select). Defaults to `true`. */\n  closeOnPick?: boolean\n  /** On open, highlight the selected option (single-select) instead of the first. Defaults to `true`. */\n  highlightSelected?: boolean\n  /** Show a search box that filters by label + keywords. */\n  searchable?: boolean\n  /** The consumer filters `options` itself (server-side search) — skip the local filter. */\n  onSearchChange?: (query: string) => void\n  disabled?: boolean\n  /** The element focus returns to when the menu closes with `refocus` (the trigger / the input). */\n  focusRef: RefObject<HTMLElement | null>\n  /** Runs on every close (e.g. mark a form field touched). */\n  onClose?: () => void\n}\n\n/**\n * The state + keyboard model behind every option popover (internal): open / close, the search query\n * and its label + keywords filter, the highlighted row (skipping disabled ones), type-ahead when not\n * searchable, and one `handleKeyDown` for the trigger and the search box — Arrow / Home / End move,\n * Enter / Space pick, Escape closes (refocusing), Tab closes and moves on. Render it with `OptionMenu`.\n */\nexport function useOptionMenu({\n  idBase,\n  options,\n  isSelected,\n  onPick,\n  closeOnPick = true,\n  highlightSelected = true,\n  searchable = false,\n  onSearchChange,\n  disabled = false,\n  focusRef,\n  onClose,\n}: UseOptionMenuOptions) {\n  const listboxId = `${idBase}-listbox`\n  const optionId = useCallback((index: number) => `${idBase}-opt-${index}`, [idBase])\n\n  const [open, setOpen] = useState(false)\n  const [searchQuery, setSearchQueryState] = useState('')\n  const [highlightedIndex, setHighlightedIndex] = useState(-1)\n  const searchInputRef = useRef<HTMLInputElement | null>(null)\n  // the floating panel forwards its node here, for the focus-leaves-the-widget check on blur\n  const popoverRef = useRef<HTMLDivElement | null>(null)\n  const typeahead = useRef({ buffer: '', timer: 0 })\n  // latest callbacks without re-creating the stable handlers\n  const onCloseRef = useRef(onClose)\n  onCloseRef.current = onClose\n\n  // local filter by label + keywords (skipped when the consumer owns the options — server search), then\n  // grouped, so the flat index the keyboard walks is exactly the rendered order\n  const filteredOptions = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase()\n    const matches =\n      !searchable || onSearchChange || !q\n        ? options\n        : options.filter(\n            (o) =>\n              o.label.toLowerCase().includes(q) ||\n              o.keywords?.some((k) => k.toLowerCase().includes(q)),\n          )\n    return groupOptions(matches)\n  }, [searchable, onSearchChange, searchQuery, options])\n\n  const findEnabled = useCallback(\n    (start: number, delta: number) => {\n      let i = start\n      while (i >= 0 && i < filteredOptions.length) {\n        if (!filteredOptions[i].disabled) return i\n        i += delta\n      }\n      return -1\n    },\n    [filteredOptions],\n  )\n\n  // single dismiss path: clears the search + type-ahead, notifies, optionally refocuses\n  const closeMenu = useCallback(\n    (refocus: boolean) => {\n      setOpen(false)\n      setSearchQueryState('')\n      window.clearTimeout(typeahead.current.timer)\n      typeahead.current.buffer = ''\n      onCloseRef.current?.()\n      if (refocus) focusRef.current?.focus()\n    },\n    [focusRef],\n  )\n\n  // on open: highlight the selected option (or the first enabled), focus the search box\n  useEffect(() => {\n    if (!open) return\n    const selIdx = highlightSelected ? filteredOptions.findIndex(isSelected) : -1\n    setHighlightedIndex(\n      selIdx >= 0 && !filteredOptions[selIdx].disabled ? selIdx : findEnabled(0, 1),\n    )\n    if (searchable) requestAnimationFrame(() => searchInputRef.current?.focus())\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  // keep the highlighted option scrolled into view\n  useEffect(() => {\n    if (!open || highlightedIndex < 0) return\n    document.getElementById(optionId(highlightedIndex))?.scrollIntoView?.({ block: 'nearest' })\n  }, [open, highlightedIndex, optionId])\n\n  // a new search → re-anchor the highlight to the first match\n  useEffect(() => {\n    if (open && searchable) setHighlightedIndex(findEnabled(0, 1))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchQuery])\n\n  // the option count changed while open (async load / list shrink) → keep the highlight in range\n  useEffect(() => {\n    if (open) setHighlightedIndex((i) => (i < filteredOptions.length ? i : findEnabled(0, 1)))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [filteredOptions.length])\n\n  const openMenu = () => {\n    if (!disabled) setOpen(true)\n  }\n  const toggleMenu = () => (open ? closeMenu(false) : openMenu())\n\n  const setSearchQuery = (query: string) => {\n    setSearchQueryState(query)\n    onSearchChange?.(query)\n  }\n\n  const pick = (option: SelectOption | undefined) => {\n    if (!option || option.disabled) return\n    onPick(option)\n    if (closeOnPick) closeMenu(true)\n  }\n\n  const moveHighlight = (delta: number) => {\n    setHighlightedIndex((cur) => {\n      const start = cur < 0 ? (delta > 0 ? 0 : filteredOptions.length - 1) : cur + delta\n      const found = findEnabled(start, delta)\n      return found === -1 ? cur : found\n    })\n  }\n\n  // type-ahead (no search box): jump to the option whose label starts with the typed buffer\n  const handleTypeahead = (char: string) => {\n    const t = typeahead.current\n    window.clearTimeout(t.timer)\n    t.buffer += char.toLowerCase()\n    t.timer = window.setTimeout(() => (t.buffer = ''), 500)\n    const match = filteredOptions.findIndex(\n      (o) => !o.disabled && o.label.toLowerCase().startsWith(t.buffer),\n    )\n    if (match >= 0) setHighlightedIndex(match)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (disabled) return\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault()\n        open ? moveHighlight(1) : openMenu()\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        open ? moveHighlight(-1) : openMenu()\n        break\n      case 'Enter':\n        event.preventDefault()\n        if (!open) openMenu()\n        else pick(filteredOptions[highlightedIndex])\n        break\n      case ' ':\n        // Space opens a closed menu; picks only when open without a search box (so search can type spaces)\n        if (!open) {\n          event.preventDefault()\n          openMenu()\n        } else if (!searchable) {\n          event.preventDefault()\n          pick(filteredOptions[highlightedIndex])\n        }\n        break\n      case 'Escape':\n        if (open) {\n          event.preventDefault()\n          event.stopPropagation() // don't let FloatingPanel's own Escape also fire closeMenu\n          closeMenu(true)\n        }\n        break\n      case 'Tab':\n        // refocus the trigger so Tab continues from the field's visual spot, not the portaled search\n        // input's DOM position (end of <body>); no preventDefault — let Tab move on\n        if (open) closeMenu(true)\n        break\n      case 'Home':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(0, 1))\n        }\n        break\n      case 'End':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(filteredOptions.length - 1, -1))\n        }\n        break\n      default:\n        if (\n          !searchable &&\n          open &&\n          event.key.length === 1 &&\n          !event.metaKey &&\n          !event.ctrlKey &&\n          !event.altKey\n        ) {\n          handleTypeahead(event.key)\n        }\n    }\n  }\n\n  const activeId = open && highlightedIndex >= 0 ? optionId(highlightedIndex) : undefined\n\n  return {\n    open,\n    openMenu,\n    closeMenu,\n    toggleMenu,\n    searchable,\n    searchQuery,\n    setSearchQuery,\n    filteredOptions,\n    highlightedIndex,\n    setHighlightedIndex,\n    isSelected,\n    pick,\n    handleKeyDown,\n    listboxId,\n    optionId,\n    activeId,\n    searchInputRef,\n    popoverRef,\n  }\n}\n\n/** Everything `useOptionMenu` returns — pass it to `<OptionMenu menu={…} />`. */\nexport type OptionMenuState = ReturnType<typeof useOptionMenu>\n"],"names":["OptionMenu","menu","anchorRef","size","searchPlaceholder","loading","loadingText","noOptionsText","showSelectedTick","multiselectable","labelledBy","ariaLabel","onSearchKeyDown","className","useT","searchPh","filteredOptions","highlightedIndex","renderOption","opt","index","selected","tick","jsx","ListItem","clsx","styles","jsxs","Icon","e","renderRows","rows","r","runs","row","last","run","i","headingId","Typography","FloatingPanel","List","Loader","groupOptions","options","o","buckets","bucket","useOptionMenu","idBase","isSelected","onPick","closeOnPick","highlightSelected","searchable","onSearchChange","disabled","focusRef","onClose","listboxId","optionId","useCallback","open","setOpen","useState","searchQuery","setSearchQueryState","setHighlightedIndex","searchInputRef","useRef","popoverRef","typeahead","onCloseRef","useMemo","q","matches","_a","k","findEnabled","start","delta","closeMenu","refocus","_b","useEffect","selIdx","openMenu","toggleMenu","setSearchQuery","query","pick","option","moveHighlight","cur","found","handleTypeahead","char","t","match","handleKeyDown","event","activeId"],"mappings":"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"}
+{"version":3,"file":"useOptionMenu-BkKiZ6Ax.js","sources":["../src/components/OptionMenu/OptionMenu.tsx","../src/components/OptionMenu/useOptionMenu.ts"],"sourcesContent":["import type { KeyboardEvent, ReactNode, RefObject } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Icon } from '../Icon'\nimport { List, ListItem, type ListItemSize } from '../List'\nimport { Loader } from '../Loader'\nimport { Typography } from '../Typography'\nimport type { OptionMenuState, SelectOption } from './useOptionMenu'\nimport styles from './OptionMenu.module.css'\n\nexport interface OptionMenuProps {\n  /** The state from `useOptionMenu`. */\n  menu: OptionMenuState\n  /** What the panel anchors under (and matches the width of) — also excluded from outside-click. */\n  anchorRef: RefObject<HTMLElement | null>\n  /** Row size. */\n  size: ListItemSize\n  /** Search box placeholder + accessible label. Defaults to the localized \"Search…\". */\n  searchPlaceholder?: string\n  /** Show a loader row instead of the options (server-side search in flight). */\n  loading?: boolean\n  /** Text next to the loader. Defaults to the localized \"Loading…\". */\n  loadingText?: ReactNode\n  /** Empty-result content — a node or `(query) => node`. Defaults to the localized \"No Options\". */\n  noOptionsText?: ReactNode | ((query: string) => ReactNode)\n  /** Tick the selected option(s). Defaults to `true`. */\n  showSelectedTick?: boolean\n  /** `aria-multiselectable` on the listbox. */\n  multiselectable?: boolean\n  /** Labels the listbox (the field label id). */\n  labelledBy?: string\n  /** Accessible label for the listbox when there's no visible label. */\n  ariaLabel?: string\n  /** Wraps the search box's key handling (e.g. MultiSelect's Backspace-removes-a-chip). */\n  onSearchKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void\n  /** Extra class on the panel. */\n  className?: string\n}\n\n/**\n * The option popover shared by `Select`, `MultiSelect` and `PhoneField` (internal): a `FloatingPanel`\n * anchored under the field, an optional sticky search box (`role=\"combobox\"`, `aria-activedescendant`),\n * and a scrolling `role=\"listbox\"` of `ListItem` options — icon, label, the option's `trailing`, a tick\n * when selected, the keyboard highlight, disabled rows inert, `group`ed options under a labelled heading —\n * plus the loading and empty rows. All state\n * and keys live in `useOptionMenu`; this only renders it.\n */\nexport function OptionMenu({\n  menu,\n  anchorRef,\n  size,\n  searchPlaceholder,\n  loading = false,\n  loadingText,\n  noOptionsText,\n  showSelectedTick = true,\n  multiselectable = false,\n  labelledBy,\n  ariaLabel,\n  onSearchKeyDown,\n  className,\n}: OptionMenuProps) {\n  const t = useT()\n  const searchPh = searchPlaceholder ?? t('common.search')\n  const { filteredOptions, highlightedIndex } = menu\n\n  const renderOption = ({ opt, index }: { opt: SelectOption; index: number }) => {\n    const selected = menu.isSelected(opt)\n    const tick = selected && showSelectedTick\n    return (\n      <ListItem\n        key={opt.value}\n        id={menu.optionId(index)}\n        role=\"option\"\n        tabIndex={-1}\n        aria-selected={selected}\n        aria-current={undefined}\n        clickable\n        selected={selected}\n        disabled={opt.disabled}\n        icon={opt.icon}\n        className={clsx(index === highlightedIndex && styles.active)}\n        trailing={\n          opt.trailing != null || tick ? (\n            <span className={styles.trailing}>\n              {opt.trailing}\n              {tick && <Icon name=\"TickCircle\" size=\"sm\" />}\n            </span>\n          ) : undefined\n        }\n        onMouseEnter={() => !opt.disabled && menu.setHighlightedIndex(index)}\n        // keep focus where it is (trigger / search box) — a multi-select stays open and typing keeps\n        // working; a single-select refocuses its trigger on close anyway\n        onMouseDown={(e) => e.preventDefault()}\n        onClick={() => menu.pick(opt)}\n      >\n        {opt.label}\n      </ListItem>\n    )\n  }\n\n  // consecutive runs of the same `group` (the hook already gathered them) → a labelled role=\"group\"\n  // each; ungrouped runs render as plain rows\n  const renderRows = (rows: { opt: SelectOption; index: number }[]) => {\n    if (!rows.some((r) => r.opt.group != null)) return rows.map(renderOption)\n    const runs: { group: string | undefined; rows: typeof rows }[] = []\n    for (const row of rows) {\n      const last = runs[runs.length - 1]\n      if (last && last.group === row.opt.group) last.rows.push(row)\n      else runs.push({ group: row.opt.group, rows: [row] })\n    }\n    return runs.map((run, i) => {\n      if (run.group == null) return run.rows.map(renderOption)\n      const headingId = `${menu.listboxId}-group-${i}`\n      return (\n        <div key={`group-${i}`} role=\"group\" aria-labelledby={headingId} className={styles.group}>\n          <Typography\n            as=\"div\"\n            id={headingId}\n            role=\"presentation\"\n            variant=\"caption\"\n            color=\"muted\"\n            uppercase\n            className={styles.groupLabel}\n          >\n            {run.group}\n          </Typography>\n          {run.rows.map(renderOption)}\n        </div>\n      )\n    })\n  }\n\n  return (\n    <FloatingPanel\n      ref={menu.popoverRef}\n      open={menu.open}\n      triggerRef={anchorRef}\n      onClose={menu.closeMenu}\n      matchTriggerWidth\n      className={clsx(styles.popover, className)}\n    >\n      {menu.searchable && (\n        <div className={styles.search}>\n          <Icon name=\"SearchNormal\" size=\"sm\" className={styles.searchIcon} aria-hidden=\"true\" />\n          <input\n            ref={menu.searchInputRef}\n            className={styles.searchInput}\n            type=\"text\"\n            role=\"combobox\"\n            aria-expanded=\"true\"\n            aria-controls={menu.listboxId}\n            aria-activedescendant={menu.activeId}\n            aria-autocomplete=\"list\"\n            aria-label={searchPh}\n            placeholder={searchPh}\n            value={menu.searchQuery}\n            spellCheck={false}\n            autoComplete=\"off\"\n            onChange={(e) => menu.setSearchQuery(e.target.value)}\n            onKeyDown={onSearchKeyDown ?? menu.handleKeyDown}\n          />\n        </div>\n      )}\n\n      {/* the listbox always carries its id (even when empty) so aria-controls never dangles */}\n      <List\n        role=\"listbox\"\n        id={menu.listboxId}\n        aria-labelledby={labelledBy}\n        aria-label={labelledBy ? undefined : ariaLabel}\n        aria-multiselectable={multiselectable || undefined}\n        size={size}\n        className={styles.listbox}\n        // clear the mouse highlight when the pointer leaves the list (no lingering hover)\n        onMouseLeave={() => menu.setHighlightedIndex(-1)}\n      >\n        {loading ? (\n          <div className={styles.loading}>\n            <Loader size=\"sm\" />\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {loadingText ?? t('common.loading')}\n            </Typography>\n          </div>\n        ) : filteredOptions.length === 0 ? (\n          <div className={styles.noOptions}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {noOptionsText == null\n                ? t('select.noOptions')\n                : typeof noOptionsText === 'function'\n                  ? noOptionsText(menu.searchQuery)\n                  : noOptionsText}\n            </Typography>\n          </div>\n        ) : (\n          renderRows(filteredOptions.map((opt, index) => ({ opt, index })))\n        )}\n      </List>\n    </FloatingPanel>\n  )\n}\n","import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type RefObject,\n} from 'react'\nimport type { ReactNode } from 'react'\nimport type { IconName } from '../../icons/names'\n\n/** A single selectable option — shared by `Select`, `MultiSelect` and `PhoneField`. */\nexport interface SelectOption {\n  /** The value committed when this option is chosen. */\n  value: string\n  /** Display + search text. */\n  label: string\n  /** Greys out and blocks selecting this option. */\n  disabled?: boolean\n  /** Leading icon — a known `IconName` (rendered as `<Icon>`) or any node. */\n  icon?: IconName | ReactNode\n  /**\n   * Extra search terms matched alongside the label (case-insensitive, substring) — e.g. a currency's\n   * code (`'USD'`) or a country's calling code (`'995'`). Never shown.\n   */\n  keywords?: readonly string[]\n  /** Content on the right of the row, before the selected tick (e.g. a code or a count). */\n  trailing?: ReactNode\n  /**\n   * Group heading. Options sharing a `group` are listed together under it (groups in order of first\n   * appearance, options keeping their order within a group); options without one stay ungrouped.\n   */\n  group?: string\n}\n\n/**\n * Stable-group the options: each group gathered at its first appearance, order kept within a group. A\n * list with no `group` at all is returned untouched (the common case costs nothing).\n */\nexport function groupOptions<T extends SelectOption>(options: readonly T[]): readonly T[] {\n  if (!options.some((o) => o.group != null)) return options\n  const buckets = new Map<string | undefined, T[]>()\n  for (const o of options) {\n    const bucket = buckets.get(o.group)\n    if (bucket) bucket.push(o)\n    else buckets.set(o.group, [o])\n  }\n  return [...buckets.values()].flat()\n}\n\nexport interface UseOptionMenuOptions {\n  /** Base for the listbox / option ids (`${idBase}-listbox`, `${idBase}-opt-${i}`). */\n  idBase: string\n  options: readonly SelectOption[]\n  /** Whether an option is selected (drives the initial highlight when `highlightSelected`). */\n  isSelected: (option: SelectOption) => boolean\n  /** Called when an option is picked (Enter / Space / click). */\n  onPick: (option: SelectOption) => void\n  /** Close the menu after a pick (single-select) or keep it open (multi-select). Defaults to `true`. */\n  closeOnPick?: boolean\n  /** On open, highlight the selected option (single-select) instead of the first. Defaults to `true`. */\n  highlightSelected?: boolean\n  /** Show a search box that filters by label + keywords. */\n  searchable?: boolean\n  /** The consumer filters `options` itself (server-side search) — skip the local filter. */\n  onSearchChange?: (query: string) => void\n  disabled?: boolean\n  /** The element focus returns to when the menu closes with `refocus` (the trigger / the input). */\n  focusRef: RefObject<HTMLElement | null>\n  /** Runs on every close (e.g. mark a form field touched). */\n  onClose?: () => void\n}\n\n/**\n * The state + keyboard model behind every option popover (internal): open / close, the search query\n * and its label + keywords filter, the highlighted row (skipping disabled ones), type-ahead when not\n * searchable, and one `handleKeyDown` for the trigger and the search box — Arrow / Home / End move,\n * Enter / Space pick, Escape closes (refocusing), Tab closes and moves on. Render it with `OptionMenu`.\n */\nexport function useOptionMenu({\n  idBase,\n  options,\n  isSelected,\n  onPick,\n  closeOnPick = true,\n  highlightSelected = true,\n  searchable = false,\n  onSearchChange,\n  disabled = false,\n  focusRef,\n  onClose,\n}: UseOptionMenuOptions) {\n  const listboxId = `${idBase}-listbox`\n  const optionId = useCallback((index: number) => `${idBase}-opt-${index}`, [idBase])\n\n  const [open, setOpen] = useState(false)\n  const [searchQuery, setSearchQueryState] = useState('')\n  const [highlightedIndex, setHighlightedIndex] = useState(-1)\n  const searchInputRef = useRef<HTMLInputElement | null>(null)\n  // the floating panel forwards its node here, for the focus-leaves-the-widget check on blur\n  const popoverRef = useRef<HTMLDivElement | null>(null)\n  const typeahead = useRef({ buffer: '', timer: 0 })\n  // latest callbacks without re-creating the stable handlers\n  const onCloseRef = useRef(onClose)\n  onCloseRef.current = onClose\n\n  // local filter by label + keywords (skipped when the consumer owns the options — server search), then\n  // grouped, so the flat index the keyboard walks is exactly the rendered order\n  const filteredOptions = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase()\n    const matches =\n      !searchable || onSearchChange || !q\n        ? options\n        : options.filter(\n            (o) =>\n              o.label.toLowerCase().includes(q) ||\n              o.keywords?.some((k) => k.toLowerCase().includes(q)),\n          )\n    return groupOptions(matches)\n  }, [searchable, onSearchChange, searchQuery, options])\n\n  const findEnabled = useCallback(\n    (start: number, delta: number) => {\n      let i = start\n      while (i >= 0 && i < filteredOptions.length) {\n        if (!filteredOptions[i].disabled) return i\n        i += delta\n      }\n      return -1\n    },\n    [filteredOptions],\n  )\n\n  // single dismiss path: clears the search + type-ahead, notifies, optionally refocuses\n  const closeMenu = useCallback(\n    (refocus: boolean) => {\n      setOpen(false)\n      setSearchQueryState('')\n      window.clearTimeout(typeahead.current.timer)\n      typeahead.current.buffer = ''\n      onCloseRef.current?.()\n      if (refocus) focusRef.current?.focus()\n    },\n    [focusRef],\n  )\n\n  // on open: highlight the selected option (or the first enabled), focus the search box\n  useEffect(() => {\n    if (!open) return\n    const selIdx = highlightSelected ? filteredOptions.findIndex(isSelected) : -1\n    setHighlightedIndex(\n      selIdx >= 0 && !filteredOptions[selIdx].disabled ? selIdx : findEnabled(0, 1),\n    )\n    if (searchable) requestAnimationFrame(() => searchInputRef.current?.focus())\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  // keep the highlighted option scrolled into view\n  useEffect(() => {\n    if (!open || highlightedIndex < 0) return\n    document.getElementById(optionId(highlightedIndex))?.scrollIntoView?.({ block: 'nearest' })\n  }, [open, highlightedIndex, optionId])\n\n  // a new search → re-anchor the highlight to the first match\n  useEffect(() => {\n    if (open && searchable) setHighlightedIndex(findEnabled(0, 1))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchQuery])\n\n  // the option count changed while open (async load / list shrink) → keep the highlight in range\n  useEffect(() => {\n    if (open) setHighlightedIndex((i) => (i < filteredOptions.length ? i : findEnabled(0, 1)))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [filteredOptions.length])\n\n  const openMenu = () => {\n    if (!disabled) setOpen(true)\n  }\n  const toggleMenu = () => (open ? closeMenu(false) : openMenu())\n\n  const setSearchQuery = (query: string) => {\n    setSearchQueryState(query)\n    onSearchChange?.(query)\n  }\n\n  const pick = (option: SelectOption | undefined) => {\n    if (!option || option.disabled) return\n    onPick(option)\n    if (closeOnPick) closeMenu(true)\n  }\n\n  const moveHighlight = (delta: number) => {\n    setHighlightedIndex((cur) => {\n      const start = cur < 0 ? (delta > 0 ? 0 : filteredOptions.length - 1) : cur + delta\n      const found = findEnabled(start, delta)\n      return found === -1 ? cur : found\n    })\n  }\n\n  // type-ahead (no search box): jump to the option whose label starts with the typed buffer\n  const handleTypeahead = (char: string) => {\n    const t = typeahead.current\n    window.clearTimeout(t.timer)\n    t.buffer += char.toLowerCase()\n    t.timer = window.setTimeout(() => (t.buffer = ''), 500)\n    const match = filteredOptions.findIndex(\n      (o) => !o.disabled && o.label.toLowerCase().startsWith(t.buffer),\n    )\n    if (match >= 0) setHighlightedIndex(match)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (disabled) return\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault()\n        open ? moveHighlight(1) : openMenu()\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        open ? moveHighlight(-1) : openMenu()\n        break\n      case 'Enter':\n        event.preventDefault()\n        if (!open) openMenu()\n        else pick(filteredOptions[highlightedIndex])\n        break\n      case ' ':\n        // Space opens a closed menu; picks only when open without a search box (so search can type spaces)\n        if (!open) {\n          event.preventDefault()\n          openMenu()\n        } else if (!searchable) {\n          event.preventDefault()\n          pick(filteredOptions[highlightedIndex])\n        }\n        break\n      case 'Escape':\n        if (open) {\n          event.preventDefault()\n          event.stopPropagation() // don't let FloatingPanel's own Escape also fire closeMenu\n          closeMenu(true)\n        }\n        break\n      case 'Tab':\n        // refocus the trigger so Tab continues from the field's visual spot, not the portaled search\n        // input's DOM position (end of <body>); no preventDefault — let Tab move on\n        if (open) closeMenu(true)\n        break\n      case 'Home':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(0, 1))\n        }\n        break\n      case 'End':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(filteredOptions.length - 1, -1))\n        }\n        break\n      default:\n        if (\n          !searchable &&\n          open &&\n          event.key.length === 1 &&\n          !event.metaKey &&\n          !event.ctrlKey &&\n          !event.altKey\n        ) {\n          handleTypeahead(event.key)\n        }\n    }\n  }\n\n  const activeId = open && highlightedIndex >= 0 ? optionId(highlightedIndex) : undefined\n\n  return {\n    open,\n    openMenu,\n    closeMenu,\n    toggleMenu,\n    searchable,\n    searchQuery,\n    setSearchQuery,\n    filteredOptions,\n    highlightedIndex,\n    setHighlightedIndex,\n    isSelected,\n    pick,\n    handleKeyDown,\n    listboxId,\n    optionId,\n    activeId,\n    searchInputRef,\n    popoverRef,\n  }\n}\n\n/** Everything `useOptionMenu` returns — pass it to `<OptionMenu menu={…} />`. */\nexport type OptionMenuState = ReturnType<typeof useOptionMenu>\n"],"names":["OptionMenu","menu","anchorRef","size","searchPlaceholder","loading","loadingText","noOptionsText","showSelectedTick","multiselectable","labelledBy","ariaLabel","onSearchKeyDown","className","useT","searchPh","filteredOptions","highlightedIndex","renderOption","opt","index","selected","tick","jsx","ListItem","clsx","styles","jsxs","Icon","e","renderRows","rows","r","runs","row","last","run","i","headingId","Typography","FloatingPanel","List","Loader","groupOptions","options","o","buckets","bucket","useOptionMenu","idBase","isSelected","onPick","closeOnPick","highlightSelected","searchable","onSearchChange","disabled","focusRef","onClose","listboxId","optionId","useCallback","open","setOpen","useState","searchQuery","setSearchQueryState","setHighlightedIndex","searchInputRef","useRef","popoverRef","typeahead","onCloseRef","useMemo","q","matches","_a","k","findEnabled","start","delta","closeMenu","refocus","_b","useEffect","selIdx","openMenu","toggleMenu","setSearchQuery","query","pick","option","moveHighlight","cur","found","handleTypeahead","char","t","match","handleKeyDown","event","activeId"],"mappings":"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"}

package/dist/{useOptionMenu-B40OOVsO.cjs → useOptionMenu-CVl7VHXl.cjs}

@@ -1,2 +1,2 @@
-"use strict";const c=require("react/jsx-runtime"),Q=require("clsx"),W=require("./FloatingPanel-tGCG2nhA.cjs"),$=require("./Icon-CBg21lKA.cjs"),U=require("./List-CLUXeaXS.cjs"),V=require("./ListItem-CguNjf-u.cjs"),G=require("./Loader-DNR2_YHm.cjs"),C=require("./Typography-d97DdbNd.cjs"),J=require("./ConfigProvider-Cf-awvZs.cjs"),l=require("react"),X="_popover_rf9kn_3",Y="_search_rf9kn_11",Z="_searchIcon_rf9kn_20",B="_searchInput_rf9kn_24",ee="_listbox_rf9kn_40",te="_active_rf9kn_48",re="_noOptions_rf9kn_52",se="_loading_rf9kn_58",oe="_group_rf9kn_68",ne="_groupLabel_rf9kn_80",ae="_trailing_rf9kn_86",h={popover:X,search:Y,searchIcon:Z,searchInput:B,listbox:ee,active:te,noOptions:re,loading:se,group:oe,groupLabel:ne,trailing:ae};function ie({menu:t,anchorRef:m,size:g,searchPlaceholder:_,loading:O=!1,loadingText:E,noOptionsText:d,showSelectedTick:x=!0,multiselectable:M=!1,labelledBy:j,ariaLabel:N,onSearchKeyDown:R,className:y}){const r=J.useT(),L=_??r("common.search"),{filteredOptions:I,highlightedIndex:q}=t,f=({opt:o,index:p})=>{const n=t.isSelected(o),u=n&&x;return c.jsx(V.ListItem,{id:t.optionId(p),role:"option",tabIndex:-1,"aria-selected":n,"aria-current":void 0,clickable:!0,selected:n,disabled:o.disabled,icon:o.icon,className:Q.clsx(p===q&&h.active),trailing:o.trailing!=null||u?c.jsxs("span",{className:h.trailing,children:[o.trailing,u&&c.jsx($.Icon,{name:"TickCircle",size:"sm"})]}):void 0,onMouseEnter:()=>!o.disabled&&t.setHighlightedIndex(p),onMouseDown:a=>a.preventDefault(),onClick:()=>t.pick(o),children:o.label},o.value)},b=o=>{if(!o.some(n=>n.opt.group!=null))return o.map(f);const p=[];for(const n of o){const u=p[p.length-1];u&&u.group===n.opt.group?u.rows.push(n):p.push({group:n.opt.group,rows:[n]})}return p.map((n,u)=>{if(n.group==null)return n.rows.map(f);const a=`${t.listboxId}-group-${u}`;return c.jsxs("div",{role:"group","aria-labelledby":a,className:h.group,children:[c.jsx(C.Typography,{as:"div",id:a,role:"presentation",variant:"caption",color:"muted",uppercase:!0,className:h.groupLabel,children:n.group}),n.rows.map(f)]},`group-${u}`)})};return c.jsxs(W.FloatingPanel,{ref:t.popoverRef,open:t.open,triggerRef:m,onClose:t.closeMenu,matchTriggerWidth:!0,className:Q.clsx(h.popover,y),children:[t.searchable&&c.jsxs("div",{className:h.search,children:[c.jsx($.Icon,{name:"SearchNormal",size:"sm",className:h.searchIcon,"aria-hidden":"true"}),c.jsx("input",{ref:t.searchInputRef,className:h.searchInput,type:"text",role:"combobox","aria-expanded":"true","aria-controls":t.listboxId,"aria-activedescendant":t.activeId,"aria-autocomplete":"list","aria-label":L,placeholder:L,value:t.searchQuery,spellCheck:!1,autoComplete:"off",onChange:o=>t.setSearchQuery(o.target.value),onKeyDown:R??t.handleKeyDown})]}),c.jsx(U.List,{role:"listbox",id:t.listboxId,"aria-labelledby":j,"aria-label":j?void 0:N,"aria-multiselectable":M||void 0,size:g,className:h.listbox,onMouseLeave:()=>t.setHighlightedIndex(-1),children:O?c.jsxs("div",{className:h.loading,children:[c.jsx(G.Loader,{size:"sm"}),c.jsx(C.Typography,{as:"span",variant:"bodySmall",color:"muted",children:E??r("common.loading")})]}):I.length===0?c.jsx("div",{className:h.noOptions,children:c.jsx(C.Typography,{as:"span",variant:"bodySmall",color:"muted",children:d==null?r("select.noOptions"):typeof d=="function"?d(t.searchQuery):d})}):b(I.map((o,p)=>({opt:o,index:p})))})]})}function ce(t){if(!t.some(g=>g.group!=null))return t;const m=new Map;for(const g of t){const _=m.get(g.group);_?_.push(g):m.set(g.group,[g])}return[...m.values()].flat()}function le({idBase:t,options:m,isSelected:g,onPick:_,closeOnPick:O=!0,highlightSelected:E=!0,searchable:d=!1,onSearchChange:x,disabled:M=!1,focusRef:j,onClose:N}){const R=`${t}-listbox`,y=l.useCallback(e=>`${t}-opt-${e}`,[t]),[r,L]=l.useState(!1),[I,q]=l.useState(""),[f,b]=l.useState(-1),o=l.useRef(null),p=l.useRef(null),n=l.useRef({buffer:"",timer:0}),u=l.useRef(N);u.current=N;const a=l.useMemo(()=>{const e=I.trim().toLowerCase(),s=!d||x||!e?m:m.filter(i=>{var k;return i.label.toLowerCase().includes(e)||((k=i.keywords)==null?void 0:k.some(F=>F.toLowerCase().includes(e)))});return ce(s)},[d,x,I,m]),v=l.useCallback((e,s)=>{let i=e;for(;i>=0&&i<a.length;){if(!a[i].disabled)return i;i+=s}return-1},[a]),D=l.useCallback(e=>{var s,i;L(!1),q(""),window.clearTimeout(n.current.timer),n.current.buffer="",(s=u.current)==null||s.call(u),e&&((i=j.current)==null||i.focus())},[j]);l.useEffect(()=>{if(!r)return;const e=E?a.findIndex(g):-1;b(e>=0&&!a[e].disabled?e:v(0,1)),d&&requestAnimationFrame(()=>{var s;return(s=o.current)==null?void 0:s.focus()})},[r]),l.useEffect(()=>{var e,s;!r||f<0||(s=(e=document.getElementById(y(f)))==null?void 0:e.scrollIntoView)==null||s.call(e,{block:"nearest"})},[r,f,y]),l.useEffect(()=>{r&&d&&b(v(0,1))},[I]),l.useEffect(()=>{r&&b(e=>e<a.length?e:v(0,1))},[a.length]);const w=()=>{M||L(!0)},H=()=>r?D(!1):w(),P=e=>{q(e),x==null||x(e)},T=e=>{!e||e.disabled||(_(e),O&&D(!0))},K=e=>{b(s=>{const i=s<0?e>0?0:a.length-1:s+e,k=v(i,e);return k===-1?s:k})},S=e=>{const s=n.current;window.clearTimeout(s.timer),s.buffer+=e.toLowerCase(),s.timer=window.setTimeout(()=>s.buffer="",500);const i=a.findIndex(k=>!k.disabled&&k.label.toLowerCase().startsWith(s.buffer));i>=0&&b(i)},z=e=>{if(!M)switch(e.key){case"ArrowDown":e.preventDefault(),r?K(1):w();break;case"ArrowUp":e.preventDefault(),r?K(-1):w();break;case"Enter":e.preventDefault(),r?T(a[f]):w();break;case" ":r?d||(e.preventDefault(),T(a[f])):(e.preventDefault(),w());break;case"Escape":r&&(e.preventDefault(),e.stopPropagation(),D(!0));break;case"Tab":r&&D(!0);break;case"Home":r&&(e.preventDefault(),b(v(0,1)));break;case"End":r&&(e.preventDefault(),b(v(a.length-1,-1)));break;default:!d&&r&&e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey&&S(e.key)}},A=r&&f>=0?y(f):void 0;return{open:r,openMenu:w,closeMenu:D,toggleMenu:H,searchable:d,searchQuery:I,setSearchQuery:P,filteredOptions:a,highlightedIndex:f,setHighlightedIndex:b,isSelected:g,pick:T,handleKeyDown:z,listboxId:R,optionId:y,activeId:A,searchInputRef:o,popoverRef:p}}exports.OptionMenu=ie;exports.useOptionMenu=le;
-//# sourceMappingURL=useOptionMenu-B40OOVsO.cjs.map
+"use strict";const c=require("react/jsx-runtime"),Q=require("clsx"),W=require("./FloatingPanel-tGCG2nhA.cjs"),$=require("./Icon-CBg21lKA.cjs"),U=require("./List-CLUXeaXS.cjs"),V=require("./ListItem-CguNjf-u.cjs"),G=require("./Loader-BE3SQr7W.cjs"),C=require("./Typography-d97DdbNd.cjs"),J=require("./ConfigProvider-DBU6rOIA.cjs"),l=require("react"),X="_popover_rf9kn_3",Y="_search_rf9kn_11",Z="_searchIcon_rf9kn_20",B="_searchInput_rf9kn_24",ee="_listbox_rf9kn_40",te="_active_rf9kn_48",re="_noOptions_rf9kn_52",se="_loading_rf9kn_58",oe="_group_rf9kn_68",ne="_groupLabel_rf9kn_80",ae="_trailing_rf9kn_86",h={popover:X,search:Y,searchIcon:Z,searchInput:B,listbox:ee,active:te,noOptions:re,loading:se,group:oe,groupLabel:ne,trailing:ae};function ie({menu:t,anchorRef:m,size:g,searchPlaceholder:_,loading:O=!1,loadingText:E,noOptionsText:d,showSelectedTick:x=!0,multiselectable:M=!1,labelledBy:j,ariaLabel:N,onSearchKeyDown:R,className:y}){const r=J.useT(),L=_??r("common.search"),{filteredOptions:I,highlightedIndex:q}=t,f=({opt:o,index:p})=>{const n=t.isSelected(o),u=n&&x;return c.jsx(V.ListItem,{id:t.optionId(p),role:"option",tabIndex:-1,"aria-selected":n,"aria-current":void 0,clickable:!0,selected:n,disabled:o.disabled,icon:o.icon,className:Q.clsx(p===q&&h.active),trailing:o.trailing!=null||u?c.jsxs("span",{className:h.trailing,children:[o.trailing,u&&c.jsx($.Icon,{name:"TickCircle",size:"sm"})]}):void 0,onMouseEnter:()=>!o.disabled&&t.setHighlightedIndex(p),onMouseDown:a=>a.preventDefault(),onClick:()=>t.pick(o),children:o.label},o.value)},b=o=>{if(!o.some(n=>n.opt.group!=null))return o.map(f);const p=[];for(const n of o){const u=p[p.length-1];u&&u.group===n.opt.group?u.rows.push(n):p.push({group:n.opt.group,rows:[n]})}return p.map((n,u)=>{if(n.group==null)return n.rows.map(f);const a=`${t.listboxId}-group-${u}`;return c.jsxs("div",{role:"group","aria-labelledby":a,className:h.group,children:[c.jsx(C.Typography,{as:"div",id:a,role:"presentation",variant:"caption",color:"muted",uppercase:!0,className:h.groupLabel,children:n.group}),n.rows.map(f)]},`group-${u}`)})};return c.jsxs(W.FloatingPanel,{ref:t.popoverRef,open:t.open,triggerRef:m,onClose:t.closeMenu,matchTriggerWidth:!0,className:Q.clsx(h.popover,y),children:[t.searchable&&c.jsxs("div",{className:h.search,children:[c.jsx($.Icon,{name:"SearchNormal",size:"sm",className:h.searchIcon,"aria-hidden":"true"}),c.jsx("input",{ref:t.searchInputRef,className:h.searchInput,type:"text",role:"combobox","aria-expanded":"true","aria-controls":t.listboxId,"aria-activedescendant":t.activeId,"aria-autocomplete":"list","aria-label":L,placeholder:L,value:t.searchQuery,spellCheck:!1,autoComplete:"off",onChange:o=>t.setSearchQuery(o.target.value),onKeyDown:R??t.handleKeyDown})]}),c.jsx(U.List,{role:"listbox",id:t.listboxId,"aria-labelledby":j,"aria-label":j?void 0:N,"aria-multiselectable":M||void 0,size:g,className:h.listbox,onMouseLeave:()=>t.setHighlightedIndex(-1),children:O?c.jsxs("div",{className:h.loading,children:[c.jsx(G.Loader,{size:"sm"}),c.jsx(C.Typography,{as:"span",variant:"bodySmall",color:"muted",children:E??r("common.loading")})]}):I.length===0?c.jsx("div",{className:h.noOptions,children:c.jsx(C.Typography,{as:"span",variant:"bodySmall",color:"muted",children:d==null?r("select.noOptions"):typeof d=="function"?d(t.searchQuery):d})}):b(I.map((o,p)=>({opt:o,index:p})))})]})}function ce(t){if(!t.some(g=>g.group!=null))return t;const m=new Map;for(const g of t){const _=m.get(g.group);_?_.push(g):m.set(g.group,[g])}return[...m.values()].flat()}function le({idBase:t,options:m,isSelected:g,onPick:_,closeOnPick:O=!0,highlightSelected:E=!0,searchable:d=!1,onSearchChange:x,disabled:M=!1,focusRef:j,onClose:N}){const R=`${t}-listbox`,y=l.useCallback(e=>`${t}-opt-${e}`,[t]),[r,L]=l.useState(!1),[I,q]=l.useState(""),[f,b]=l.useState(-1),o=l.useRef(null),p=l.useRef(null),n=l.useRef({buffer:"",timer:0}),u=l.useRef(N);u.current=N;const a=l.useMemo(()=>{const e=I.trim().toLowerCase(),s=!d||x||!e?m:m.filter(i=>{var k;return i.label.toLowerCase().includes(e)||((k=i.keywords)==null?void 0:k.some(F=>F.toLowerCase().includes(e)))});return ce(s)},[d,x,I,m]),v=l.useCallback((e,s)=>{let i=e;for(;i>=0&&i<a.length;){if(!a[i].disabled)return i;i+=s}return-1},[a]),D=l.useCallback(e=>{var s,i;L(!1),q(""),window.clearTimeout(n.current.timer),n.current.buffer="",(s=u.current)==null||s.call(u),e&&((i=j.current)==null||i.focus())},[j]);l.useEffect(()=>{if(!r)return;const e=E?a.findIndex(g):-1;b(e>=0&&!a[e].disabled?e:v(0,1)),d&&requestAnimationFrame(()=>{var s;return(s=o.current)==null?void 0:s.focus()})},[r]),l.useEffect(()=>{var e,s;!r||f<0||(s=(e=document.getElementById(y(f)))==null?void 0:e.scrollIntoView)==null||s.call(e,{block:"nearest"})},[r,f,y]),l.useEffect(()=>{r&&d&&b(v(0,1))},[I]),l.useEffect(()=>{r&&b(e=>e<a.length?e:v(0,1))},[a.length]);const w=()=>{M||L(!0)},H=()=>r?D(!1):w(),P=e=>{q(e),x==null||x(e)},T=e=>{!e||e.disabled||(_(e),O&&D(!0))},K=e=>{b(s=>{const i=s<0?e>0?0:a.length-1:s+e,k=v(i,e);return k===-1?s:k})},S=e=>{const s=n.current;window.clearTimeout(s.timer),s.buffer+=e.toLowerCase(),s.timer=window.setTimeout(()=>s.buffer="",500);const i=a.findIndex(k=>!k.disabled&&k.label.toLowerCase().startsWith(s.buffer));i>=0&&b(i)},z=e=>{if(!M)switch(e.key){case"ArrowDown":e.preventDefault(),r?K(1):w();break;case"ArrowUp":e.preventDefault(),r?K(-1):w();break;case"Enter":e.preventDefault(),r?T(a[f]):w();break;case" ":r?d||(e.preventDefault(),T(a[f])):(e.preventDefault(),w());break;case"Escape":r&&(e.preventDefault(),e.stopPropagation(),D(!0));break;case"Tab":r&&D(!0);break;case"Home":r&&(e.preventDefault(),b(v(0,1)));break;case"End":r&&(e.preventDefault(),b(v(a.length-1,-1)));break;default:!d&&r&&e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey&&S(e.key)}},A=r&&f>=0?y(f):void 0;return{open:r,openMenu:w,closeMenu:D,toggleMenu:H,searchable:d,searchQuery:I,setSearchQuery:P,filteredOptions:a,highlightedIndex:f,setHighlightedIndex:b,isSelected:g,pick:T,handleKeyDown:z,listboxId:R,optionId:y,activeId:A,searchInputRef:o,popoverRef:p}}exports.OptionMenu=ie;exports.useOptionMenu=le;
+//# sourceMappingURL=useOptionMenu-CVl7VHXl.cjs.map

package/dist/{useOptionMenu-B40OOVsO.cjs.map → useOptionMenu-CVl7VHXl.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"useOptionMenu-B40OOVsO.cjs","sources":["../src/components/OptionMenu/OptionMenu.tsx","../src/components/OptionMenu/useOptionMenu.ts"],"sourcesContent":["import type { KeyboardEvent, ReactNode, RefObject } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Icon } from '../Icon'\nimport { List, ListItem, type ListItemSize } from '../List'\nimport { Loader } from '../Loader'\nimport { Typography } from '../Typography'\nimport type { OptionMenuState, SelectOption } from './useOptionMenu'\nimport styles from './OptionMenu.module.css'\n\nexport interface OptionMenuProps {\n  /** The state from `useOptionMenu`. */\n  menu: OptionMenuState\n  /** What the panel anchors under (and matches the width of) — also excluded from outside-click. */\n  anchorRef: RefObject<HTMLElement | null>\n  /** Row size. */\n  size: ListItemSize\n  /** Search box placeholder + accessible label. Defaults to the localized \"Search…\". */\n  searchPlaceholder?: string\n  /** Show a loader row instead of the options (server-side search in flight). */\n  loading?: boolean\n  /** Text next to the loader. Defaults to the localized \"Loading…\". */\n  loadingText?: ReactNode\n  /** Empty-result content — a node or `(query) => node`. Defaults to the localized \"No Options\". */\n  noOptionsText?: ReactNode | ((query: string) => ReactNode)\n  /** Tick the selected option(s). Defaults to `true`. */\n  showSelectedTick?: boolean\n  /** `aria-multiselectable` on the listbox. */\n  multiselectable?: boolean\n  /** Labels the listbox (the field label id). */\n  labelledBy?: string\n  /** Accessible label for the listbox when there's no visible label. */\n  ariaLabel?: string\n  /** Wraps the search box's key handling (e.g. MultiSelect's Backspace-removes-a-chip). */\n  onSearchKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void\n  /** Extra class on the panel. */\n  className?: string\n}\n\n/**\n * The option popover shared by `Select`, `MultiSelect` and `PhoneField` (internal): a `FloatingPanel`\n * anchored under the field, an optional sticky search box (`role=\"combobox\"`, `aria-activedescendant`),\n * and a scrolling `role=\"listbox\"` of `ListItem` options — icon, label, the option's `trailing`, a tick\n * when selected, the keyboard highlight, disabled rows inert, `group`ed options under a labelled heading —\n * plus the loading and empty rows. All state\n * and keys live in `useOptionMenu`; this only renders it.\n */\nexport function OptionMenu({\n  menu,\n  anchorRef,\n  size,\n  searchPlaceholder,\n  loading = false,\n  loadingText,\n  noOptionsText,\n  showSelectedTick = true,\n  multiselectable = false,\n  labelledBy,\n  ariaLabel,\n  onSearchKeyDown,\n  className,\n}: OptionMenuProps) {\n  const t = useT()\n  const searchPh = searchPlaceholder ?? t('common.search')\n  const { filteredOptions, highlightedIndex } = menu\n\n  const renderOption = ({ opt, index }: { opt: SelectOption; index: number }) => {\n    const selected = menu.isSelected(opt)\n    const tick = selected && showSelectedTick\n    return (\n      <ListItem\n        key={opt.value}\n        id={menu.optionId(index)}\n        role=\"option\"\n        tabIndex={-1}\n        aria-selected={selected}\n        aria-current={undefined}\n        clickable\n        selected={selected}\n        disabled={opt.disabled}\n        icon={opt.icon}\n        className={clsx(index === highlightedIndex && styles.active)}\n        trailing={\n          opt.trailing != null || tick ? (\n            <span className={styles.trailing}>\n              {opt.trailing}\n              {tick && <Icon name=\"TickCircle\" size=\"sm\" />}\n            </span>\n          ) : undefined\n        }\n        onMouseEnter={() => !opt.disabled && menu.setHighlightedIndex(index)}\n        // keep focus where it is (trigger / search box) — a multi-select stays open and typing keeps\n        // working; a single-select refocuses its trigger on close anyway\n        onMouseDown={(e) => e.preventDefault()}\n        onClick={() => menu.pick(opt)}\n      >\n        {opt.label}\n      </ListItem>\n    )\n  }\n\n  // consecutive runs of the same `group` (the hook already gathered them) → a labelled role=\"group\"\n  // each; ungrouped runs render as plain rows\n  const renderRows = (rows: { opt: SelectOption; index: number }[]) => {\n    if (!rows.some((r) => r.opt.group != null)) return rows.map(renderOption)\n    const runs: { group: string | undefined; rows: typeof rows }[] = []\n    for (const row of rows) {\n      const last = runs[runs.length - 1]\n      if (last && last.group === row.opt.group) last.rows.push(row)\n      else runs.push({ group: row.opt.group, rows: [row] })\n    }\n    return runs.map((run, i) => {\n      if (run.group == null) return run.rows.map(renderOption)\n      const headingId = `${menu.listboxId}-group-${i}`\n      return (\n        <div key={`group-${i}`} role=\"group\" aria-labelledby={headingId} className={styles.group}>\n          <Typography\n            as=\"div\"\n            id={headingId}\n            role=\"presentation\"\n            variant=\"caption\"\n            color=\"muted\"\n            uppercase\n            className={styles.groupLabel}\n          >\n            {run.group}\n          </Typography>\n          {run.rows.map(renderOption)}\n        </div>\n      )\n    })\n  }\n\n  return (\n    <FloatingPanel\n      ref={menu.popoverRef}\n      open={menu.open}\n      triggerRef={anchorRef}\n      onClose={menu.closeMenu}\n      matchTriggerWidth\n      className={clsx(styles.popover, className)}\n    >\n      {menu.searchable && (\n        <div className={styles.search}>\n          <Icon name=\"SearchNormal\" size=\"sm\" className={styles.searchIcon} aria-hidden=\"true\" />\n          <input\n            ref={menu.searchInputRef}\n            className={styles.searchInput}\n            type=\"text\"\n            role=\"combobox\"\n            aria-expanded=\"true\"\n            aria-controls={menu.listboxId}\n            aria-activedescendant={menu.activeId}\n            aria-autocomplete=\"list\"\n            aria-label={searchPh}\n            placeholder={searchPh}\n            value={menu.searchQuery}\n            spellCheck={false}\n            autoComplete=\"off\"\n            onChange={(e) => menu.setSearchQuery(e.target.value)}\n            onKeyDown={onSearchKeyDown ?? menu.handleKeyDown}\n          />\n        </div>\n      )}\n\n      {/* the listbox always carries its id (even when empty) so aria-controls never dangles */}\n      <List\n        role=\"listbox\"\n        id={menu.listboxId}\n        aria-labelledby={labelledBy}\n        aria-label={labelledBy ? undefined : ariaLabel}\n        aria-multiselectable={multiselectable || undefined}\n        size={size}\n        className={styles.listbox}\n        // clear the mouse highlight when the pointer leaves the list (no lingering hover)\n        onMouseLeave={() => menu.setHighlightedIndex(-1)}\n      >\n        {loading ? (\n          <div className={styles.loading}>\n            <Loader size=\"sm\" />\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {loadingText ?? t('common.loading')}\n            </Typography>\n          </div>\n        ) : filteredOptions.length === 0 ? (\n          <div className={styles.noOptions}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {noOptionsText == null\n                ? t('select.noOptions')\n                : typeof noOptionsText === 'function'\n                  ? noOptionsText(menu.searchQuery)\n                  : noOptionsText}\n            </Typography>\n          </div>\n        ) : (\n          renderRows(filteredOptions.map((opt, index) => ({ opt, index })))\n        )}\n      </List>\n    </FloatingPanel>\n  )\n}\n","import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type RefObject,\n} from 'react'\nimport type { ReactNode } from 'react'\nimport type { IconName } from '../../icons/names'\n\n/** A single selectable option — shared by `Select`, `MultiSelect` and `PhoneField`. */\nexport interface SelectOption {\n  /** The value committed when this option is chosen. */\n  value: string\n  /** Display + search text. */\n  label: string\n  /** Greys out and blocks selecting this option. */\n  disabled?: boolean\n  /** Leading icon — a known `IconName` (rendered as `<Icon>`) or any node. */\n  icon?: IconName | ReactNode\n  /**\n   * Extra search terms matched alongside the label (case-insensitive, substring) — e.g. a currency's\n   * code (`'USD'`) or a country's calling code (`'995'`). Never shown.\n   */\n  keywords?: readonly string[]\n  /** Content on the right of the row, before the selected tick (e.g. a code or a count). */\n  trailing?: ReactNode\n  /**\n   * Group heading. Options sharing a `group` are listed together under it (groups in order of first\n   * appearance, options keeping their order within a group); options without one stay ungrouped.\n   */\n  group?: string\n}\n\n/**\n * Stable-group the options: each group gathered at its first appearance, order kept within a group. A\n * list with no `group` at all is returned untouched (the common case costs nothing).\n */\nexport function groupOptions<T extends SelectOption>(options: readonly T[]): readonly T[] {\n  if (!options.some((o) => o.group != null)) return options\n  const buckets = new Map<string | undefined, T[]>()\n  for (const o of options) {\n    const bucket = buckets.get(o.group)\n    if (bucket) bucket.push(o)\n    else buckets.set(o.group, [o])\n  }\n  return [...buckets.values()].flat()\n}\n\nexport interface UseOptionMenuOptions {\n  /** Base for the listbox / option ids (`${idBase}-listbox`, `${idBase}-opt-${i}`). */\n  idBase: string\n  options: readonly SelectOption[]\n  /** Whether an option is selected (drives the initial highlight when `highlightSelected`). */\n  isSelected: (option: SelectOption) => boolean\n  /** Called when an option is picked (Enter / Space / click). */\n  onPick: (option: SelectOption) => void\n  /** Close the menu after a pick (single-select) or keep it open (multi-select). Defaults to `true`. */\n  closeOnPick?: boolean\n  /** On open, highlight the selected option (single-select) instead of the first. Defaults to `true`. */\n  highlightSelected?: boolean\n  /** Show a search box that filters by label + keywords. */\n  searchable?: boolean\n  /** The consumer filters `options` itself (server-side search) — skip the local filter. */\n  onSearchChange?: (query: string) => void\n  disabled?: boolean\n  /** The element focus returns to when the menu closes with `refocus` (the trigger / the input). */\n  focusRef: RefObject<HTMLElement | null>\n  /** Runs on every close (e.g. mark a form field touched). */\n  onClose?: () => void\n}\n\n/**\n * The state + keyboard model behind every option popover (internal): open / close, the search query\n * and its label + keywords filter, the highlighted row (skipping disabled ones), type-ahead when not\n * searchable, and one `handleKeyDown` for the trigger and the search box — Arrow / Home / End move,\n * Enter / Space pick, Escape closes (refocusing), Tab closes and moves on. Render it with `OptionMenu`.\n */\nexport function useOptionMenu({\n  idBase,\n  options,\n  isSelected,\n  onPick,\n  closeOnPick = true,\n  highlightSelected = true,\n  searchable = false,\n  onSearchChange,\n  disabled = false,\n  focusRef,\n  onClose,\n}: UseOptionMenuOptions) {\n  const listboxId = `${idBase}-listbox`\n  const optionId = useCallback((index: number) => `${idBase}-opt-${index}`, [idBase])\n\n  const [open, setOpen] = useState(false)\n  const [searchQuery, setSearchQueryState] = useState('')\n  const [highlightedIndex, setHighlightedIndex] = useState(-1)\n  const searchInputRef = useRef<HTMLInputElement | null>(null)\n  // the floating panel forwards its node here, for the focus-leaves-the-widget check on blur\n  const popoverRef = useRef<HTMLDivElement | null>(null)\n  const typeahead = useRef({ buffer: '', timer: 0 })\n  // latest callbacks without re-creating the stable handlers\n  const onCloseRef = useRef(onClose)\n  onCloseRef.current = onClose\n\n  // local filter by label + keywords (skipped when the consumer owns the options — server search), then\n  // grouped, so the flat index the keyboard walks is exactly the rendered order\n  const filteredOptions = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase()\n    const matches =\n      !searchable || onSearchChange || !q\n        ? options\n        : options.filter(\n            (o) =>\n              o.label.toLowerCase().includes(q) ||\n              o.keywords?.some((k) => k.toLowerCase().includes(q)),\n          )\n    return groupOptions(matches)\n  }, [searchable, onSearchChange, searchQuery, options])\n\n  const findEnabled = useCallback(\n    (start: number, delta: number) => {\n      let i = start\n      while (i >= 0 && i < filteredOptions.length) {\n        if (!filteredOptions[i].disabled) return i\n        i += delta\n      }\n      return -1\n    },\n    [filteredOptions],\n  )\n\n  // single dismiss path: clears the search + type-ahead, notifies, optionally refocuses\n  const closeMenu = useCallback(\n    (refocus: boolean) => {\n      setOpen(false)\n      setSearchQueryState('')\n      window.clearTimeout(typeahead.current.timer)\n      typeahead.current.buffer = ''\n      onCloseRef.current?.()\n      if (refocus) focusRef.current?.focus()\n    },\n    [focusRef],\n  )\n\n  // on open: highlight the selected option (or the first enabled), focus the search box\n  useEffect(() => {\n    if (!open) return\n    const selIdx = highlightSelected ? filteredOptions.findIndex(isSelected) : -1\n    setHighlightedIndex(\n      selIdx >= 0 && !filteredOptions[selIdx].disabled ? selIdx : findEnabled(0, 1),\n    )\n    if (searchable) requestAnimationFrame(() => searchInputRef.current?.focus())\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  // keep the highlighted option scrolled into view\n  useEffect(() => {\n    if (!open || highlightedIndex < 0) return\n    document.getElementById(optionId(highlightedIndex))?.scrollIntoView?.({ block: 'nearest' })\n  }, [open, highlightedIndex, optionId])\n\n  // a new search → re-anchor the highlight to the first match\n  useEffect(() => {\n    if (open && searchable) setHighlightedIndex(findEnabled(0, 1))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchQuery])\n\n  // the option count changed while open (async load / list shrink) → keep the highlight in range\n  useEffect(() => {\n    if (open) setHighlightedIndex((i) => (i < filteredOptions.length ? i : findEnabled(0, 1)))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [filteredOptions.length])\n\n  const openMenu = () => {\n    if (!disabled) setOpen(true)\n  }\n  const toggleMenu = () => (open ? closeMenu(false) : openMenu())\n\n  const setSearchQuery = (query: string) => {\n    setSearchQueryState(query)\n    onSearchChange?.(query)\n  }\n\n  const pick = (option: SelectOption | undefined) => {\n    if (!option || option.disabled) return\n    onPick(option)\n    if (closeOnPick) closeMenu(true)\n  }\n\n  const moveHighlight = (delta: number) => {\n    setHighlightedIndex((cur) => {\n      const start = cur < 0 ? (delta > 0 ? 0 : filteredOptions.length - 1) : cur + delta\n      const found = findEnabled(start, delta)\n      return found === -1 ? cur : found\n    })\n  }\n\n  // type-ahead (no search box): jump to the option whose label starts with the typed buffer\n  const handleTypeahead = (char: string) => {\n    const t = typeahead.current\n    window.clearTimeout(t.timer)\n    t.buffer += char.toLowerCase()\n    t.timer = window.setTimeout(() => (t.buffer = ''), 500)\n    const match = filteredOptions.findIndex(\n      (o) => !o.disabled && o.label.toLowerCase().startsWith(t.buffer),\n    )\n    if (match >= 0) setHighlightedIndex(match)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (disabled) return\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault()\n        open ? moveHighlight(1) : openMenu()\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        open ? moveHighlight(-1) : openMenu()\n        break\n      case 'Enter':\n        event.preventDefault()\n        if (!open) openMenu()\n        else pick(filteredOptions[highlightedIndex])\n        break\n      case ' ':\n        // Space opens a closed menu; picks only when open without a search box (so search can type spaces)\n        if (!open) {\n          event.preventDefault()\n          openMenu()\n        } else if (!searchable) {\n          event.preventDefault()\n          pick(filteredOptions[highlightedIndex])\n        }\n        break\n      case 'Escape':\n        if (open) {\n          event.preventDefault()\n          event.stopPropagation() // don't let FloatingPanel's own Escape also fire closeMenu\n          closeMenu(true)\n        }\n        break\n      case 'Tab':\n        // refocus the trigger so Tab continues from the field's visual spot, not the portaled search\n        // input's DOM position (end of <body>); no preventDefault — let Tab move on\n        if (open) closeMenu(true)\n        break\n      case 'Home':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(0, 1))\n        }\n        break\n      case 'End':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(filteredOptions.length - 1, -1))\n        }\n        break\n      default:\n        if (\n          !searchable &&\n          open &&\n          event.key.length === 1 &&\n          !event.metaKey &&\n          !event.ctrlKey &&\n          !event.altKey\n        ) {\n          handleTypeahead(event.key)\n        }\n    }\n  }\n\n  const activeId = open && highlightedIndex >= 0 ? optionId(highlightedIndex) : undefined\n\n  return {\n    open,\n    openMenu,\n    closeMenu,\n    toggleMenu,\n    searchable,\n    searchQuery,\n    setSearchQuery,\n    filteredOptions,\n    highlightedIndex,\n    setHighlightedIndex,\n    isSelected,\n    pick,\n    handleKeyDown,\n    listboxId,\n    optionId,\n    activeId,\n    searchInputRef,\n    popoverRef,\n  }\n}\n\n/** Everything `useOptionMenu` returns — pass it to `<OptionMenu menu={…} />`. */\nexport type OptionMenuState = ReturnType<typeof useOptionMenu>\n"],"names":["OptionMenu","menu","anchorRef","size","searchPlaceholder","loading","loadingText","noOptionsText","showSelectedTick","multiselectable","labelledBy","ariaLabel","onSearchKeyDown","className","t","useT","searchPh","filteredOptions","highlightedIndex","renderOption","opt","index","selected","tick","jsx","ListItem","clsx","styles","jsxs","Icon","e","renderRows","rows","r","runs","row","last","run","i","headingId","Typography","FloatingPanel","List","Loader","groupOptions","options","o","buckets","bucket","useOptionMenu","idBase","isSelected","onPick","closeOnPick","highlightSelected","searchable","onSearchChange","disabled","focusRef","onClose","listboxId","optionId","useCallback","open","setOpen","useState","searchQuery","setSearchQueryState","setHighlightedIndex","searchInputRef","useRef","popoverRef","typeahead","onCloseRef","useMemo","q","matches","_a","k","findEnabled","start","delta","closeMenu","refocus","_b","useEffect","selIdx","openMenu","toggleMenu","setSearchQuery","query","pick","option","moveHighlight","cur","found","handleTypeahead","char","match","handleKeyDown","event","activeId"],"mappings":"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"}
+{"version":3,"file":"useOptionMenu-CVl7VHXl.cjs","sources":["../src/components/OptionMenu/OptionMenu.tsx","../src/components/OptionMenu/useOptionMenu.ts"],"sourcesContent":["import type { KeyboardEvent, ReactNode, RefObject } from 'react'\nimport { clsx } from 'clsx'\nimport { useT } from '../../theme'\nimport { FloatingPanel } from '../FloatingPanel/FloatingPanel'\nimport { Icon } from '../Icon'\nimport { List, ListItem, type ListItemSize } from '../List'\nimport { Loader } from '../Loader'\nimport { Typography } from '../Typography'\nimport type { OptionMenuState, SelectOption } from './useOptionMenu'\nimport styles from './OptionMenu.module.css'\n\nexport interface OptionMenuProps {\n  /** The state from `useOptionMenu`. */\n  menu: OptionMenuState\n  /** What the panel anchors under (and matches the width of) — also excluded from outside-click. */\n  anchorRef: RefObject<HTMLElement | null>\n  /** Row size. */\n  size: ListItemSize\n  /** Search box placeholder + accessible label. Defaults to the localized \"Search…\". */\n  searchPlaceholder?: string\n  /** Show a loader row instead of the options (server-side search in flight). */\n  loading?: boolean\n  /** Text next to the loader. Defaults to the localized \"Loading…\". */\n  loadingText?: ReactNode\n  /** Empty-result content — a node or `(query) => node`. Defaults to the localized \"No Options\". */\n  noOptionsText?: ReactNode | ((query: string) => ReactNode)\n  /** Tick the selected option(s). Defaults to `true`. */\n  showSelectedTick?: boolean\n  /** `aria-multiselectable` on the listbox. */\n  multiselectable?: boolean\n  /** Labels the listbox (the field label id). */\n  labelledBy?: string\n  /** Accessible label for the listbox when there's no visible label. */\n  ariaLabel?: string\n  /** Wraps the search box's key handling (e.g. MultiSelect's Backspace-removes-a-chip). */\n  onSearchKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void\n  /** Extra class on the panel. */\n  className?: string\n}\n\n/**\n * The option popover shared by `Select`, `MultiSelect` and `PhoneField` (internal): a `FloatingPanel`\n * anchored under the field, an optional sticky search box (`role=\"combobox\"`, `aria-activedescendant`),\n * and a scrolling `role=\"listbox\"` of `ListItem` options — icon, label, the option's `trailing`, a tick\n * when selected, the keyboard highlight, disabled rows inert, `group`ed options under a labelled heading —\n * plus the loading and empty rows. All state\n * and keys live in `useOptionMenu`; this only renders it.\n */\nexport function OptionMenu({\n  menu,\n  anchorRef,\n  size,\n  searchPlaceholder,\n  loading = false,\n  loadingText,\n  noOptionsText,\n  showSelectedTick = true,\n  multiselectable = false,\n  labelledBy,\n  ariaLabel,\n  onSearchKeyDown,\n  className,\n}: OptionMenuProps) {\n  const t = useT()\n  const searchPh = searchPlaceholder ?? t('common.search')\n  const { filteredOptions, highlightedIndex } = menu\n\n  const renderOption = ({ opt, index }: { opt: SelectOption; index: number }) => {\n    const selected = menu.isSelected(opt)\n    const tick = selected && showSelectedTick\n    return (\n      <ListItem\n        key={opt.value}\n        id={menu.optionId(index)}\n        role=\"option\"\n        tabIndex={-1}\n        aria-selected={selected}\n        aria-current={undefined}\n        clickable\n        selected={selected}\n        disabled={opt.disabled}\n        icon={opt.icon}\n        className={clsx(index === highlightedIndex && styles.active)}\n        trailing={\n          opt.trailing != null || tick ? (\n            <span className={styles.trailing}>\n              {opt.trailing}\n              {tick && <Icon name=\"TickCircle\" size=\"sm\" />}\n            </span>\n          ) : undefined\n        }\n        onMouseEnter={() => !opt.disabled && menu.setHighlightedIndex(index)}\n        // keep focus where it is (trigger / search box) — a multi-select stays open and typing keeps\n        // working; a single-select refocuses its trigger on close anyway\n        onMouseDown={(e) => e.preventDefault()}\n        onClick={() => menu.pick(opt)}\n      >\n        {opt.label}\n      </ListItem>\n    )\n  }\n\n  // consecutive runs of the same `group` (the hook already gathered them) → a labelled role=\"group\"\n  // each; ungrouped runs render as plain rows\n  const renderRows = (rows: { opt: SelectOption; index: number }[]) => {\n    if (!rows.some((r) => r.opt.group != null)) return rows.map(renderOption)\n    const runs: { group: string | undefined; rows: typeof rows }[] = []\n    for (const row of rows) {\n      const last = runs[runs.length - 1]\n      if (last && last.group === row.opt.group) last.rows.push(row)\n      else runs.push({ group: row.opt.group, rows: [row] })\n    }\n    return runs.map((run, i) => {\n      if (run.group == null) return run.rows.map(renderOption)\n      const headingId = `${menu.listboxId}-group-${i}`\n      return (\n        <div key={`group-${i}`} role=\"group\" aria-labelledby={headingId} className={styles.group}>\n          <Typography\n            as=\"div\"\n            id={headingId}\n            role=\"presentation\"\n            variant=\"caption\"\n            color=\"muted\"\n            uppercase\n            className={styles.groupLabel}\n          >\n            {run.group}\n          </Typography>\n          {run.rows.map(renderOption)}\n        </div>\n      )\n    })\n  }\n\n  return (\n    <FloatingPanel\n      ref={menu.popoverRef}\n      open={menu.open}\n      triggerRef={anchorRef}\n      onClose={menu.closeMenu}\n      matchTriggerWidth\n      className={clsx(styles.popover, className)}\n    >\n      {menu.searchable && (\n        <div className={styles.search}>\n          <Icon name=\"SearchNormal\" size=\"sm\" className={styles.searchIcon} aria-hidden=\"true\" />\n          <input\n            ref={menu.searchInputRef}\n            className={styles.searchInput}\n            type=\"text\"\n            role=\"combobox\"\n            aria-expanded=\"true\"\n            aria-controls={menu.listboxId}\n            aria-activedescendant={menu.activeId}\n            aria-autocomplete=\"list\"\n            aria-label={searchPh}\n            placeholder={searchPh}\n            value={menu.searchQuery}\n            spellCheck={false}\n            autoComplete=\"off\"\n            onChange={(e) => menu.setSearchQuery(e.target.value)}\n            onKeyDown={onSearchKeyDown ?? menu.handleKeyDown}\n          />\n        </div>\n      )}\n\n      {/* the listbox always carries its id (even when empty) so aria-controls never dangles */}\n      <List\n        role=\"listbox\"\n        id={menu.listboxId}\n        aria-labelledby={labelledBy}\n        aria-label={labelledBy ? undefined : ariaLabel}\n        aria-multiselectable={multiselectable || undefined}\n        size={size}\n        className={styles.listbox}\n        // clear the mouse highlight when the pointer leaves the list (no lingering hover)\n        onMouseLeave={() => menu.setHighlightedIndex(-1)}\n      >\n        {loading ? (\n          <div className={styles.loading}>\n            <Loader size=\"sm\" />\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {loadingText ?? t('common.loading')}\n            </Typography>\n          </div>\n        ) : filteredOptions.length === 0 ? (\n          <div className={styles.noOptions}>\n            <Typography as=\"span\" variant=\"bodySmall\" color=\"muted\">\n              {noOptionsText == null\n                ? t('select.noOptions')\n                : typeof noOptionsText === 'function'\n                  ? noOptionsText(menu.searchQuery)\n                  : noOptionsText}\n            </Typography>\n          </div>\n        ) : (\n          renderRows(filteredOptions.map((opt, index) => ({ opt, index })))\n        )}\n      </List>\n    </FloatingPanel>\n  )\n}\n","import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent,\n  type RefObject,\n} from 'react'\nimport type { ReactNode } from 'react'\nimport type { IconName } from '../../icons/names'\n\n/** A single selectable option — shared by `Select`, `MultiSelect` and `PhoneField`. */\nexport interface SelectOption {\n  /** The value committed when this option is chosen. */\n  value: string\n  /** Display + search text. */\n  label: string\n  /** Greys out and blocks selecting this option. */\n  disabled?: boolean\n  /** Leading icon — a known `IconName` (rendered as `<Icon>`) or any node. */\n  icon?: IconName | ReactNode\n  /**\n   * Extra search terms matched alongside the label (case-insensitive, substring) — e.g. a currency's\n   * code (`'USD'`) or a country's calling code (`'995'`). Never shown.\n   */\n  keywords?: readonly string[]\n  /** Content on the right of the row, before the selected tick (e.g. a code or a count). */\n  trailing?: ReactNode\n  /**\n   * Group heading. Options sharing a `group` are listed together under it (groups in order of first\n   * appearance, options keeping their order within a group); options without one stay ungrouped.\n   */\n  group?: string\n}\n\n/**\n * Stable-group the options: each group gathered at its first appearance, order kept within a group. A\n * list with no `group` at all is returned untouched (the common case costs nothing).\n */\nexport function groupOptions<T extends SelectOption>(options: readonly T[]): readonly T[] {\n  if (!options.some((o) => o.group != null)) return options\n  const buckets = new Map<string | undefined, T[]>()\n  for (const o of options) {\n    const bucket = buckets.get(o.group)\n    if (bucket) bucket.push(o)\n    else buckets.set(o.group, [o])\n  }\n  return [...buckets.values()].flat()\n}\n\nexport interface UseOptionMenuOptions {\n  /** Base for the listbox / option ids (`${idBase}-listbox`, `${idBase}-opt-${i}`). */\n  idBase: string\n  options: readonly SelectOption[]\n  /** Whether an option is selected (drives the initial highlight when `highlightSelected`). */\n  isSelected: (option: SelectOption) => boolean\n  /** Called when an option is picked (Enter / Space / click). */\n  onPick: (option: SelectOption) => void\n  /** Close the menu after a pick (single-select) or keep it open (multi-select). Defaults to `true`. */\n  closeOnPick?: boolean\n  /** On open, highlight the selected option (single-select) instead of the first. Defaults to `true`. */\n  highlightSelected?: boolean\n  /** Show a search box that filters by label + keywords. */\n  searchable?: boolean\n  /** The consumer filters `options` itself (server-side search) — skip the local filter. */\n  onSearchChange?: (query: string) => void\n  disabled?: boolean\n  /** The element focus returns to when the menu closes with `refocus` (the trigger / the input). */\n  focusRef: RefObject<HTMLElement | null>\n  /** Runs on every close (e.g. mark a form field touched). */\n  onClose?: () => void\n}\n\n/**\n * The state + keyboard model behind every option popover (internal): open / close, the search query\n * and its label + keywords filter, the highlighted row (skipping disabled ones), type-ahead when not\n * searchable, and one `handleKeyDown` for the trigger and the search box — Arrow / Home / End move,\n * Enter / Space pick, Escape closes (refocusing), Tab closes and moves on. Render it with `OptionMenu`.\n */\nexport function useOptionMenu({\n  idBase,\n  options,\n  isSelected,\n  onPick,\n  closeOnPick = true,\n  highlightSelected = true,\n  searchable = false,\n  onSearchChange,\n  disabled = false,\n  focusRef,\n  onClose,\n}: UseOptionMenuOptions) {\n  const listboxId = `${idBase}-listbox`\n  const optionId = useCallback((index: number) => `${idBase}-opt-${index}`, [idBase])\n\n  const [open, setOpen] = useState(false)\n  const [searchQuery, setSearchQueryState] = useState('')\n  const [highlightedIndex, setHighlightedIndex] = useState(-1)\n  const searchInputRef = useRef<HTMLInputElement | null>(null)\n  // the floating panel forwards its node here, for the focus-leaves-the-widget check on blur\n  const popoverRef = useRef<HTMLDivElement | null>(null)\n  const typeahead = useRef({ buffer: '', timer: 0 })\n  // latest callbacks without re-creating the stable handlers\n  const onCloseRef = useRef(onClose)\n  onCloseRef.current = onClose\n\n  // local filter by label + keywords (skipped when the consumer owns the options — server search), then\n  // grouped, so the flat index the keyboard walks is exactly the rendered order\n  const filteredOptions = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase()\n    const matches =\n      !searchable || onSearchChange || !q\n        ? options\n        : options.filter(\n            (o) =>\n              o.label.toLowerCase().includes(q) ||\n              o.keywords?.some((k) => k.toLowerCase().includes(q)),\n          )\n    return groupOptions(matches)\n  }, [searchable, onSearchChange, searchQuery, options])\n\n  const findEnabled = useCallback(\n    (start: number, delta: number) => {\n      let i = start\n      while (i >= 0 && i < filteredOptions.length) {\n        if (!filteredOptions[i].disabled) return i\n        i += delta\n      }\n      return -1\n    },\n    [filteredOptions],\n  )\n\n  // single dismiss path: clears the search + type-ahead, notifies, optionally refocuses\n  const closeMenu = useCallback(\n    (refocus: boolean) => {\n      setOpen(false)\n      setSearchQueryState('')\n      window.clearTimeout(typeahead.current.timer)\n      typeahead.current.buffer = ''\n      onCloseRef.current?.()\n      if (refocus) focusRef.current?.focus()\n    },\n    [focusRef],\n  )\n\n  // on open: highlight the selected option (or the first enabled), focus the search box\n  useEffect(() => {\n    if (!open) return\n    const selIdx = highlightSelected ? filteredOptions.findIndex(isSelected) : -1\n    setHighlightedIndex(\n      selIdx >= 0 && !filteredOptions[selIdx].disabled ? selIdx : findEnabled(0, 1),\n    )\n    if (searchable) requestAnimationFrame(() => searchInputRef.current?.focus())\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  // keep the highlighted option scrolled into view\n  useEffect(() => {\n    if (!open || highlightedIndex < 0) return\n    document.getElementById(optionId(highlightedIndex))?.scrollIntoView?.({ block: 'nearest' })\n  }, [open, highlightedIndex, optionId])\n\n  // a new search → re-anchor the highlight to the first match\n  useEffect(() => {\n    if (open && searchable) setHighlightedIndex(findEnabled(0, 1))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchQuery])\n\n  // the option count changed while open (async load / list shrink) → keep the highlight in range\n  useEffect(() => {\n    if (open) setHighlightedIndex((i) => (i < filteredOptions.length ? i : findEnabled(0, 1)))\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [filteredOptions.length])\n\n  const openMenu = () => {\n    if (!disabled) setOpen(true)\n  }\n  const toggleMenu = () => (open ? closeMenu(false) : openMenu())\n\n  const setSearchQuery = (query: string) => {\n    setSearchQueryState(query)\n    onSearchChange?.(query)\n  }\n\n  const pick = (option: SelectOption | undefined) => {\n    if (!option || option.disabled) return\n    onPick(option)\n    if (closeOnPick) closeMenu(true)\n  }\n\n  const moveHighlight = (delta: number) => {\n    setHighlightedIndex((cur) => {\n      const start = cur < 0 ? (delta > 0 ? 0 : filteredOptions.length - 1) : cur + delta\n      const found = findEnabled(start, delta)\n      return found === -1 ? cur : found\n    })\n  }\n\n  // type-ahead (no search box): jump to the option whose label starts with the typed buffer\n  const handleTypeahead = (char: string) => {\n    const t = typeahead.current\n    window.clearTimeout(t.timer)\n    t.buffer += char.toLowerCase()\n    t.timer = window.setTimeout(() => (t.buffer = ''), 500)\n    const match = filteredOptions.findIndex(\n      (o) => !o.disabled && o.label.toLowerCase().startsWith(t.buffer),\n    )\n    if (match >= 0) setHighlightedIndex(match)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (disabled) return\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault()\n        open ? moveHighlight(1) : openMenu()\n        break\n      case 'ArrowUp':\n        event.preventDefault()\n        open ? moveHighlight(-1) : openMenu()\n        break\n      case 'Enter':\n        event.preventDefault()\n        if (!open) openMenu()\n        else pick(filteredOptions[highlightedIndex])\n        break\n      case ' ':\n        // Space opens a closed menu; picks only when open without a search box (so search can type spaces)\n        if (!open) {\n          event.preventDefault()\n          openMenu()\n        } else if (!searchable) {\n          event.preventDefault()\n          pick(filteredOptions[highlightedIndex])\n        }\n        break\n      case 'Escape':\n        if (open) {\n          event.preventDefault()\n          event.stopPropagation() // don't let FloatingPanel's own Escape also fire closeMenu\n          closeMenu(true)\n        }\n        break\n      case 'Tab':\n        // refocus the trigger so Tab continues from the field's visual spot, not the portaled search\n        // input's DOM position (end of <body>); no preventDefault — let Tab move on\n        if (open) closeMenu(true)\n        break\n      case 'Home':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(0, 1))\n        }\n        break\n      case 'End':\n        if (open) {\n          event.preventDefault()\n          setHighlightedIndex(findEnabled(filteredOptions.length - 1, -1))\n        }\n        break\n      default:\n        if (\n          !searchable &&\n          open &&\n          event.key.length === 1 &&\n          !event.metaKey &&\n          !event.ctrlKey &&\n          !event.altKey\n        ) {\n          handleTypeahead(event.key)\n        }\n    }\n  }\n\n  const activeId = open && highlightedIndex >= 0 ? optionId(highlightedIndex) : undefined\n\n  return {\n    open,\n    openMenu,\n    closeMenu,\n    toggleMenu,\n    searchable,\n    searchQuery,\n    setSearchQuery,\n    filteredOptions,\n    highlightedIndex,\n    setHighlightedIndex,\n    isSelected,\n    pick,\n    handleKeyDown,\n    listboxId,\n    optionId,\n    activeId,\n    searchInputRef,\n    popoverRef,\n  }\n}\n\n/** Everything `useOptionMenu` returns — pass it to `<OptionMenu menu={…} />`. */\nexport type OptionMenuState = ReturnType<typeof useOptionMenu>\n"],"names":["OptionMenu","menu","anchorRef","size","searchPlaceholder","loading","loadingText","noOptionsText","showSelectedTick","multiselectable","labelledBy","ariaLabel","onSearchKeyDown","className","t","useT","searchPh","filteredOptions","highlightedIndex","renderOption","opt","index","selected","tick","jsx","ListItem","clsx","styles","jsxs","Icon","e","renderRows","rows","r","runs","row","last","run","i","headingId","Typography","FloatingPanel","List","Loader","groupOptions","options","o","buckets","bucket","useOptionMenu","idBase","isSelected","onPick","closeOnPick","highlightSelected","searchable","onSearchChange","disabled","focusRef","onClose","listboxId","optionId","useCallback","open","setOpen","useState","searchQuery","setSearchQueryState","setHighlightedIndex","searchInputRef","useRef","popoverRef","typeahead","onCloseRef","useMemo","q","matches","_a","k","findEnabled","start","delta","closeMenu","refocus","_b","useEffect","selIdx","openMenu","toggleMenu","setSearchQuery","query","pick","option","moveHighlight","cur","found","handleTypeahead","char","match","handleKeyDown","event","activeId"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@techzyapp/ui-library",
-  "version": "1.0.44",
+  "version": "1.0.45",
   "description": "Techzy UI — reusable React component library for admin panels.",
   "type": "module",
   "license": "MIT",