@allxsmith/bestax-bulma 5.34.3 → 5.35.1

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

@@ -1 +1 @@
-{"version":3,"file":"Taginput.js","sources":["../../../src/form/Taginput.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  useId,\n} from 'react';\nimport {\n  classNames,\n  usePrefixedClassNames,\n  prefixedClassNames,\n} from '../helpers/classNames';\nimport { useConfig, useIconLibrary } from '../helpers/Config';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { isEventInside } from '../helpers/shadowDom';\nimport {\n  useInsideField,\n  useInsideControl,\n  rendersOwnField,\n} from './FormContext';\nimport { Field } from './Field';\nimport { FormFieldProps } from './fieldProps';\nimport { useAutoLabelId } from './useAutoLabelId';\nimport { Icon } from '../elements/Icon';\n\n/**\n * Represents a tag item object with a value and optional label.\n */\nexport interface TaginputItem {\n  /** The tag value. */\n  value: string;\n  /** Display label (optional). */\n  label?: string;\n  [key: string]: unknown;\n}\n\n/** A tag can be either a TaginputItem object or a plain string. */\nexport type TaginputTag = TaginputItem | string;\n\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Props for the Taginput component.\n * Inside an outer `Field`, or a `Control` with no `Field` around it, it\n * renders no `Field` of its own. The exception is `label`, `message`,\n * `horizontal` or `fieldClassName` in that bare `Control`: it keeps a `Field`\n * for them, nested in the `.control`, and warns in development. Wrap the\n * `Control` in a `Field` instead, and set the `label`, `horizontal` and class\n * name on that `Field`.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the input element.\n */\nexport interface TaginputProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'>,\n    Omit<BulmaClassesProps, 'color'>,\n    FormFieldProps {\n  /** Field label. Automatically associated with the text input via `htmlFor` — uses your `id` when provided, otherwise a generated one. Not wired when the tag limit is reached (the input is not rendered). Dropped inside an outer `Field`, whose own label associates instead when that `Field` generates a target id (not `grouped`/`hasAddons`, no explicit `labelProps.htmlFor`) and you set no `id` here; it then replaces the `aria-label=\"Add tag\"` fallback too. With `data`, the label naming the input also names the open suggestion list, through `aria-labelledby`, when it has an id: this label always does, and an outer `Field`'s does unless you wired it by hand without an `id` in its `labelProps`. Otherwise the list is named \"Suggestions\". */\n  label?: React.ReactNode;\n  /** Props for the label element. An explicit `htmlFor` here overrides the automatic association (no id is generated then). With `data`, while the label names the input, the suggestion list's `aria-labelledby` points at it, through an `id` here when you give one and a generated one otherwise. */\n  labelProps?: React.LabelHTMLAttributes<HTMLLabelElement> & {\n    [key: string]: unknown;\n  };\n  /** Applied to the inner text input (the labellable control), not the wrapper div. */\n  id?: string;\n  /** The current tags (controlled). */\n  value?: TaginputTag[];\n  /** Default tags (uncontrolled). */\n  defaultValue?: TaginputTag[];\n  /**\n   * Autocomplete suggestions. With `data` set, even to an empty array, the\n   * text input is a `role=\"combobox\"` that controls the suggestion list and\n   * points `aria-activedescendant` at the highlighted suggestion. Without it\n   * there's no list, so the input stays a plain text field.\n   */\n  data?: string[];\n  /** Placeholder text when no tags. */\n  placeholder?: string;\n  /** Object property to use as display field. */\n  field?: string;\n  /** Allow creating new tags not in suggestions. */\n  allowNew?: boolean;\n  /** Allow duplicate tags. */\n  allowDuplicates?: boolean;\n  /** Open autocomplete dropdown on focus. */\n  openOnFocus?: boolean;\n  /** Remove tag on backspace. Default: true. */\n  removeOnKeys?: boolean;\n  /** Keys to confirm tag creation. Default: ['Enter', ',']. */\n  confirmKeys?: string[];\n  /** Show close button on tags. Default: true. */\n  closable?: boolean;\n  /** Attach tags visually. */\n  attached?: boolean;\n  /** Maximum number of tags allowed. */\n  maxTags?: number;\n  /** Maximum length of input. */\n  maxlength?: number;\n  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Whether the input is read-only. */\n  readonly?: boolean;\n  /** Applies rounded corners to the tags. */\n  rounded?: boolean;\n  /** Truncates long tag text with ellipsis. */\n  ellipsis?: boolean;\n  /** Shows a counter of the number of tags. */\n  hasCounter?: boolean;\n  /** Characters that split pasted text into tags. */\n  onPasteSeparators?: string[];\n  /** Validation function called before adding a tag. */\n  beforeAdding?: (tag: string) => boolean;\n  /** Custom function for creating tag objects from input. */\n  createTag?: (input: string) => TaginputTag;\n  /** Keeps the first autocomplete suggestion highlighted. */\n  keepFirst?: boolean;\n  /** Keeps the autocomplete dropdown open after selection. */\n  keepOpen?: boolean;\n  /**\n   * Shows a loading spinner in the input.\n   * Under `prefers-reduced-motion: reduce` the spinner stops and stays\n   * drawn (with bestax's CSS loaded).\n   */\n  loading?: boolean;\n  /** ARIA label for tag close buttons. */\n  ariaCloseLabel?: string;\n  /** Icon name for the input field. */\n  icon?: string;\n  /** Icon library to use. */\n  iconLibrary?: IconLibrary;\n  /** Icon style variant (e.g., 'solid', 'outlined'). */\n  iconVariant?: string;\n  /** Additional icon modifiers. */\n  iconFeatures?: string | string[];\n  /** Input color variant. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Tag color variant. */\n  tagColor?:\n    | 'primary'\n    | 'link'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'danger'\n    | 'dark'\n    | 'light';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Form field name. When set, one hidden input per tag is rendered. */\n  name?: string;\n  /** Optional id of the form the hidden inputs belong to. */\n  form?: string;\n  /** Callback when tags change. */\n  onChange?: (tags: TaginputTag[]) => void;\n  /** Callback when tag is added. */\n  onAdd?: (tag: TaginputTag) => void;\n  /** Callback when tag is removed. */\n  onRemove?: (tag: TaginputTag, index: number) => void;\n  /** Callback when typing in input. */\n  onTyping?: (value: string) => void;\n  /** Custom render for tags. */\n  tagTemplate?: (tag: TaginputTag) => React.ReactNode;\n}\n\n/**\n * The `Taginput` component provides a tag/chip input field for managing multiple tags.\n *\n * @function\n * @param {TaginputProps} props - Props for the Taginput component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the input element.\n * @returns {JSX.Element} The rendered taginput component.\n *\n * @example\n * // Basic usage\n * <Taginput\n *   placeholder=\"Add a tag...\"\n *   onChange={(tags) => console.log(tags)}\n * />\n *\n * @example\n * // With autocomplete\n * <Taginput\n *   data={['React', 'Vue', 'Angular', 'Svelte']}\n *   allowNew={false}\n *   placeholder=\"Select frameworks...\"\n * />\n */\nexport const Taginput = forwardRef<HTMLInputElement, TaginputProps>(\n  (\n    {\n      // Field props\n      label,\n      labelSize,\n      labelProps,\n      horizontal,\n      message,\n      messageColor,\n      fieldClassName,\n      value: controlledValue,\n      defaultValue = [],\n      data: dataProp,\n      placeholder,\n      field = 'label',\n      allowNew = true,\n      allowDuplicates = false,\n      openOnFocus = false,\n      removeOnKeys = true,\n      confirmKeys = ['Enter', ','],\n      closable = true,\n      attached = false,\n      maxTags,\n      maxlength,\n      disabled = false,\n      readonly = false,\n      rounded = false,\n      ellipsis = false,\n      hasCounter = true,\n      onPasteSeparators = [','],\n      beforeAdding,\n      createTag,\n      keepFirst = false,\n      keepOpen = true,\n      loading = false,\n      ariaCloseLabel,\n      icon,\n      iconLibrary: iconLibraryProp,\n      iconVariant,\n      iconFeatures,\n      color,\n      tagColor,\n      size,\n      onChange,\n      onAdd,\n      onRemove,\n      onTyping,\n      tagTemplate,\n      name,\n      form,\n      id,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const insideField = useInsideField();\n    const insideControl = useInsideControl();\n    const ownField = rendersOwnField('Taginput', {\n      insideField,\n      insideControl,\n      label,\n      message,\n      horizontal,\n      fieldClassName,\n    });\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const { classPrefix } = useConfig();\n    const defaultIconLibrary = useIconLibrary();\n    const resolvedLibrary = iconLibraryProp || defaultIconLibrary || 'fa';\n    const pcn = (\n      ...args: (\n        | string\n        | number\n        | undefined\n        | null\n        | false\n        | Record<string, unknown>\n        | unknown[]\n      )[]\n    ) => prefixedClassNames(classPrefix, ...args);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    const [internalTags, setInternalTags] =\n      useState<TaginputTag[]>(defaultValue);\n    const [inputValue, setInputValue] = useState('');\n    const [isActive, setIsActive] = useState(false);\n    const [highlightedIndex, setHighlightedIndex] = useState(-1);\n    const listboxId = `${useId()}-listbox`;\n\n    // With `data` the input offers suggestions, so it's a combobox, even\n    // while none match. Without it there's never a list, so it stays a plain\n    // text field.\n    const hasSuggestions = dataProp !== undefined;\n    const data = dataProp ?? [];\n\n    // Use controlled or internal tags\n    const tags = controlledValue !== undefined ? controlledValue : internalTags;\n\n    const isMaxReached = maxTags !== undefined && tags.length >= maxTags;\n    // At the tag limit the text input is not rendered, so there is nothing to\n    // wire a label to, its own or a surrounding Field's. The suggestion list\n    // points `aria-labelledby` at the label that names the input, so with\n    // suggestions it needs that label's id.\n    const {\n      controlId,\n      fieldLabelProps,\n      labelled,\n      labelId: listLabelId,\n    } = useAutoLabelId({\n      label,\n      id,\n      labelProps,\n      rendersLabel: ownField && !isMaxReached,\n      hasInput: !isMaxReached,\n      needsLabelId: hasSuggestions,\n    });\n\n    // Get display value from tag\n    const getDisplayValue = (tag: TaginputTag): string => {\n      if (typeof tag === 'string') return tag;\n      const fieldValue = tag[field];\n      if (typeof fieldValue === 'string') return fieldValue;\n      return tag.value || '';\n    };\n\n    // Filter autocomplete data\n    const filteredData = data.filter(item => {\n      const displayValue = item.toLowerCase();\n      const matchesInput = displayValue.includes(inputValue.toLowerCase());\n      const notAlreadyAdded =\n        allowDuplicates ||\n        !tags.some(tag => getDisplayValue(tag).toLowerCase() === displayValue);\n      const hasInput = inputValue || (openOnFocus && isActive);\n      return matchesInput && notAlreadyAdded && hasInput;\n    });\n    const listOpen = isActive && filteredData.length > 0;\n\n    // keepFirst: auto-highlight first item when dropdown opens\n    useEffect(() => {\n      if (keepFirst && isActive && filteredData.length > 0) {\n        setHighlightedIndex(0);\n      }\n    }, [keepFirst, isActive, filteredData.length]);\n\n    // Update tags\n    const updateTags = useCallback(\n      (newTags: TaginputTag[]) => {\n        if (controlledValue === undefined) {\n          setInternalTags(newTags);\n        }\n        onChange?.(newTags);\n      },\n      [controlledValue, onChange]\n    );\n\n    // Add tag\n    const addTag = useCallback(\n      (value: string | TaginputTag) => {\n        if (disabled || readonly) return;\n\n        const tagValue = typeof value === 'string' ? value.trim() : value;\n        const displayValue =\n          typeof tagValue === 'string' ? tagValue : getDisplayValue(tagValue);\n\n        if (!displayValue) return;\n\n        // Check max tags\n        if (maxTags && tags.length >= maxTags) return;\n\n        // Check duplicates\n        if (!allowDuplicates) {\n          const exists = tags.some(\n            tag =>\n              getDisplayValue(tag).toLowerCase() === displayValue.toLowerCase()\n          );\n          if (exists) return;\n        }\n\n        // Check if allowed (must be in data if allowNew is false). Compare\n        // case-insensitively, consistent with the dropdown filter and the\n        // duplicate check above.\n        if (\n          !allowNew &&\n          !data.some(d => d.toLowerCase() === displayValue.toLowerCase())\n        )\n          return;\n\n        // beforeAdding validation\n        if (beforeAdding && !beforeAdding(displayValue)) return;\n\n        // createTag transformation\n        const finalTag = createTag ? createTag(displayValue) : tagValue;\n\n        const newTags = [...tags, finalTag];\n        updateTags(newTags);\n        onAdd?.(finalTag);\n        setInputValue('');\n        if (!keepOpen) {\n          setIsActive(false);\n        }\n        setHighlightedIndex(-1);\n      },\n      [\n        disabled,\n        readonly,\n        tags,\n        maxTags,\n        allowDuplicates,\n        allowNew,\n        data,\n        field,\n        updateTags,\n        onAdd,\n        beforeAdding,\n        createTag,\n        keepOpen,\n      ]\n    );\n\n    // Remove tag\n    const removeTag = useCallback(\n      (index: number) => {\n        /* istanbul ignore next: both triggers (delete button click, Backspace handler) are already gated on disabled/readonly */\n        if (disabled || readonly) return;\n\n        const removedTag = tags[index];\n        const newTags = tags.filter((_, i) => i !== index);\n        updateTags(newTags);\n        onRemove?.(removedTag, index);\n      },\n      [disabled, readonly, tags, updateTags, onRemove]\n    );\n\n    // Handle input change\n    const handleInputChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const newValue = e.target.value;\n\n        // Check if a confirm key was typed\n        const lastChar = newValue.slice(-1);\n        if (confirmKeys.includes(lastChar) && lastChar !== 'Enter') {\n          const valueWithoutKey = newValue.slice(0, -1).trim();\n          if (valueWithoutKey) {\n            addTag(valueWithoutKey);\n          }\n          return;\n        }\n\n        setInputValue(newValue);\n        onTyping?.(newValue);\n\n        if (newValue && data.length > 0) {\n          setIsActive(true);\n        }\n      },\n      [confirmKeys, addTag, onTyping, data.length]\n    );\n\n    // Handle paste\n    const handlePaste = useCallback(\n      (e: React.ClipboardEvent<HTMLInputElement>) => {\n        if (onPasteSeparators.length === 0) return;\n\n        const pastedText = e.clipboardData.getData('text');\n        // Check if any separator exists in the pasted text\n        const hasSeparator = onPasteSeparators.some(sep =>\n          pastedText.includes(sep)\n        );\n\n        if (!hasSeparator) return;\n\n        e.preventDefault();\n\n        // Build a regex from all separators\n        const escapedSeparators = onPasteSeparators.map(s =>\n          s.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&')\n        );\n        const regex = new RegExp(`[${escapedSeparators.join('')}]`);\n\n        const parts = pastedText\n          .split(regex)\n          .map(s => s.trim())\n          .filter(Boolean);\n\n        for (const part of parts) {\n          addTag(part);\n        }\n      },\n      [onPasteSeparators, addTag]\n    );\n\n    // Handle focus\n    const handleFocus = useCallback(() => {\n      if (openOnFocus && data.length > 0 && !disabled) {\n        setIsActive(true);\n      }\n    }, [openOnFocus, data.length, disabled]);\n\n    // Handle click outside\n    useEffect(() => {\n      if (!isActive) return undefined;\n\n      const handleClickOutside = (e: MouseEvent) => {\n        if (containerRef.current && !isEventInside(e, containerRef.current)) {\n          setIsActive(false);\n          setHighlightedIndex(-1);\n        }\n      };\n\n      document.addEventListener('mousedown', handleClickOutside);\n      return () =>\n        document.removeEventListener('mousedown', handleClickOutside);\n    }, [isActive]);\n\n    // Handle keyboard\n    const handleKeyDown = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (disabled || readonly) return;\n\n        // Handle confirm keys\n        if (confirmKeys.includes(e.key)) {\n          e.preventDefault();\n          if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n            addTag(filteredData[highlightedIndex]);\n          } else if (inputValue.trim()) {\n            addTag(inputValue);\n          }\n          return;\n        }\n\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            if (!isActive && data.length > 0) {\n              setIsActive(true);\n            } else {\n              setHighlightedIndex(prev =>\n                prev < filteredData.length - 1 ? prev + 1 : prev\n              );\n            }\n            break;\n          case 'ArrowUp':\n            e.preventDefault();\n            setHighlightedIndex(prev => (prev > 0 ? prev - 1 : prev));\n            break;\n          case 'Backspace':\n            if (removeOnKeys && !inputValue && tags.length > 0) {\n              e.preventDefault();\n              removeTag(tags.length - 1);\n            }\n            break;\n          case 'Escape':\n            // Closing the suggestions claims the key, so a Modal around the\n            // field stays open. With none showing, the key goes on to it.\n            if (isActive && filteredData.length > 0) e.preventDefault();\n            setIsActive(false);\n            setHighlightedIndex(-1);\n            break;\n        }\n      },\n      [\n        disabled,\n        readonly,\n        confirmKeys,\n        highlightedIndex,\n        filteredData,\n        addTag,\n        inputValue,\n        isActive,\n        data.length,\n        removeOnKeys,\n        tags.length,\n        removeTag,\n      ]\n    );\n\n    // Combined ref\n    const combinedRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        (inputRef as React.MutableRefObject<HTMLInputElement | null>).current =\n          node;\n        if (typeof ref === 'function') {\n          ref(node);\n        } else if (ref) {\n          (ref as React.MutableRefObject<HTMLInputElement | null>).current =\n            node;\n        }\n      },\n      [ref]\n    );\n\n    // Focus input when container is clicked\n    const handleContainerClick = useCallback(() => {\n      inputRef.current?.focus();\n    }, []);\n\n    // Generate classes\n    const taginputClasses = pcn('taginput', {\n      'is-active': isActive,\n      [`is-${size}`]: !!size,\n      [`is-${color}`]: !!color,\n      'is-disabled': disabled,\n      'is-rounded': rounded,\n      'is-ellipsis': ellipsis,\n    });\n\n    const containerClasses = pcn('taginput-container', {\n      'is-attached': attached,\n      'has-icons-left': !!icon,\n    });\n\n    const inputClasses = pcn('input', {\n      [`is-${size}`]: !!size,\n    });\n\n    const tagClasses = pcn('tag', {\n      [`is-${tagColor}`]: !!tagColor,\n      [`is-${size}`]: !!size,\n    });\n\n    const combinedClasses = classNames(\n      taginputClasses,\n      bulmaHelperClasses,\n      className\n    );\n\n    // Counter text\n    const showCounter =\n      hasCounter && (maxTags !== undefined || maxlength !== undefined);\n    const counterText =\n      maxTags !== undefined\n        ? `${tags.length} / ${maxTags}`\n        : maxlength !== undefined\n          ? `${inputValue.length} / ${maxlength}`\n          : '';\n\n    const counterClasses = pcn('help', 'counter');\n    const tagsClasses = pcn('tags');\n    const dropdownMenuClasses = pcn('dropdown-menu', 'is-active');\n    const dropdownContentClasses = pcn('dropdown-content');\n    const iconRightClass = pcn('icon', 'is-right');\n    const loaderClass = pcn('loader', 'is-loading');\n\n    const helpClass = usePrefixedClassNames('help', {\n      [`is-${messageColor}`]: !!messageColor,\n    });\n    const messageEl = message ? <p className={helpClass}>{message}</p> : null;\n\n    // The combobox controls its listbox and points at the highlighted option,\n    // the way Autocomplete's does. The listbox takes its name from the label\n    // that names the combobox, the one this renders or a surrounding Field's,\n    // and keeps a fallback name when no label names it or the one that does\n    // has no id to point at. While no suggestion matches there's no listbox,\n    // so the combobox is collapsed and points at nothing. It skips a\n    // highlighted suggestion that's blank once trimmed, since that one can't\n    // become a tag, and the option it points at is the one marked selected.\n    const optionId = (index: number) => `${listboxId}-${index}`;\n    const activeOptionId =\n      listOpen && filteredData[highlightedIndex]?.trim()\n        ? optionId(highlightedIndex)\n        : undefined;\n    const comboboxProps: React.InputHTMLAttributes<HTMLInputElement> = {\n      role: 'combobox',\n      'aria-expanded': listOpen,\n      'aria-controls': listOpen ? listboxId : undefined,\n      'aria-activedescendant': activeOptionId,\n      'aria-haspopup': 'listbox',\n      'aria-autocomplete': 'list',\n    };\n\n    const taginputElement = (\n      <div\n        ref={containerRef}\n        className={combinedClasses}\n        onClick={handleContainerClick}\n        {...rest}\n      >\n        <div className={containerClasses}>\n          {icon && (\n            <Icon\n              name={icon}\n              library={resolvedLibrary}\n              variant={iconVariant}\n              features={iconFeatures}\n              containerClassName={pcn('icon', 'is-left')}\n            />\n          )}\n          <div className={tagsClasses}>\n            {tags.map((tag, index) => {\n              const displayVal = getDisplayValue(tag);\n              return (\n                <span key={index} className={tagClasses}>\n                  {tagTemplate ? (\n                    tagTemplate(tag)\n                  ) : ellipsis ? (\n                    <span title={displayVal}>{displayVal}</span>\n                  ) : (\n                    displayVal\n                  )}\n                  {closable && !disabled && !readonly && (\n                    <button\n                      type=\"button\"\n                      className={pcn('delete', 'is-small')}\n                      onClick={e => {\n                        e.stopPropagation();\n                        removeTag(index);\n                      }}\n                      aria-label={ariaCloseLabel || `Remove ${displayVal}`}\n                    />\n                  )}\n                </span>\n              );\n            })}\n            {!isMaxReached && (\n              <input\n                ref={combinedRef}\n                type=\"text\"\n                className={inputClasses}\n                id={controlId}\n                value={inputValue}\n                placeholder={tags.length === 0 ? placeholder : undefined}\n                disabled={disabled}\n                readOnly={readonly}\n                maxLength={maxlength}\n                onChange={handleInputChange}\n                onFocus={handleFocus}\n                onKeyDown={handleKeyDown}\n                onPaste={handlePaste}\n                {...(hasSuggestions && comboboxProps)}\n                // Fallback name, dropped only when a rendered label actually\n                // targets this input, its own or a surrounding Field's\n                // (aria-label would win otherwise). A label pointing elsewhere\n                // keeps the fallback so the input is never nameless.\n                aria-label={labelled ? undefined : 'Add tag'}\n              />\n            )}\n          </div>\n          {loading && (\n            <span className={iconRightClass}>\n              <span className={loaderClass} />\n            </span>\n          )}\n        </div>\n\n        {listOpen && (\n          <div className={dropdownMenuClasses}>\n            <div\n              ref={dropdownRef}\n              id={listboxId}\n              className={dropdownContentClasses}\n              role=\"listbox\"\n              aria-labelledby={listLabelId}\n              aria-label={listLabelId ? undefined : 'Suggestions'}\n            >\n              {filteredData.map((item, index) => (\n                <a\n                  key={index}\n                  id={optionId(index)}\n                  className={pcn('dropdown-item', {\n                    'is-active': index === highlightedIndex,\n                  })}\n                  onClick={() => addTag(item)}\n                  onMouseEnter={() => setHighlightedIndex(index)}\n                  role=\"option\"\n                  aria-selected={optionId(index) === activeOptionId}\n                >\n                  {item}\n                </a>\n              ))}\n            </div>\n          </div>\n        )}\n\n        {showCounter && <small className={counterClasses}>{counterText}</small>}\n\n        {name &&\n          tags.map((tag, i) => (\n            <input\n              key={`tag-input-${i}`}\n              type=\"hidden\"\n              name={name}\n              value={getDisplayValue(tag)}\n              form={form}\n            />\n          ))}\n      </div>\n    );\n\n    if (ownField) {\n      return (\n        <Field\n          label={label}\n          labelSize={labelSize}\n          labelProps={fieldLabelProps}\n          horizontal={horizontal}\n          className={fieldClassName}\n        >\n          {taginputElement}\n          {messageEl}\n        </Field>\n      );\n    }\n\n    return (\n      <>\n        {taginputElement}\n        {messageEl}\n      </>\n    );\n  }\n);\n\nTaginput.displayName = 'Taginput';\n\n/** @deprecated Use `Taginput` — same component. */\nexport const TagInput = Taginput;\n\n/** @deprecated Use `TaginputProps`. */\nexport type TagInputProps = TaginputProps;\n\nexport default Taginput;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Taginput.js","sources":["../../../src/form/Taginput.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  useId,\n} from 'react';\nimport {\n  classNames,\n  usePrefixedClassNames,\n  prefixedClassNames,\n} from '../helpers/classNames';\nimport { useConfig, useIconLibrary } from '../helpers/Config';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { isEventInside } from '../helpers/shadowDom';\nimport {\n  useInsideField,\n  useInsideControl,\n  rendersOwnField,\n} from './FormContext';\nimport { Field } from './Field';\nimport { FormFieldProps } from './fieldProps';\nimport { useAutoLabelId } from './useAutoLabelId';\nimport { Icon } from '../elements/Icon';\n\n/**\n * Represents a tag item object with a value and optional label.\n */\nexport interface TaginputItem {\n  /** The tag value. */\n  value: string;\n  /** Display label (optional). */\n  label?: string;\n  [key: string]: unknown;\n}\n\n/** A tag can be either a TaginputItem object or a plain string. */\nexport type TaginputTag = TaginputItem | string;\n\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Props for the Taginput component.\n * Inside an outer `Field`, or a `Control` with no `Field` around it, it\n * renders no `Field` of its own. The exception is `label`, `message`,\n * `horizontal` or `fieldClassName` in that bare `Control`: it keeps a `Field`\n * for them, nested in the `.control`, and warns in development. Wrap the\n * `Control` in a `Field` instead, and set the `label`, `horizontal` and class\n * name on that `Field`.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the input element.\n */\nexport interface TaginputProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'>,\n    Omit<BulmaClassesProps, 'color'>,\n    FormFieldProps {\n  /** Field label. Automatically associated with the text input via `htmlFor` — uses your `id` when provided, otherwise a generated one. Not wired when the tag limit is reached (the input is not rendered). Dropped inside an outer `Field`, whose own label associates instead when that `Field` generates a target id (not `grouped`/`hasAddons`, no explicit `labelProps.htmlFor`) and you set no `id` here; it then replaces the `aria-label=\"Add tag\"` fallback too. With `data`, the label naming the input also names the open suggestion list, through `aria-labelledby`, when it has an id: this label always does, and an outer `Field`'s does unless you wired it by hand without an `id` in its `labelProps`. Otherwise the list is named \"Suggestions\". */\n  label?: React.ReactNode;\n  /** Props for the label element. An explicit `htmlFor` here overrides the automatic association (no id is generated then). With `data`, while the label names the input, the suggestion list's `aria-labelledby` points at it, through an `id` here when you give one and a generated one otherwise. */\n  labelProps?: React.LabelHTMLAttributes<HTMLLabelElement> & {\n    [key: string]: unknown;\n  };\n  /** Applied to the inner text input (the labellable control), not the wrapper div. */\n  id?: string;\n  /** The current tags (controlled). */\n  value?: TaginputTag[];\n  /** Default tags (uncontrolled). */\n  defaultValue?: TaginputTag[];\n  /**\n   * Autocomplete suggestions. With `data` set, even to an empty array, the\n   * text input is a `role=\"combobox\"` that controls the suggestion list and\n   * points `aria-activedescendant` at the highlighted suggestion. Without it\n   * there's no list, so the input stays a plain text field.\n   */\n  data?: string[];\n  /** Placeholder text when no tags. */\n  placeholder?: string;\n  /** Object property to use as display field. */\n  field?: string;\n  /** Allow creating new tags not in suggestions. */\n  allowNew?: boolean;\n  /** Allow duplicate tags. */\n  allowDuplicates?: boolean;\n  /** Open autocomplete dropdown on focus. */\n  openOnFocus?: boolean;\n  /** Remove tag on backspace. Default: true. */\n  removeOnKeys?: boolean;\n  /** Keys to confirm tag creation. Default: ['Enter', ',']. */\n  confirmKeys?: string[];\n  /** Show close button on tags. Default: true. */\n  closable?: boolean;\n  /** Attach tags visually. */\n  attached?: boolean;\n  /**\n   * Maximum number of tags allowed. At the limit the text input isn't\n   * rendered, and neither is the suggestion list, so the field takes no more\n   * tags until one is removed.\n   */\n  maxTags?: number;\n  /** Maximum length of input. */\n  maxlength?: number;\n  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Whether the input is read-only. */\n  readonly?: boolean;\n  /** Applies rounded corners to the tags. */\n  rounded?: boolean;\n  /** Truncates long tag text with ellipsis. */\n  ellipsis?: boolean;\n  /** Shows a counter of the number of tags. */\n  hasCounter?: boolean;\n  /** Characters that split pasted text into tags. */\n  onPasteSeparators?: string[];\n  /** Validation function called before adding a tag. */\n  beforeAdding?: (tag: string) => boolean;\n  /** Custom function for creating tag objects from input. */\n  createTag?: (input: string) => TaginputTag;\n  /** Keeps the first autocomplete suggestion highlighted. */\n  keepFirst?: boolean;\n  /** Keeps the autocomplete dropdown open after selection. */\n  keepOpen?: boolean;\n  /**\n   * Shows a loading spinner in the input.\n   * Under `prefers-reduced-motion: reduce` the spinner stops and stays\n   * drawn (with bestax's CSS loaded).\n   */\n  loading?: boolean;\n  /** ARIA label for tag close buttons. */\n  ariaCloseLabel?: string;\n  /** Icon name for the input field. */\n  icon?: string;\n  /** Icon library to use. */\n  iconLibrary?: IconLibrary;\n  /** Icon style variant (e.g., 'solid', 'outlined'). */\n  iconVariant?: string;\n  /** Additional icon modifiers. */\n  iconFeatures?: string | string[];\n  /** Input color variant. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Tag color variant. */\n  tagColor?:\n    | 'primary'\n    | 'link'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'danger'\n    | 'dark'\n    | 'light';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Form field name. When set, one hidden input per tag is rendered. */\n  name?: string;\n  /** Optional id of the form the hidden inputs belong to. */\n  form?: string;\n  /** Callback when tags change. */\n  onChange?: (tags: TaginputTag[]) => void;\n  /** Callback when tag is added. */\n  onAdd?: (tag: TaginputTag) => void;\n  /** Callback when tag is removed. */\n  onRemove?: (tag: TaginputTag, index: number) => void;\n  /** Callback when typing in input. */\n  onTyping?: (value: string) => void;\n  /** Custom render for tags. */\n  tagTemplate?: (tag: TaginputTag) => React.ReactNode;\n}\n\n/**\n * The `Taginput` component provides a tag/chip input field for managing multiple tags.\n *\n * @function\n * @param {TaginputProps} props - Props for the Taginput component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the input element.\n * @returns {JSX.Element} The rendered taginput component.\n *\n * @example\n * // Basic usage\n * <Taginput\n *   placeholder=\"Add a tag...\"\n *   onChange={(tags) => console.log(tags)}\n * />\n *\n * @example\n * // With autocomplete\n * <Taginput\n *   data={['React', 'Vue', 'Angular', 'Svelte']}\n *   allowNew={false}\n *   placeholder=\"Select frameworks...\"\n * />\n */\nexport const Taginput = forwardRef<HTMLInputElement, TaginputProps>(\n  (\n    {\n      // Field props\n      label,\n      labelSize,\n      labelProps,\n      horizontal,\n      message,\n      messageColor,\n      fieldClassName,\n      value: controlledValue,\n      defaultValue = [],\n      data: dataProp,\n      placeholder,\n      field = 'label',\n      allowNew = true,\n      allowDuplicates = false,\n      openOnFocus = false,\n      removeOnKeys = true,\n      confirmKeys = ['Enter', ','],\n      closable = true,\n      attached = false,\n      maxTags,\n      maxlength,\n      disabled = false,\n      readonly = false,\n      rounded = false,\n      ellipsis = false,\n      hasCounter = true,\n      onPasteSeparators = [','],\n      beforeAdding,\n      createTag,\n      keepFirst = false,\n      keepOpen = true,\n      loading = false,\n      ariaCloseLabel,\n      icon,\n      iconLibrary: iconLibraryProp,\n      iconVariant,\n      iconFeatures,\n      color,\n      tagColor,\n      size,\n      onChange,\n      onAdd,\n      onRemove,\n      onTyping,\n      tagTemplate,\n      name,\n      form,\n      id,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const insideField = useInsideField();\n    const insideControl = useInsideControl();\n    const ownField = rendersOwnField('Taginput', {\n      insideField,\n      insideControl,\n      label,\n      message,\n      horizontal,\n      fieldClassName,\n    });\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const { classPrefix } = useConfig();\n    const defaultIconLibrary = useIconLibrary();\n    const resolvedLibrary = iconLibraryProp || defaultIconLibrary || 'fa';\n    const pcn = (\n      ...args: (\n        | string\n        | number\n        | undefined\n        | null\n        | false\n        | Record<string, unknown>\n        | unknown[]\n      )[]\n    ) => prefixedClassNames(classPrefix, ...args);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    const [internalTags, setInternalTags] =\n      useState<TaginputTag[]>(defaultValue);\n    const [inputValue, setInputValue] = useState('');\n    const [isActive, setIsActive] = useState(false);\n    const [highlightedIndex, setHighlightedIndex] = useState(-1);\n    const listboxId = `${useId()}-listbox`;\n\n    // With `data` the input offers suggestions, so it's a combobox, even\n    // while none match. Without it there's never a list, so it stays a plain\n    // text field.\n    const hasSuggestions = dataProp !== undefined;\n    const data = dataProp ?? [];\n\n    // Use controlled or internal tags\n    const tags = controlledValue !== undefined ? controlledValue : internalTags;\n\n    const isMaxReached = maxTags !== undefined && tags.length >= maxTags;\n    // At the tag limit the text input is not rendered, so there is nothing to\n    // wire a label to, its own or a surrounding Field's. The suggestion list\n    // points `aria-labelledby` at the label that names the input, so with\n    // suggestions it needs that label's id.\n    const {\n      controlId,\n      fieldLabelProps,\n      labelled,\n      labelId: listLabelId,\n    } = useAutoLabelId({\n      label,\n      id,\n      labelProps,\n      rendersLabel: ownField && !isMaxReached,\n      hasInput: !isMaxReached,\n      needsLabelId: hasSuggestions,\n    });\n\n    // Get display value from tag\n    const getDisplayValue = (tag: TaginputTag): string => {\n      if (typeof tag === 'string') return tag;\n      const fieldValue = tag[field];\n      if (typeof fieldValue === 'string') return fieldValue;\n      return tag.value || '';\n    };\n\n    // Filter autocomplete data\n    const filteredData = data.filter(item => {\n      const displayValue = item.toLowerCase();\n      const matchesInput = displayValue.includes(inputValue.toLowerCase());\n      const notAlreadyAdded =\n        allowDuplicates ||\n        !tags.some(tag => getDisplayValue(tag).toLowerCase() === displayValue);\n      const hasInput = inputValue || (openOnFocus && isActive);\n      return matchesInput && notAlreadyAdded && hasInput;\n    });\n    // At the tag limit the input isn't rendered, so the list isn't either.\n    // Left open it would be a listbox with no combobox, offering tags past\n    // the limit (#1087).\n    const listOpen = isActive && !isMaxReached && filteredData.length > 0;\n\n    // keepFirst: auto-highlight first item when dropdown opens\n    useEffect(() => {\n      if (keepFirst && isActive && filteredData.length > 0) {\n        setHighlightedIndex(0);\n      }\n    }, [keepFirst, isActive, filteredData.length]);\n\n    // Update tags\n    const updateTags = useCallback(\n      (newTags: TaginputTag[]) => {\n        if (controlledValue === undefined) {\n          setInternalTags(newTags);\n        }\n        onChange?.(newTags);\n      },\n      [controlledValue, onChange]\n    );\n\n    // Add a tag from text typed, pasted or picked from the list. Only\n    // `createTag` turns it into an object.\n    const addTag = useCallback(\n      (value: string) => {\n        if (disabled || readonly) return;\n\n        const displayValue = value.trim();\n\n        if (!displayValue) return;\n\n        // No maxTags check: only the input and the list call this, neither\n        // renders at the limit, and each call adds at most one tag.\n\n        // Check duplicates\n        if (!allowDuplicates) {\n          const exists = tags.some(\n            tag =>\n              getDisplayValue(tag).toLowerCase() === displayValue.toLowerCase()\n          );\n          if (exists) return;\n        }\n\n        // Check if allowed (must be in data if allowNew is false). Compare\n        // case-insensitively, consistent with the dropdown filter and the\n        // duplicate check above.\n        if (\n          !allowNew &&\n          !data.some(d => d.toLowerCase() === displayValue.toLowerCase())\n        )\n          return;\n\n        // beforeAdding validation\n        if (beforeAdding && !beforeAdding(displayValue)) return;\n\n        // createTag transformation\n        const finalTag = createTag ? createTag(displayValue) : displayValue;\n\n        const newTags = [...tags, finalTag];\n        updateTags(newTags);\n        onAdd?.(finalTag);\n        setInputValue('');\n        if (!keepOpen) {\n          setIsActive(false);\n        }\n        setHighlightedIndex(-1);\n      },\n      [\n        disabled,\n        readonly,\n        tags,\n        allowDuplicates,\n        allowNew,\n        data,\n        field,\n        updateTags,\n        onAdd,\n        beforeAdding,\n        createTag,\n        keepOpen,\n      ]\n    );\n\n    // Remove tag\n    const removeTag = useCallback(\n      (index: number) => {\n        /* istanbul ignore next: both triggers (delete button click, Backspace handler) are already gated on disabled/readonly */\n        if (disabled || readonly) return;\n\n        const removedTag = tags[index];\n        const newTags = tags.filter((_, i) => i !== index);\n        updateTags(newTags);\n        onRemove?.(removedTag, index);\n      },\n      [disabled, readonly, tags, updateTags, onRemove]\n    );\n\n    // Handle input change\n    const handleInputChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const newValue = e.target.value;\n\n        // Check if a confirm key was typed\n        const lastChar = newValue.slice(-1);\n        if (confirmKeys.includes(lastChar) && lastChar !== 'Enter') {\n          const valueWithoutKey = newValue.slice(0, -1).trim();\n          if (valueWithoutKey) {\n            addTag(valueWithoutKey);\n          }\n          return;\n        }\n\n        setInputValue(newValue);\n        onTyping?.(newValue);\n\n        if (newValue && data.length > 0) {\n          setIsActive(true);\n        }\n      },\n      [confirmKeys, addTag, onTyping, data.length]\n    );\n\n    // Handle paste\n    const handlePaste = useCallback(\n      (e: React.ClipboardEvent<HTMLInputElement>) => {\n        if (onPasteSeparators.length === 0) return;\n\n        const pastedText = e.clipboardData.getData('text');\n        // Check if any separator exists in the pasted text\n        const hasSeparator = onPasteSeparators.some(sep =>\n          pastedText.includes(sep)\n        );\n\n        if (!hasSeparator) return;\n\n        e.preventDefault();\n\n        // Build a regex from all separators\n        const escapedSeparators = onPasteSeparators.map(s =>\n          s.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&')\n        );\n        const regex = new RegExp(`[${escapedSeparators.join('')}]`);\n\n        const parts = pastedText\n          .split(regex)\n          .map(s => s.trim())\n          .filter(Boolean);\n\n        for (const part of parts) {\n          addTag(part);\n        }\n      },\n      [onPasteSeparators, addTag]\n    );\n\n    // Handle focus\n    const handleFocus = useCallback(() => {\n      if (openOnFocus && data.length > 0 && !disabled) {\n        setIsActive(true);\n      }\n    }, [openOnFocus, data.length, disabled]);\n\n    // Reaching the limit dismisses the list the way a click outside does, so\n    // making room later doesn't bring it back unasked. It's an effect, not a\n    // step in addTag, because a click on a suggestion also bubbles to the\n    // container, whose focus on the input reopens the list in that same\n    // event, and because a controlled value can reach the limit too.\n    useEffect(() => {\n      if (isMaxReached) {\n        setIsActive(false);\n        setHighlightedIndex(-1);\n      }\n    }, [isMaxReached]);\n\n    // Handle click outside\n    useEffect(() => {\n      if (!isActive) return undefined;\n\n      const handleClickOutside = (e: MouseEvent) => {\n        if (containerRef.current && !isEventInside(e, containerRef.current)) {\n          setIsActive(false);\n          setHighlightedIndex(-1);\n        }\n      };\n\n      document.addEventListener('mousedown', handleClickOutside);\n      return () =>\n        document.removeEventListener('mousedown', handleClickOutside);\n    }, [isActive]);\n\n    // Handle keyboard\n    const handleKeyDown = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (disabled || readonly) return;\n\n        // Handle confirm keys\n        if (confirmKeys.includes(e.key)) {\n          e.preventDefault();\n          if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n            addTag(filteredData[highlightedIndex]);\n          } else if (inputValue.trim()) {\n            addTag(inputValue);\n          }\n          return;\n        }\n\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            if (!isActive && data.length > 0) {\n              setIsActive(true);\n            } else {\n              setHighlightedIndex(prev =>\n                prev < filteredData.length - 1 ? prev + 1 : prev\n              );\n            }\n            break;\n          case 'ArrowUp':\n            e.preventDefault();\n            setHighlightedIndex(prev => (prev > 0 ? prev - 1 : prev));\n            break;\n          case 'Backspace':\n            if (removeOnKeys && !inputValue && tags.length > 0) {\n              e.preventDefault();\n              removeTag(tags.length - 1);\n            }\n            break;\n          case 'Escape':\n            // Closing the suggestions claims the key, so a Modal around the\n            // field stays open. With none showing, the key goes on to it.\n            if (isActive && filteredData.length > 0) e.preventDefault();\n            setIsActive(false);\n            setHighlightedIndex(-1);\n            break;\n        }\n      },\n      [\n        disabled,\n        readonly,\n        confirmKeys,\n        highlightedIndex,\n        filteredData,\n        addTag,\n        inputValue,\n        isActive,\n        data.length,\n        removeOnKeys,\n        tags.length,\n        removeTag,\n      ]\n    );\n\n    // Combined ref\n    const combinedRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        (inputRef as React.MutableRefObject<HTMLInputElement | null>).current =\n          node;\n        if (typeof ref === 'function') {\n          ref(node);\n        } else if (ref) {\n          (ref as React.MutableRefObject<HTMLInputElement | null>).current =\n            node;\n        }\n      },\n      [ref]\n    );\n\n    // Focus input when container is clicked\n    const handleContainerClick = useCallback(() => {\n      inputRef.current?.focus();\n    }, []);\n\n    // Generate classes\n    const taginputClasses = pcn('taginput', {\n      'is-active': isActive,\n      [`is-${size}`]: !!size,\n      [`is-${color}`]: !!color,\n      'is-disabled': disabled,\n      'is-rounded': rounded,\n      'is-ellipsis': ellipsis,\n    });\n\n    const containerClasses = pcn('taginput-container', {\n      'is-attached': attached,\n      'has-icons-left': !!icon,\n    });\n\n    const inputClasses = pcn('input', {\n      [`is-${size}`]: !!size,\n    });\n\n    const tagClasses = pcn('tag', {\n      [`is-${tagColor}`]: !!tagColor,\n      [`is-${size}`]: !!size,\n    });\n\n    const combinedClasses = classNames(\n      taginputClasses,\n      bulmaHelperClasses,\n      className\n    );\n\n    // Counter text\n    const showCounter =\n      hasCounter && (maxTags !== undefined || maxlength !== undefined);\n    const counterText =\n      maxTags !== undefined\n        ? `${tags.length} / ${maxTags}`\n        : maxlength !== undefined\n          ? `${inputValue.length} / ${maxlength}`\n          : '';\n\n    const counterClasses = pcn('help', 'counter');\n    const tagsClasses = pcn('tags');\n    const dropdownMenuClasses = pcn('dropdown-menu', 'is-active');\n    const dropdownContentClasses = pcn('dropdown-content');\n    const iconRightClass = pcn('icon', 'is-right');\n    const loaderClass = pcn('loader', 'is-loading');\n\n    const helpClass = usePrefixedClassNames('help', {\n      [`is-${messageColor}`]: !!messageColor,\n    });\n    const messageEl = message ? <p className={helpClass}>{message}</p> : null;\n\n    // The combobox controls its listbox and points at the highlighted option,\n    // the way Autocomplete's does. The listbox takes its name from the label\n    // that names the combobox, the one this renders or a surrounding Field's,\n    // and keeps a fallback name when no label names it or the one that does\n    // has no id to point at. While no suggestion matches there's no listbox,\n    // so the combobox is collapsed and points at nothing. It skips a\n    // highlighted suggestion that's blank once trimmed, since that one can't\n    // become a tag, and the option it points at is the one marked selected.\n    const optionId = (index: number) => `${listboxId}-${index}`;\n    const activeOptionId =\n      listOpen && filteredData[highlightedIndex]?.trim()\n        ? optionId(highlightedIndex)\n        : undefined;\n    const comboboxProps: React.InputHTMLAttributes<HTMLInputElement> = {\n      role: 'combobox',\n      'aria-expanded': listOpen,\n      'aria-controls': listOpen ? listboxId : undefined,\n      'aria-activedescendant': activeOptionId,\n      'aria-haspopup': 'listbox',\n      'aria-autocomplete': 'list',\n    };\n\n    const taginputElement = (\n      <div\n        ref={containerRef}\n        className={combinedClasses}\n        onClick={handleContainerClick}\n        {...rest}\n      >\n        <div className={containerClasses}>\n          {icon && (\n            <Icon\n              name={icon}\n              library={resolvedLibrary}\n              variant={iconVariant}\n              features={iconFeatures}\n              containerClassName={pcn('icon', 'is-left')}\n            />\n          )}\n          <div className={tagsClasses}>\n            {tags.map((tag, index) => {\n              const displayVal = getDisplayValue(tag);\n              return (\n                <span key={index} className={tagClasses}>\n                  {tagTemplate ? (\n                    tagTemplate(tag)\n                  ) : ellipsis ? (\n                    <span title={displayVal}>{displayVal}</span>\n                  ) : (\n                    displayVal\n                  )}\n                  {closable && !disabled && !readonly && (\n                    <button\n                      type=\"button\"\n                      className={pcn('delete', 'is-small')}\n                      onClick={e => {\n                        e.stopPropagation();\n                        removeTag(index);\n                      }}\n                      aria-label={ariaCloseLabel || `Remove ${displayVal}`}\n                    />\n                  )}\n                </span>\n              );\n            })}\n            {!isMaxReached && (\n              <input\n                ref={combinedRef}\n                type=\"text\"\n                className={inputClasses}\n                id={controlId}\n                value={inputValue}\n                placeholder={tags.length === 0 ? placeholder : undefined}\n                disabled={disabled}\n                readOnly={readonly}\n                maxLength={maxlength}\n                onChange={handleInputChange}\n                onFocus={handleFocus}\n                onKeyDown={handleKeyDown}\n                onPaste={handlePaste}\n                {...(hasSuggestions && comboboxProps)}\n                // Fallback name, dropped only when a rendered label actually\n                // targets this input, its own or a surrounding Field's\n                // (aria-label would win otherwise). A label pointing elsewhere\n                // keeps the fallback so the input is never nameless.\n                aria-label={labelled ? undefined : 'Add tag'}\n              />\n            )}\n          </div>\n          {loading && (\n            <span className={iconRightClass}>\n              <span className={loaderClass} />\n            </span>\n          )}\n        </div>\n\n        {listOpen && (\n          <div className={dropdownMenuClasses}>\n            <div\n              ref={dropdownRef}\n              id={listboxId}\n              className={dropdownContentClasses}\n              role=\"listbox\"\n              aria-labelledby={listLabelId}\n              aria-label={listLabelId ? undefined : 'Suggestions'}\n            >\n              {filteredData.map((item, index) => (\n                <a\n                  key={index}\n                  id={optionId(index)}\n                  className={pcn('dropdown-item', {\n                    'is-active': index === highlightedIndex,\n                  })}\n                  onClick={() => addTag(item)}\n                  onMouseEnter={() => setHighlightedIndex(index)}\n                  role=\"option\"\n                  aria-selected={optionId(index) === activeOptionId}\n                >\n                  {item}\n                </a>\n              ))}\n            </div>\n          </div>\n        )}\n\n        {showCounter && <small className={counterClasses}>{counterText}</small>}\n\n        {name &&\n          tags.map((tag, i) => (\n            <input\n              key={`tag-input-${i}`}\n              type=\"hidden\"\n              name={name}\n              value={getDisplayValue(tag)}\n              form={form}\n            />\n          ))}\n      </div>\n    );\n\n    if (ownField) {\n      return (\n        <Field\n          label={label}\n          labelSize={labelSize}\n          labelProps={fieldLabelProps}\n          horizontal={horizontal}\n          className={fieldClassName}\n        >\n          {taginputElement}\n          {messageEl}\n        </Field>\n      );\n    }\n\n    return (\n      <>\n        {taginputElement}\n        {messageEl}\n      </>\n    );\n  }\n);\n\nTaginput.displayName = 'Taginput';\n\n/** @deprecated Use `Taginput` — same component. */\nexport const TagInput = Taginput;\n\n/** @deprecated Use `TaginputProps`. */\nexport type TagInputProps = TaginputProps;\n\nexport default Taginput;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

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

@@ -93,7 +93,15 @@ const PickerPopover = ({ isOpen, onClose, anchorRef, children, position = 'botto
             left: resolved.left,
         }
         : {};
-    const panel = (jsx("div", { ref: panelRef, id: id, role: role, "aria-modal": role === 'dialog' ? 'false' : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, tabIndex: -1, className: classNames(panelClass, className), style: style, children: children }));
+    const panel = (jsx("div", { ref: panelRef, id: id, role: role, "aria-modal": role === 'dialog' ? 'false' : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, tabIndex: -1, className: classNames(panelClass, className), style: style, 
+        // An Escape pressed in the panel is the picker's, and the listener
+        // above claims it. A Dropdown menu around the picker hears Escape in a
+        // React handler, which runs before that listener, so the panel claims
+        // it here too, where React gets to it first.
+        onKeyDown: e => {
+            if (closeOnEscape && e.key === 'Escape')
+                e.preventDefault();
+        }, children: children }));
     if (appendToBody && isBrowser) {
         return createPortal(panel, resolveContainer());
     }

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

@@ -1 +1 @@
-{"version":3,"file":"PickerPopover.js","sources":["../../../../src/form/_pickerInternals/PickerPopover.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../../helpers/classNames';\nimport { useFocusTrap } from '../../helpers/useFocusTrap';\nimport { usePortalContainer } from '../../helpers/portal';\nimport { isEventInside } from '../../helpers/shadowDom';\nimport {\n  marginGap,\n  useAnchoredPosition,\n} from '../../helpers/useAnchoredPosition';\nimport { PickerPosition } from './pickerTypes';\n\nexport interface PickerPopoverProps {\n  isOpen: boolean;\n  onClose: () => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n  children: React.ReactNode;\n  position?: PickerPosition;\n  appendToBody?: boolean;\n  className?: string;\n  trapFocus?: boolean;\n  closeOnClickOutside?: boolean;\n  /** Close on Escape and on Alt+ArrowUp. Default `true`. */\n  closeOnEscape?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  role?: 'dialog' | 'group';\n  id?: string;\n  /**\n   * Where focus goes when the popover closes. Without it, focus goes back to\n   * whatever had it when the focus trap turned on, which is read after the\n   * panel's content mounts: a calendar that focuses a cell as it mounts\n   * would be recorded instead, and that cell leaves with the panel.\n   */\n  restoreFocusRef?: React.RefObject<HTMLElement | null>;\n  /**\n   * Selects the element in the panel that takes focus as it opens, such as a\n   * calendar's focused date rather than the first button in its header. When\n   * nothing matches, or the match can't take focus, the first tab stop does.\n   */\n  initialFocusSelector?: string;\n}\n\nconst isBrowser = typeof window !== 'undefined';\n\nexport const PickerPopover: React.FC<PickerPopoverProps> = ({\n  isOpen,\n  onClose,\n  anchorRef,\n  children,\n  position = 'bottom-left',\n  appendToBody = false,\n  className,\n  trapFocus = true,\n  closeOnClickOutside = true,\n  closeOnEscape = true,\n  ariaLabel,\n  ariaLabelledBy,\n  role = 'dialog',\n  id,\n  restoreFocusRef,\n  initialFocusSelector,\n}) => {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const resolveContainer = usePortalContainer();\n  // Read as the trap turns on, once the panel's content has rendered.\n  const initialFocusRef = useMemo(\n    () =>\n      initialFocusSelector === undefined\n        ? undefined\n        : {\n            get current() {\n              return (\n                panelRef.current?.querySelector<HTMLElement>(\n                  initialFocusSelector\n                ) ?? null\n              );\n            },\n          },\n    [initialFocusSelector]\n  );\n  const resolved = useAnchoredPosition(anchorRef, panelRef, {\n    active: isOpen,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-picker-popover-offset` as a margin, in place\n    // or portaled, so the coordinates leave it out and `auto` reads it off\n    // the panel.\n    offset: 0,\n    styledGap: marginGap,\n  });\n\n  useEffect(() => {\n    if (!isOpen || !closeOnClickOutside || !isBrowser) return undefined;\n    // Listen on `pointerdown` (rather than `mousedown`) so touch starts\n    // outside the popover dismiss it on mobile — including swipe-from-outside\n    // gestures, where the synthetic mouse event would otherwise lag a few\n    // hundred ms behind the actual touch.\n    const handler = (e: PointerEvent) => {\n      const path = e.composedPath();\n      if (panelRef.current && path.includes(panelRef.current)) return;\n      if (anchorRef.current && path.includes(anchorRef.current)) return;\n      onClose();\n    };\n    document.addEventListener('pointerdown', handler);\n    return () => document.removeEventListener('pointerdown', handler);\n  }, [isOpen, closeOnClickOutside, anchorRef, onClose]);\n\n  // Escape closes it, and so does Alt+ArrowUp, the combobox's key for it,\n  // which the calendar and the time wheels inside leave to it. Escape closes\n  // it from anywhere, but the key is only the picker's when it was pressed in\n  // the panel or the field: then it's marked used, so a Modal or Sidebar\n  // around the picker stays open. From anywhere else, such as a dialog opened\n  // over the picker, the key goes on to whatever has focus.\n  useEffect(() => {\n    if (!isOpen || !closeOnEscape || !isBrowser) return undefined;\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        if (\n          isEventInside(e, panelRef.current) ||\n          isEventInside(e, anchorRef.current)\n        ) {\n          e.preventDefault();\n        }\n        onClose();\n      } else if (e.altKey && e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        onClose();\n      }\n    };\n    document.addEventListener('keydown', handler);\n    return () => document.removeEventListener('keydown', handler);\n  }, [isOpen, closeOnEscape, anchorRef, onClose]);\n\n  useFocusTrap(panelRef, {\n    active: isOpen && trapFocus,\n    initialFocusRef,\n    restoreFocus: restoreFocusRef ?? true,\n  });\n\n  const panelClass = usePrefixedClassNames('picker-popover', {\n    'is-active': isOpen,\n    [`is-${resolved.position}`]: true,\n    'is-portal': appendToBody,\n  });\n\n  if (!isOpen) return null;\n\n  const style: React.CSSProperties = appendToBody\n    ? {\n        position: 'fixed',\n        top: resolved.top,\n        left: resolved.left,\n      }\n    : {};\n\n  const panel = (\n    <div\n      ref={panelRef}\n      id={id}\n      role={role}\n      aria-modal={role === 'dialog' ? 'false' : undefined}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={-1}\n      className={classNames(panelClass, className)}\n      style={style}\n    >\n      {children}\n    </div>\n  );\n\n  if (appendToBody && isBrowser) {\n    return createPortal(panel, resolveContainer());\n  }\n  return panel;\n};\n\nPickerPopover.displayName = 'PickerPopover';\n\nexport default PickerPopover;\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"PickerPopover.js","sources":["../../../../src/form/_pickerInternals/PickerPopover.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../../helpers/classNames';\nimport { useFocusTrap } from '../../helpers/useFocusTrap';\nimport { usePortalContainer } from '../../helpers/portal';\nimport { isEventInside } from '../../helpers/shadowDom';\nimport {\n  marginGap,\n  useAnchoredPosition,\n} from '../../helpers/useAnchoredPosition';\nimport { PickerPosition } from './pickerTypes';\n\nexport interface PickerPopoverProps {\n  isOpen: boolean;\n  onClose: () => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n  children: React.ReactNode;\n  position?: PickerPosition;\n  appendToBody?: boolean;\n  className?: string;\n  trapFocus?: boolean;\n  closeOnClickOutside?: boolean;\n  /** Close on Escape and on Alt+ArrowUp. Default `true`. */\n  closeOnEscape?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  role?: 'dialog' | 'group';\n  id?: string;\n  /**\n   * Where focus goes when the popover closes. Without it, focus goes back to\n   * whatever had it when the focus trap turned on, which is read after the\n   * panel's content mounts: a calendar that focuses a cell as it mounts\n   * would be recorded instead, and that cell leaves with the panel.\n   */\n  restoreFocusRef?: React.RefObject<HTMLElement | null>;\n  /**\n   * Selects the element in the panel that takes focus as it opens, such as a\n   * calendar's focused date rather than the first button in its header. When\n   * nothing matches, or the match can't take focus, the first tab stop does.\n   */\n  initialFocusSelector?: string;\n}\n\nconst isBrowser = typeof window !== 'undefined';\n\nexport const PickerPopover: React.FC<PickerPopoverProps> = ({\n  isOpen,\n  onClose,\n  anchorRef,\n  children,\n  position = 'bottom-left',\n  appendToBody = false,\n  className,\n  trapFocus = true,\n  closeOnClickOutside = true,\n  closeOnEscape = true,\n  ariaLabel,\n  ariaLabelledBy,\n  role = 'dialog',\n  id,\n  restoreFocusRef,\n  initialFocusSelector,\n}) => {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const resolveContainer = usePortalContainer();\n  // Read as the trap turns on, once the panel's content has rendered.\n  const initialFocusRef = useMemo(\n    () =>\n      initialFocusSelector === undefined\n        ? undefined\n        : {\n            get current() {\n              return (\n                panelRef.current?.querySelector<HTMLElement>(\n                  initialFocusSelector\n                ) ?? null\n              );\n            },\n          },\n    [initialFocusSelector]\n  );\n  const resolved = useAnchoredPosition(anchorRef, panelRef, {\n    active: isOpen,\n    position,\n    fixed: appendToBody,\n    // The gap comes from `--bulma-picker-popover-offset` as a margin, in place\n    // or portaled, so the coordinates leave it out and `auto` reads it off\n    // the panel.\n    offset: 0,\n    styledGap: marginGap,\n  });\n\n  useEffect(() => {\n    if (!isOpen || !closeOnClickOutside || !isBrowser) return undefined;\n    // Listen on `pointerdown` (rather than `mousedown`) so touch starts\n    // outside the popover dismiss it on mobile — including swipe-from-outside\n    // gestures, where the synthetic mouse event would otherwise lag a few\n    // hundred ms behind the actual touch.\n    const handler = (e: PointerEvent) => {\n      const path = e.composedPath();\n      if (panelRef.current && path.includes(panelRef.current)) return;\n      if (anchorRef.current && path.includes(anchorRef.current)) return;\n      onClose();\n    };\n    document.addEventListener('pointerdown', handler);\n    return () => document.removeEventListener('pointerdown', handler);\n  }, [isOpen, closeOnClickOutside, anchorRef, onClose]);\n\n  // Escape closes it, and so does Alt+ArrowUp, the combobox's key for it,\n  // which the calendar and the time wheels inside leave to it. Escape closes\n  // it from anywhere, but the key is only the picker's when it was pressed in\n  // the panel or the field: then it's marked used, so a Modal or Sidebar\n  // around the picker stays open. From anywhere else, such as a dialog opened\n  // over the picker, the key goes on to whatever has focus.\n  useEffect(() => {\n    if (!isOpen || !closeOnEscape || !isBrowser) return undefined;\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        if (\n          isEventInside(e, panelRef.current) ||\n          isEventInside(e, anchorRef.current)\n        ) {\n          e.preventDefault();\n        }\n        onClose();\n      } else if (e.altKey && e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        onClose();\n      }\n    };\n    document.addEventListener('keydown', handler);\n    return () => document.removeEventListener('keydown', handler);\n  }, [isOpen, closeOnEscape, anchorRef, onClose]);\n\n  useFocusTrap(panelRef, {\n    active: isOpen && trapFocus,\n    initialFocusRef,\n    restoreFocus: restoreFocusRef ?? true,\n  });\n\n  const panelClass = usePrefixedClassNames('picker-popover', {\n    'is-active': isOpen,\n    [`is-${resolved.position}`]: true,\n    'is-portal': appendToBody,\n  });\n\n  if (!isOpen) return null;\n\n  const style: React.CSSProperties = appendToBody\n    ? {\n        position: 'fixed',\n        top: resolved.top,\n        left: resolved.left,\n      }\n    : {};\n\n  const panel = (\n    <div\n      ref={panelRef}\n      id={id}\n      role={role}\n      aria-modal={role === 'dialog' ? 'false' : undefined}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      tabIndex={-1}\n      className={classNames(panelClass, className)}\n      style={style}\n      // An Escape pressed in the panel is the picker's, and the listener\n      // above claims it. A Dropdown menu around the picker hears Escape in a\n      // React handler, which runs before that listener, so the panel claims\n      // it here too, where React gets to it first.\n      onKeyDown={e => {\n        if (closeOnEscape && e.key === 'Escape') e.preventDefault();\n      }}\n    >\n      {children}\n    </div>\n  );\n\n  if (appendToBody && isBrowser) {\n    return createPortal(panel, resolveContainer());\n  }\n  return panel;\n};\n\nPickerPopover.displayName = 'PickerPopover';\n\nexport default PickerPopover;\n"],"names":["_jsx"],"mappings":"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"}

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

@@ -1,5 +1,6 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
-import { useMemo, useState, useRef, useCallback, useLayoutEffect, useEffect } from 'react';
+import { useMemo, useState, useRef, useCallback, useEffect } from 'react';
+import { useClientLayoutEffect } from '../../helpers/useClientLayoutEffect.js';
 import { isWithin } from './dateUtils.js';
 import { buildSegmentMap, segmentIndexAtCaret, setAmPm, setSegmentValue, incrementSegmentValue } from './segmentMap.js';
 
@@ -55,7 +56,7 @@ function useSegmentedEntry(params) {
     // any of its effects, so a focus in between is the one handed back.
     const closingRef = useRef(false);
     const wasOpenRef = useRef(isOpen);
-    useLayoutEffect(() => {
+    useClientLayoutEffect(() => {
         if (wasOpenRef.current && !isOpen) {
             closingRef.current = true;
             if (!value && isUntouched(text))
@@ -85,12 +86,12 @@ function useSegmentedEntry(params) {
         setText(formatFn(next, format, locale));
     }, [commitValue, isAllowed, formatFn, format, locale, setText]);
     // After every segment-driven change, restore the system selection on the
-    // active segment's char range. useLayoutEffect runs synchronously before
+    // active segment's char range. A layout effect runs synchronously before
     // paint so the user never sees a stray caret position. We deliberately do
     // NOT gate on document.activeElement: when openOnFocus is true the focus
     // trap moves focus into the popover, but setSelectionRange on an unfocused
     // input is well-defined and the selection becomes visible on refocus.
-    useLayoutEffect(() => {
+    useClientLayoutEffect(() => {
         if (activeSegmentIdx === null || !segmentMap || !inputRef.current)
             return;
         const seg = segmentMap.segments[activeSegmentIdx];

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

@@ -1 +1 @@
-{"version":3,"file":"useSegmentedEntry.js","sources":["../../../../src/form/_pickerInternals/useSegmentedEntry.ts"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { DateFormatOption } from './formatters';\nimport { isWithin } from './dateUtils';\nimport {\n  buildSegmentMap,\n  incrementSegmentValue,\n  setSegmentValue,\n  setAmPm,\n  segmentIndexAtCaret,\n  SegmentKind,\n  SegmentMap,\n} from './segmentMap';\n\n/**\n * Single-character literals that, when typed, jump the caret to the next\n * editable segment — the slash / colon / dash / dot / space separators that\n * appear between date and time tokens. Lets a user type `12/25/2026` or\n * `13:45` straight through, skipping over the format's punctuation.\n */\nconst SEPARATOR_RE = /[/:\\-.\\s]/;\n\nexport interface UseSegmentedEntryParams {\n  /** Resolved format actually used to render (the host's default format). */\n  format: DateFormatOption;\n  /**\n   * Segment kinds the caret never stops on: they still render, but arrows,\n   * digits and separators pass over them. A month picker skips `'day'` so a\n   * format such as `'YYYY-MM-DD'` edits only the year and month. Must be\n   * referentially stable. A format left with no editable segment falls back\n   * to free-form entry.\n   */\n  skipKinds?: readonly SegmentKind[];\n  /** Current canonical value (controlled or internal). */\n  value: Date | null;\n  /** Commit a new Date through the host's onChange / internal pipeline. */\n  commitValue: (next: Date | null) => void;\n  /** Host formatter: formatDate | formatTime | formatDateTime. */\n  formatFn: (\n    d: Date,\n    fmt: DateFormatOption | undefined,\n    locale?: string\n  ) => string;\n  /** Host parser used by the free-form fallback (parseDate / parseTime / custom). */\n  tryParse: (s: string) => Date | null;\n  /** Host's displayed-text state and setter (the hook drives it during edits). */\n  text: string;\n  setText: (s: string) => void;\n  /**\n   * Seed for an empty value when the user starts typing: Time → today at noon,\n   * Date → today at 00:00, DateTime → now. Should be referentially stable.\n   */\n  makeBaseDate: () => Date;\n  locale?: string;\n  min?: Date;\n  max?: Date;\n  /**\n   * Host-supplied blocking predicate (composed from shouldDisableDate /\n   * unselectableDates / unselectableTimes). Checked alongside min/max on\n   * every manual-entry commit; return true to reject the candidate value.\n   */\n  isBlocked?: (d: Date) => boolean;\n  /**\n   * Rejects a candidate only while the digits typed into its segment leave\n   * it unfinished, such as the first digits of a year. The digit stays in\n   * the segment and the next one tries again, so a value passing through a\n   * candidate it can't commit on the way to one it can costs nothing. A\n   * finished segment, an arrow step and parsed text answer to `isBlocked`\n   * alone.\n   */\n  isUnfinishedBlocked?: (d: Date) => boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  /** Allow segmented typing. When false, segment mode never engages. */\n  editable?: boolean;\n  /** Whether a popover exists; gates open-on-focus / click / Alt+ArrowDown. */\n  popover?: boolean;\n  openOnFocus?: boolean;\n  closeOnSelect?: boolean;\n  isOpen: boolean;\n  /**\n   * The host's open-state setter. The hook asks it to open on focus, click\n   * or Alt+ArrowDown, but not on the focus the popover's focus trap hands\n   * back to the input as it closes, which is not the user arriving.\n   */\n  setOpen: (next: boolean) => void;\n  inputRef: React.RefObject<HTMLInputElement | null>;\n  containerRef: React.RefObject<HTMLElement | null>;\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  onClick?: React.MouseEventHandler<HTMLInputElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n}\n\nexport interface UseSegmentedEntryResult {\n  segmentMap: SegmentMap | null;\n  activeSegmentIdx: number | null;\n  /** True when segment typing is available (map + editable + not disabled/readOnly). */\n  segmentEditable: boolean;\n  /** True when a segment is actively selected. */\n  inSegmentMode: boolean;\n  /** Spread onto the combobox `<input>`. */\n  inputHandlers: {\n    onChange: React.ChangeEventHandler<HTMLInputElement>;\n    onFocus: React.FocusEventHandler<HTMLInputElement>;\n    onClick: React.MouseEventHandler<HTMLInputElement>;\n    onKeyDown: React.KeyboardEventHandler<HTMLInputElement>;\n    onBlur: React.FocusEventHandler<HTMLInputElement>;\n  };\n}\n\n/**\n * Segmented manual keyboard entry for a date / time picker input. Computes a\n * segment map from the token format, tracks the active segment, and returns\n * the full set of `<input>` event handlers — segment-mutating keys (arrows,\n * digits, AM/PM, separators) are handled here, while popover open/close and\n * free-form parse-on-blur/Enter are driven through the host-supplied\n * `setOpen` / `tryParse` / `commitValue` callbacks. When the format is an\n * `Intl` options object or contains variable-width tokens, the segment map is\n * null and the input transparently falls back to free-form text entry.\n */\nexport function useSegmentedEntry(\n  params: UseSegmentedEntryParams\n): UseSegmentedEntryResult {\n  const {\n    format,\n    skipKinds,\n    value,\n    commitValue,\n    formatFn,\n    tryParse,\n    text,\n    setText,\n    makeBaseDate,\n    locale,\n    min,\n    max,\n    isBlocked,\n    isUnfinishedBlocked,\n    disabled,\n    readOnly,\n    editable = true,\n    popover = true,\n    openOnFocus = true,\n    closeOnSelect = false,\n    isOpen,\n    setOpen,\n    inputRef,\n    containerRef,\n    onFocus,\n    onClick,\n    onKeyDown,\n    onBlur,\n  } = params;\n\n  const segmentMap: SegmentMap | null = useMemo(() => {\n    const map = typeof format === 'string' ? buildSegmentMap(format) : null;\n    if (!map || !skipKinds) return map;\n    const editable = map.editable.filter(\n      i => !skipKinds.includes(map.segments[i].kind)\n    );\n    return editable.length > 0 ? { ...map, editable } : null;\n  }, [format, skipKinds]);\n  const [activeSegmentIdx, setActiveSegmentIdx] = useState<number | null>(null);\n  // Buffer of digits typed within the current segment, cleared on segment\n  // change. Kept in a ref because key handlers read+update synchronously\n  // within the same event tick.\n  const typedDigitsRef = useRef<string>('');\n  // The text focus seeded an empty picker with, until the user edits it or\n  // leaves.\n  const seedRef = useRef<string | null>(null);\n\n  // Whether the text is still what the picker put there, so nothing in it was\n  // typed: the value's display, or an empty picker's seed until an edit drops\n  // it. Against a value it compares text alone, so typing that ends back on\n  // the display counts as untouched.\n  const isUntouched = useCallback(\n    (s: string) =>\n      value\n        ? s === formatFn(value, format, locale)\n        : seedRef.current !== null && s === seedRef.current,\n    [value, formatFn, format, locale]\n  );\n\n  // A seed the popover never turned into a value closes with it, wherever\n  // focus goes, so a dismissed empty field stays empty.\n  //\n  // As the popover closes, its focus trap hands focus back to the input. That\n  // focus is not the user arriving: it must not open the popover again under\n  // `openOnFocus`, or seed an empty picker. `closingRef` is set in the layout\n  // phase of the commit that closes it and cleared by that commit's effects,\n  // and React runs a commit's effect cleanups, the trap's among them, before\n  // any of its effects, so a focus in between is the one handed back.\n  const closingRef = useRef(false);\n  const wasOpenRef = useRef(isOpen);\n  useLayoutEffect(() => {\n    if (wasOpenRef.current && !isOpen) {\n      closingRef.current = true;\n      if (!value && isUntouched(text)) setText('');\n      seedRef.current = null;\n    }\n    wasOpenRef.current = isOpen;\n  }, [isOpen, value, isUntouched, text, setText]);\n  useEffect(() => {\n    closingRef.current = false;\n  }, [isOpen]);\n\n  // Segment mode is unavailable for disabled / read-only / non-editable\n  // pickers and for Intl-options / variable-width formats (segmentMap null).\n  const segmentEditable = !!segmentMap && !!editable && !disabled && !readOnly;\n\n  // The Date we edit when the user starts without a current value.\n  const segmentBaseDate = useCallback(\n    (): Date => value ?? makeBaseDate(),\n    [value, makeBaseDate]\n  );\n\n  // Single gate for every manual-entry commit: min/max bounds plus the\n  // host's blocking predicate.\n  const isAllowed = useCallback(\n    (d: Date) => isWithin(d, min, max) && !isBlocked?.(d),\n    [min, max, isBlocked]\n  );\n\n  // Apply a segment-driven date update: commit through the host pipeline (so\n  // onChange / controlled mode keep working) and re-render the text so the\n  // active selection range stays valid.\n  const applyDateFromSegment = useCallback(\n    (next: Date) => {\n      if (!isAllowed(next)) return;\n      commitValue(next);\n      setText(formatFn(next, format, locale));\n    },\n    [commitValue, isAllowed, formatFn, format, locale, setText]\n  );\n\n  // After every segment-driven change, restore the system selection on the\n  // active segment's char range. useLayoutEffect runs synchronously before\n  // paint so the user never sees a stray caret position. We deliberately do\n  // NOT gate on document.activeElement: when openOnFocus is true the focus\n  // trap moves focus into the popover, but setSelectionRange on an unfocused\n  // input is well-defined and the selection becomes visible on refocus.\n  useLayoutEffect(() => {\n    if (activeSegmentIdx === null || !segmentMap || !inputRef.current) return;\n    const seg = segmentMap.segments[activeSegmentIdx];\n    if (!seg) return;\n    try {\n      inputRef.current.setSelectionRange(seg.start, seg.end);\n    } catch {\n      // Some read-only inputs reject setSelectionRange; harmless.\n    }\n  }, [activeSegmentIdx, segmentMap, text, inputRef]);\n\n  const moveSegment = useCallback(\n    (delta: 1 | -1) => {\n      if (!segmentMap || activeSegmentIdx === null) return;\n      const pos = segmentMap.editable.indexOf(activeSegmentIdx);\n      if (pos < 0) return;\n      const nextPos = Math.max(\n        0,\n        Math.min(segmentMap.editable.length - 1, pos + delta)\n      );\n      const nextIdx = segmentMap.editable[nextPos];\n      if (nextIdx !== activeSegmentIdx) {\n        typedDigitsRef.current = '';\n        setActiveSegmentIdx(nextIdx);\n      }\n    },\n    [segmentMap, activeSegmentIdx]\n  );\n\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      // In segment mode the text is managed programmatically (every edit\n      // re-formats from the canonical Date). Browser-issued input events\n      // would otherwise clobber it. The free-form path runs only when\n      // segment mode is inactive.\n      if (activeSegmentIdx !== null && segmentEditable) return;\n      seedRef.current = null;\n      setText(e.target.value);\n    },\n    [activeSegmentIdx, segmentEditable, setText]\n  );\n\n  const handleBlur = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      // The popover opens on focus by default, and the focus trap moves focus\n      // into the popover panel — that fires this blur even though the user is\n      // still in the same picker. Only tear down segment state and re-parse\n      // when focus has truly left the picker's container.\n      const nextFocus = e.relatedTarget as HTMLElement | null;\n      const stayingInPicker =\n        nextFocus !== null &&\n        containerRef.current !== null &&\n        containerRef.current.contains(nextFocus);\n      if (stayingInPicker) {\n        onBlur?.(e);\n        return;\n      }\n      setActiveSegmentIdx(null);\n      typedDigitsRef.current = '';\n      // Leaving commits only what was typed. Re-parsing the value's display\n      // could drop what the format leaves out, such as seconds, and a seed\n      // nobody typed over is not the user's date.\n      const untouched = isUntouched(text);\n      // An open popover keeps an unused seed until it closes, so one portaled\n      // outside the picker, whose focus reads as leaving, keeps it as one\n      // inside does.\n      if (!isOpen) seedRef.current = null;\n      if (untouched) {\n        if (!value && !isOpen) setText('');\n        onBlur?.(e);\n        return;\n      }\n      const parsed = tryParse(text);\n      if (parsed && isAllowed(parsed)) {\n        commitValue(parsed);\n      } else {\n        setText(value ? formatFn(value, format, locale) : '');\n      }\n      onBlur?.(e);\n    },\n    [\n      containerRef,\n      isUntouched,\n      isOpen,\n      tryParse,\n      text,\n      isAllowed,\n      commitValue,\n      value,\n      formatFn,\n      format,\n      locale,\n      setText,\n      onBlur,\n    ]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const handedBack = closingRef.current;\n      if (!handedBack && openOnFocus && popover && !disabled && !readOnly) {\n        setOpen(true);\n      }\n      // Enter segment mode: prime an initial value (so editing works even when\n      // empty), seed the text, and highlight the first editable segment. The\n      // segment base doesn't need the seed, so focus handed back skips it.\n      if (segmentEditable && segmentMap) {\n        if (!value && !handedBack) {\n          const seed = formatFn(makeBaseDate(), format, locale);\n          seedRef.current = seed;\n          setText(seed);\n        }\n        typedDigitsRef.current = '';\n        setActiveSegmentIdx(segmentMap.editable[0]);\n      }\n      onFocus?.(e);\n    },\n    [\n      openOnFocus,\n      popover,\n      disabled,\n      readOnly,\n      setOpen,\n      segmentEditable,\n      segmentMap,\n      value,\n      makeBaseDate,\n      formatFn,\n      format,\n      locale,\n      setText,\n      onFocus,\n    ]\n  );\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLInputElement>) => {\n      // Clicking the field opens the popover only when `openOnFocus` is on —\n      // a click is just a focus. With `openOnFocus={false}` (manual-entry\n      // mode) the click positions the caret for typing and the popover is\n      // opened explicitly via the right launcher button (or Alt+ArrowDown).\n      if (openOnFocus && popover && !disabled && !readOnly) setOpen(true);\n      if (segmentEditable && segmentMap && inputRef.current) {\n        const caret = inputRef.current.selectionStart ?? 0;\n        const idx = segmentIndexAtCaret(segmentMap, caret);\n        if (idx !== null && idx !== activeSegmentIdx) {\n          typedDigitsRef.current = '';\n          setActiveSegmentIdx(idx);\n        }\n      }\n      onClick?.(e);\n    },\n    [\n      openOnFocus,\n      popover,\n      disabled,\n      readOnly,\n      setOpen,\n      segmentEditable,\n      segmentMap,\n      inputRef,\n      activeSegmentIdx,\n      onClick,\n    ]\n  );\n\n  const inSegmentMode =\n    segmentEditable && segmentMap !== null && activeSegmentIdx !== null;\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      // Segment-mode key routing comes first. When segment mode isn't engaged\n      // (not editable, no map, or no active segment — e.g. after a typed-text\n      // fallback), unhandled keys fall through to the popover / free-form\n      // handling below.\n      if (inSegmentMode && segmentMap && activeSegmentIdx !== null) {\n        const seg = segmentMap.segments[activeSegmentIdx];\n        const base = segmentBaseDate();\n        const isPm = base.getHours() >= 12;\n        switch (e.key) {\n          case 'ArrowUp':\n          case 'ArrowDown':\n            e.preventDefault();\n            // The plain arrows step the segment, so the popover opens on\n            // Alt+ArrowDown and closes on Alt+ArrowUp, as a combobox's does,\n            // and neither steps it.\n            if (e.altKey) {\n              if (e.key === 'ArrowUp') {\n                if (isOpen) setOpen(false);\n              } else if (!isOpen && popover) {\n                setOpen(true);\n              }\n              return;\n            }\n            typedDigitsRef.current = '';\n            applyDateFromSegment(\n              incrementSegmentValue(\n                seg,\n                base,\n                e.key === 'ArrowUp' ? 1 : -1,\n                isPm\n              )\n            );\n            return;\n          case 'ArrowRight':\n            e.preventDefault();\n            moveSegment(1);\n            return;\n          case 'ArrowLeft':\n            e.preventDefault();\n            moveSegment(-1);\n            return;\n          case 'Backspace':\n            e.preventDefault();\n            if (typedDigitsRef.current.length > 0) {\n              typedDigitsRef.current = '';\n            } else {\n              moveSegment(-1);\n            }\n            return;\n          case 'Escape':\n            if (isOpen) {\n              e.preventDefault();\n              setOpen(false);\n            }\n            return;\n          case 'Enter':\n            e.preventDefault();\n            if (closeOnSelect) setOpen(false);\n            return;\n          case 'Tab':\n            setActiveSegmentIdx(null);\n            typedDigitsRef.current = '';\n            return;\n          default:\n            // AM/PM keys.\n            if (seg.kind === 'ampm') {\n              if (e.key === 'a' || e.key === 'A') {\n                e.preventDefault();\n                typedDigitsRef.current = '';\n                applyDateFromSegment(setAmPm(base, false));\n                moveSegment(1);\n                return;\n              }\n              if (e.key === 'p' || e.key === 'P') {\n                e.preventDefault();\n                typedDigitsRef.current = '';\n                applyDateFromSegment(setAmPm(base, true));\n                moveSegment(1);\n                return;\n              }\n            }\n            // Typing a format separator (/, :, -, ., space) jumps to the next\n            // segment, skipping over the literal punctuation.\n            if (e.key.length === 1 && SEPARATOR_RE.test(e.key)) {\n              e.preventDefault();\n              typedDigitsRef.current = '';\n              moveSegment(1);\n              return;\n            }\n            // Digit entry for numeric segments.\n            if (/^[0-9]$/.test(e.key) && seg.kind !== 'ampm') {\n              e.preventDefault();\n              const nextBuffer = typedDigitsRef.current + e.key;\n              typedDigitsRef.current = nextBuffer;\n              const { date, advance } = setSegmentValue(\n                seg,\n                base,\n                nextBuffer,\n                isPm\n              );\n              if (!advance && isUnfinishedBlocked?.(date)) return;\n              applyDateFromSegment(date);\n              if (advance) {\n                typedDigitsRef.current = '';\n                moveSegment(1);\n              }\n              return;\n            }\n        }\n      }\n      // ----- free-form / popover key handling -----\n      // With no segment to step, ArrowDown opens the popover with or without\n      // Alt, unless the field is read-only or disabled, as focus and the\n      // launcher don't open it then either. Alt+ArrowUp closes it.\n      if (\n        e.key === 'ArrowDown' &&\n        !isOpen &&\n        popover &&\n        !disabled &&\n        !readOnly\n      ) {\n        e.preventDefault();\n        setOpen(true);\n        return;\n      }\n      if (e.key === 'ArrowUp' && e.altKey && isOpen) {\n        e.preventDefault();\n        setOpen(false);\n        return;\n      }\n      if (e.key === 'Escape' && isOpen) {\n        e.preventDefault();\n        setOpen(false);\n        return;\n      }\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        // Untouched text has nothing to commit, as on leaving, but Enter\n        // still confirms what the field shows.\n        if (isUntouched(text)) {\n          if (closeOnSelect) setOpen(false);\n        } else {\n          const parsed = tryParse(text);\n          if (parsed && isAllowed(parsed)) {\n            commitValue(parsed);\n            if (closeOnSelect) setOpen(false);\n          }\n        }\n      }\n      onKeyDown?.(e);\n    },\n    [\n      inSegmentMode,\n      segmentMap,\n      activeSegmentIdx,\n      segmentBaseDate,\n      applyDateFromSegment,\n      isUnfinishedBlocked,\n      moveSegment,\n      isOpen,\n      setOpen,\n      closeOnSelect,\n      popover,\n      disabled,\n      readOnly,\n      isUntouched,\n      tryParse,\n      text,\n      isAllowed,\n      commitValue,\n      onKeyDown,\n    ]\n  );\n\n  return {\n    segmentMap,\n    activeSegmentIdx,\n    segmentEditable,\n    inSegmentMode,\n    inputHandlers: {\n      onChange: handleChange,\n      onFocus: handleFocus,\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onBlur: handleBlur,\n    },\n  };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useSegmentedEntry.js","sources":["../../../../src/form/_pickerInternals/useSegmentedEntry.ts"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useClientLayoutEffect } from '../../helpers/useClientLayoutEffect';\nimport { DateFormatOption } from './formatters';\nimport { isWithin } from './dateUtils';\nimport {\n  buildSegmentMap,\n  incrementSegmentValue,\n  setSegmentValue,\n  setAmPm,\n  segmentIndexAtCaret,\n  SegmentKind,\n  SegmentMap,\n} from './segmentMap';\n\n/**\n * Single-character literals that, when typed, jump the caret to the next\n * editable segment — the slash / colon / dash / dot / space separators that\n * appear between date and time tokens. Lets a user type `12/25/2026` or\n * `13:45` straight through, skipping over the format's punctuation.\n */\nconst SEPARATOR_RE = /[/:\\-.\\s]/;\n\nexport interface UseSegmentedEntryParams {\n  /** Resolved format actually used to render (the host's default format). */\n  format: DateFormatOption;\n  /**\n   * Segment kinds the caret never stops on: they still render, but arrows,\n   * digits and separators pass over them. A month picker skips `'day'` so a\n   * format such as `'YYYY-MM-DD'` edits only the year and month. Must be\n   * referentially stable. A format left with no editable segment falls back\n   * to free-form entry.\n   */\n  skipKinds?: readonly SegmentKind[];\n  /** Current canonical value (controlled or internal). */\n  value: Date | null;\n  /** Commit a new Date through the host's onChange / internal pipeline. */\n  commitValue: (next: Date | null) => void;\n  /** Host formatter: formatDate | formatTime | formatDateTime. */\n  formatFn: (\n    d: Date,\n    fmt: DateFormatOption | undefined,\n    locale?: string\n  ) => string;\n  /** Host parser used by the free-form fallback (parseDate / parseTime / custom). */\n  tryParse: (s: string) => Date | null;\n  /** Host's displayed-text state and setter (the hook drives it during edits). */\n  text: string;\n  setText: (s: string) => void;\n  /**\n   * Seed for an empty value when the user starts typing: Time → today at noon,\n   * Date → today at 00:00, DateTime → now. Should be referentially stable.\n   */\n  makeBaseDate: () => Date;\n  locale?: string;\n  min?: Date;\n  max?: Date;\n  /**\n   * Host-supplied blocking predicate (composed from shouldDisableDate /\n   * unselectableDates / unselectableTimes). Checked alongside min/max on\n   * every manual-entry commit; return true to reject the candidate value.\n   */\n  isBlocked?: (d: Date) => boolean;\n  /**\n   * Rejects a candidate only while the digits typed into its segment leave\n   * it unfinished, such as the first digits of a year. The digit stays in\n   * the segment and the next one tries again, so a value passing through a\n   * candidate it can't commit on the way to one it can costs nothing. A\n   * finished segment, an arrow step and parsed text answer to `isBlocked`\n   * alone.\n   */\n  isUnfinishedBlocked?: (d: Date) => boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  /** Allow segmented typing. When false, segment mode never engages. */\n  editable?: boolean;\n  /** Whether a popover exists; gates open-on-focus / click / Alt+ArrowDown. */\n  popover?: boolean;\n  openOnFocus?: boolean;\n  closeOnSelect?: boolean;\n  isOpen: boolean;\n  /**\n   * The host's open-state setter. The hook asks it to open on focus, click\n   * or Alt+ArrowDown, but not on the focus the popover's focus trap hands\n   * back to the input as it closes, which is not the user arriving.\n   */\n  setOpen: (next: boolean) => void;\n  inputRef: React.RefObject<HTMLInputElement | null>;\n  containerRef: React.RefObject<HTMLElement | null>;\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  onClick?: React.MouseEventHandler<HTMLInputElement>;\n  onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n}\n\nexport interface UseSegmentedEntryResult {\n  segmentMap: SegmentMap | null;\n  activeSegmentIdx: number | null;\n  /** True when segment typing is available (map + editable + not disabled/readOnly). */\n  segmentEditable: boolean;\n  /** True when a segment is actively selected. */\n  inSegmentMode: boolean;\n  /** Spread onto the combobox `<input>`. */\n  inputHandlers: {\n    onChange: React.ChangeEventHandler<HTMLInputElement>;\n    onFocus: React.FocusEventHandler<HTMLInputElement>;\n    onClick: React.MouseEventHandler<HTMLInputElement>;\n    onKeyDown: React.KeyboardEventHandler<HTMLInputElement>;\n    onBlur: React.FocusEventHandler<HTMLInputElement>;\n  };\n}\n\n/**\n * Segmented manual keyboard entry for a date / time picker input. Computes a\n * segment map from the token format, tracks the active segment, and returns\n * the full set of `<input>` event handlers — segment-mutating keys (arrows,\n * digits, AM/PM, separators) are handled here, while popover open/close and\n * free-form parse-on-blur/Enter are driven through the host-supplied\n * `setOpen` / `tryParse` / `commitValue` callbacks. When the format is an\n * `Intl` options object or contains variable-width tokens, the segment map is\n * null and the input transparently falls back to free-form text entry.\n */\nexport function useSegmentedEntry(\n  params: UseSegmentedEntryParams\n): UseSegmentedEntryResult {\n  const {\n    format,\n    skipKinds,\n    value,\n    commitValue,\n    formatFn,\n    tryParse,\n    text,\n    setText,\n    makeBaseDate,\n    locale,\n    min,\n    max,\n    isBlocked,\n    isUnfinishedBlocked,\n    disabled,\n    readOnly,\n    editable = true,\n    popover = true,\n    openOnFocus = true,\n    closeOnSelect = false,\n    isOpen,\n    setOpen,\n    inputRef,\n    containerRef,\n    onFocus,\n    onClick,\n    onKeyDown,\n    onBlur,\n  } = params;\n\n  const segmentMap: SegmentMap | null = useMemo(() => {\n    const map = typeof format === 'string' ? buildSegmentMap(format) : null;\n    if (!map || !skipKinds) return map;\n    const editable = map.editable.filter(\n      i => !skipKinds.includes(map.segments[i].kind)\n    );\n    return editable.length > 0 ? { ...map, editable } : null;\n  }, [format, skipKinds]);\n  const [activeSegmentIdx, setActiveSegmentIdx] = useState<number | null>(null);\n  // Buffer of digits typed within the current segment, cleared on segment\n  // change. Kept in a ref because key handlers read+update synchronously\n  // within the same event tick.\n  const typedDigitsRef = useRef<string>('');\n  // The text focus seeded an empty picker with, until the user edits it or\n  // leaves.\n  const seedRef = useRef<string | null>(null);\n\n  // Whether the text is still what the picker put there, so nothing in it was\n  // typed: the value's display, or an empty picker's seed until an edit drops\n  // it. Against a value it compares text alone, so typing that ends back on\n  // the display counts as untouched.\n  const isUntouched = useCallback(\n    (s: string) =>\n      value\n        ? s === formatFn(value, format, locale)\n        : seedRef.current !== null && s === seedRef.current,\n    [value, formatFn, format, locale]\n  );\n\n  // A seed the popover never turned into a value closes with it, wherever\n  // focus goes, so a dismissed empty field stays empty.\n  //\n  // As the popover closes, its focus trap hands focus back to the input. That\n  // focus is not the user arriving: it must not open the popover again under\n  // `openOnFocus`, or seed an empty picker. `closingRef` is set in the layout\n  // phase of the commit that closes it and cleared by that commit's effects,\n  // and React runs a commit's effect cleanups, the trap's among them, before\n  // any of its effects, so a focus in between is the one handed back.\n  const closingRef = useRef(false);\n  const wasOpenRef = useRef(isOpen);\n  useClientLayoutEffect(() => {\n    if (wasOpenRef.current && !isOpen) {\n      closingRef.current = true;\n      if (!value && isUntouched(text)) setText('');\n      seedRef.current = null;\n    }\n    wasOpenRef.current = isOpen;\n  }, [isOpen, value, isUntouched, text, setText]);\n  useEffect(() => {\n    closingRef.current = false;\n  }, [isOpen]);\n\n  // Segment mode is unavailable for disabled / read-only / non-editable\n  // pickers and for Intl-options / variable-width formats (segmentMap null).\n  const segmentEditable = !!segmentMap && !!editable && !disabled && !readOnly;\n\n  // The Date we edit when the user starts without a current value.\n  const segmentBaseDate = useCallback(\n    (): Date => value ?? makeBaseDate(),\n    [value, makeBaseDate]\n  );\n\n  // Single gate for every manual-entry commit: min/max bounds plus the\n  // host's blocking predicate.\n  const isAllowed = useCallback(\n    (d: Date) => isWithin(d, min, max) && !isBlocked?.(d),\n    [min, max, isBlocked]\n  );\n\n  // Apply a segment-driven date update: commit through the host pipeline (so\n  // onChange / controlled mode keep working) and re-render the text so the\n  // active selection range stays valid.\n  const applyDateFromSegment = useCallback(\n    (next: Date) => {\n      if (!isAllowed(next)) return;\n      commitValue(next);\n      setText(formatFn(next, format, locale));\n    },\n    [commitValue, isAllowed, formatFn, format, locale, setText]\n  );\n\n  // After every segment-driven change, restore the system selection on the\n  // active segment's char range. A layout effect runs synchronously before\n  // paint so the user never sees a stray caret position. We deliberately do\n  // NOT gate on document.activeElement: when openOnFocus is true the focus\n  // trap moves focus into the popover, but setSelectionRange on an unfocused\n  // input is well-defined and the selection becomes visible on refocus.\n  useClientLayoutEffect(() => {\n    if (activeSegmentIdx === null || !segmentMap || !inputRef.current) return;\n    const seg = segmentMap.segments[activeSegmentIdx];\n    if (!seg) return;\n    try {\n      inputRef.current.setSelectionRange(seg.start, seg.end);\n    } catch {\n      // Some read-only inputs reject setSelectionRange; harmless.\n    }\n  }, [activeSegmentIdx, segmentMap, text, inputRef]);\n\n  const moveSegment = useCallback(\n    (delta: 1 | -1) => {\n      if (!segmentMap || activeSegmentIdx === null) return;\n      const pos = segmentMap.editable.indexOf(activeSegmentIdx);\n      if (pos < 0) return;\n      const nextPos = Math.max(\n        0,\n        Math.min(segmentMap.editable.length - 1, pos + delta)\n      );\n      const nextIdx = segmentMap.editable[nextPos];\n      if (nextIdx !== activeSegmentIdx) {\n        typedDigitsRef.current = '';\n        setActiveSegmentIdx(nextIdx);\n      }\n    },\n    [segmentMap, activeSegmentIdx]\n  );\n\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      // In segment mode the text is managed programmatically (every edit\n      // re-formats from the canonical Date). Browser-issued input events\n      // would otherwise clobber it. The free-form path runs only when\n      // segment mode is inactive.\n      if (activeSegmentIdx !== null && segmentEditable) return;\n      seedRef.current = null;\n      setText(e.target.value);\n    },\n    [activeSegmentIdx, segmentEditable, setText]\n  );\n\n  const handleBlur = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      // The popover opens on focus by default, and the focus trap moves focus\n      // into the popover panel — that fires this blur even though the user is\n      // still in the same picker. Only tear down segment state and re-parse\n      // when focus has truly left the picker's container.\n      const nextFocus = e.relatedTarget as HTMLElement | null;\n      const stayingInPicker =\n        nextFocus !== null &&\n        containerRef.current !== null &&\n        containerRef.current.contains(nextFocus);\n      if (stayingInPicker) {\n        onBlur?.(e);\n        return;\n      }\n      setActiveSegmentIdx(null);\n      typedDigitsRef.current = '';\n      // Leaving commits only what was typed. Re-parsing the value's display\n      // could drop what the format leaves out, such as seconds, and a seed\n      // nobody typed over is not the user's date.\n      const untouched = isUntouched(text);\n      // An open popover keeps an unused seed until it closes, so one portaled\n      // outside the picker, whose focus reads as leaving, keeps it as one\n      // inside does.\n      if (!isOpen) seedRef.current = null;\n      if (untouched) {\n        if (!value && !isOpen) setText('');\n        onBlur?.(e);\n        return;\n      }\n      const parsed = tryParse(text);\n      if (parsed && isAllowed(parsed)) {\n        commitValue(parsed);\n      } else {\n        setText(value ? formatFn(value, format, locale) : '');\n      }\n      onBlur?.(e);\n    },\n    [\n      containerRef,\n      isUntouched,\n      isOpen,\n      tryParse,\n      text,\n      isAllowed,\n      commitValue,\n      value,\n      formatFn,\n      format,\n      locale,\n      setText,\n      onBlur,\n    ]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const handedBack = closingRef.current;\n      if (!handedBack && openOnFocus && popover && !disabled && !readOnly) {\n        setOpen(true);\n      }\n      // Enter segment mode: prime an initial value (so editing works even when\n      // empty), seed the text, and highlight the first editable segment. The\n      // segment base doesn't need the seed, so focus handed back skips it.\n      if (segmentEditable && segmentMap) {\n        if (!value && !handedBack) {\n          const seed = formatFn(makeBaseDate(), format, locale);\n          seedRef.current = seed;\n          setText(seed);\n        }\n        typedDigitsRef.current = '';\n        setActiveSegmentIdx(segmentMap.editable[0]);\n      }\n      onFocus?.(e);\n    },\n    [\n      openOnFocus,\n      popover,\n      disabled,\n      readOnly,\n      setOpen,\n      segmentEditable,\n      segmentMap,\n      value,\n      makeBaseDate,\n      formatFn,\n      format,\n      locale,\n      setText,\n      onFocus,\n    ]\n  );\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLInputElement>) => {\n      // Clicking the field opens the popover only when `openOnFocus` is on —\n      // a click is just a focus. With `openOnFocus={false}` (manual-entry\n      // mode) the click positions the caret for typing and the popover is\n      // opened explicitly via the right launcher button (or Alt+ArrowDown).\n      if (openOnFocus && popover && !disabled && !readOnly) setOpen(true);\n      if (segmentEditable && segmentMap && inputRef.current) {\n        const caret = inputRef.current.selectionStart ?? 0;\n        const idx = segmentIndexAtCaret(segmentMap, caret);\n        if (idx !== null && idx !== activeSegmentIdx) {\n          typedDigitsRef.current = '';\n          setActiveSegmentIdx(idx);\n        }\n      }\n      onClick?.(e);\n    },\n    [\n      openOnFocus,\n      popover,\n      disabled,\n      readOnly,\n      setOpen,\n      segmentEditable,\n      segmentMap,\n      inputRef,\n      activeSegmentIdx,\n      onClick,\n    ]\n  );\n\n  const inSegmentMode =\n    segmentEditable && segmentMap !== null && activeSegmentIdx !== null;\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      // Segment-mode key routing comes first. When segment mode isn't engaged\n      // (not editable, no map, or no active segment — e.g. after a typed-text\n      // fallback), unhandled keys fall through to the popover / free-form\n      // handling below.\n      if (inSegmentMode && segmentMap && activeSegmentIdx !== null) {\n        const seg = segmentMap.segments[activeSegmentIdx];\n        const base = segmentBaseDate();\n        const isPm = base.getHours() >= 12;\n        switch (e.key) {\n          case 'ArrowUp':\n          case 'ArrowDown':\n            e.preventDefault();\n            // The plain arrows step the segment, so the popover opens on\n            // Alt+ArrowDown and closes on Alt+ArrowUp, as a combobox's does,\n            // and neither steps it.\n            if (e.altKey) {\n              if (e.key === 'ArrowUp') {\n                if (isOpen) setOpen(false);\n              } else if (!isOpen && popover) {\n                setOpen(true);\n              }\n              return;\n            }\n            typedDigitsRef.current = '';\n            applyDateFromSegment(\n              incrementSegmentValue(\n                seg,\n                base,\n                e.key === 'ArrowUp' ? 1 : -1,\n                isPm\n              )\n            );\n            return;\n          case 'ArrowRight':\n            e.preventDefault();\n            moveSegment(1);\n            return;\n          case 'ArrowLeft':\n            e.preventDefault();\n            moveSegment(-1);\n            return;\n          case 'Backspace':\n            e.preventDefault();\n            if (typedDigitsRef.current.length > 0) {\n              typedDigitsRef.current = '';\n            } else {\n              moveSegment(-1);\n            }\n            return;\n          case 'Escape':\n            if (isOpen) {\n              e.preventDefault();\n              setOpen(false);\n            }\n            return;\n          case 'Enter':\n            e.preventDefault();\n            if (closeOnSelect) setOpen(false);\n            return;\n          case 'Tab':\n            setActiveSegmentIdx(null);\n            typedDigitsRef.current = '';\n            return;\n          default:\n            // AM/PM keys.\n            if (seg.kind === 'ampm') {\n              if (e.key === 'a' || e.key === 'A') {\n                e.preventDefault();\n                typedDigitsRef.current = '';\n                applyDateFromSegment(setAmPm(base, false));\n                moveSegment(1);\n                return;\n              }\n              if (e.key === 'p' || e.key === 'P') {\n                e.preventDefault();\n                typedDigitsRef.current = '';\n                applyDateFromSegment(setAmPm(base, true));\n                moveSegment(1);\n                return;\n              }\n            }\n            // Typing a format separator (/, :, -, ., space) jumps to the next\n            // segment, skipping over the literal punctuation.\n            if (e.key.length === 1 && SEPARATOR_RE.test(e.key)) {\n              e.preventDefault();\n              typedDigitsRef.current = '';\n              moveSegment(1);\n              return;\n            }\n            // Digit entry for numeric segments.\n            if (/^[0-9]$/.test(e.key) && seg.kind !== 'ampm') {\n              e.preventDefault();\n              const nextBuffer = typedDigitsRef.current + e.key;\n              typedDigitsRef.current = nextBuffer;\n              const { date, advance } = setSegmentValue(\n                seg,\n                base,\n                nextBuffer,\n                isPm\n              );\n              if (!advance && isUnfinishedBlocked?.(date)) return;\n              applyDateFromSegment(date);\n              if (advance) {\n                typedDigitsRef.current = '';\n                moveSegment(1);\n              }\n              return;\n            }\n        }\n      }\n      // ----- free-form / popover key handling -----\n      // With no segment to step, ArrowDown opens the popover with or without\n      // Alt, unless the field is read-only or disabled, as focus and the\n      // launcher don't open it then either. Alt+ArrowUp closes it.\n      if (\n        e.key === 'ArrowDown' &&\n        !isOpen &&\n        popover &&\n        !disabled &&\n        !readOnly\n      ) {\n        e.preventDefault();\n        setOpen(true);\n        return;\n      }\n      if (e.key === 'ArrowUp' && e.altKey && isOpen) {\n        e.preventDefault();\n        setOpen(false);\n        return;\n      }\n      if (e.key === 'Escape' && isOpen) {\n        e.preventDefault();\n        setOpen(false);\n        return;\n      }\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        // Untouched text has nothing to commit, as on leaving, but Enter\n        // still confirms what the field shows.\n        if (isUntouched(text)) {\n          if (closeOnSelect) setOpen(false);\n        } else {\n          const parsed = tryParse(text);\n          if (parsed && isAllowed(parsed)) {\n            commitValue(parsed);\n            if (closeOnSelect) setOpen(false);\n          }\n        }\n      }\n      onKeyDown?.(e);\n    },\n    [\n      inSegmentMode,\n      segmentMap,\n      activeSegmentIdx,\n      segmentBaseDate,\n      applyDateFromSegment,\n      isUnfinishedBlocked,\n      moveSegment,\n      isOpen,\n      setOpen,\n      closeOnSelect,\n      popover,\n      disabled,\n      readOnly,\n      isUntouched,\n      tryParse,\n      text,\n      isAllowed,\n      commitValue,\n      onKeyDown,\n    ]\n  );\n\n  return {\n    segmentMap,\n    activeSegmentIdx,\n    segmentEditable,\n    inSegmentMode,\n    inputHandlers: {\n      onChange: handleChange,\n      onFocus: handleFocus,\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onBlur: handleBlur,\n    },\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/helpers/overlayStack.js

@@ -0,0 +1,49 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+import { useRef, useEffect, useCallback } from 'react';
+
+// INTERNAL: deliberately not exported from src/index.ts.
+/**
+ * The open overlays that take part, in the order they opened. Only the last
+ * one answers Escape, so one keypress closes one layer. It's touched in
+ * effects and key handlers, never while rendering, so a server render leaves
+ * it alone.
+ */
+const openOverlays = [];
+/**
+ * Holds this overlay's place in the stack of open overlays while `inStack`
+ * is true, from the effect after it opens until the one after it closes.
+ * Opening again puts it back on top.
+ *
+ * Returns a check for whether nothing in the stack sits above this overlay,
+ * to call when a key arrives. For an overlay in the stack, that's whether it
+ * is the topmost one. For one that isn't, such as a Toast, it's whether no
+ * overlay is open at all.
+ *
+ * @function useOverlayStack
+ * @param inStack - Whether this overlay is open and takes part.
+ * @returns A check for whether nothing in the stack is above this overlay.
+ */
+function useOverlayStack(inStack) {
+    const tokenRef = useRef({});
+    useEffect(() => {
+        if (!inStack)
+            return undefined;
+        const token = tokenRef.current;
+        openOverlays.push(token);
+        // Takes out this effect's own push. Should it ever be gone already, the
+        // stack is left as it is: splicing at -1 would take the topmost overlay
+        // instead.
+        return () => {
+            const index = openOverlays.indexOf(token);
+            if (index !== -1)
+                openOverlays.splice(index, 1);
+        };
+    }, [inStack]);
+    return useCallback(() => {
+        const top = openOverlays[openOverlays.length - 1];
+        return top === undefined || top === tokenRef.current;
+    }, []);
+}
+
+export { useOverlayStack };
+//# sourceMappingURL=overlayStack.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"overlayStack.js","sources":["../../../src/helpers/overlayStack.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport { useCallback, useEffect, useRef } from 'react';\n\n/**\n * The open overlays that take part, in the order they opened. Only the last\n * one answers Escape, so one keypress closes one layer. It's touched in\n * effects and key handlers, never while rendering, so a server render leaves\n * it alone.\n */\nconst openOverlays: object[] = [];\n\n/**\n * Holds this overlay's place in the stack of open overlays while `inStack`\n * is true, from the effect after it opens until the one after it closes.\n * Opening again puts it back on top.\n *\n * Returns a check for whether nothing in the stack sits above this overlay,\n * to call when a key arrives. For an overlay in the stack, that's whether it\n * is the topmost one. For one that isn't, such as a Toast, it's whether no\n * overlay is open at all.\n *\n * @function useOverlayStack\n * @param inStack - Whether this overlay is open and takes part.\n * @returns A check for whether nothing in the stack is above this overlay.\n */\nexport function useOverlayStack(inStack: boolean): () => boolean {\n  const tokenRef = useRef<object>({});\n\n  useEffect(() => {\n    if (!inStack) return undefined;\n    const token = tokenRef.current;\n    openOverlays.push(token);\n    // Takes out this effect's own push. Should it ever be gone already, the\n    // stack is left as it is: splicing at -1 would take the topmost overlay\n    // instead.\n    return () => {\n      const index = openOverlays.indexOf(token);\n      if (index !== -1) openOverlays.splice(index, 1);\n    };\n  }, [inStack]);\n\n  return useCallback(() => {\n    const top = openOverlays[openOverlays.length - 1];\n    return top === undefined || top === tokenRef.current;\n  }, []);\n}\n"],"names":[],"mappings":";;;AAAA;AAGA;;;;;AAKG;AACH,MAAM,YAAY,GAAa,EAAE;AAEjC;;;;;;;;;;;;;AAaG;AACG,SAAU,eAAe,CAAC,OAAgB,EAAA;AAC9C,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAS,EAAE,CAAC;IAEnC,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;AAC9B,QAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO;AAC9B,QAAA,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC;;;;AAIxB,QAAA,OAAO,MAAK;YACV,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC;YACzC,IAAI,KAAK,KAAK,EAAE;AAAE,gBAAA,YAAY,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;AACjD,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAEb,OAAO,WAAW,CAAC,MAAK;QACtB,MAAM,GAAG,GAAG,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;QACjD,OAAO,GAAG,KAAK,SAAS,IAAI,GAAG,KAAK,QAAQ,CAAC,OAAO;IACtD,CAAC,EAAE,EAAE,CAAC;AACR;;"}

package/dist/esm/helpers/useLatestRef.js

@@ -0,0 +1,33 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+import { useRef } from 'react';
+import { useClientLayoutEffect } from './useClientLayoutEffect.js';
+
+// INTERNAL: deliberately not exported from src/index.ts.
+/**
+ * A ref holding the value from the latest commit, for a listener that is
+ * added once and calls whatever callback it was given most recently.
+ *
+ * A listener whose effect lists a callback prop is taken off and added again
+ * each time that callback changes, and an inline one changes on every render
+ * of its parent. React can render between two listeners for the same
+ * keypress, and the browser runs neither a listener taken off mid-event nor
+ * one added mid-event, so that keypress never reaches it (#1088). Reading the
+ * callback from here keeps the listener where it is.
+ *
+ * It's updated before paint on each commit, so a listener reads the props of
+ * the render that's on screen.
+ *
+ * @function useLatestRef
+ * @param value - The value to keep current, usually a callback prop.
+ * @returns A ref whose `current` is `value` as of the latest commit.
+ */
+function useLatestRef(value) {
+    const ref = useRef(value);
+    useClientLayoutEffect(() => {
+        ref.current = value;
+    });
+    return ref;
+}
+
+export { useLatestRef };
+//# sourceMappingURL=useLatestRef.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useLatestRef.js","sources":["../../../src/helpers/useLatestRef.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport { useRef } from 'react';\nimport { useClientLayoutEffect } from './useClientLayoutEffect';\n\n/**\n * A ref holding the value from the latest commit, for a listener that is\n * added once and calls whatever callback it was given most recently.\n *\n * A listener whose effect lists a callback prop is taken off and added again\n * each time that callback changes, and an inline one changes on every render\n * of its parent. React can render between two listeners for the same\n * keypress, and the browser runs neither a listener taken off mid-event nor\n * one added mid-event, so that keypress never reaches it (#1088). Reading the\n * callback from here keeps the listener where it is.\n *\n * It's updated before paint on each commit, so a listener reads the props of\n * the render that's on screen.\n *\n * @function useLatestRef\n * @param value - The value to keep current, usually a callback prop.\n * @returns A ref whose `current` is `value` as of the latest commit.\n */\nexport function useLatestRef<T>(value: T): { readonly current: T } {\n  const ref = useRef(value);\n  useClientLayoutEffect(() => {\n    ref.current = value;\n  });\n  return ref;\n}\n"],"names":[],"mappings":";;;;AAAA;AAIA;;;;;;;;;;;;;;;;;AAiBG;AACG,SAAU,YAAY,CAAI,KAAQ,EAAA;AACtC,IAAA,MAAM,GAAG,GAAG,MAAM,CAAC,KAAK,CAAC;IACzB,qBAAqB,CAAC,MAAK;AACzB,QAAA,GAAG,CAAC,OAAO,GAAG,KAAK;AACrB,IAAA,CAAC,CAAC;AACF,IAAA,OAAO,GAAG;AACZ;;"}