@allxsmith/bestax-bulma 5.27.4 → 5.27.6

package/dist/esm/form/Autocomplete.js

@@ -37,11 +37,14 @@ const Autocomplete = forwardRef(({ data = [], value: controlledValue, placeholde
 // Field props
 label, labelSize, labelProps, horizontal, message, messageColor, fieldClassName, className, ...props }, ref) => {
     const insideField = useInsideField();
-    const { controlId, fieldLabelProps } = useAutoLabelId({
+    // The suggestion list points `aria-labelledby` at the label that names
+    // the input, so it needs that label's id.
+    const { controlId, fieldLabelProps, labelId: listLabelId, } = useAutoLabelId({
         label,
         id,
         labelProps,
         rendersLabel: !insideField,
+        needsLabelId: true,
     });
     const { bulmaHelperClasses, rest } = useBulmaClasses(props);
     const { classPrefix } = useConfig();
@@ -244,12 +247,11 @@ label, labelSize, labelProps, horizontal, message, messageColor, fieldClassName,
     const controlLoading = useControlLoading();
     const showClear = clearable && !!inputValue && !disabled && !loading && !controlLoading;
     // The combobox controls its listbox and points at the highlighted option.
-    // The listbox takes its name from the label this renders, or a fallback
-    // when it renders none.
+    // The listbox takes its name from the label that names the combobox, the
+    // one this renders or a surrounding Field's, so the two say the same
+    // thing. When no label names the combobox, or the one that does has no
+    // id to point at, the list keeps a fallback name.
     const listOpen = isActive && (filteredData.length > 0 || !!empty);
-    const listLabelId = !insideField && label
-        ? (fieldLabelProps?.id ?? `${listboxId}-label`)
-        : undefined;
     const activeOptionId = listOpen &&
         highlightedIndex >= 0 &&
         highlightedIndex < filteredData.length
@@ -267,9 +269,7 @@ label, labelSize, labelProps, horizontal, message, messageColor, fieldClassName,
                                     : getDisplayValue(item) }, index));
                         })) : (jsx("div", { className: emptyItemClasses, children: empty })), footer && jsx("div", { className: dropdownFooterClass, children: footer })] }) }))] }));
     if (!insideField) {
-        return (jsxs(Field, { label: label, labelSize: labelSize, labelProps: listLabelId
-                ? { ...fieldLabelProps, id: listLabelId }
-                : fieldLabelProps, horizontal: horizontal, className: fieldClassName, children: [autocompleteElement, messageEl] }));
+        return (jsxs(Field, { label: label, labelSize: labelSize, labelProps: fieldLabelProps, horizontal: horizontal, className: fieldClassName, children: [autocompleteElement, messageEl] }));
     }
     return (jsxs(Fragment, { children: [autocompleteElement, messageEl] }));
 });

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

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.js","sources":["../../../src/form/Autocomplete.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 } from '../helpers/Config';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { useInsideField } from './FormContext';\nimport { Field } from './Field';\nimport { FormFieldProps } from './fieldProps';\nimport { useAutoLabelId } from './useAutoLabelId';\nimport { useControlLoading } from './controlLoading';\n\n/**\n * An item in the Autocomplete dropdown list.\n */\nexport interface AutocompleteItem {\n  /** The value used for filtering and selection. */\n  value: string;\n  /** Display label (optional). */\n  label?: string;\n  /** Whether the item is disabled and unselectable. */\n  disabled?: boolean;\n  [key: string]: unknown;\n}\n\n/**\n * Props for the Autocomplete component.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the input element.\n */\nexport interface AutocompleteProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'onInput'>,\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. Dropped inside an outer `Field`, whose own label associates instead when that `Field` generates a target id (not `grouped`/`hasAddons`, no explicit `labelProps.htmlFor`). */\n  label?: React.ReactNode;\n  /** Props for the label element. An explicit `htmlFor` here overrides the automatic association (no id is generated then). */\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 options data to display (required). */\n  data: AutocompleteItem[] | string[];\n  /** The current input value (controlled). */\n  value?: string;\n  /** The selected item (controlled). */\n  selected?: AutocompleteItem | string | null;\n  /** Placeholder text for the input. */\n  placeholder?: string;\n  /** Object property to use as the display field. */\n  field?: string;\n  /**\n   * Whether to show a clear button while the input holds a value.\n   * It hides while the input is disabled, and gives way to a loading\n   * spinner at the same right edge: the one `loading` draws, or that of a\n   * `Control` with `isLoading` around the Autocomplete.\n   */\n  clearable?: boolean;\n  /** Open dropdown when input is focused. */\n  openOnFocus?: boolean;\n  /** Keep first option highlighted. */\n  keepFirst?: boolean;\n  /** Keep dropdown open after selection. */\n  keepOpen?: boolean;\n  /** Select highlighted item on click outside. */\n  selectOnClickOutside?: boolean;\n  /** Maximum dropdown height in pixels. */\n  maxHeight?: number;\n  /** Render as dropdown style. */\n  dropdown?: boolean;\n  /**\n   * Show 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  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Enables infinite scroll detection in the dropdown. */\n  checkInfiniteScroll?: boolean;\n  /** Distance in pixels from the bottom to trigger `onInfiniteScroll`. */\n  infiniteScrollDistance?: number;\n  /** Input color variant. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Form field name. Forwarded to the inner `<input>`. */\n  name?: string;\n  /** Optional id of the form the input belongs to. */\n  form?: string;\n  /** Marks the field as required for native HTML form validation. */\n  required?: boolean;\n  /** Callback when input value changes. */\n  onInput?: (value: string) => void;\n  /** Callback when item is selected. */\n  onSelect?: (item: AutocompleteItem | string | null) => void;\n  /** Callback when dropdown active state changes. */\n  onActiveChange?: (active: boolean) => void;\n  /** Callback when scrolled to bottom (infinite scroll). */\n  onInfiniteScroll?: () => void;\n  /** Custom render for items. */\n  itemTemplate?: (item: AutocompleteItem | string) => React.ReactNode;\n  /** Custom header in dropdown. */\n  header?: React.ReactNode;\n  /** Custom footer in dropdown. */\n  footer?: React.ReactNode;\n  /** Content to show when no results. */\n  empty?: React.ReactNode;\n}\n\n/**\n * The `Autocomplete` component provides an input field with dropdown suggestions that filter based on user input.\n *\n * @function\n * @param {AutocompleteProps} props - Props for the Autocomplete component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the input element.\n * @returns {JSX.Element} The rendered autocomplete component.\n *\n * @example\n * // Basic usage with string array\n * <Autocomplete\n *   data={['Apple', 'Banana', 'Cherry']}\n *   placeholder=\"Search fruit...\"\n *   onSelect={(item) => console.log(item)}\n * />\n *\n * @example\n * // With object data\n * <Autocomplete\n *   data={[{ value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }]}\n *   field=\"label\"\n *   onSelect={(item) => console.log(item)}\n * />\n */\nexport const Autocomplete = forwardRef<HTMLInputElement, AutocompleteProps>(\n  (\n    {\n      data = [],\n      value: controlledValue,\n      placeholder,\n      field = 'label',\n      clearable = false,\n      openOnFocus = false,\n      keepFirst = false,\n      keepOpen = false,\n      selectOnClickOutside = false,\n      maxHeight = 200,\n      loading = false,\n      disabled = false,\n      checkInfiniteScroll = false,\n      infiniteScrollDistance = 50,\n      color,\n      size,\n      onInput,\n      onSelect,\n      onActiveChange,\n      onInfiniteScroll,\n      itemTemplate,\n      header,\n      footer,\n      empty,\n      name,\n      form,\n      required,\n      id,\n      // Field props\n      label,\n      labelSize,\n      labelProps,\n      horizontal,\n      message,\n      messageColor,\n      fieldClassName,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const insideField = useInsideField();\n    const { controlId, fieldLabelProps } = useAutoLabelId({\n      label,\n      id,\n      labelProps,\n      rendersLabel: !insideField,\n    });\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const { classPrefix } = useConfig();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    const [internalValue, setInternalValue] = useState('');\n    const [isActive, setIsActive] = useState(false);\n    const [highlightedIndex, setHighlightedIndex] = useState(-1);\n    const listboxId = `${useId()}-listbox`;\n\n    // Use controlled or internal value\n    const inputValue =\n      controlledValue !== undefined ? controlledValue : internalValue;\n\n    // Get display value from item\n    const getDisplayValue = (item: AutocompleteItem | string): string => {\n      if (typeof item === 'string') return item;\n      const fieldValue = item[field];\n      if (typeof fieldValue === 'string') return fieldValue;\n      return item.value || '';\n    };\n\n    // Filter data based on input\n    const filteredData = data.filter(item => {\n      const displayValue = getDisplayValue(item);\n      return displayValue.toLowerCase().includes(inputValue.toLowerCase());\n    });\n\n    // Handle input change\n    const handleInputChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const newValue = e.target.value;\n        if (controlledValue === undefined) {\n          setInternalValue(newValue);\n        }\n        onInput?.(newValue);\n        if (!isActive && newValue) {\n          setIsActive(true);\n        }\n      },\n      [controlledValue, isActive, onInput]\n    );\n\n    // Handle item selection\n    const handleSelect = useCallback(\n      (item: AutocompleteItem | string) => {\n        if (typeof item !== 'string' && item.disabled) return;\n\n        const displayValue = getDisplayValue(item);\n        if (controlledValue === undefined) {\n          setInternalValue(displayValue);\n        }\n        onInput?.(displayValue);\n        onSelect?.(item);\n\n        if (!keepOpen) {\n          setIsActive(false);\n        }\n        setHighlightedIndex(-1);\n      },\n      [controlledValue, field, keepOpen, onInput, onSelect]\n    );\n\n    // Handle clear\n    const handleClear = useCallback(() => {\n      if (controlledValue === undefined) {\n        setInternalValue('');\n      }\n      onInput?.('');\n      onSelect?.(null);\n      inputRef.current?.focus();\n    }, [controlledValue, onInput, onSelect]);\n\n    // Handle focus\n    const handleFocus = useCallback(() => {\n      if (openOnFocus && !disabled) {\n        setIsActive(true);\n      }\n    }, [openOnFocus, disabled]);\n\n    // Handle blur (click outside)\n    useEffect(() => {\n      if (!isActive) return undefined;\n\n      const handleClickOutside = (e: MouseEvent) => {\n        if (!containerRef.current) return;\n\n        // Use composedPath() to correctly detect clicks inside Shadow DOM\n        const path = e.composedPath();\n        const isInside = path.includes(containerRef.current);\n\n        if (!isInside) {\n          if (selectOnClickOutside && highlightedIndex >= 0) {\n            handleSelect(filteredData[highlightedIndex]);\n          }\n          setIsActive(false);\n        }\n      };\n\n      document.addEventListener('mousedown', handleClickOutside);\n      return () =>\n        document.removeEventListener('mousedown', handleClickOutside);\n    }, [\n      isActive,\n      selectOnClickOutside,\n      highlightedIndex,\n      filteredData,\n      handleSelect,\n    ]);\n\n    // Notify active state change\n    useEffect(() => {\n      onActiveChange?.(isActive);\n    }, [isActive, onActiveChange]);\n\n    // Keep first highlighted\n    useEffect(() => {\n      if (keepFirst && isActive && filteredData.length > 0) {\n        setHighlightedIndex(0);\n      }\n    }, [keepFirst, isActive, filteredData.length, inputValue]);\n\n    // Handle keyboard navigation\n    const handleKeyDown = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (disabled) return;\n\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            if (!isActive) {\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 'Enter':\n            e.preventDefault();\n            if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n              handleSelect(filteredData[highlightedIndex]);\n            }\n            break;\n          case 'Escape':\n            e.preventDefault();\n            setIsActive(false);\n            setHighlightedIndex(-1);\n            break;\n          case 'Tab':\n            if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n              handleSelect(filteredData[highlightedIndex]);\n            }\n            setIsActive(false);\n            break;\n        }\n      },\n      [disabled, isActive, highlightedIndex, filteredData, handleSelect]\n    );\n\n    // Handle dropdown scroll for infinite scroll\n    const handleDropdownScroll = useCallback(() => {\n      if (!checkInfiniteScroll || !dropdownRef.current) return;\n\n      const { scrollTop, scrollHeight, clientHeight } = dropdownRef.current;\n      if (scrollHeight - scrollTop - clientHeight <= infiniteScrollDistance) {\n        onInfiniteScroll?.();\n      }\n    }, [checkInfiniteScroll, infiniteScrollDistance, onInfiniteScroll]);\n\n    // Scroll highlighted item into view\n    useEffect(() => {\n      if (highlightedIndex >= 0 && dropdownRef.current) {\n        const highlightedEl = dropdownRef.current.querySelector(\n          `[data-index=\"${highlightedIndex}\"]`\n        );\n        if (\n          highlightedEl &&\n          typeof highlightedEl.scrollIntoView === 'function'\n        ) {\n          highlightedEl.scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }, [highlightedIndex]);\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    // Generate classes\n    const autocompleteClasses = usePrefixedClassNames('autocomplete', {\n      'is-active': isActive,\n      [`is-${size}`]: !!size,\n    });\n\n    const inputClasses = usePrefixedClassNames('input', {\n      [`is-${color}`]: !!color,\n      [`is-${size}`]: !!size,\n      'is-loading': loading,\n    });\n\n    const controlClasses = usePrefixedClassNames(\n      'control',\n      'is-expanded',\n      'has-icons-right'\n    );\n\n    const dropdownMenuClasses = usePrefixedClassNames('dropdown-menu', {\n      'is-active': isActive && (filteredData.length > 0 || !!empty),\n    });\n\n    const dropdownContentClass = usePrefixedClassNames('dropdown-content');\n    const dropdownHeaderClass = usePrefixedClassNames('dropdown-header');\n    const dropdownFooterClass = usePrefixedClassNames('dropdown-footer');\n    const emptyItemClasses = usePrefixedClassNames(\n      'dropdown-item',\n      'has-text-grey'\n    );\n\n    const iconRightClickableClass = usePrefixedClassNames(\n      'icon',\n      'is-right',\n      'is-clickable'\n    );\n    const iconRightClass = usePrefixedClassNames('icon', 'is-right');\n    const loaderClass = usePrefixedClassNames('loader', 'is-loading');\n\n    const combinedClasses = classNames(\n      autocompleteClasses,\n      bulmaHelperClasses,\n      className\n    );\n\n    const helpClass = usePrefixedClassNames('help', {\n      [`is-${messageColor}`]: !!messageColor,\n    });\n    const messageEl = message ? <p className={helpClass}>{message}</p> : null;\n\n    // The clear button gives way to a spinner at its spot: the `loading` one,\n    // or that of a loading Control this sits in.\n    const controlLoading = useControlLoading();\n    const showClear =\n      clearable && !!inputValue && !disabled && !loading && !controlLoading;\n\n    // The combobox controls its listbox and points at the highlighted option.\n    // The listbox takes its name from the label this renders, or a fallback\n    // when it renders none.\n    const listOpen = isActive && (filteredData.length > 0 || !!empty);\n    const listLabelId =\n      !insideField && label\n        ? ((fieldLabelProps?.id as string | undefined) ?? `${listboxId}-label`)\n        : undefined;\n    const activeOptionId =\n      listOpen &&\n      highlightedIndex >= 0 &&\n      highlightedIndex < filteredData.length\n        ? `${listboxId}-${highlightedIndex}`\n        : undefined;\n\n    const autocompleteElement = (\n      <div ref={containerRef} className={combinedClasses} {...rest}>\n        <div className={controlClasses}>\n          <input\n            ref={combinedRef}\n            type=\"text\"\n            className={inputClasses}\n            id={controlId}\n            value={inputValue}\n            placeholder={placeholder}\n            disabled={disabled}\n            name={name}\n            form={form}\n            required={required}\n            onChange={handleInputChange}\n            onFocus={handleFocus}\n            onKeyDown={handleKeyDown}\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            autoComplete=\"off\"\n          />\n          {showClear && (\n            <button\n              type=\"button\"\n              className={iconRightClickableClass}\n              onClick={handleClear}\n              aria-label=\"Clear\"\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                width=\"16\"\n                height=\"16\"\n                aria-hidden=\"true\"\n              >\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          )}\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              className={dropdownContentClass}\n              style={{ maxHeight: `${maxHeight}px`, overflowY: 'auto' }}\n              id={listboxId}\n              role=\"listbox\"\n              aria-labelledby={listLabelId}\n              aria-label={listLabelId ? undefined : 'Suggestions'}\n              onScroll={handleDropdownScroll}\n            >\n              {header && <div className={dropdownHeaderClass}>{header}</div>}\n\n              {filteredData.length > 0 ? (\n                filteredData.map((item, index) => {\n                  const isDisabled = typeof item !== 'string' && item.disabled;\n                  const isHighlighted = index === highlightedIndex;\n\n                  const itemClasses = prefixedClassNames(\n                    classPrefix,\n                    'dropdown-item',\n                    {\n                      'is-active': isHighlighted,\n                      'is-disabled': isDisabled,\n                    }\n                  );\n\n                  return (\n                    <a\n                      key={index}\n                      id={`${listboxId}-${index}`}\n                      data-index={index}\n                      className={itemClasses}\n                      onClick={() => !isDisabled && handleSelect(item)}\n                      onMouseEnter={() =>\n                        !isDisabled && setHighlightedIndex(index)\n                      }\n                      role=\"option\"\n                      aria-selected={isHighlighted}\n                      aria-disabled={isDisabled}\n                    >\n                      {itemTemplate\n                        ? itemTemplate(item)\n                        : getDisplayValue(item)}\n                    </a>\n                  );\n                })\n              ) : (\n                <div className={emptyItemClasses}>{empty}</div>\n              )}\n\n              {footer && <div className={dropdownFooterClass}>{footer}</div>}\n            </div>\n          </div>\n        )}\n      </div>\n    );\n\n    if (!insideField) {\n      return (\n        <Field\n          label={label}\n          labelSize={labelSize}\n          labelProps={\n            listLabelId\n              ? { ...fieldLabelProps, id: listLabelId }\n              : fieldLabelProps\n          }\n          horizontal={horizontal}\n          className={fieldClassName}\n        >\n          {autocompleteElement}\n          {messageEl}\n        </Field>\n      );\n    }\n\n    return (\n      <>\n        {autocompleteElement}\n        {messageEl}\n      </>\n    );\n  }\n);\n\nAutocomplete.displayName = 'Autocomplete';\n\nexport default Autocomplete;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Autocomplete.js","sources":["../../../src/form/Autocomplete.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 } from '../helpers/Config';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { useInsideField } from './FormContext';\nimport { Field } from './Field';\nimport { FormFieldProps } from './fieldProps';\nimport { useAutoLabelId } from './useAutoLabelId';\nimport { useControlLoading } from './controlLoading';\n\n/**\n * An item in the Autocomplete dropdown list.\n */\nexport interface AutocompleteItem {\n  /** The value used for filtering and selection. */\n  value: string;\n  /** Display label (optional). */\n  label?: string;\n  /** Whether the item is disabled and unselectable. */\n  disabled?: boolean;\n  [key: string]: unknown;\n}\n\n/**\n * Props for the Autocomplete component.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the input element.\n */\nexport interface AutocompleteProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'onInput'>,\n    Omit<BulmaClassesProps, 'color'>,\n    FormFieldProps {\n  /** Field label, associated with the text input via `htmlFor`: through your `id` when provided, otherwise a generated one. Dropped inside an outer `Field`, whose label names the input instead when it points at it. The `Field` points its label there itself when the Autocomplete has no `id` and no inner `Field` sits between them (and the `Field` is not `grouped` or `hasAddons`); a label you wire by hand with `labelProps.htmlFor` points at the input with that `id`. 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 (the input then gets no generated id). 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 options data to display (required). */\n  data: AutocompleteItem[] | string[];\n  /** The current input value (controlled). */\n  value?: string;\n  /** The selected item (controlled). */\n  selected?: AutocompleteItem | string | null;\n  /** Placeholder text for the input. */\n  placeholder?: string;\n  /** Object property to use as the display field. */\n  field?: string;\n  /**\n   * Whether to show a clear button while the input holds a value.\n   * It hides while the input is disabled, and gives way to a loading\n   * spinner at the same right edge: the one `loading` draws, or that of a\n   * `Control` with `isLoading` around the Autocomplete.\n   */\n  clearable?: boolean;\n  /** Open dropdown when input is focused. */\n  openOnFocus?: boolean;\n  /** Keep first option highlighted. */\n  keepFirst?: boolean;\n  /** Keep dropdown open after selection. */\n  keepOpen?: boolean;\n  /** Select highlighted item on click outside. */\n  selectOnClickOutside?: boolean;\n  /** Maximum dropdown height in pixels. */\n  maxHeight?: number;\n  /** Render as dropdown style. */\n  dropdown?: boolean;\n  /**\n   * Show 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  /** Whether the input is disabled. */\n  disabled?: boolean;\n  /** Enables infinite scroll detection in the dropdown. */\n  checkInfiniteScroll?: boolean;\n  /** Distance in pixels from the bottom to trigger `onInfiniteScroll`. */\n  infiniteScrollDistance?: number;\n  /** Input color variant. */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Form field name. Forwarded to the inner `<input>`. */\n  name?: string;\n  /** Optional id of the form the input belongs to. */\n  form?: string;\n  /** Marks the field as required for native HTML form validation. */\n  required?: boolean;\n  /** Callback when input value changes. */\n  onInput?: (value: string) => void;\n  /** Callback when item is selected. */\n  onSelect?: (item: AutocompleteItem | string | null) => void;\n  /** Callback when dropdown active state changes. */\n  onActiveChange?: (active: boolean) => void;\n  /** Callback when scrolled to bottom (infinite scroll). */\n  onInfiniteScroll?: () => void;\n  /** Custom render for items. */\n  itemTemplate?: (item: AutocompleteItem | string) => React.ReactNode;\n  /** Custom header in dropdown. */\n  header?: React.ReactNode;\n  /** Custom footer in dropdown. */\n  footer?: React.ReactNode;\n  /** Content to show when no results. */\n  empty?: React.ReactNode;\n}\n\n/**\n * The `Autocomplete` component provides an input field with dropdown suggestions that filter based on user input.\n *\n * @function\n * @param {AutocompleteProps} props - Props for the Autocomplete component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the input element.\n * @returns {JSX.Element} The rendered autocomplete component.\n *\n * @example\n * // Basic usage with string array\n * <Autocomplete\n *   data={['Apple', 'Banana', 'Cherry']}\n *   placeholder=\"Search fruit...\"\n *   onSelect={(item) => console.log(item)}\n * />\n *\n * @example\n * // With object data\n * <Autocomplete\n *   data={[{ value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }]}\n *   field=\"label\"\n *   onSelect={(item) => console.log(item)}\n * />\n */\nexport const Autocomplete = forwardRef<HTMLInputElement, AutocompleteProps>(\n  (\n    {\n      data = [],\n      value: controlledValue,\n      placeholder,\n      field = 'label',\n      clearable = false,\n      openOnFocus = false,\n      keepFirst = false,\n      keepOpen = false,\n      selectOnClickOutside = false,\n      maxHeight = 200,\n      loading = false,\n      disabled = false,\n      checkInfiniteScroll = false,\n      infiniteScrollDistance = 50,\n      color,\n      size,\n      onInput,\n      onSelect,\n      onActiveChange,\n      onInfiniteScroll,\n      itemTemplate,\n      header,\n      footer,\n      empty,\n      name,\n      form,\n      required,\n      id,\n      // Field props\n      label,\n      labelSize,\n      labelProps,\n      horizontal,\n      message,\n      messageColor,\n      fieldClassName,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const insideField = useInsideField();\n    // The suggestion list points `aria-labelledby` at the label that names\n    // the input, so it needs that label's id.\n    const {\n      controlId,\n      fieldLabelProps,\n      labelId: listLabelId,\n    } = useAutoLabelId({\n      label,\n      id,\n      labelProps,\n      rendersLabel: !insideField,\n      needsLabelId: true,\n    });\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const { classPrefix } = useConfig();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n\n    const [internalValue, setInternalValue] = useState('');\n    const [isActive, setIsActive] = useState(false);\n    const [highlightedIndex, setHighlightedIndex] = useState(-1);\n    const listboxId = `${useId()}-listbox`;\n\n    // Use controlled or internal value\n    const inputValue =\n      controlledValue !== undefined ? controlledValue : internalValue;\n\n    // Get display value from item\n    const getDisplayValue = (item: AutocompleteItem | string): string => {\n      if (typeof item === 'string') return item;\n      const fieldValue = item[field];\n      if (typeof fieldValue === 'string') return fieldValue;\n      return item.value || '';\n    };\n\n    // Filter data based on input\n    const filteredData = data.filter(item => {\n      const displayValue = getDisplayValue(item);\n      return displayValue.toLowerCase().includes(inputValue.toLowerCase());\n    });\n\n    // Handle input change\n    const handleInputChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        const newValue = e.target.value;\n        if (controlledValue === undefined) {\n          setInternalValue(newValue);\n        }\n        onInput?.(newValue);\n        if (!isActive && newValue) {\n          setIsActive(true);\n        }\n      },\n      [controlledValue, isActive, onInput]\n    );\n\n    // Handle item selection\n    const handleSelect = useCallback(\n      (item: AutocompleteItem | string) => {\n        if (typeof item !== 'string' && item.disabled) return;\n\n        const displayValue = getDisplayValue(item);\n        if (controlledValue === undefined) {\n          setInternalValue(displayValue);\n        }\n        onInput?.(displayValue);\n        onSelect?.(item);\n\n        if (!keepOpen) {\n          setIsActive(false);\n        }\n        setHighlightedIndex(-1);\n      },\n      [controlledValue, field, keepOpen, onInput, onSelect]\n    );\n\n    // Handle clear\n    const handleClear = useCallback(() => {\n      if (controlledValue === undefined) {\n        setInternalValue('');\n      }\n      onInput?.('');\n      onSelect?.(null);\n      inputRef.current?.focus();\n    }, [controlledValue, onInput, onSelect]);\n\n    // Handle focus\n    const handleFocus = useCallback(() => {\n      if (openOnFocus && !disabled) {\n        setIsActive(true);\n      }\n    }, [openOnFocus, disabled]);\n\n    // Handle blur (click outside)\n    useEffect(() => {\n      if (!isActive) return undefined;\n\n      const handleClickOutside = (e: MouseEvent) => {\n        if (!containerRef.current) return;\n\n        // Use composedPath() to correctly detect clicks inside Shadow DOM\n        const path = e.composedPath();\n        const isInside = path.includes(containerRef.current);\n\n        if (!isInside) {\n          if (selectOnClickOutside && highlightedIndex >= 0) {\n            handleSelect(filteredData[highlightedIndex]);\n          }\n          setIsActive(false);\n        }\n      };\n\n      document.addEventListener('mousedown', handleClickOutside);\n      return () =>\n        document.removeEventListener('mousedown', handleClickOutside);\n    }, [\n      isActive,\n      selectOnClickOutside,\n      highlightedIndex,\n      filteredData,\n      handleSelect,\n    ]);\n\n    // Notify active state change\n    useEffect(() => {\n      onActiveChange?.(isActive);\n    }, [isActive, onActiveChange]);\n\n    // Keep first highlighted\n    useEffect(() => {\n      if (keepFirst && isActive && filteredData.length > 0) {\n        setHighlightedIndex(0);\n      }\n    }, [keepFirst, isActive, filteredData.length, inputValue]);\n\n    // Handle keyboard navigation\n    const handleKeyDown = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (disabled) return;\n\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            if (!isActive) {\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 'Enter':\n            e.preventDefault();\n            if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n              handleSelect(filteredData[highlightedIndex]);\n            }\n            break;\n          case 'Escape':\n            e.preventDefault();\n            setIsActive(false);\n            setHighlightedIndex(-1);\n            break;\n          case 'Tab':\n            if (highlightedIndex >= 0 && filteredData[highlightedIndex]) {\n              handleSelect(filteredData[highlightedIndex]);\n            }\n            setIsActive(false);\n            break;\n        }\n      },\n      [disabled, isActive, highlightedIndex, filteredData, handleSelect]\n    );\n\n    // Handle dropdown scroll for infinite scroll\n    const handleDropdownScroll = useCallback(() => {\n      if (!checkInfiniteScroll || !dropdownRef.current) return;\n\n      const { scrollTop, scrollHeight, clientHeight } = dropdownRef.current;\n      if (scrollHeight - scrollTop - clientHeight <= infiniteScrollDistance) {\n        onInfiniteScroll?.();\n      }\n    }, [checkInfiniteScroll, infiniteScrollDistance, onInfiniteScroll]);\n\n    // Scroll highlighted item into view\n    useEffect(() => {\n      if (highlightedIndex >= 0 && dropdownRef.current) {\n        const highlightedEl = dropdownRef.current.querySelector(\n          `[data-index=\"${highlightedIndex}\"]`\n        );\n        if (\n          highlightedEl &&\n          typeof highlightedEl.scrollIntoView === 'function'\n        ) {\n          highlightedEl.scrollIntoView({ block: 'nearest' });\n        }\n      }\n    }, [highlightedIndex]);\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    // Generate classes\n    const autocompleteClasses = usePrefixedClassNames('autocomplete', {\n      'is-active': isActive,\n      [`is-${size}`]: !!size,\n    });\n\n    const inputClasses = usePrefixedClassNames('input', {\n      [`is-${color}`]: !!color,\n      [`is-${size}`]: !!size,\n      'is-loading': loading,\n    });\n\n    const controlClasses = usePrefixedClassNames(\n      'control',\n      'is-expanded',\n      'has-icons-right'\n    );\n\n    const dropdownMenuClasses = usePrefixedClassNames('dropdown-menu', {\n      'is-active': isActive && (filteredData.length > 0 || !!empty),\n    });\n\n    const dropdownContentClass = usePrefixedClassNames('dropdown-content');\n    const dropdownHeaderClass = usePrefixedClassNames('dropdown-header');\n    const dropdownFooterClass = usePrefixedClassNames('dropdown-footer');\n    const emptyItemClasses = usePrefixedClassNames(\n      'dropdown-item',\n      'has-text-grey'\n    );\n\n    const iconRightClickableClass = usePrefixedClassNames(\n      'icon',\n      'is-right',\n      'is-clickable'\n    );\n    const iconRightClass = usePrefixedClassNames('icon', 'is-right');\n    const loaderClass = usePrefixedClassNames('loader', 'is-loading');\n\n    const combinedClasses = classNames(\n      autocompleteClasses,\n      bulmaHelperClasses,\n      className\n    );\n\n    const helpClass = usePrefixedClassNames('help', {\n      [`is-${messageColor}`]: !!messageColor,\n    });\n    const messageEl = message ? <p className={helpClass}>{message}</p> : null;\n\n    // The clear button gives way to a spinner at its spot: the `loading` one,\n    // or that of a loading Control this sits in.\n    const controlLoading = useControlLoading();\n    const showClear =\n      clearable && !!inputValue && !disabled && !loading && !controlLoading;\n\n    // The combobox controls its listbox and points at the highlighted option.\n    // The listbox takes its name from the label that names the combobox, the\n    // one this renders or a surrounding Field's, so the two say the same\n    // thing. When no label names the combobox, or the one that does has no\n    // id to point at, the list keeps a fallback name.\n    const listOpen = isActive && (filteredData.length > 0 || !!empty);\n    const activeOptionId =\n      listOpen &&\n      highlightedIndex >= 0 &&\n      highlightedIndex < filteredData.length\n        ? `${listboxId}-${highlightedIndex}`\n        : undefined;\n\n    const autocompleteElement = (\n      <div ref={containerRef} className={combinedClasses} {...rest}>\n        <div className={controlClasses}>\n          <input\n            ref={combinedRef}\n            type=\"text\"\n            className={inputClasses}\n            id={controlId}\n            value={inputValue}\n            placeholder={placeholder}\n            disabled={disabled}\n            name={name}\n            form={form}\n            required={required}\n            onChange={handleInputChange}\n            onFocus={handleFocus}\n            onKeyDown={handleKeyDown}\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            autoComplete=\"off\"\n          />\n          {showClear && (\n            <button\n              type=\"button\"\n              className={iconRightClickableClass}\n              onClick={handleClear}\n              aria-label=\"Clear\"\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                width=\"16\"\n                height=\"16\"\n                aria-hidden=\"true\"\n              >\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          )}\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              className={dropdownContentClass}\n              style={{ maxHeight: `${maxHeight}px`, overflowY: 'auto' }}\n              id={listboxId}\n              role=\"listbox\"\n              aria-labelledby={listLabelId}\n              aria-label={listLabelId ? undefined : 'Suggestions'}\n              onScroll={handleDropdownScroll}\n            >\n              {header && <div className={dropdownHeaderClass}>{header}</div>}\n\n              {filteredData.length > 0 ? (\n                filteredData.map((item, index) => {\n                  const isDisabled = typeof item !== 'string' && item.disabled;\n                  const isHighlighted = index === highlightedIndex;\n\n                  const itemClasses = prefixedClassNames(\n                    classPrefix,\n                    'dropdown-item',\n                    {\n                      'is-active': isHighlighted,\n                      'is-disabled': isDisabled,\n                    }\n                  );\n\n                  return (\n                    <a\n                      key={index}\n                      id={`${listboxId}-${index}`}\n                      data-index={index}\n                      className={itemClasses}\n                      onClick={() => !isDisabled && handleSelect(item)}\n                      onMouseEnter={() =>\n                        !isDisabled && setHighlightedIndex(index)\n                      }\n                      role=\"option\"\n                      aria-selected={isHighlighted}\n                      aria-disabled={isDisabled}\n                    >\n                      {itemTemplate\n                        ? itemTemplate(item)\n                        : getDisplayValue(item)}\n                    </a>\n                  );\n                })\n              ) : (\n                <div className={emptyItemClasses}>{empty}</div>\n              )}\n\n              {footer && <div className={dropdownFooterClass}>{footer}</div>}\n            </div>\n          </div>\n        )}\n      </div>\n    );\n\n    if (!insideField) {\n      return (\n        <Field\n          label={label}\n          labelSize={labelSize}\n          labelProps={fieldLabelProps}\n          horizontal={horizontal}\n          className={fieldClassName}\n        >\n          {autocompleteElement}\n          {messageEl}\n        </Field>\n      );\n    }\n\n    return (\n      <>\n        {autocompleteElement}\n        {messageEl}\n      </>\n    );\n  }\n);\n\nAutocomplete.displayName = 'Autocomplete';\n\nexport default Autocomplete;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/esm/form/DateInputBase.js

@@ -12,6 +12,7 @@ import { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker.
 import { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry.js';
 import { supportsInputType } from './_pickerInternals/nativeInputSupport.js';
 import { useControlLoading } from './controlLoading.js';
+import { useFieldLabelId } from './FormContext.js';
 import { useIsHydrated } from '../helpers/useIsHydrated.js';
 import { Icon } from '../elements/Icon.js';
 
@@ -35,7 +36,13 @@ const SKIPPED_SEGMENTS = {
  * @returns {JSX.Element}
  */
 const DateInputBase = forwardRef((props, ref) => {
-    const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, granularity = 'day', format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = true, position = 'bottom-left', appendToBody = false, color, size, isRounded, shouldDisableDate, unselectableDates, firstDayOfWeek = 0, dayNames, monthNames, nearbyMonthDays = true, className, name, form, required, id, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon: triggerIconProp, triggerIconName = 'chevron-down', labels, ...rest } = props;
+    const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, granularity = 'day', format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = true, position = 'bottom-left', appendToBody = false, color, size, isRounded, shouldDisableDate, unselectableDates, firstDayOfWeek = 0, dayNames, monthNames, nearbyMonthDays = true, className, name, form, required, id: idProp, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon: triggerIconProp, triggerIconName = 'chevron-down', labels, ...rest } = props;
+    // Inside a labeled Field the input takes the id the label points at
+    // when the caller set none, as InputBase does, and the popover's ids
+    // follow it. Inline there is no input to name, so nothing takes the
+    // Field's id or builds on it.
+    const fieldLabelId = useFieldLabelId();
+    const id = idProp ?? (inline ? undefined : fieldLabelId);
     // The launcher gives way to the loading spinner of a Control this sits in.
     const controlLoading = useControlLoading();
     const triggerIcon = triggerIconProp ?? !controlLoading;

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

@@ -1 +1 @@
-{"version":3,"file":"DateInputBase.js","sources":["../../../src/form/DateInputBase.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport {\n  PickerPosition,\n  DayOfWeek,\n  DateGranularity,\n  PickerLabels,\n  mergeLabels,\n} from './_pickerInternals/pickerTypes';\nimport {\n  formatDate,\n  parseDate,\n  DateFormatOption,\n  DEFAULT_DATE_FORMAT,\n  DEFAULT_MONTH_FORMAT,\n  DEFAULT_YEAR_FORMAT,\n  fromIsoValue,\n  toIsoValue,\n} from './_pickerInternals/formatters';\nimport {\n  isWithin,\n  clampDate,\n  floorMin,\n  isSameDay,\n  isPeriodUnselectable,\n  startOfDay,\n  startOfPeriod,\n  endOfPeriod,\n} from './_pickerInternals/dateUtils';\nimport { Calendar, CALENDAR_FOCUSED_CELL } from './_pickerInternals/Calendar';\nimport { PickerPopover } from './_pickerInternals/PickerPopover';\nimport { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker';\nimport { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry';\nimport { supportsInputType } from './_pickerInternals/nativeInputSupport';\nimport type { SegmentKind } from './_pickerInternals/segmentMap';\nimport { useControlLoading } from './controlLoading';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { Icon } from '../elements/Icon';\n\nconst DEFAULT_FORMATS: Record<DateGranularity, string> = {\n  day: DEFAULT_DATE_FORMAT,\n  month: DEFAULT_MONTH_FORMAT,\n  year: DEFAULT_YEAR_FORMAT,\n};\n\n// Segments finer than the granularity render but are never edited.\nconst SKIPPED_SEGMENTS: Record<\n  DateGranularity,\n  readonly SegmentKind[] | undefined\n> = {\n  day: undefined,\n  month: ['day'],\n  year: ['month', 'day'],\n};\n\n/**\n * Props for the raw DateInput base. Use the higher-level `DateInput` for\n * Field/Control composition; `DateInputBase` is the input + popover only.\n */\nexport interface DateInputBaseProps\n  extends\n    Omit<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'size'\n      | 'color'\n      | 'min'\n      | 'max'\n      | 'type'\n      | 'popover'\n    >,\n    Omit<BulmaClassesProps, 'color'> {\n  /** Controlled selected date. */\n  value?: Date | null;\n  /** Initial date for uncontrolled usage. */\n  defaultValue?: Date | null;\n  /**\n   * Fired when the value changes. A day picked in the calendar, by click or\n   * by key, arrives at local midnight.\n   */\n  onChange?: (d: Date | null) => void;\n  /** Fired when the popover opens. */\n  onOpen?: () => void;\n  /** Fired when the popover closes. */\n  onClose?: () => void;\n  /**\n   * Earliest selectable date. A `min` before year 1 is raised to 1 January of\n   * year 1, where the range starts without one too: HTML's date and month\n   * inputs hold no earlier year, so the calendar and typing stop there.\n   */\n  min?: Date;\n  /** Latest selectable date. */\n  max?: Date;\n  /** Disable the input. */\n  disabled?: boolean;\n  /** Make the input read-only. */\n  readOnly?: boolean;\n  /** Placeholder text for the input. */\n  placeholder?: string;\n  /**\n   * What the calendar shows and what a selection means: `'day'` shows the\n   * day grid, `'month'` a grid of the focused year's months whose header\n   * steps a year at a time, and `'year'` the year list. A month or year value\n   * is the first day of that period at local midnight, so `onChange` gets\n   * `new Date(2026, 5, 1)` for June 2026. A `value` elsewhere in the period\n   * shows as that period and stays as given until the user picks a period or\n   * types a different one. `min`, `max`,\n   * `shouldDisableDate` and `unselectableDates` judge whole periods: a month\n   * or year can be picked while any day in it can, so a `min` of 15 June\n   * still allows June, and June commits as 1 June, earlier than that `min`.\n   * The default `format` follows the granularity (`'YYYY-MM'`, `'YYYY'`); a\n   * custom `format` with finer tokens still renders them, but typing skips\n   * them. `firstDayOfWeek`, `dayNames` and `nearbyMonthDays` only affect the\n   * day grid, and an `inline` calendar's hidden form value is `YYYY-MM` or\n   * `YYYY`. The `labels` keys `chooseMonth` / `chooseYear` name the launcher\n   * and popover, and `prevYear` / `nextYear` the month grid's header buttons.\n   * @defaultValue 'day'\n   */\n  granularity?: DateGranularity;\n  /**\n   * Token format string or `Intl.DateTimeFormat` options. Defaults to\n   * `'YYYY-MM-DD'`, or to `'YYYY-MM'` / `'YYYY'` when `granularity` is\n   * `'month'` / `'year'`.\n   * @defaultValue 'YYYY-MM-DD'\n   */\n  format?: DateFormatOption;\n  /**\n   * Custom parser (use when `format` is `Intl.DateTimeFormatOptions`).\n   * Enter and leaving the field call it only if the user changed the text,\n   * so focus passing through commits nothing and the value keeps what the\n   * format leaves out, such as the time of day.\n   */\n  parse?: (s: string) => Date | null;\n  /** BCP-47 locale tag for day/month names and Intl formatting. */\n  locale?: string;\n  /** Render the calendar inline (no popover). */\n  inline?: boolean;\n  /**\n   * Use `<input type=\"date\">` on coarse-pointer + small-viewport devices. At\n   * `'month'` granularity it uses `<input type=\"month\">` where the browser\n   * implements one, as Chromium browsers, Safari on iOS and Firefox for\n   * Android do, and the calendar where it doesn't, as in desktop Firefox.\n   * Desktop Safari accepts the type but draws no month control, so forcing\n   * `true` there shows a plain text box. HTML has no year input, so `'year'`\n   * granularity always renders the calendar.\n   */\n  mobileNative?: boolean | 'auto';\n  /** Allow segmented keyboard typing in the input (type the date directly, auto-advancing across segments). `false` makes the field picker-only. */\n  editable?: boolean;\n  /** Whether the calendar popover exists. `false` makes the field input-only (segmented typing, no popover). */\n  popover?: boolean;\n  /**\n   * Open the popover when the input is focused. Focus that a closing popover\n   * hands back to the input leaves it closed. Dismissing it commits nothing:\n   * an empty field stays empty, and leaving afterwards commits only what was\n   * typed since. With it off, the launcher or Alt+ArrowDown opens it.\n   */\n  openOnFocus?: boolean;\n  /** Close the popover after a date is selected. */\n  closeOnSelect?: boolean;\n  /** Popover anchor position relative to the input. */\n  position?: PickerPosition;\n  /** Render the popover into `document.body` via portal. */\n  appendToBody?: boolean;\n  /**\n   * Bulma color modifier for the input, also carried by the calendar, where it\n   * colors the selected date. Today's date and the keyboard focus ring take\n   * the color's `-on-scheme` variant, which Bulma adjusts to contrast with the\n   * background, so pale colors stay readable. Unset, the calendar uses its\n   * `--bulma-dateinput-*` variables, which follow `primary` the same way by\n   * default.\n   */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Render the input with rounded corners. */\n  isRounded?: boolean;\n  /** Predicate to disable specific dates (e.g. weekends). Blocked dates are also rejected during manual typing. */\n  shouldDisableDate?: (d: Date) => boolean;\n  /** Convenience array of disabled dates; merged with `shouldDisableDate`. Matched by calendar day and also rejected during manual typing. */\n  unselectableDates?: Date[];\n  /** Day the week starts on (0 = Sunday). */\n  firstDayOfWeek?: DayOfWeek;\n  /** Override the 7 day-name labels (in calendar order, post-rotation). */\n  dayNames?: string[];\n  /** Override the 12 month-name labels. */\n  monthNames?: string[];\n  /** Show dimmed dates from adjacent months in the grid. */\n  nearbyMonthDays?: boolean;\n  /** Decorative left icon glyph for the wrapping `Control` (shown by default). Set `''` to hide. */\n  iconLeftName?: string;\n  /**\n   * Show a clickable launcher button on the right that toggles the popover.\n   * Hidden by default while a `Control` it sits in shows its `isLoading`\n   * spinner, which shares that right edge.\n   * @defaultValue true\n   */\n  triggerIcon?: boolean;\n  /** Glyph for the right launcher button. */\n  triggerIconName?: string;\n  /** Optional translatable string overrides (ARIA labels, button text). */\n  labels?: PickerLabels;\n}\n\n/**\n * Raw DateInput — input + popover calendar without Field/Control wrapping.\n * Use `DateInput` for the convenience wrapper.\n *\n * @function\n * @param {DateInputBaseProps} props\n * @returns {JSX.Element}\n */\nexport const DateInputBase = forwardRef<HTMLInputElement, DateInputBaseProps>(\n  (props, ref) => {\n    const {\n      value: controlledValue,\n      defaultValue,\n      onChange,\n      onOpen,\n      onClose,\n      min,\n      max,\n      disabled,\n      readOnly,\n      placeholder,\n      granularity = 'day',\n      format,\n      parse,\n      locale,\n      inline = false,\n      mobileNative = 'auto',\n      editable = true,\n      popover = true,\n      openOnFocus = true,\n      closeOnSelect = true,\n      position = 'bottom-left',\n      appendToBody = false,\n      color,\n      size,\n      isRounded,\n      shouldDisableDate,\n      unselectableDates,\n      firstDayOfWeek = 0,\n      dayNames,\n      monthNames,\n      nearbyMonthDays = true,\n      className,\n      name,\n      form,\n      required,\n      id,\n      onFocus,\n      onClick,\n      onKeyDown,\n      onBlur,\n      iconLeftName: _iconLeftName,\n      triggerIcon: triggerIconProp,\n      triggerIconName = 'chevron-down',\n      labels,\n      ...rest\n    } = props;\n    // The launcher gives way to the loading spinner of a Control this sits in.\n    const controlLoading = useControlLoading();\n    const triggerIcon = triggerIconProp ?? !controlLoading;\n\n    const t = mergeLabels(labels);\n    const isDayGranularity = granularity === 'day';\n    const resolvedFormat = format ?? DEFAULT_FORMATS[granularity];\n\n    const isControlled = controlledValue !== undefined;\n    const [internalValue, setInternalValue] = useState<Date | null>(\n      defaultValue ?? null\n    );\n    const value = isControlled ? (controlledValue ?? null) : internalValue;\n\n    // Nothing before year 1 is in range, as in HTML's date inputs.\n    const lowerBound = useMemo(() => floorMin(min), [min]);\n\n    const initialFocused = useMemo(\n      () => clampDate(value ?? new Date(), lowerBound, max),\n      // intentionally only on mount: keep focusedDate stable until value/open change\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      []\n    );\n    const [focusedDate, setFocusedDate] = useState<Date>(initialFocused);\n    // Re-clamp focusedDate if min/max change after mount so the focused cell\n    // never disappears outside the displayable range.\n    useEffect(() => {\n      setFocusedDate(prev => clampDate(prev, lowerBound, max));\n    }, [lowerBound, max]);\n    const [open, setOpenState] = useState(false);\n    const [text, setText] = useState<string>(\n      value ? formatDate(value, resolvedFormat, locale) : ''\n    );\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const reactId = useId();\n    const popoverId = id ? `${id}-popover` : `picker-${reactId}`;\n\n    const { bulmaHelperClasses, rest: cleanRest } = useBulmaClasses(rest);\n\n    const { shouldUseNative } = useNativeMobilePicker({\n      force: mobileNative === 'auto' ? undefined : mobileNative,\n    });\n    // The day picker goes native as it always has. A month picker does only\n    // where the browser implements the month input, asked after hydration so\n    // the server and the first client render agree. HTML has no year input,\n    // so a year picker always renders the calendar.\n    const hydrated = useIsHydrated();\n    const hasNativeInput =\n      isDayGranularity ||\n      (granularity === 'month' && hydrated && supportsInputType('month'));\n    const useNative = !inline && shouldUseNative && hasNativeInput;\n\n    const inputClass = usePrefixedClassNames('input', {\n      [`is-${color}`]: !!color,\n      [`is-${size}`]: !!size,\n      'is-rounded': isRounded,\n    });\n    const containerClass = usePrefixedClassNames('dateinput-container');\n    const triggerClass = usePrefixedClassNames('dateinput-trigger');\n\n    // What the latest request asked for, so a second request in the same\n    // event sees it before React renders. The callbacks fire here rather than\n    // in a state updater, which StrictMode calls twice, and after the state\n    // is set, so a request a callback makes is the one that lands last.\n    const requestedOpenRef = useRef(false);\n    const setOpen = useCallback(\n      (next: boolean) => {\n        if (requestedOpenRef.current === next) return;\n        requestedOpenRef.current = next;\n        setOpenState(next);\n        if (next) onOpen?.();\n        else onClose?.();\n      },\n      [onOpen, onClose]\n    );\n\n    // Sync displayed text with value when value changes externally.\n    useEffect(() => {\n      setText(value ? formatDate(value, resolvedFormat, locale) : '');\n    }, [value, resolvedFormat, locale]);\n\n    const commitValue = useCallback(\n      (next: Date | null) => {\n        // A month or year value is its period's first day, however the\n        // calendar, typing or parsing arrived at it.\n        const committed =\n          next && !isDayGranularity ? startOfPeriod(next, granularity) : next;\n        if (!isControlled) setInternalValue(committed);\n        // Keep the calendar's focused cell tracking typed / parsed values.\n        if (committed) setFocusedDate(committed);\n        onChange?.(committed);\n      },\n      [isControlled, onChange, isDayGranularity, granularity]\n    );\n\n    // At month or year granularity the bounds widen to the periods holding\n    // them, so the month or year containing `min` stays reachable.\n    const periodMin = useMemo(\n      () =>\n        isDayGranularity ? lowerBound : startOfPeriod(lowerBound, granularity),\n      [lowerBound, isDayGranularity, granularity]\n    );\n    const periodMax = useMemo(\n      () => (max && !isDayGranularity ? endOfPeriod(max, granularity) : max),\n      [max, isDayGranularity, granularity]\n    );\n\n    // A pick is the day at midnight, as a click on its cell gives. Enter hands\n    // over the focused date, which can carry a time of day from the clock, a\n    // value or a bound, so its time is dropped here.\n    const handleSelect = useCallback(\n      (picked: Date) => {\n        const d = startOfDay(picked);\n        if (!isWithin(d, periodMin, periodMax)) return;\n        commitValue(d);\n        setFocusedDate(d);\n        if (closeOnSelect) setOpen(false);\n      },\n      [periodMin, periodMax, commitValue, closeOnSelect, setOpen]\n    );\n\n    const tryParse = useCallback(\n      (s: string): Date | null => {\n        const trimmed = s.trim();\n        if (!trimmed) return null;\n        const fmt = typeof format === 'string' ? format : undefined;\n        return parse\n          ? parse(trimmed)\n          : parseDate(trimmed, fmt ?? DEFAULT_FORMATS[granularity], locale);\n      },\n      [parse, format, locale, granularity]\n    );\n\n    // The Date the user edits when starting without a current value (today at\n    // midnight, or the start of this month or year; the hook clamps to\n    // min/max on commit).\n    const makeBaseDate = useCallback((): Date => {\n      const d = new Date();\n      d.setHours(0, 0, 0, 0);\n      return isDayGranularity ? d : startOfPeriod(d, granularity);\n    }, [isDayGranularity, granularity]);\n\n    const inputReadOnlyAttr = !!readOnly || !editable;\n    const canOpen = !!popover && !disabled && !readOnly;\n\n    // Blocking predicate for manual entry, matching the calendar's\n    // disabled-cell logic (shouldDisableDate + unselectableDates by day, or\n    // every day of the month or year blocked at those granularities).\n    const isBlocked = useMemo(() => {\n      if (!isDayGranularity) {\n        const constraints = { min, max, shouldDisableDate, unselectableDates };\n        return (d: Date) => isPeriodUnselectable(d, granularity, constraints);\n      }\n      if (!shouldDisableDate && !unselectableDates?.length) return undefined;\n      return (d: Date) =>\n        !!shouldDisableDate?.(d) ||\n        !!unselectableDates?.some(u => isSameDay(u, d));\n    }, [\n      isDayGranularity,\n      granularity,\n      min,\n      max,\n      shouldDisableDate,\n      unselectableDates,\n    ]);\n\n    // Typing, and the re-parse on blur or Enter, that lands in the period the\n    // value already holds commits nothing, so a `value` elsewhere in its month\n    // or year changes only when the user picks or types a different period.\n    const commitTyped = useCallback(\n      (next: Date | null) => {\n        if (\n          next &&\n          value &&\n          !isDayGranularity &&\n          startOfPeriod(next, granularity).getTime() ===\n            startOfPeriod(value, granularity).getTime()\n        ) {\n          setText(formatDate(value, resolvedFormat, locale));\n          return;\n        }\n        commitValue(next);\n      },\n      [\n        value,\n        isDayGranularity,\n        granularity,\n        resolvedFormat,\n        locale,\n        commitValue,\n      ]\n    );\n\n    const { inputHandlers } = useSegmentedEntry({\n      format: resolvedFormat,\n      skipKinds: SKIPPED_SEGMENTS[granularity],\n      value,\n      commitValue: commitTyped,\n      formatFn: formatDate,\n      tryParse,\n      text,\n      setText,\n      makeBaseDate,\n      locale,\n      min: periodMin,\n      max: periodMax,\n      isBlocked,\n      disabled,\n      readOnly,\n      editable,\n      popover,\n      openOnFocus,\n      closeOnSelect,\n      isOpen: open,\n      setOpen,\n      inputRef,\n      containerRef,\n      onFocus,\n      onClick,\n      onKeyDown,\n      onBlur,\n    });\n\n    const handlePopoverClose = useCallback(() => setOpen(false), [setOpen]);\n\n    const combinedRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        (inputRef as React.MutableRefObject<HTMLInputElement | null>).current =\n          node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref)\n          (ref as React.MutableRefObject<HTMLInputElement | null>).current =\n            node;\n      },\n      [ref]\n    );\n\n    // Native mobile path renders <input type=\"date\"> (type=\"month\" for a\n    // month picker).\n    if (useNative) {\n      return (\n        <input\n          {...cleanRest}\n          ref={combinedRef}\n          type={isDayGranularity ? 'date' : 'month'}\n          className={classNames(inputClass, bulmaHelperClasses, className)}\n          value={value ? toIsoValue(value, granularity) : ''}\n          onChange={e => {\n            const parsed = e.target.value\n              ? fromIsoValue(e.target.value, granularity)\n              : null;\n            commitValue(parsed);\n          }}\n          min={min ? toIsoValue(lowerBound, granularity) : undefined}\n          max={max ? toIsoValue(max, granularity) : undefined}\n          disabled={disabled}\n          readOnly={readOnly}\n          placeholder={placeholder}\n          name={name}\n          form={form}\n          required={required}\n          id={id}\n        />\n      );\n    }\n\n    const chooseLabel =\n      granularity === 'month'\n        ? t.chooseMonth\n        : granularity === 'year'\n          ? t.chooseYear\n          : t.chooseDate;\n\n    const calendar = (\n      <Calendar\n        // A new granularity starts the calendar over on its own view.\n        key={granularity}\n        granularity={granularity}\n        value={value}\n        focusedDate={focusedDate}\n        onSelect={handleSelect}\n        onFocusedDateChange={setFocusedDate}\n        min={min}\n        max={max}\n        shouldDisableDate={shouldDisableDate}\n        unselectableDates={unselectableDates}\n        firstDayOfWeek={firstDayOfWeek}\n        locale={locale}\n        dayNames={dayNames}\n        monthNames={monthNames}\n        nearbyMonthDays={nearbyMonthDays}\n        color={color}\n        size={size}\n        // The popover panel takes `popoverId`, so the calendar inside it\n        // takes one of its own. Inline there is no panel, and the calendar\n        // keeps the id it released with.\n        id={inline ? popoverId : `${popoverId}-cal`}\n        autoFocusCell={open}\n        labels={labels}\n      />\n    );\n\n    if (inline) {\n      return (\n        <div\n          {...cleanRest}\n          ref={containerRef}\n          className={classNames(containerClass, bulmaHelperClasses, className)}\n        >\n          {calendar}\n          {name && (\n            <input\n              type=\"hidden\"\n              name={name}\n              form={form}\n              value={value ? toIsoValue(value, granularity) : ''}\n              required={required}\n            />\n          )}\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={containerRef}\n        className={classNames(containerClass, bulmaHelperClasses, className)}\n        {...cleanRest}\n      >\n        <input\n          ref={combinedRef}\n          type=\"text\"\n          role=\"combobox\"\n          aria-haspopup=\"dialog\"\n          aria-expanded={open}\n          aria-controls={popoverId}\n          autoComplete=\"off\"\n          className={inputClass}\n          value={text}\n          placeholder={placeholder}\n          disabled={disabled}\n          readOnly={inputReadOnlyAttr}\n          name={name}\n          form={form}\n          required={required}\n          id={id}\n          {...inputHandlers}\n        />\n        {popover && triggerIcon && (\n          <button\n            type=\"button\"\n            className={triggerClass}\n            onClick={() => {\n              if (canOpen) setOpen(!open);\n            }}\n            disabled={!canOpen}\n            aria-label={chooseLabel}\n            aria-haspopup=\"dialog\"\n            aria-controls={popoverId}\n            aria-expanded={open}\n            tabIndex={canOpen ? 0 : -1}\n          >\n            <Icon name={triggerIconName} size={size} />\n          </button>\n        )}\n        {popover && (\n          <PickerPopover\n            isOpen={open}\n            onClose={handlePopoverClose}\n            anchorRef={containerRef}\n            position={position}\n            appendToBody={appendToBody}\n            ariaLabel={chooseLabel}\n            id={popoverId}\n            restoreFocusRef={inputRef}\n            initialFocusSelector={CALENDAR_FOCUSED_CELL}\n          >\n            {calendar}\n          </PickerPopover>\n        )}\n      </div>\n    );\n  }\n);\n\nDateInputBase.displayName = 'DateInputBase';\n\nexport default DateInputBase;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"DateInputBase.js","sources":["../../../src/form/DateInputBase.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport {\n  PickerPosition,\n  DayOfWeek,\n  DateGranularity,\n  PickerLabels,\n  mergeLabels,\n} from './_pickerInternals/pickerTypes';\nimport {\n  formatDate,\n  parseDate,\n  DateFormatOption,\n  DEFAULT_DATE_FORMAT,\n  DEFAULT_MONTH_FORMAT,\n  DEFAULT_YEAR_FORMAT,\n  fromIsoValue,\n  toIsoValue,\n} from './_pickerInternals/formatters';\nimport {\n  isWithin,\n  clampDate,\n  floorMin,\n  isSameDay,\n  isPeriodUnselectable,\n  startOfDay,\n  startOfPeriod,\n  endOfPeriod,\n} from './_pickerInternals/dateUtils';\nimport { Calendar, CALENDAR_FOCUSED_CELL } from './_pickerInternals/Calendar';\nimport { PickerPopover } from './_pickerInternals/PickerPopover';\nimport { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker';\nimport { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry';\nimport { supportsInputType } from './_pickerInternals/nativeInputSupport';\nimport type { SegmentKind } from './_pickerInternals/segmentMap';\nimport { useControlLoading } from './controlLoading';\nimport { useFieldLabelId } from './FormContext';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { Icon } from '../elements/Icon';\n\nconst DEFAULT_FORMATS: Record<DateGranularity, string> = {\n  day: DEFAULT_DATE_FORMAT,\n  month: DEFAULT_MONTH_FORMAT,\n  year: DEFAULT_YEAR_FORMAT,\n};\n\n// Segments finer than the granularity render but are never edited.\nconst SKIPPED_SEGMENTS: Record<\n  DateGranularity,\n  readonly SegmentKind[] | undefined\n> = {\n  day: undefined,\n  month: ['day'],\n  year: ['month', 'day'],\n};\n\n/**\n * Props for the raw DateInput base. Use the higher-level `DateInput` for\n * Field/Control composition; `DateInputBase` is the input + popover only.\n */\nexport interface DateInputBaseProps\n  extends\n    Omit<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'size'\n      | 'color'\n      | 'min'\n      | 'max'\n      | 'type'\n      | 'popover'\n    >,\n    Omit<BulmaClassesProps, 'color'> {\n  /** Controlled selected date. */\n  value?: Date | null;\n  /** Initial date for uncontrolled usage. */\n  defaultValue?: Date | null;\n  /**\n   * Fired when the value changes. A day picked in the calendar, by click or\n   * by key, arrives at local midnight.\n   */\n  onChange?: (d: Date | null) => void;\n  /** Fired when the popover opens. */\n  onOpen?: () => void;\n  /** Fired when the popover closes. */\n  onClose?: () => void;\n  /**\n   * Earliest selectable date. A `min` before year 1 is raised to 1 January of\n   * year 1, where the range starts without one too: HTML's date and month\n   * inputs hold no earlier year, so the calendar and typing stop there.\n   */\n  min?: Date;\n  /** Latest selectable date. */\n  max?: Date;\n  /** Disable the input. */\n  disabled?: boolean;\n  /** Make the input read-only. */\n  readOnly?: boolean;\n  /** Placeholder text for the input. */\n  placeholder?: string;\n  /**\n   * What the calendar shows and what a selection means: `'day'` shows the\n   * day grid, `'month'` a grid of the focused year's months whose header\n   * steps a year at a time, and `'year'` the year list. A month or year value\n   * is the first day of that period at local midnight, so `onChange` gets\n   * `new Date(2026, 5, 1)` for June 2026. A `value` elsewhere in the period\n   * shows as that period and stays as given until the user picks a period or\n   * types a different one. `min`, `max`,\n   * `shouldDisableDate` and `unselectableDates` judge whole periods: a month\n   * or year can be picked while any day in it can, so a `min` of 15 June\n   * still allows June, and June commits as 1 June, earlier than that `min`.\n   * The default `format` follows the granularity (`'YYYY-MM'`, `'YYYY'`); a\n   * custom `format` with finer tokens still renders them, but typing skips\n   * them. `firstDayOfWeek`, `dayNames` and `nearbyMonthDays` only affect the\n   * day grid, and an `inline` calendar's hidden form value is `YYYY-MM` or\n   * `YYYY`. The `labels` keys `chooseMonth` / `chooseYear` name the launcher\n   * and popover, and `prevYear` / `nextYear` the month grid's header buttons.\n   * @defaultValue 'day'\n   */\n  granularity?: DateGranularity;\n  /**\n   * Token format string or `Intl.DateTimeFormat` options. Defaults to\n   * `'YYYY-MM-DD'`, or to `'YYYY-MM'` / `'YYYY'` when `granularity` is\n   * `'month'` / `'year'`.\n   * @defaultValue 'YYYY-MM-DD'\n   */\n  format?: DateFormatOption;\n  /**\n   * Custom parser (use when `format` is `Intl.DateTimeFormatOptions`).\n   * Enter and leaving the field call it only if the user changed the text,\n   * so focus passing through commits nothing and the value keeps what the\n   * format leaves out, such as the time of day.\n   */\n  parse?: (s: string) => Date | null;\n  /** BCP-47 locale tag for day/month names and Intl formatting. */\n  locale?: string;\n  /** Render the calendar inline (no popover). */\n  inline?: boolean;\n  /**\n   * Use `<input type=\"date\">` on coarse-pointer + small-viewport devices. At\n   * `'month'` granularity it uses `<input type=\"month\">` where the browser\n   * implements one, as Chromium browsers, Safari on iOS and Firefox for\n   * Android do, and the calendar where it doesn't, as in desktop Firefox.\n   * Desktop Safari accepts the type but draws no month control, so forcing\n   * `true` there shows a plain text box. HTML has no year input, so `'year'`\n   * granularity always renders the calendar.\n   */\n  mobileNative?: boolean | 'auto';\n  /** Allow segmented keyboard typing in the input (type the date directly, auto-advancing across segments). `false` makes the field picker-only. */\n  editable?: boolean;\n  /** Whether the calendar popover exists. `false` makes the field input-only (segmented typing, no popover). */\n  popover?: boolean;\n  /**\n   * Open the popover when the input is focused. Focus that a closing popover\n   * hands back to the input leaves it closed. Dismissing it commits nothing:\n   * an empty field stays empty, and leaving afterwards commits only what was\n   * typed since. With it off, the launcher or Alt+ArrowDown opens it.\n   */\n  openOnFocus?: boolean;\n  /** Close the popover after a date is selected. */\n  closeOnSelect?: boolean;\n  /** Popover anchor position relative to the input. */\n  position?: PickerPosition;\n  /** Render the popover into `document.body` via portal. */\n  appendToBody?: boolean;\n  /**\n   * Bulma color modifier for the input, also carried by the calendar, where it\n   * colors the selected date. Today's date and the keyboard focus ring take\n   * the color's `-on-scheme` variant, which Bulma adjusts to contrast with the\n   * background, so pale colors stay readable. Unset, the calendar uses its\n   * `--bulma-dateinput-*` variables, which follow `primary` the same way by\n   * default.\n   */\n  color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n  /** Size variant. */\n  size?: 'small' | 'medium' | 'large';\n  /** Render the input with rounded corners. */\n  isRounded?: boolean;\n  /** Predicate to disable specific dates (e.g. weekends). Blocked dates are also rejected during manual typing. */\n  shouldDisableDate?: (d: Date) => boolean;\n  /** Convenience array of disabled dates; merged with `shouldDisableDate`. Matched by calendar day and also rejected during manual typing. */\n  unselectableDates?: Date[];\n  /** Day the week starts on (0 = Sunday). */\n  firstDayOfWeek?: DayOfWeek;\n  /** Override the 7 day-name labels (in calendar order, post-rotation). */\n  dayNames?: string[];\n  /** Override the 12 month-name labels. */\n  monthNames?: string[];\n  /** Show dimmed dates from adjacent months in the grid. */\n  nearbyMonthDays?: boolean;\n  /** Decorative left icon glyph for the wrapping `Control` (shown by default). Set `''` to hide. */\n  iconLeftName?: string;\n  /**\n   * Show a clickable launcher button on the right that toggles the popover.\n   * Hidden by default while a `Control` it sits in shows its `isLoading`\n   * spinner, which shares that right edge.\n   * @defaultValue true\n   */\n  triggerIcon?: boolean;\n  /** Glyph for the right launcher button. */\n  triggerIconName?: string;\n  /** Optional translatable string overrides (ARIA labels, button text). */\n  labels?: PickerLabels;\n}\n\n/**\n * Raw DateInput — input + popover calendar without Field/Control wrapping.\n * Use `DateInput` for the convenience wrapper.\n *\n * @function\n * @param {DateInputBaseProps} props\n * @returns {JSX.Element}\n */\nexport const DateInputBase = forwardRef<HTMLInputElement, DateInputBaseProps>(\n  (props, ref) => {\n    const {\n      value: controlledValue,\n      defaultValue,\n      onChange,\n      onOpen,\n      onClose,\n      min,\n      max,\n      disabled,\n      readOnly,\n      placeholder,\n      granularity = 'day',\n      format,\n      parse,\n      locale,\n      inline = false,\n      mobileNative = 'auto',\n      editable = true,\n      popover = true,\n      openOnFocus = true,\n      closeOnSelect = true,\n      position = 'bottom-left',\n      appendToBody = false,\n      color,\n      size,\n      isRounded,\n      shouldDisableDate,\n      unselectableDates,\n      firstDayOfWeek = 0,\n      dayNames,\n      monthNames,\n      nearbyMonthDays = true,\n      className,\n      name,\n      form,\n      required,\n      id: idProp,\n      onFocus,\n      onClick,\n      onKeyDown,\n      onBlur,\n      iconLeftName: _iconLeftName,\n      triggerIcon: triggerIconProp,\n      triggerIconName = 'chevron-down',\n      labels,\n      ...rest\n    } = props;\n    // Inside a labeled Field the input takes the id the label points at\n    // when the caller set none, as InputBase does, and the popover's ids\n    // follow it. Inline there is no input to name, so nothing takes the\n    // Field's id or builds on it.\n    const fieldLabelId = useFieldLabelId();\n    const id = idProp ?? (inline ? undefined : fieldLabelId);\n    // The launcher gives way to the loading spinner of a Control this sits in.\n    const controlLoading = useControlLoading();\n    const triggerIcon = triggerIconProp ?? !controlLoading;\n\n    const t = mergeLabels(labels);\n    const isDayGranularity = granularity === 'day';\n    const resolvedFormat = format ?? DEFAULT_FORMATS[granularity];\n\n    const isControlled = controlledValue !== undefined;\n    const [internalValue, setInternalValue] = useState<Date | null>(\n      defaultValue ?? null\n    );\n    const value = isControlled ? (controlledValue ?? null) : internalValue;\n\n    // Nothing before year 1 is in range, as in HTML's date inputs.\n    const lowerBound = useMemo(() => floorMin(min), [min]);\n\n    const initialFocused = useMemo(\n      () => clampDate(value ?? new Date(), lowerBound, max),\n      // intentionally only on mount: keep focusedDate stable until value/open change\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      []\n    );\n    const [focusedDate, setFocusedDate] = useState<Date>(initialFocused);\n    // Re-clamp focusedDate if min/max change after mount so the focused cell\n    // never disappears outside the displayable range.\n    useEffect(() => {\n      setFocusedDate(prev => clampDate(prev, lowerBound, max));\n    }, [lowerBound, max]);\n    const [open, setOpenState] = useState(false);\n    const [text, setText] = useState<string>(\n      value ? formatDate(value, resolvedFormat, locale) : ''\n    );\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const reactId = useId();\n    const popoverId = id ? `${id}-popover` : `picker-${reactId}`;\n\n    const { bulmaHelperClasses, rest: cleanRest } = useBulmaClasses(rest);\n\n    const { shouldUseNative } = useNativeMobilePicker({\n      force: mobileNative === 'auto' ? undefined : mobileNative,\n    });\n    // The day picker goes native as it always has. A month picker does only\n    // where the browser implements the month input, asked after hydration so\n    // the server and the first client render agree. HTML has no year input,\n    // so a year picker always renders the calendar.\n    const hydrated = useIsHydrated();\n    const hasNativeInput =\n      isDayGranularity ||\n      (granularity === 'month' && hydrated && supportsInputType('month'));\n    const useNative = !inline && shouldUseNative && hasNativeInput;\n\n    const inputClass = usePrefixedClassNames('input', {\n      [`is-${color}`]: !!color,\n      [`is-${size}`]: !!size,\n      'is-rounded': isRounded,\n    });\n    const containerClass = usePrefixedClassNames('dateinput-container');\n    const triggerClass = usePrefixedClassNames('dateinput-trigger');\n\n    // What the latest request asked for, so a second request in the same\n    // event sees it before React renders. The callbacks fire here rather than\n    // in a state updater, which StrictMode calls twice, and after the state\n    // is set, so a request a callback makes is the one that lands last.\n    const requestedOpenRef = useRef(false);\n    const setOpen = useCallback(\n      (next: boolean) => {\n        if (requestedOpenRef.current === next) return;\n        requestedOpenRef.current = next;\n        setOpenState(next);\n        if (next) onOpen?.();\n        else onClose?.();\n      },\n      [onOpen, onClose]\n    );\n\n    // Sync displayed text with value when value changes externally.\n    useEffect(() => {\n      setText(value ? formatDate(value, resolvedFormat, locale) : '');\n    }, [value, resolvedFormat, locale]);\n\n    const commitValue = useCallback(\n      (next: Date | null) => {\n        // A month or year value is its period's first day, however the\n        // calendar, typing or parsing arrived at it.\n        const committed =\n          next && !isDayGranularity ? startOfPeriod(next, granularity) : next;\n        if (!isControlled) setInternalValue(committed);\n        // Keep the calendar's focused cell tracking typed / parsed values.\n        if (committed) setFocusedDate(committed);\n        onChange?.(committed);\n      },\n      [isControlled, onChange, isDayGranularity, granularity]\n    );\n\n    // At month or year granularity the bounds widen to the periods holding\n    // them, so the month or year containing `min` stays reachable.\n    const periodMin = useMemo(\n      () =>\n        isDayGranularity ? lowerBound : startOfPeriod(lowerBound, granularity),\n      [lowerBound, isDayGranularity, granularity]\n    );\n    const periodMax = useMemo(\n      () => (max && !isDayGranularity ? endOfPeriod(max, granularity) : max),\n      [max, isDayGranularity, granularity]\n    );\n\n    // A pick is the day at midnight, as a click on its cell gives. Enter hands\n    // over the focused date, which can carry a time of day from the clock, a\n    // value or a bound, so its time is dropped here.\n    const handleSelect = useCallback(\n      (picked: Date) => {\n        const d = startOfDay(picked);\n        if (!isWithin(d, periodMin, periodMax)) return;\n        commitValue(d);\n        setFocusedDate(d);\n        if (closeOnSelect) setOpen(false);\n      },\n      [periodMin, periodMax, commitValue, closeOnSelect, setOpen]\n    );\n\n    const tryParse = useCallback(\n      (s: string): Date | null => {\n        const trimmed = s.trim();\n        if (!trimmed) return null;\n        const fmt = typeof format === 'string' ? format : undefined;\n        return parse\n          ? parse(trimmed)\n          : parseDate(trimmed, fmt ?? DEFAULT_FORMATS[granularity], locale);\n      },\n      [parse, format, locale, granularity]\n    );\n\n    // The Date the user edits when starting without a current value (today at\n    // midnight, or the start of this month or year; the hook clamps to\n    // min/max on commit).\n    const makeBaseDate = useCallback((): Date => {\n      const d = new Date();\n      d.setHours(0, 0, 0, 0);\n      return isDayGranularity ? d : startOfPeriod(d, granularity);\n    }, [isDayGranularity, granularity]);\n\n    const inputReadOnlyAttr = !!readOnly || !editable;\n    const canOpen = !!popover && !disabled && !readOnly;\n\n    // Blocking predicate for manual entry, matching the calendar's\n    // disabled-cell logic (shouldDisableDate + unselectableDates by day, or\n    // every day of the month or year blocked at those granularities).\n    const isBlocked = useMemo(() => {\n      if (!isDayGranularity) {\n        const constraints = { min, max, shouldDisableDate, unselectableDates };\n        return (d: Date) => isPeriodUnselectable(d, granularity, constraints);\n      }\n      if (!shouldDisableDate && !unselectableDates?.length) return undefined;\n      return (d: Date) =>\n        !!shouldDisableDate?.(d) ||\n        !!unselectableDates?.some(u => isSameDay(u, d));\n    }, [\n      isDayGranularity,\n      granularity,\n      min,\n      max,\n      shouldDisableDate,\n      unselectableDates,\n    ]);\n\n    // Typing, and the re-parse on blur or Enter, that lands in the period the\n    // value already holds commits nothing, so a `value` elsewhere in its month\n    // or year changes only when the user picks or types a different period.\n    const commitTyped = useCallback(\n      (next: Date | null) => {\n        if (\n          next &&\n          value &&\n          !isDayGranularity &&\n          startOfPeriod(next, granularity).getTime() ===\n            startOfPeriod(value, granularity).getTime()\n        ) {\n          setText(formatDate(value, resolvedFormat, locale));\n          return;\n        }\n        commitValue(next);\n      },\n      [\n        value,\n        isDayGranularity,\n        granularity,\n        resolvedFormat,\n        locale,\n        commitValue,\n      ]\n    );\n\n    const { inputHandlers } = useSegmentedEntry({\n      format: resolvedFormat,\n      skipKinds: SKIPPED_SEGMENTS[granularity],\n      value,\n      commitValue: commitTyped,\n      formatFn: formatDate,\n      tryParse,\n      text,\n      setText,\n      makeBaseDate,\n      locale,\n      min: periodMin,\n      max: periodMax,\n      isBlocked,\n      disabled,\n      readOnly,\n      editable,\n      popover,\n      openOnFocus,\n      closeOnSelect,\n      isOpen: open,\n      setOpen,\n      inputRef,\n      containerRef,\n      onFocus,\n      onClick,\n      onKeyDown,\n      onBlur,\n    });\n\n    const handlePopoverClose = useCallback(() => setOpen(false), [setOpen]);\n\n    const combinedRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        (inputRef as React.MutableRefObject<HTMLInputElement | null>).current =\n          node;\n        if (typeof ref === 'function') ref(node);\n        else if (ref)\n          (ref as React.MutableRefObject<HTMLInputElement | null>).current =\n            node;\n      },\n      [ref]\n    );\n\n    // Native mobile path renders <input type=\"date\"> (type=\"month\" for a\n    // month picker).\n    if (useNative) {\n      return (\n        <input\n          {...cleanRest}\n          ref={combinedRef}\n          type={isDayGranularity ? 'date' : 'month'}\n          className={classNames(inputClass, bulmaHelperClasses, className)}\n          value={value ? toIsoValue(value, granularity) : ''}\n          onChange={e => {\n            const parsed = e.target.value\n              ? fromIsoValue(e.target.value, granularity)\n              : null;\n            commitValue(parsed);\n          }}\n          min={min ? toIsoValue(lowerBound, granularity) : undefined}\n          max={max ? toIsoValue(max, granularity) : undefined}\n          disabled={disabled}\n          readOnly={readOnly}\n          placeholder={placeholder}\n          name={name}\n          form={form}\n          required={required}\n          id={id}\n        />\n      );\n    }\n\n    const chooseLabel =\n      granularity === 'month'\n        ? t.chooseMonth\n        : granularity === 'year'\n          ? t.chooseYear\n          : t.chooseDate;\n\n    const calendar = (\n      <Calendar\n        // A new granularity starts the calendar over on its own view.\n        key={granularity}\n        granularity={granularity}\n        value={value}\n        focusedDate={focusedDate}\n        onSelect={handleSelect}\n        onFocusedDateChange={setFocusedDate}\n        min={min}\n        max={max}\n        shouldDisableDate={shouldDisableDate}\n        unselectableDates={unselectableDates}\n        firstDayOfWeek={firstDayOfWeek}\n        locale={locale}\n        dayNames={dayNames}\n        monthNames={monthNames}\n        nearbyMonthDays={nearbyMonthDays}\n        color={color}\n        size={size}\n        // The popover panel takes `popoverId`, so the calendar inside it\n        // takes one of its own. Inline there is no panel, and the calendar\n        // keeps the id it released with.\n        id={inline ? popoverId : `${popoverId}-cal`}\n        autoFocusCell={open}\n        labels={labels}\n      />\n    );\n\n    if (inline) {\n      return (\n        <div\n          {...cleanRest}\n          ref={containerRef}\n          className={classNames(containerClass, bulmaHelperClasses, className)}\n        >\n          {calendar}\n          {name && (\n            <input\n              type=\"hidden\"\n              name={name}\n              form={form}\n              value={value ? toIsoValue(value, granularity) : ''}\n              required={required}\n            />\n          )}\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={containerRef}\n        className={classNames(containerClass, bulmaHelperClasses, className)}\n        {...cleanRest}\n      >\n        <input\n          ref={combinedRef}\n          type=\"text\"\n          role=\"combobox\"\n          aria-haspopup=\"dialog\"\n          aria-expanded={open}\n          aria-controls={popoverId}\n          autoComplete=\"off\"\n          className={inputClass}\n          value={text}\n          placeholder={placeholder}\n          disabled={disabled}\n          readOnly={inputReadOnlyAttr}\n          name={name}\n          form={form}\n          required={required}\n          id={id}\n          {...inputHandlers}\n        />\n        {popover && triggerIcon && (\n          <button\n            type=\"button\"\n            className={triggerClass}\n            onClick={() => {\n              if (canOpen) setOpen(!open);\n            }}\n            disabled={!canOpen}\n            aria-label={chooseLabel}\n            aria-haspopup=\"dialog\"\n            aria-controls={popoverId}\n            aria-expanded={open}\n            tabIndex={canOpen ? 0 : -1}\n          >\n            <Icon name={triggerIconName} size={size} />\n          </button>\n        )}\n        {popover && (\n          <PickerPopover\n            isOpen={open}\n            onClose={handlePopoverClose}\n            anchorRef={containerRef}\n            position={position}\n            appendToBody={appendToBody}\n            ariaLabel={chooseLabel}\n            id={popoverId}\n            restoreFocusRef={inputRef}\n            initialFocusSelector={CALENDAR_FOCUSED_CELL}\n          >\n            {calendar}\n          </PickerPopover>\n        )}\n      </div>\n    );\n  }\n);\n\nDateInputBase.displayName = 'DateInputBase';\n\nexport default DateInputBase;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/esm/form/DateTimeInputBase.js

@@ -12,6 +12,7 @@ import { PickerPopover } from './_pickerInternals/PickerPopover.js';
 import { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker.js';
 import { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry.js';
 import { useControlLoading } from './controlLoading.js';
+import { useFieldLabelId } from './FormContext.js';
 import { Icon } from '../elements/Icon.js';
 import { getActiveElementInTree } from '../helpers/shadowDom.js';
 import { inertProps } from '../helpers/inertProps.js';
@@ -54,7 +55,13 @@ const fromIsoDateTime = (s) => {
 const DateTimeInputBase = forwardRef((props, ref) => {
     const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = false, position = 'bottom-left', appendToBody = false, color, size, isRounded, shouldDisableDate, unselectableDates, firstDayOfWeek = 0, dayNames, monthNames, nearbyMonthDays = true, hourFormat = '24', enableSeconds = false, incrementHours = 1, 
     // Step between visible wheel values; 1 gives the iOS-style every-minute wheel.
-    incrementMinutes = 1, incrementSeconds = 1, unselectableTimes, className, name, form, required, id, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon: triggerIconProp, triggerIconName = 'chevron-down', audioTick = false, haptics = false, labels, ...rest } = props;
+    incrementMinutes = 1, incrementSeconds = 1, unselectableTimes, className, name, form, required, id: idProp, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon: triggerIconProp, triggerIconName = 'chevron-down', audioTick = false, haptics = false, labels, ...rest } = props;
+    // Inside a labeled Field the input takes the id the label points at
+    // when the caller set none, as InputBase does, and the popover's ids
+    // follow it. Inline there is no input to name, so nothing takes the
+    // Field's id or builds on it.
+    const fieldLabelId = useFieldLabelId();
+    const id = idProp ?? (inline ? undefined : fieldLabelId);
     // The launcher gives way to the loading spinner of a Control this sits in.
     const controlLoading = useControlLoading();
     const triggerIcon = triggerIconProp ?? !controlLoading;