@mortenbrudvik/waveui 0.9.0 → 0.11.0

package/dist/components/input/TagPicker.root.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagPicker.root.cjs","names":["flattenChildren","isElementOfType","TagPickerList","useFieldContext","useFieldControl","isInvalidLook","useInputLook","useControllable","EMPTY_VALUES","React","useIsClient","useId","collectOptionLabels","createOptionText","useListbox","useListboxPopup","useMergedRefs","sameValues","useFocusWithin","useTagOverflow","useEventCallback","findExactMatch","tagListControls","_Fragment","TagPickerControl","cn","tagPickerClassNames","TagPickerContext","HiddenInput","require_runtime","require_cn","require_children","require_dev","require_classNames","require_useEventCallback","require_useControllable","require_useId","require_useMergedRefs","require_useIsClient","require_useFieldControl","require_useAnnounce","require_useListbox","require_inputLook","require_Input","require_useFormReset","require_HiddenInput","require_Option","require_pickerLabels","require_pickerValues","require_TagPicker_context","require_TagPicker_create","require_TagPicker_overflow","require_TagPicker_parts","react","react_jsx_runtime","TAG_PICKER_SIZES","EMPTY_OPTIONS","EMPTY_LABELS","TAG_SIZE","defaultRemoveLabel","label","defaultSummaryLabel","labels","defaultCreateLabel","text","defaultOverflowCountLabel","count","matchesText","item","triggerMessage","ALLOW_CREATE_BUTTON_MESSAGE","LIST_PLACEMENT_MESSAGE","findList","children","node","TagPickerRoot","valueProp","openProp","queryProp","sizeProp","appearanceProp","overflowProp","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaInvalid","ariaRequired","ariaErrorMessage","ariaDetails","rest","props","onChange","overflow","field","validates","required","readOnly","triggerId","triggerLabel","triggerLabelledBy","triggerDescribedBy","triggerInvalid","triggerRequired","invalidLook","coreSize","size","tagSize","tagAppearance","appearance","selected","setSelected","defaultValue","list","next","onValueChange","selectedSet","interactive","disabled","openState","setOpen","defaultOpen","onOpenChange","isClient","open","triggersRef","triggerKind","setTriggerKind","registerTrigger","token","triggers","firstKind","kind","listCountRef","registerList","isButtonTrigger","queryState","setQuery","defaultQuery","onQueryChange","query","lock","setLock","lockedOpen","rootRef","triggerRef","controlElementRef","groupRef","chipRef","summaryId","createValue","allowCreate","listElement","listChildren","registration","collected","optionByValue","map","option","options","resolvedLabels","offersCreate","dataCreateText","items","available","listFilter","matches","filter","addTag","value","commitCreate","onOptionCreate","listbox","details","getItem","labelOf","createText","listed","showCreate","expanded","noMatchesText","surfaceOpen","noMatches","rootMergedRef","ref","initial","current","form","trackFocus","trackBlur","collapsed","focusWithin","tagLabels","hiddenValues","focusTrigger","toggleOpen","removeTag","v","clear","editText","candidates","focusLastTagControl","group","last","setOpenStable","entryOf","triggerProps","tabIndex","autoFocus","inputProps","autoComplete","autoCapitalize","autoCorrect","maxLength","inputMode","spellCheck","enterKeyHint","onFocus","onBlur","onKeyDown","onKeyUp","controlRef","listLabelledBy","listLabel","hasSummary","context","placeholder","layerId","surfaceRef","floatingProps","setReference","expandIcon","clearable","parts","className"],"sources":["../../../src/components/input/TagPicker.root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { flattenChildren, isElementOfType } from '../../lib/children';\nimport { cn } from '../../lib/cn';\nimport { tagPickerClassNames } from '../../lib/classNames';\nimport { warnDeprecated, warnOnce } from '../../lib/dev';\nimport type { Slot } from '../../lib/slot';\nimport type { CoreSize, InputAppearance, Size, TagAppearance, TagSize } from '../../lib/types';\nimport { useAnnounce } from '../../hooks/useAnnounce';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { useFieldContext, useFieldControl } from '../../hooks/useFieldControl';\nimport { useFormReset } from '../../hooks/useFormReset';\nimport { useId } from '../../hooks/useId';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { collectOptionLabels, useListbox, type ListboxItem } from '../../hooks/useListbox';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { HiddenInput } from '../internal/HiddenInput';\nimport { useInputLook } from './inputLook';\nimport { isInvalidLook } from './Input';\nimport { useListboxPopup } from './Option';\nimport { announceToggle } from './pickerLabels';\nimport { EMPTY_VALUES, sameValues } from './pickerValues';\nimport type { RoutedHandlers } from './routedHandlers';\nimport { TagPickerContext } from './TagPicker.context';\nimport type {\n  ResolvedTagPickerLabels,\n  TagPickerContextValue,\n  TagPickerInputOnlyProps,\n  TagPickerTriggerKind,\n  TagPickerTriggerProps,\n} from './TagPicker.context';\nimport { createOptionText, findExactMatch } from './TagPicker.create';\nimport type { ExactMatchCandidate } from './TagPicker.create';\nimport type { TagPickerOption } from './TagPicker.option';\nimport { useFocusWithin, useTagOverflow } from './TagPicker.overflow';\nimport { TagPickerControl, TagPickerList, tagListControls } from './TagPicker.parts';\n\n/**\n * The TagPicker's built-in names, descriptions and announcements, for localization. Each member is\n * optional and falls back to its English default.\n */\nexport interface TagPickerLabels {\n  /** Name of a tag's remove button.\n   * @default (label) => `Remove ${label}`\n   */\n  remove?: (label: string) => string;\n  /** Name of the list of selected tags.\n   * @default 'Selected'\n   */\n  selected?: string;\n  /** Description of the input that sums up the selected tags (their labels, in order).\n   * @default (labels) => `Selected: ${labels.join(', ')}`\n   */\n  summary?: (labels: string[]) => string;\n  /** Announcement when a tag is added; `count` is the number of tags after the change.\n   * @default (label, count) => `${label} added, ${count} selected`\n   */\n  added?: (label: string, count: number) => string;\n  /** Announcement when a tag is removed; `count` is the number of tags after the change.\n   * @default (label, count) => `${label} removed, ${count} selected`\n   */\n  removed?: (label: string, count: number) => string;\n  /** Status text (announced, and shown in the popup) when the typed text matches no option.\n   * @default 'No matches'\n   */\n  noMatches?: string;\n  /**\n   * Text and name of the create option (`allowCreate`), from the trimmed typed text.\n   * @default (text) => `Create \"${text}\"`\n   */\n  create?: (text: string) => string;\n  /** Name of the clear button (`clearable`). @default 'Clear selection' */\n  clear?: string;\n  /** Name of the expand button at the end of the field. @default 'Show options' */\n  expand?: string;\n  /**\n   * The \"+N\" text of the single-line layout (`overflow=\"count\"`); hidden from assistive\n   * technology, which hears the input's summary of every tag.\n   * @default (count) => `+${count}`\n   */\n  overflowCount?: (count: number) => string;\n}\n\n/** Sizes of TagPicker (Fluent's): medium (the 0.7 look), large and extra-large. */\nexport type TagPickerSize = Extract<Size, 'medium' | 'large' | 'extra-large'>;\n\n/** Properties for the TagPicker component. */\nexport interface TagPickerProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue' | RoutedHandlers\n> {\n  /**\n   * The options, the array form (`{ value, label, media?, secondaryContent? }`). With parts whose\n   * `TagPicker.List` has children it only names values (tags, announcements). Changed in 0.11:\n   * optional.\n   */\n  options?: readonly TagPickerOption[];\n  /**\n   * The parts: `TagPicker.Control` and `TagPicker.List`, directly inside TagPicker (a Fragment is\n   * fine). Without children TagPicker renders both with their defaults; without a\n   * `TagPicker.List` it renders the default list after the children.\n   */\n  children?: React.ReactNode;\n  /**\n   * Controlled array of selected option values (`[]` for none). Fluent's `selectedOptions`.\n   */\n  value?: readonly string[];\n  /**\n   * Initial selected values for uncontrolled usage; a form reset restores them.\n   * @default []\n   */\n  defaultValue?: readonly string[];\n  /**\n   * Called with the new selection when it changes: a tag is added (an option, or a created tag)\n   * or removed, or a form reset restores different tags. Fluent's `onOptionSelect`.\n   */\n  onValueChange?: (value: string[]) => void;\n  /**\n   * Called with the new selection when it changes: a tag is added or removed, or a form reset\n   * restores different tags.\n   * @deprecated Use `onValueChange`.\n   */\n  onChange?: (value: string[]) => void;\n  /**\n   * Controlled open state of the option list. The list renders only in the browser: an open\n   * picker is closed in the server HTML and opens once it has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state for uncontrolled usage. A picker that starts disabled or read-only starts\n   * closed. The list renders only in the browser: it is closed in the server HTML and opens once\n   * the picker has hydrated.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /** Called when the option list opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Shown by TagPicker.Input or TagPicker.Button while no tag is selected; the part's own\n   * `placeholder` wins.\n   * @default 'Select...'\n   */\n  placeholder?: string;\n  /**\n   * Whether an option matches the typed text (the query). Called with every listed option, also\n   * the options of `TagPicker.List`'s children (its `value`, `label` and `textValue`), and the\n   * text whenever the text is not empty, never with a selected option or the create option; an\n   * option it returns `false` for is filtered out. It may keep options that do not contain the\n   * text: `filter={() => true}` with `query` and `onQueryChange` leaves the matching to you (a\n   * server-side search that replaces `options`); for a create entry, use `allowCreate`. With a\n   * server-side search, keep the selected options in `options` (they are never listed): a\n   * selected value without an option shows its raw value as the tag label, with a development\n   * warning (the \"Async search\" story does this).\n   * @default a case-insensitive substring match on the option's `textValue ?? label`\n   */\n  filter?: (option: ListboxItem, query: string) => boolean;\n  /**\n   * Controlled query: the text typed since the last tag was added, which filters the options and\n   * shows in the input (hidden while `disabled` or `readOnly`). Not used with TagPicker.Button.\n   */\n  query?: string;\n  /**\n   * Initial query for uncontrolled usage. A TagPicker that starts disabled or read-only starts\n   * without it (as it starts closed). Not used with TagPicker.Button.\n   * @default ''\n   */\n  defaultQuery?: string;\n  /**\n   * Called with the new query when it changes: as the user types, and with `''` when it resets (a\n   * tag added or created, Escape on the closed list, the clear button, a form reset, or `disabled`\n   * or `readOnly` turned on while text is typed). A blur or a close keeps the text. A TagPicker\n   * that mounts disabled or read-only reports nothing: it keeps a controlled query, which shows\n   * once it unlocks. Not used with TagPicker.Button.\n   */\n  onQueryChange?: (query: string) => void;\n  /**\n   * Whether the tag picker is disabled: nothing can be added or removed, the remove buttons leave\n   * the tab order, and the expand and clear buttons are disabled. The field dims once.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Size of the tags and the field: `medium` (the 0.7 look), `large` or `extra-large` (Fluent's\n   * union; TagPicker has no `small`). Default: the surrounding Field's `size`, else `WaveProvider\n   * inputDefaults.size`, else `'medium'`; a Field or provider `small` gives `'medium'` too. Its\n   * tags are one Tag size smaller: medium → extra-small, large → small, extra-large → medium. The\n   * option list keeps its size.\n   */\n  size?: TagPickerSize;\n  /**\n   * Look of the field: `outline` (a full border), `underline` (a bottom stroke only),\n   * `filled-darker` or `filled-lighter` (a fill without a visible stroke: give the field a visible\n   * label). Default: `WaveProvider inputDefaults.appearance`, else `'outline'`. The tags are\n   * filled, outlined on `filled-darker`.\n   */\n  appearance?: InputAppearance;\n  /** Name of the values in form submissions (one hidden input per value). */\n  name?: string;\n  /** Id of the form the values belong to, when the TagPicker is outside it. */\n  form?: string;\n  /**\n   * At least one tag is required to submit the form (native constraint validation). Like a native\n   * readonly input, a `readOnly` TagPicker does not block submission.\n   */\n  required?: boolean;\n  /**\n   * The `autocomplete` attribute of TagPicker.Input's `<input role=\"combobox\">`. Browser autofill\n   * is off unless you set it (for example `'on'`). With TagPicker.Button, not used.\n   * @default 'off'\n   */\n  autoComplete?: string;\n  /**\n   * The maximum length of the typed text (`maxlength` of TagPicker.Input's `<input>`). With\n   * TagPicker.Button, not used.\n   */\n  maxLength?: number;\n  /**\n   * The selection cannot be changed: the trigger is read-only, the tags have no remove buttons,\n   * the expand button is disabled and the clear button hidden, and the option list neither opens\n   * (click, keyboard, a controlled `open`) nor adds tags; Escape is left to the page. Turning it\n   * (or `disabled`) on while the list is open closes it (`onOpenChange(false)`); a focused remove\n   * button hands focus to the trigger.\n   */\n  readOnly?: boolean;\n  /**\n   * Lets the user add a tag of their own text: while the trimmed text matches no option label\n   * and no selected value (ignoring case) and no option value, the list ends with a create option\n   * (`labels.create`); Enter on it or a click adds the text as a tag, calls `onOptionCreate`, and\n   * clears the text. Needs `TagPicker.Input` (not `TagPicker.Button`). WaveUI-only: Fluent's\n   * TagPicker has no free tagging.\n   * @default false\n   */\n  allowCreate?: boolean;\n  /**\n   * Called with the trimmed text when the user creates a tag, before `onValueChange` reports the\n   * new value. Add an option for it if you keep options: until then the tag shows the raw text.\n   * WaveUI-only (see `allowCreate`).\n   */\n  onOptionCreate?: (text: string) => void;\n  /**\n   * Shows a clear button at the end of the field while a tag is selected (not while `readOnly`;\n   * disabled while `disabled`): it removes every tag (`onValueChange([])`), clears the typed\n   * text, closes the list and focuses the trigger (the input, or `TagPicker.Button`). A Tab stop\n   * after the trigger. The name of Fluent's Combobox and Dropdown prop.\n   * @default false\n   */\n  clearable?: boolean;\n  /**\n   * The glyph of the expand button at the end of the field (default: a chevron). The button\n   * opens and closes the list, keeps focus on the trigger and is not a Tab stop. `null` or\n   * `undefined` keep the chevron; `false`, or a value that renders nothing, hides the button.\n   * Decorative: a `<button>` passed here is unwrapped. `TagPicker.Control`'s `expandIcon` wins.\n   */\n  expandIcon?: Slot<'span'>;\n  /**\n   * `'wrap'`: the tags wrap onto more lines. `'count'`: while focus is outside the picker and its\n   * list is closed, the tags stay on one line and the ones that do not fit give way to \"+N\"\n   * (`labels.overflowCount`); focusing the picker shows them all. The tags are measured by\n   * position: your own Tags in `TagPicker.Group` render in `value` order. WaveUI-only: Fluent's\n   * single-line layout is a story, not a prop.\n   * @default 'wrap'\n   */\n  overflow?: 'wrap' | 'count';\n  /**\n   * Names of the remove buttons and the tag list, the summary that describes the trigger, the\n   * announcements, the \"No matches\" text, the create option, the clear and expand buttons and the\n   * \"+N\" count, for localization. Unset members keep their English defaults.\n   */\n  labels?: TagPickerLabels;\n  /**\n   * Called when TagPicker.Input's `<input role=\"combobox\">` receives focus (the root keeps other\n   * handlers). With TagPicker.Button, pass it (and `ref`) on the Button.\n   */\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  /** Called when TagPicker.Input's `<input>` loses focus. With TagPicker.Button, pass it on the Button. */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * Called on a key press in TagPicker.Input's `<input>`, after the Input's own `onKeyDown` and\n   * before the built-in listbox and tag keys; `event.preventDefault()` skips them. With\n   * TagPicker.Button, pass it on the Button.\n   */\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  /** Called when a key is released in TagPicker.Input's `<input>`. With TagPicker.Button, pass it on the Button. */\n  onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;\n  /**\n   * Ref to TagPicker.Input's `<input role=\"combobox\">` (the focusable element). With\n   * TagPicker.Button, pass `ref` on the Button.\n   */\n  controlRef?: React.Ref<HTMLInputElement>;\n  /** Ref to the root `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * How the picker came to be locked (`disabled` or `readOnly`): not at all, by a change while\n * mounted, or since it mounted.\n */\ntype LockState = 'unlocked' | 'locked' | 'mounted-locked';\n\nconst TAG_PICKER_SIZES: readonly TagPickerSize[] = ['medium', 'large', 'extra-large'];\nconst EMPTY_OPTIONS: readonly TagPickerOption[] = [];\nconst EMPTY_LABELS: ReadonlyMap<string, string> = new Map();\n\n/** The tag size of each picker size (Fluent's mapping, D54). */\nconst TAG_SIZE: Readonly<Record<TagPickerSize, TagSize>> = {\n  medium: 'extra-small',\n  large: 'small',\n  'extra-large': 'medium',\n};\n\nconst defaultRemoveLabel = (label: string) => `Remove ${label}`;\nconst defaultSummaryLabel = (labels: string[]) => `Selected: ${labels.join(', ')}`;\nconst defaultCreateLabel = (text: string) => `Create \"${text}\"`;\nconst defaultOverflowCountLabel = (count: number) => `+${count}`;\n\n/** The default `filter` (Phase 5 D13): a case-insensitive substring of `textValue ?? label`. */\nfunction matchesText(item: ListboxItem, text: string): boolean {\n  return (item.textValue ?? item.label).toLowerCase().includes(text.toLowerCase());\n}\n\nfunction triggerMessage(count: number): string {\n  return `TagPicker: render exactly one trigger, \\`TagPicker.Input\\` or \\`TagPicker.Button\\`, inside \\`TagPicker.Control\\` (found ${count}).`;\n}\n\nconst ALLOW_CREATE_BUTTON_MESSAGE =\n  'TagPicker: `allowCreate` needs `TagPicker.Input`: `TagPicker.Button` has no text to create a tag from, so no create option is offered.';\n\nconst LIST_PLACEMENT_MESSAGE =\n  'TagPicker.List: render one TagPicker.List, directly inside TagPicker (a Fragment is fine). A second list, or one inside a component of your own, splits the options over two lists.';\n\n/** The `TagPicker.List` among the direct children and Fragments, if any (D50). */\nfunction findList(\n  children: React.ReactNode,\n): React.ReactElement<{ children?: React.ReactNode }> | undefined {\n  if (children === null || children === undefined) return undefined;\n  for (const { node } of flattenChildren(children)) {\n    if (isElementOfType<{ children?: React.ReactNode }>(node, TagPickerList)) return node;\n  }\n  return undefined;\n}\n\nexport const TagPickerRoot = (props: TagPickerProps) => {\n  const {\n    options = EMPTY_OPTIONS,\n    children,\n    value: valueProp,\n    defaultValue,\n    onValueChange,\n    onChange,\n    open: openProp,\n    defaultOpen,\n    onOpenChange,\n    placeholder = 'Select...',\n    filter,\n    query: queryProp,\n    defaultQuery,\n    onQueryChange,\n    disabled = false,\n    size: sizeProp,\n    appearance: appearanceProp,\n    name,\n    form,\n    required,\n    autoComplete = 'off',\n    autoCapitalize,\n    autoCorrect,\n    maxLength,\n    readOnly = false,\n    allowCreate = false,\n    onOptionCreate,\n    clearable = false,\n    expandIcon,\n    overflow: overflowProp = 'wrap',\n    labels,\n    inputMode,\n    spellCheck,\n    enterKeyHint,\n    autoFocus,\n    tabIndex,\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    'aria-required': ariaRequired,\n    'aria-errormessage': ariaErrorMessage,\n    'aria-details': ariaDetails,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    onKeyUp,\n    controlRef,\n    className,\n    ref,\n    ...rest\n  } = props;\n\n  if (onChange !== undefined) warnDeprecated('TagPicker', 'onChange', 'onValueChange');\n  const overflow = overflowProp === 'count' ? 'count' : 'wrap';\n\n  const field = useFieldContext();\n  const isRequired = required ?? field?.required ?? false;\n  // Like a native readonly input, a read-only TagPicker is barred from constraint validation (the\n  // user could not fix it); its values are still submitted.\n  const validates = isRequired && !readOnly;\n  const fieldProps = useFieldControl({\n    id,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    // An explicit `required={false}` wins over a required Field, so aria-required matches\n    // `isRequired`.\n    'aria-required': ariaRequired ?? required,\n  });\n  const {\n    id: triggerId,\n    'aria-label': triggerLabel,\n    'aria-labelledby': triggerLabelledBy,\n    'aria-describedby': triggerDescribedBy,\n    'aria-invalid': triggerInvalid,\n    'aria-required': triggerRequired,\n  } = fieldProps;\n  // The error look follows the resolved state: the consumer's `aria-invalid` or the Field's.\n  const invalidLook = isInvalidLook(false, triggerInvalid);\n  const { size, appearance } = useInputLook(sizeProp, appearanceProp, {\n    sizes: TAG_PICKER_SIZES,\n    defaultSize: 'medium',\n  });\n  const coreSize: CoreSize = size === 'medium' ? 'medium' : 'large';\n  const tagSize = TAG_SIZE[size];\n  // A muted tag would barely show on the darker fill: outlined there (D54).\n  const tagAppearance: TagAppearance = appearance === 'filled-darker' ? 'outline' : 'filled';\n\n  const [selected, setSelected] = useControllable<readonly string[]>(\n    valueProp,\n    defaultValue ?? EMPTY_VALUES,\n    (next) => {\n      // The props are read only; the callbacks receive an array of their own.\n      const list = [...next];\n      onValueChange?.(list);\n      onChange?.(list);\n    },\n  );\n  const selectedSet = React.useMemo(() => new Set(selected), [selected]);\n  const interactive = !disabled && !readOnly;\n  // A picker that starts disabled or read-only never shows its list, so it starts closed (no close\n  // to report later).\n  const [openState, setOpen] = useControllable(\n    openProp,\n    (defaultOpen ?? false) && interactive,\n    onOpenChange,\n  );\n  // The open list lives in a portal, which renders only in the browser: until then (the server\n  // HTML, hydration) the picker shows the closed inline list and reports it closed, so\n  // aria-controls and aria-activedescendant never name a missing element.\n  const isClient = useIsClient();\n  const open = openState && interactive && isClient;\n  // The trigger parts (D63): their kind decides the listbox mode; the server HTML and the first\n  // render use the editable mode of `TagPicker.Input`.\n  const triggersRef = React.useRef(new Map<object, TagPickerTriggerKind>());\n  const [triggerKind, setTriggerKind] = React.useState<TagPickerTriggerKind>('input');\n  const registerTrigger = React.useCallback((kind: TagPickerTriggerKind) => {\n    const token = {};\n    const triggers = triggersRef.current;\n    const firstKind = () => triggers.values().next().value ?? 'input';\n    triggers.set(token, kind);\n    setTriggerKind(firstKind());\n    return () => {\n      triggers.delete(token);\n      setTriggerKind(firstKind());\n    };\n  }, []);\n  const listCountRef = React.useRef(0);\n  const registerList = React.useCallback(() => {\n    listCountRef.current += 1;\n    return () => {\n      listCountRef.current -= 1;\n    };\n  }, []);\n  // After every commit (every part's layout effect has run): exactly one trigger and one List.\n  React.useEffect(() => {\n    const triggers = triggersRef.current.size;\n    if (triggers !== 1) warnOnce('TagPicker:trigger', triggerMessage(triggers));\n    if (listCountRef.current > 1) warnOnce('TagPicker.List:placement', LIST_PLACEMENT_MESSAGE);\n  });\n  const isButtonTrigger = triggerKind === 'button';\n\n  // The query (D12): the text typed since the last tag was added, which filters the options. A\n  // picker that starts locked starts without a query, as it starts closed.\n  const [queryState, setQuery] = useControllable(\n    queryProp,\n    interactive ? (defaultQuery ?? '') : '',\n    onQueryChange,\n  );\n  // Locking the control (readOnly/disabled) while typing drops the typed text: hidden during\n  // render here, and the reset reported from an effect, since `onQueryChange` never runs during\n  // render (D12). `lock` is how the picker came to be locked (previous-value pattern, C-HOOKS):\n  // `'locked'` by a change while mounted, whose reset is reported once, or `'mounted-locked'`\n  // since it mounted, which reports nothing and keeps a controlled query, hidden until the picker\n  // unlocks (R20).\n  // `TagPicker.Button` has no text entry, so no query filters its list (D63).\n  const query = interactive && !isButtonTrigger ? queryState : '';\n  const [lock, setLock] = React.useState<LockState>(interactive ? 'unlocked' : 'mounted-locked');\n  if (interactive && lock !== 'unlocked') setLock('unlocked');\n  else if (!interactive && lock === 'unlocked') setLock('locked');\n  React.useEffect(() => {\n    if (lock === 'locked') setQuery('');\n  }, [lock, setQuery]);\n  // Locking also closes the list itself, not only the derived `open`, so unlocking does not reopen\n  // it without a user action. The close is reported through onOpenChange (a consumer callback from\n  // an effect, C-HOOKS); a controlled `open` that stays true is still not shown while locked.\n  const lockedOpen = !interactive && openState;\n  React.useEffect(() => {\n    if (lockedOpen) setOpen(false);\n  }, [lockedOpen, setOpen]);\n  // Keeps the shared live regions alive while mounted: every addition and removal is announced\n  // (`announceToggle`).\n  useAnnounce();\n\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  const controlElementRef = React.useRef<HTMLDivElement | null>(null);\n  const groupRef = React.useRef<HTMLDivElement | null>(null);\n  const chipRef = React.useRef<HTMLSpanElement | null>(null);\n  const summaryId = useId('tagpicker-summary');\n  const createValue = useId('tagpicker-create');\n\n  React.useEffect(() => {\n    if (allowCreate && isButtonTrigger) {\n      warnOnce('TagPicker:allowCreate-button', ALLOW_CREATE_BUTTON_MESSAGE);\n    }\n  }, [allowCreate, isButtonTrigger]);\n\n  // The parts form (D50): a List among the direct children with children of its own switches the\n  // listbox to registration mode; `options` then only names values.\n  const listElement = findList(children);\n  const listChildren = listElement?.props.children;\n  const registration = listChildren !== undefined && listChildren !== null;\n  const collected = React.useMemo(\n    () => (registration ? collectOptionLabels(listChildren) : EMPTY_LABELS),\n    [registration, listChildren],\n  );\n\n  const optionByValue = React.useMemo(() => {\n    const map = new Map<string, TagPickerOption>();\n    for (const option of options) if (!map.has(option.value)) map.set(option.value, option);\n    return map;\n  }, [options]);\n\n  const resolvedLabels = React.useMemo<ResolvedTagPickerLabels>(\n    () => ({\n      remove: labels?.remove ?? defaultRemoveLabel,\n      selected: labels?.selected ?? 'Selected',\n      create: labels?.create ?? defaultCreateLabel,\n      clear: labels?.clear ?? 'Clear selection',\n      expand: labels?.expand ?? 'Show options',\n      overflowCount: labels?.overflowCount ?? defaultOverflowCountLabel,\n      noMatches: labels?.noMatches ?? 'No matches',\n    }),\n    [labels],\n  );\n\n  // The create option (D59) needs the text input, an interactive picker and an open list.\n  const offersCreate =\n    allowCreate && interactive && !isButtonTrigger && open && query.trim() !== '';\n  // Data mode: the duplicate check reads every `options` entry, before the listbox, since the\n  // create item is one of its items.\n  const dataCreateText =\n    offersCreate && !registration\n      ? createOptionText(query, {\n          labels: options.map((option) => option.label),\n          values: options.map((option) => option.value),\n          selected,\n        })\n      : null;\n\n  const items = React.useMemo<ListboxItem[] | undefined>(() => {\n    if (registration) return undefined;\n    const available: ListboxItem[] = options\n      .filter((option) => !selectedSet.has(option.value))\n      .map((option) => ({ value: option.value, label: option.label }));\n    if (dataCreateText !== null) {\n      available.push({ value: createValue, label: resolvedLabels.create(dataCreateText) });\n    }\n    return available;\n  }, [registration, options, selectedSet, dataCreateText, createValue, resolvedLabels]);\n\n  // useListbox's navigability predicate (D58): the create option always, never a selected option,\n  // and `filter` (else the default) bound to the typed text while there is any.\n  const listFilter = React.useMemo(() => {\n    if (!registration && !query) return undefined;\n    const matches = filter ?? matchesText;\n    return (item: ListboxItem) =>\n      item.value === createValue ||\n      (!selectedSet.has(item.value) && (query === '' || matches(item, query)));\n  }, [registration, query, filter, selectedSet, createValue]);\n\n  // Adds a listed option (`label`: the committed item's).\n  const addTag = (value: string, label: string) => {\n    if (!interactive || selected.includes(value)) return;\n    const next = [...selected, value];\n    setSelected(next);\n    setQuery('');\n    announceToggle(labels, label, true, next.length);\n  };\n\n  // Creates a tag of the trimmed text (D59): the create option was offered for it.\n  const commitCreate = () => {\n    const text = query.trim();\n    if (!interactive || text === '') return;\n    onOptionCreate?.(text);\n    const next = [...selected, text];\n    setSelected(next);\n    setQuery('');\n    announceToggle(labels, text, true, next.length);\n  };\n\n  const listbox = useListbox({\n    open,\n    onOpenChange: (next) => setOpen(next),\n    mode: isButtonTrigger ? 'select-only' : 'editable',\n    multiselect: true,\n    selectedValues: selected,\n    onSelect: (value, details) => {\n      if (value === createValue) commitCreate();\n      else addTag(value, details?.item.label ?? value);\n    },\n    items,\n    filter: listFilter,\n    // Typing a filter makes its first match active (as in Combobox), so Enter adds what the list\n    // shows instead of submitting the form. Nothing is active on open or with the text cleared.\n    // The Button trigger starts on the first listed option, as Dropdown does.\n    autoHighlight: isButtonTrigger ? 'selected' : query ? 'first' : false,\n    idPrefix: 'tagpicker-listbox',\n    onClearDraft: query && !isButtonTrigger ? () => setQuery('') : undefined,\n  });\n\n  // A value's label (D58): its registered option's, else the List children's (the server and the\n  // first render), else the `options` entry's, else the raw value.\n  const getItem = listbox.getItem;\n  const labelOf = React.useCallback(\n    (value: string): string =>\n      (registration ? getItem(value)?.label : undefined) ??\n      collected.get(value) ??\n      optionByValue.get(value)?.label ??\n      value,\n    [registration, getItem, collected, optionByValue],\n  );\n\n  // Registration mode: the create option is a rendered Option, so the duplicate check runs after\n  // the listbox, over the labels it lists in this render and those of the selected values.\n  let createText: string | null = dataCreateText;\n  if (offersCreate && registration) {\n    const listed = listbox.items.filter((item) => item.value !== createValue);\n    createText = createOptionText(query, {\n      labels: [\n        ...options.map((option) => option.label),\n        ...collected.values(),\n        ...listed.map((item) => item.label),\n        ...selected.map(labelOf),\n      ],\n      values: [\n        ...options.map((option) => option.value),\n        ...collected.keys(),\n        ...listed.map((item) => item.value),\n      ],\n      selected,\n    });\n  }\n  const showCreate = createText !== null;\n\n  // aria-expanded only while a listbox with options (or the create option) is shown\n  // (input-pickers#21).\n  const expanded = open && (listbox.items.length > 0 || showCreate);\n  const noMatchesText = resolvedLabels.noMatches;\n  // The popup shows the options, or \"No matches\" for a query.\n  const surfaceOpen = open && (expanded || query !== '');\n  const noMatches = surfaceOpen && !expanded && !showCreate;\n  const { layerId, setReference, surfaceRef, floatingProps } = useListboxPopup({\n    open,\n    surfaceOpen,\n    onDismiss: () => setOpen(false),\n    rootRef,\n    anchorRef: triggerRef,\n  });\n\n  const rootMergedRef = useMergedRefs<HTMLDivElement>(rootRef, ref);\n\n  useFormReset(\n    rootRef,\n    () => {\n      // Compared by content (C-FORMS): an inline default is a new array on every render, and a\n      // reset that keeps the same tags reports nothing.\n      const initial = defaultValue ?? EMPTY_VALUES;\n      setSelected((current) => (sameValues(current, initial) ? current : [...initial]));\n      setQuery('');\n    },\n    form,\n  );\n\n  // The single-line layout (D62): collapsed while focus is outside the root and the list closed.\n  const {\n    focusWithin,\n    onFocus: trackFocus,\n    onBlur: trackBlur,\n  } = useFocusWithin(overflow === 'count');\n  const collapsed = overflow === 'count' && !focusWithin && !open;\n  const tagLabels = React.useMemo(() => selected.map(labelOf), [selected, labelOf]);\n  const hiddenValues = useTagOverflow({\n    active: collapsed,\n    values: selected,\n    labels: tagLabels,\n    control: controlElementRef,\n    group: groupRef,\n    chip: chipRef,\n    trigger: triggerRef,\n  });\n\n  const focusTrigger = useEventCallback(() => {\n    triggerRef.current?.focus();\n  });\n  const toggleOpen = useEventCallback(() => {\n    if (interactive) setOpen(!open);\n  });\n  const removeTag = useEventCallback((value: string) => {\n    if (!interactive || !selected.includes(value)) return;\n    const next = selected.filter((v) => v !== value);\n    setSelected(next);\n    announceToggle(labels, labelOf(value), false, next.length);\n  });\n  const clear = useEventCallback(() => {\n    focusTrigger();\n    if (!interactive) return;\n    if (selected.length > 0) setSelected([]);\n    setQuery('');\n    setOpen(false);\n  });\n  const editText = useEventCallback((text: string) => {\n    if (!interactive) return;\n    setQuery(text);\n    if (!open) setOpen(true);\n    // The option whose label equals the typed text becomes active (D60); a user edit only.\n    const candidates: Iterable<ExactMatchCandidate> = registration\n      ? Array.from(collected, ([value, label]) => ({ value, label }))\n      : options;\n    listbox.setActiveValue(findExactMatch(text, candidates, selectedSet));\n  });\n  const focusLastTagControl = useEventCallback(() => {\n    const group = groupRef.current;\n    const last = group ? tagListControls(group).at(-1) : undefined;\n    last?.focus();\n    return last !== undefined;\n  });\n  const setOpenStable = useEventCallback((next: boolean) => setOpen(next));\n  const entryOf = React.useCallback((value: string) => optionByValue.get(value), [optionByValue]);\n\n  const triggerProps = React.useMemo<TagPickerTriggerProps>(\n    () => ({\n      id: triggerId,\n      'aria-label': triggerLabel,\n      'aria-labelledby': triggerLabelledBy,\n      'aria-describedby': triggerDescribedBy,\n      'aria-invalid': triggerInvalid,\n      'aria-required': triggerRequired,\n      'aria-errormessage': ariaErrorMessage,\n      'aria-details': ariaDetails,\n      tabIndex,\n      autoFocus,\n    }),\n    [\n      triggerId,\n      triggerLabel,\n      triggerLabelledBy,\n      triggerDescribedBy,\n      triggerInvalid,\n      triggerRequired,\n      ariaErrorMessage,\n      ariaDetails,\n      tabIndex,\n      autoFocus,\n    ],\n  );\n  const inputProps = React.useMemo<TagPickerInputOnlyProps>(\n    () => ({\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      maxLength,\n      inputMode,\n      spellCheck,\n      enterKeyHint,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      onKeyUp,\n      controlRef,\n    }),\n    [\n      autoComplete,\n      autoCapitalize,\n      autoCorrect,\n      maxLength,\n      inputMode,\n      spellCheck,\n      enterKeyHint,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      onKeyUp,\n      controlRef,\n    ],\n  );\n  const listLabelledBy =\n    triggerLabel === undefined ? (triggerLabelledBy ?? field?.labelId) : triggerLabelledBy;\n  const listLabel = React.useMemo(\n    () => ({ 'aria-label': triggerLabel, 'aria-labelledby': listLabelledBy }),\n    [triggerLabel, listLabelledBy],\n  );\n\n  const hasSummary = selected.length > 0;\n  const context = React.useMemo<TagPickerContextValue>(\n    () => ({\n      size,\n      appearance,\n      coreSize,\n      tagSize,\n      tagAppearance,\n      disabled,\n      readOnly,\n      interactive,\n      invalidLook,\n      selected,\n      labelOf,\n      entryOf,\n      labels: resolvedLabels,\n      placeholder,\n      options,\n      warnsUnknownValues: !registration && !allowCreate,\n      dataMode: !registration,\n      listbox,\n      open,\n      expanded,\n      query,\n      surfaceOpen,\n      showCreate,\n      createText: createText ?? '',\n      createValue,\n      emptyContent: query !== '' && !showCreate,\n      layerId,\n      surfaceRef,\n      floatingProps,\n      listLabel,\n      triggerProps,\n      inputProps,\n      summaryId: hasSummary ? summaryId : undefined,\n      triggerRef,\n      setReference,\n      controlRef: controlElementRef,\n      groupRef,\n      chipRef,\n      registerTrigger,\n      registerList,\n      triggerKind,\n      setOpen: setOpenStable,\n      toggleOpen,\n      focusTrigger,\n      removeTag,\n      clear,\n      editText,\n      focusLastTagControl,\n      expandIcon,\n      clearable,\n      overflow,\n      collapsed,\n      hiddenValues,\n    }),\n    [\n      size,\n      appearance,\n      coreSize,\n      tagSize,\n      tagAppearance,\n      disabled,\n      readOnly,\n      interactive,\n      invalidLook,\n      selected,\n      labelOf,\n      entryOf,\n      resolvedLabels,\n      placeholder,\n      options,\n      registration,\n      allowCreate,\n      listbox,\n      open,\n      expanded,\n      query,\n      surfaceOpen,\n      showCreate,\n      createText,\n      createValue,\n      layerId,\n      surfaceRef,\n      floatingProps,\n      listLabel,\n      triggerProps,\n      inputProps,\n      hasSummary,\n      summaryId,\n      setReference,\n      registerTrigger,\n      registerList,\n      triggerKind,\n      setOpenStable,\n      toggleOpen,\n      focusTrigger,\n      removeTag,\n      clear,\n      editText,\n      focusLastTagControl,\n      expandIcon,\n      clearable,\n      overflow,\n      collapsed,\n      hiddenValues,\n    ],\n  );\n\n  const parts =\n    children === undefined || children === null ? (\n      <>\n        <TagPickerControl />\n        <TagPickerList />\n      </>\n    ) : (\n      <>\n        {children}\n        {/* A parts form without a List still has its listbox, so aria-controls never dangles. */}\n        {listElement === undefined && <TagPickerList />}\n      </>\n    );\n\n  return (\n    <div\n      data-size={size}\n      data-appearance={appearance}\n      data-overflow={overflow}\n      data-collapsed={collapsed ? '' : undefined}\n      {...rest}\n      ref={rootMergedRef}\n      className={cn(tagPickerClassNames.root, 'relative', className)}\n      // Focus inside the root (DOM containment) expands the single-line layout.\n      onFocus={trackFocus}\n      onBlur={trackBlur}\n    >\n      <TagPickerContext.Provider value={context}>{parts}</TagPickerContext.Provider>\n      {hasSummary && (\n        // Describes the trigger. The list itself would read every \"Remove …\" button name too.\n        <span id={summaryId} hidden>\n          {(labels?.summary ?? defaultSummaryLabel)(selected.map(labelOf))}\n        </span>\n      )}\n      {/* Mounted before its text: a live region added together with its text is not announced by\n          every screen reader. The row in the popup is the visible copy. */}\n      <span role=\"status\" className=\"sr-only\">\n        {noMatches && noMatchesText}\n      </span>\n      <HiddenInput\n        name={name}\n        form={form}\n        disabled={disabled}\n        value={selected}\n        type=\"text\"\n        required={validates}\n        onInvalid={focusTrigger}\n      />\n    </div>\n  );\n};\nTagPickerRoot.displayName = 'TagPicker';\n"],"mappings":"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"}

package/dist/components/input/TagPicker.root.mjs

@@ -0,0 +1,416 @@
+"use client";
+import { cn as e } from "../../lib/cn.mjs";
+import { flattenChildren as t, isElementOfType as n } from "../../lib/children.mjs";
+import { warnDeprecated as r, warnOnce as i } from "../../lib/dev.mjs";
+import { tagPickerClassNames as ee } from "../../lib/classNames.mjs";
+import { useEventCallback as a } from "../../hooks/useEventCallback.mjs";
+import { useControllable as o } from "../../hooks/useControllable.mjs";
+import { useId as te } from "../../hooks/useId.mjs";
+import { useMergedRefs as ne } from "../../hooks/useMergedRefs.mjs";
+import { useIsClient as re } from "../../hooks/useIsClient.mjs";
+import { useFieldContext as ie, useFieldControl as ae } from "../../hooks/useFieldControl.mjs";
+import { useAnnounce as oe } from "../../hooks/useAnnounce.mjs";
+import { collectOptionLabels as se, useListbox as ce } from "../../hooks/useListbox.mjs";
+import { useInputLook as le } from "./inputLook.mjs";
+import { isInvalidLook as ue } from "./Input.mjs";
+import { useFormReset as de } from "../../hooks/useFormReset.mjs";
+import { HiddenInput as fe } from "../internal/HiddenInput.mjs";
+import { useListboxPopup as pe } from "./Option.mjs";
+import { announceToggle as s } from "./pickerLabels.mjs";
+import { EMPTY_VALUES as me, sameValues as he } from "./pickerValues.mjs";
+import { TagPickerContext as ge } from "./TagPicker.context.mjs";
+import { createOptionText as _e, findExactMatch as ve } from "./TagPicker.create.mjs";
+import { useFocusWithin as ye, useTagOverflow as be } from "./TagPicker.overflow.mjs";
+import { TagPickerControl as xe, TagPickerList as c, tagListControls as Se } from "./TagPicker.parts.mjs";
+import * as l from "react";
+import { Fragment as Ce, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/input/TagPicker.root.tsx
+var we = [
+	"medium",
+	"large",
+	"extra-large"
+], Te = [], Ee = /* @__PURE__ */ new Map(), De = {
+	medium: "extra-small",
+	large: "small",
+	"extra-large": "medium"
+}, Oe = (e) => `Remove ${e}`, ke = (e) => `Selected: ${e.join(", ")}`, Ae = (e) => `Create "${e}"`, je = (e) => `+${e}`;
+function Me(e, t) {
+	return (e.textValue ?? e.label).toLowerCase().includes(t.toLowerCase());
+}
+function Ne(e) {
+	return `TagPicker: render exactly one trigger, \`TagPicker.Input\` or \`TagPicker.Button\`, inside \`TagPicker.Control\` (found ${e}).`;
+}
+var Pe = "TagPicker: `allowCreate` needs `TagPicker.Input`: `TagPicker.Button` has no text to create a tag from, so no create option is offered.", Fe = "TagPicker.List: render one TagPicker.List, directly inside TagPicker (a Fragment is fine). A second list, or one inside a component of your own, splits the options over two lists.";
+function Ie(e) {
+	if (e != null) {
+		for (let { node: r } of t(e)) if (n(r, c)) return r;
+	}
+}
+var f = (t) => {
+	let { options: n = Te, children: f, value: Le, defaultValue: Re, onValueChange: ze, onChange: Be, open: Ve, defaultOpen: He, onOpenChange: Ue, placeholder: We = "Select...", filter: Ge, query: Ke, defaultQuery: qe, onQueryChange: Je, disabled: p = !1, size: Ye, appearance: Xe, name: Ze, form: Qe, required: $e, autoComplete: et = "off", autoCapitalize: tt, autoCorrect: nt, maxLength: rt, readOnly: m = !1, allowCreate: h = !1, onOptionCreate: it, clearable: at = !1, expandIcon: ot, overflow: st = "wrap", labels: g, inputMode: ct, spellCheck: lt, enterKeyHint: ut, autoFocus: dt, tabIndex: ft, id: pt, "aria-label": mt, "aria-labelledby": ht, "aria-describedby": gt, "aria-invalid": _t, "aria-required": vt, "aria-errormessage": yt, "aria-details": bt, onFocus: xt, onBlur: St, onKeyDown: Ct, onKeyUp: wt, controlRef: Tt, className: Et, ref: Dt, ...Ot } = t;
+	Be !== void 0 && r("TagPicker", "onChange", "onValueChange");
+	let _ = st === "count" ? "count" : "wrap", kt = ie(), At = ($e ?? kt?.required ?? !1) && !m, { id: jt, "aria-label": v, "aria-labelledby": y, "aria-describedby": Mt, "aria-invalid": b, "aria-required": Nt } = ae({
+		id: pt,
+		"aria-label": mt,
+		"aria-labelledby": ht,
+		"aria-describedby": gt,
+		"aria-invalid": _t,
+		"aria-required": vt ?? $e
+	}), Pt = ue(!1, b), { size: x, appearance: S } = le(Ye, Xe, {
+		sizes: we,
+		defaultSize: "medium"
+	}), Ft = x === "medium" ? "medium" : "large", It = De[x], Lt = S === "filled-darker" ? "outline" : "filled", [C, w] = o(Le, Re ?? me, (e) => {
+		let t = [...e];
+		ze?.(t), Be?.(t);
+	}), T = l.useMemo(() => new Set(C), [C]), E = !p && !m, [Rt, D] = o(Ve, (He ?? !1) && E, Ue), zt = re(), O = Rt && E && zt, Bt = l.useRef(/* @__PURE__ */ new Map()), [k, Vt] = l.useState("input"), Ht = l.useCallback((e) => {
+		let t = {}, n = Bt.current, r = () => n.values().next().value ?? "input";
+		return n.set(t, e), Vt(r()), () => {
+			n.delete(t), Vt(r());
+		};
+	}, []), A = l.useRef(0), Ut = l.useCallback(() => (A.current += 1, () => {
+		--A.current;
+	}), []);
+	l.useEffect(() => {
+		let e = Bt.current.size;
+		e !== 1 && i("TagPicker:trigger", Ne(e)), A.current > 1 && i("TagPicker.List:placement", Fe);
+	});
+	let j = k === "button", [Wt, M] = o(Ke, E ? qe ?? "" : "", Je), N = E && !j ? Wt : "", [P, Gt] = l.useState(E ? "unlocked" : "mounted-locked");
+	E && P !== "unlocked" ? Gt("unlocked") : !E && P === "unlocked" && Gt("locked"), l.useEffect(() => {
+		P === "locked" && M("");
+	}, [P, M]);
+	let Kt = !E && Rt;
+	l.useEffect(() => {
+		Kt && D(!1);
+	}, [Kt, D]), oe();
+	let F = l.useRef(null), I = l.useRef(null), qt = l.useRef(null), L = l.useRef(null), Jt = l.useRef(null), R = te("tagpicker-summary"), z = te("tagpicker-create");
+	l.useEffect(() => {
+		h && j && i("TagPicker:allowCreate-button", Pe);
+	}, [h, j]);
+	let Yt = Ie(f), B = Yt?.props.children, V = B != null, H = l.useMemo(() => V ? se(B) : Ee, [V, B]), U = l.useMemo(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of n) e.has(t.value) || e.set(t.value, t);
+		return e;
+	}, [n]), W = l.useMemo(() => ({
+		remove: g?.remove ?? Oe,
+		selected: g?.selected ?? "Selected",
+		create: g?.create ?? Ae,
+		clear: g?.clear ?? "Clear selection",
+		expand: g?.expand ?? "Show options",
+		overflowCount: g?.overflowCount ?? je,
+		noMatches: g?.noMatches ?? "No matches"
+	}), [g]), Xt = h && E && !j && O && N.trim() !== "", G = Xt && !V ? _e(N, {
+		labels: n.map((e) => e.label),
+		values: n.map((e) => e.value),
+		selected: C
+	}) : null, Zt = l.useMemo(() => {
+		if (V) return;
+		let e = n.filter((e) => !T.has(e.value)).map((e) => ({
+			value: e.value,
+			label: e.label
+		}));
+		return G !== null && e.push({
+			value: z,
+			label: W.create(G)
+		}), e;
+	}, [
+		V,
+		n,
+		T,
+		G,
+		z,
+		W
+	]), Qt = l.useMemo(() => {
+		if (!V && !N) return;
+		let e = Ge ?? Me;
+		return (t) => t.value === z || !T.has(t.value) && (N === "" || e(t, N));
+	}, [
+		V,
+		N,
+		Ge,
+		T,
+		z
+	]), $t = (e, t) => {
+		if (!E || C.includes(e)) return;
+		let n = [...C, e];
+		w(n), M(""), s(g, t, !0, n.length);
+	}, en = () => {
+		let e = N.trim();
+		if (!E || e === "") return;
+		it?.(e);
+		let t = [...C, e];
+		w(t), M(""), s(g, e, !0, t.length);
+	}, K = ce({
+		open: O,
+		onOpenChange: (e) => D(e),
+		mode: j ? "select-only" : "editable",
+		multiselect: !0,
+		selectedValues: C,
+		onSelect: (e, t) => {
+			e === z ? en() : $t(e, t?.item.label ?? e);
+		},
+		items: Zt,
+		filter: Qt,
+		autoHighlight: j ? "selected" : N ? "first" : !1,
+		idPrefix: "tagpicker-listbox",
+		onClearDraft: N && !j ? () => M("") : void 0
+	}), tn = K.getItem, q = l.useCallback((e) => (V ? tn(e)?.label : void 0) ?? H.get(e) ?? U.get(e)?.label ?? e, [
+		V,
+		tn,
+		H,
+		U
+	]), J = G;
+	if (Xt && V) {
+		let e = K.items.filter((e) => e.value !== z);
+		J = _e(N, {
+			labels: [
+				...n.map((e) => e.label),
+				...H.values(),
+				...e.map((e) => e.label),
+				...C.map(q)
+			],
+			values: [
+				...n.map((e) => e.value),
+				...H.keys(),
+				...e.map((e) => e.value)
+			],
+			selected: C
+		});
+	}
+	let Y = J !== null, X = O && (K.items.length > 0 || Y), nn = W.noMatches, Z = O && (X || N !== ""), rn = Z && !X && !Y, { layerId: an, setReference: on, surfaceRef: sn, floatingProps: cn } = pe({
+		open: O,
+		surfaceOpen: Z,
+		onDismiss: () => D(!1),
+		rootRef: F,
+		anchorRef: I
+	}), ln = ne(F, Dt);
+	de(F, () => {
+		let e = Re ?? me;
+		w((t) => he(t, e) ? t : [...e]), M("");
+	}, Qe);
+	let { focusWithin: un, onFocus: dn, onBlur: fn } = ye(_ === "count"), Q = _ === "count" && !un && !O, pn = l.useMemo(() => C.map(q), [C, q]), mn = be({
+		active: Q,
+		values: C,
+		labels: pn,
+		control: qt,
+		group: L,
+		chip: Jt,
+		trigger: I
+	}), $ = a(() => {
+		I.current?.focus();
+	}), hn = a(() => {
+		E && D(!O);
+	}), gn = a((e) => {
+		if (!E || !C.includes(e)) return;
+		let t = C.filter((t) => t !== e);
+		w(t), s(g, q(e), !1, t.length);
+	}), _n = a(() => {
+		$(), E && (C.length > 0 && w([]), M(""), D(!1));
+	}), vn = a((e) => {
+		if (!E) return;
+		M(e), O || D(!0);
+		let t = V ? Array.from(H, ([e, t]) => ({
+			value: e,
+			label: t
+		})) : n;
+		K.setActiveValue(ve(e, t, T));
+	}), yn = a(() => {
+		let e = L.current, t = e ? Se(e).at(-1) : void 0;
+		return t?.focus(), t !== void 0;
+	}), bn = a((e) => D(e)), xn = l.useCallback((e) => U.get(e), [U]), Sn = l.useMemo(() => ({
+		id: jt,
+		"aria-label": v,
+		"aria-labelledby": y,
+		"aria-describedby": Mt,
+		"aria-invalid": b,
+		"aria-required": Nt,
+		"aria-errormessage": yt,
+		"aria-details": bt,
+		tabIndex: ft,
+		autoFocus: dt
+	}), [
+		jt,
+		v,
+		y,
+		Mt,
+		b,
+		Nt,
+		yt,
+		bt,
+		ft,
+		dt
+	]), Cn = l.useMemo(() => ({
+		autoComplete: et,
+		autoCapitalize: tt,
+		autoCorrect: nt,
+		maxLength: rt,
+		inputMode: ct,
+		spellCheck: lt,
+		enterKeyHint: ut,
+		onFocus: xt,
+		onBlur: St,
+		onKeyDown: Ct,
+		onKeyUp: wt,
+		controlRef: Tt
+	}), [
+		et,
+		tt,
+		nt,
+		rt,
+		ct,
+		lt,
+		ut,
+		xt,
+		St,
+		Ct,
+		wt,
+		Tt
+	]), wn = v === void 0 ? y ?? kt?.labelId : y, Tn = l.useMemo(() => ({
+		"aria-label": v,
+		"aria-labelledby": wn
+	}), [v, wn]), En = C.length > 0, Dn = l.useMemo(() => ({
+		size: x,
+		appearance: S,
+		coreSize: Ft,
+		tagSize: It,
+		tagAppearance: Lt,
+		disabled: p,
+		readOnly: m,
+		interactive: E,
+		invalidLook: Pt,
+		selected: C,
+		labelOf: q,
+		entryOf: xn,
+		labels: W,
+		placeholder: We,
+		options: n,
+		warnsUnknownValues: !V && !h,
+		dataMode: !V,
+		listbox: K,
+		open: O,
+		expanded: X,
+		query: N,
+		surfaceOpen: Z,
+		showCreate: Y,
+		createText: J ?? "",
+		createValue: z,
+		emptyContent: N !== "" && !Y,
+		layerId: an,
+		surfaceRef: sn,
+		floatingProps: cn,
+		listLabel: Tn,
+		triggerProps: Sn,
+		inputProps: Cn,
+		summaryId: En ? R : void 0,
+		triggerRef: I,
+		setReference: on,
+		controlRef: qt,
+		groupRef: L,
+		chipRef: Jt,
+		registerTrigger: Ht,
+		registerList: Ut,
+		triggerKind: k,
+		setOpen: bn,
+		toggleOpen: hn,
+		focusTrigger: $,
+		removeTag: gn,
+		clear: _n,
+		editText: vn,
+		focusLastTagControl: yn,
+		expandIcon: ot,
+		clearable: at,
+		overflow: _,
+		collapsed: Q,
+		hiddenValues: mn
+	}), [
+		x,
+		S,
+		Ft,
+		It,
+		Lt,
+		p,
+		m,
+		E,
+		Pt,
+		C,
+		q,
+		xn,
+		W,
+		We,
+		n,
+		V,
+		h,
+		K,
+		O,
+		X,
+		N,
+		Z,
+		Y,
+		J,
+		z,
+		an,
+		sn,
+		cn,
+		Tn,
+		Sn,
+		Cn,
+		En,
+		R,
+		on,
+		Ht,
+		Ut,
+		k,
+		bn,
+		hn,
+		$,
+		gn,
+		_n,
+		vn,
+		yn,
+		ot,
+		at,
+		_,
+		Q,
+		mn
+	]), On = f == null ? /* @__PURE__ */ d(Ce, { children: [/* @__PURE__ */ u(xe, {}), /* @__PURE__ */ u(c, {})] }) : /* @__PURE__ */ d(Ce, { children: [f, Yt === void 0 && /* @__PURE__ */ u(c, {})] });
+	return /* @__PURE__ */ d("div", {
+		"data-size": x,
+		"data-appearance": S,
+		"data-overflow": _,
+		"data-collapsed": Q ? "" : void 0,
+		...Ot,
+		ref: ln,
+		className: e(ee.root, "relative", Et),
+		onFocus: dn,
+		onBlur: fn,
+		children: [
+			/* @__PURE__ */ u(ge.Provider, {
+				value: Dn,
+				children: On
+			}),
+			En && /* @__PURE__ */ u("span", {
+				id: R,
+				hidden: !0,
+				children: (g?.summary ?? ke)(C.map(q))
+			}),
+			/* @__PURE__ */ u("span", {
+				role: "status",
+				className: "sr-only",
+				children: rn && nn
+			}),
+			/* @__PURE__ */ u(fe, {
+				name: Ze,
+				form: Qe,
+				disabled: p,
+				value: C,
+				type: "text",
+				required: At,
+				onInvalid: $
+			})
+		]
+	});
+};
+f.displayName = "TagPicker";
+//#endregion
+export { f as TagPickerRoot };
+
+//# sourceMappingURL=TagPicker.root.mjs.map