@allxsmith/bestax-bulma 5.67.8 → 5.67.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/bestax.css +1 -1
- package/dist/bestax.css.map +1 -1
- package/dist/esm/components/ContextMenu.js +2 -2
- package/dist/esm/components/ContextMenu.js.map +1 -1
- package/dist/esm/components/DataTable.js +2 -1
- package/dist/esm/components/DataTable.js.map +1 -1
- package/dist/esm/components/HoverCard.js.map +1 -1
- package/dist/esm/components/Panel.js.map +1 -1
- package/dist/esm/components/Popover.js.map +1 -1
- package/dist/esm/components/Sidebar.js.map +1 -1
- package/dist/esm/form/ColorInputBase.js.map +1 -1
- package/dist/esm/form/Combobox.js.map +1 -1
- package/dist/esm/form/DateInputBase.js.map +1 -1
- package/dist/esm/form/DateRangeInputBase.js.map +1 -1
- package/dist/esm/form/DateTimeInputBase.js.map +1 -1
- package/dist/esm/form/TimeInputBase.js.map +1 -1
- package/dist/esm/form/TreeSelect.js.map +1 -1
- package/dist/esm/helpers/Config.js.map +1 -1
- package/dist/esm/helpers/portal.js +8 -3
- package/dist/esm/helpers/portal.js.map +1 -1
- package/dist/esm/layout/AppFrame.js +9 -3
- package/dist/esm/layout/AppFrame.js.map +1 -1
- package/dist/extras.css +1 -1
- package/dist/extras.css.map +1 -1
- package/dist/index.cjs +19 -8
- package/dist/index.cjs.map +1 -1
- package/dist/types/components/DataTable.d.ts +2 -1
- package/dist/types/components/HoverCard.d.ts +11 -11
- package/dist/types/components/Panel.d.ts +6 -1
- package/dist/types/components/Popover.d.ts +6 -6
- package/dist/types/components/Sidebar.d.ts +10 -1
- package/dist/types/form/ColorInputBase.d.ts +2 -2
- package/dist/types/form/Combobox.d.ts +6 -6
- package/dist/types/form/DateInputBase.d.ts +2 -2
- package/dist/types/form/DateRangeInputBase.d.ts +2 -2
- package/dist/types/form/DateTimeInputBase.d.ts +2 -2
- package/dist/types/form/TimeInputBase.d.ts +2 -2
- package/dist/types/form/TreeSelect.d.ts +1 -1
- package/dist/types/helpers/Config.d.ts +9 -5
- package/dist/types/helpers/portal.d.ts +7 -3
- package/dist/types/layout/AppFrame.d.ts +5 -1
- package/dist/types-cjs/components/DataTable.d.ts +2 -1
- package/dist/types-cjs/components/HoverCard.d.ts +11 -11
- package/dist/types-cjs/components/Panel.d.ts +6 -1
- package/dist/types-cjs/components/Popover.d.ts +6 -6
- package/dist/types-cjs/components/Sidebar.d.ts +10 -1
- package/dist/types-cjs/form/ColorInputBase.d.ts +2 -2
- package/dist/types-cjs/form/Combobox.d.ts +6 -6
- package/dist/types-cjs/form/DateInputBase.d.ts +2 -2
- package/dist/types-cjs/form/DateRangeInputBase.d.ts +2 -2
- package/dist/types-cjs/form/DateTimeInputBase.d.ts +2 -2
- package/dist/types-cjs/form/TimeInputBase.d.ts +2 -2
- package/dist/types-cjs/form/TreeSelect.d.ts +1 -1
- package/dist/types-cjs/helpers/Config.d.ts +9 -5
- package/dist/types-cjs/helpers/portal.d.ts +7 -3
- package/dist/types-cjs/layout/AppFrame.d.ts +5 -1
- package/dist/versions/bestax-no-dark-mode.css +1 -1
- package/dist/versions/bestax-no-dark-mode.css.map +1 -1
- package/dist/versions/bestax-no-helpers-prefixed.css +1 -1
- package/dist/versions/bestax-no-helpers-prefixed.css.map +1 -1
- package/dist/versions/bestax-no-helpers.css +1 -1
- package/dist/versions/bestax-no-helpers.css.map +1 -1
- package/dist/versions/bestax-prefixed.css +1 -1
- package/dist/versions/bestax-prefixed.css.map +1 -1
- package/package.json +2 -2
- package/src/scss/components/_datatable.scss +14 -2
- package/src/scss/components/_index.scss +1 -0
- package/src/scss/components/_panel.scss +31 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeInputBase.js","sources":["../../../src/form/TimeInputBase.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 { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { useFieldHelperClasses } from '../helpers/useFieldHelperClasses';\nimport {\n PickerPosition,\n HourFormat,\n PickerLabels,\n mergeLabels,\n} from './_pickerInternals/pickerTypes';\nimport {\n formatTime,\n hourCycleFromFormat,\n parseTime,\n DateFormatOption,\n DEFAULT_TIME_FORMAT_24,\n DEFAULT_TIME_FORMAT_12,\n} from './_pickerInternals/formatters';\nimport {\n setTimeOfDay,\n floorMin,\n isWithin,\n snapTimeToIncrement,\n} from './_pickerInternals/dateUtils';\nimport { TimeWheels } from './_pickerInternals/TimeWheels';\nimport { PickerPopover } from './_pickerInternals/PickerPopover';\nimport { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker';\nimport { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry';\nimport {\n usePickerLocale,\n usePickerLocaleScope,\n} from './_pickerInternals/useLocaleDefaults';\nimport { useControlLoading } from './controlLoading';\nimport { useFieldLabelTarget, useFieldsetDisabled } from './FormContext';\nimport { Icon } from '../elements/Icon';\nimport { Buttons } from '../elements/Buttons';\n\nconst toIsoTime = (d: Date, withSeconds: boolean): string => {\n const hh = String(d.getHours()).padStart(2, '0');\n const mm = String(d.getMinutes()).padStart(2, '0');\n if (!withSeconds) return `${hh}:${mm}`;\n const ss = String(d.getSeconds()).padStart(2, '0');\n return `${hh}:${mm}:${ss}`;\n};\n\nconst fromIsoTime = (s: string): Date | null => {\n // The HTML time value may carry fractional seconds (the spec allows them\n // and some engines normalize to `:ss.sss`); accept and drop.\n const m = /^(\\d{2}):(\\d{2})(?::(\\d{2})(?:\\.\\d{1,3})?)?$/.exec(s);\n if (!m) return null;\n const today = new Date();\n return new Date(\n today.getFullYear(),\n today.getMonth(),\n today.getDate(),\n Number(m[1]),\n Number(m[2]),\n m[3] ? Number(m[3]) : 0,\n 0\n );\n};\n\n/**\n * Props for the raw TimeInput base. Use the higher-level `TimeInput` for\n * Field/Control composition; `TimeInputBase` is the input + popover only.\n *\n * @helperProps Helper props go on the `.timeinput-container` `<div>`, with\n * `className` and the other attributes, except that the background helpers\n * go on the `<input>`, and the text helpers on both, since Bulma's `.input`\n * sets its own background and font, and the popover inside the `<div>`\n * takes the text ones. Inline they all go on the `<div>`, and on the native\n * mobile input, on the `<input>`.\n */\nexport interface TimeInputBaseProps\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 time (date portion is preserved). */\n value?: Date | null;\n /** Initial value for uncontrolled usage. */\n defaultValue?: Date | null;\n /** Fired when the value changes. */\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 time. A `min` before year 1 is raised to midnight on\n * 1 January of year 1, and a `value` dated before then is out of range, so\n * the wheels and typing change nothing on it, as in the date pickers.\n */\n min?: Date;\n /** Latest selectable time. */\n max?: Date;\n /** Disable the input. */\n disabled?: boolean;\n /**\n * Make the input read-only. An `inline` picker's wheels keep their tab\n * stops and carry `aria-readonly`, but no key, scroll, drag or click turns\n * them, so the time can't change.\n */\n readOnly?: boolean;\n /** Placeholder text for the input. */\n placeholder?: string;\n /**\n * Token format string or `Intl.DateTimeFormat` options.\n * @defaultValue (see below)\n */\n format?: DateFormatOption;\n /**\n * Custom parser. Enter and leaving the field call it only if the user\n * changed the text, so focus passing through commits nothing and the value\n * keeps what the format leaves out, such as seconds and the date.\n */\n parse?: (s: string) => Date | null;\n /**\n * BCP-47 locale tag for Intl formatting. Unset, it is the `locale` of a\n * `LocaleProvider` around the picker, and with neither, `Intl` uses the\n * runtime's own locale.\n */\n locale?: string;\n /** Render the spinner inline (no popover). */\n inline?: boolean;\n /** Use `<input type=\"time\">` on coarse-pointer + small-viewport devices. */\n mobileNative?: boolean | 'auto';\n /** Allow segmented keyboard typing in the input (type the time directly, auto-advancing across segments). `false` makes the field picker-only. */\n editable?: boolean;\n /** Whether the spinner 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 time is selected (off by default). */\n closeOnSelect?: boolean;\n /**\n * Where the popover opens against the field. Left out, it opens below and\n * lines up with the field's start edge, which is its right edge when the\n * picker reads right to left. A corner you pass stays physical, so\n * `bottom-left` lines up the left edges either way.\n * @defaultValue 'bottom-left'\n */\n position?: PickerPosition;\n /**\n * Render the popover through a portal, into the `portalContainer` a\n * `ConfigProvider` sets, else the `Modal`, `Dialog` or `Command.Dialog` it's\n * in, else `document.body`. On a narrow screen\n * an in-place popover spans the bottom of the viewport, while a portaled\n * one stays on its `position` corner.\n */\n appendToBody?: boolean;\n /**\n * Bulma color modifier for the input, also carried by the wheels, where it\n * colors the selection band. A focused wheel's keyboard focus ring is drawn\n * inside the band in the color's `-invert`, like the selected value, so it\n * shows on the fill. Unset, the wheels use\n * `--bulma-timeinput-wheel-selected-bg`, which defaults to `primary`.\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 /** Hour format. `'12'` adds an AM/PM column to the wheels. */\n hourFormat?: HourFormat;\n /** Show a seconds column. Note: iOS Safari's native time picker UI does not include a seconds wheel; pass `mobileNative={false}` if you need one on iOS. */\n enableSeconds?: boolean;\n /** Hour step for the spinner. */\n incrementHours?: number;\n /** Minute step. Combine with `min`/`max` for slot-style pickers. */\n incrementMinutes?: number;\n /** Second step. Default `1`. */\n incrementSeconds?: number;\n /** Predicate returning `true` for times that should be skipped. Blocked times are also rejected during manual typing. */\n unselectableTimes?: (d: Date) => 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 /**\n * Optional translatable string overrides. In a 12-hour picker, `ampm`\n * names the AM/PM column, `'AM/PM'` by default.\n */\n labels?: PickerLabels;\n /** Play a short audible click on each wheel-item crossing. Substitute for haptic feedback on iOS Safari (which has no web haptic API as of May 2026); on Android, `navigator.vibrate(5)` fires automatically regardless. */\n audioTick?: boolean;\n /** Auto-route platform-appropriate feedback: vibrate on Android (already happening), audio thunk on iOS (where vibrate is unavailable). One switch instead of platform-sniffing on the consumer side. `audioTick={true}` always wins. */\n haptics?: boolean;\n}\n\n/**\n * Raw TimeInput — input + popover spinner without Field/Control wrapping.\n * Use `TimeInput` for the convenience wrapper.\n *\n * @function\n * @param {TimeInputBaseProps} props\n * @returns {JSX.Element}\n */\nexport const TimeInputBase = forwardRef<HTMLInputElement, TimeInputBaseProps>(\n (props, ref) => {\n const {\n value: controlledValue,\n defaultValue,\n onChange,\n onOpen,\n onClose,\n min,\n max,\n disabled: disabledProp,\n readOnly,\n placeholder,\n format,\n parse,\n locale: localeProp,\n inline = false,\n mobileNative = 'auto',\n editable = true,\n popover = true,\n openOnFocus = true,\n closeOnSelect = false,\n position,\n appendToBody = false,\n color,\n size,\n isRounded,\n hourFormat = '24',\n enableSeconds = false,\n incrementHours = 1,\n incrementMinutes = 1,\n incrementSeconds = 1,\n unselectableTimes,\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 audioTick = false,\n haptics = false,\n ...rest\n } = props;\n // A LocaleProvider around the picker sets its default locale.\n const locale = usePickerLocale(localeProp);\n // Its own language and direction, which its root and a portaled panel\n // carry inside a provider.\n const localeScope = usePickerLocaleScope(localeProp, props.dir);\n const disabled = useFieldsetDisabled(disabledProp);\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 id = useFieldLabelTarget(idProp, !inline);\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 // Platform-appropriate feedback routing: when `haptics` is opted in and\n // the runtime has no Vibration API (notably iOS Safari), enable the\n // audio thunk so the user still gets *some* tactile cue. When vibrate\n // is available (Android Chrome etc.), the existing unconditional\n // `navigator.vibrate(5)` carries the haptic — no audio added unless\n // the consumer explicitly set `audioTick`. `audioTick` always wins.\n const hasVibrate =\n typeof navigator !== 'undefined' &&\n typeof navigator.vibrate === 'function';\n const effectiveAudioTick = audioTick || (haptics && !hasVibrate);\n const t = mergeLabels(labels);\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 const defaultFormat: DateFormatOption =\n format ??\n (hourFormat === '12'\n ? enableSeconds\n ? 'hh:mm:ss A'\n : DEFAULT_TIME_FORMAT_12\n : enableSeconds\n ? 'HH:mm:ss'\n : DEFAULT_TIME_FORMAT_24);\n\n // The displayed format is the source of truth for the hour cycle: an\n // explicit 12-hour `format` must drive a 12-hour wheel even when\n // `hourFormat` was left at its default. Fall back to the raw prop only when\n // the cycle can't be read from the format (an Intl-options object, or no\n // hour token).\n const effectiveHourFormat =\n hourCycleFromFormat(defaultFormat) ?? hourFormat;\n\n const [open, setOpenState] = useState(false);\n const [text, setText] = useState<string>(\n value ? formatTime(value, defaultFormat, locale) : ''\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n // Snapshot of value at the moment the popover opens, used by Cancel.\n const valueAtOpenRef = useRef<Date | null>(null);\n const reactId = useId();\n const popoverId = id ? `${id}-popover` : `picker-${reactId}`;\n\n // The field takes the background and text helpers, since Bulma's `.input`\n // sets its own background and font. The container keeps the rest, and the\n // text helpers too where a popover inside it takes them.\n const {\n bulmaHelperClasses,\n backgroundClasses,\n textClasses,\n otherClasses,\n rest: cleanRest,\n } = useFieldHelperClasses(rest);\n\n const { shouldUseNative, isSmallViewport } = useNativeMobilePicker({\n force: mobileNative === 'auto' ? undefined : mobileNative,\n });\n const useNative = !inline && shouldUseNative;\n const wheelItemHeight = isSmallViewport ? 40 : 32;\n\n const inputClass = usePrefixedClassNames('input', {\n [`is-${color}`]: !!color,\n [`is-${size}`]: !!size,\n 'is-rounded': isRounded,\n });\n const containerClass = usePrefixedClassNames('timeinput-container');\n const triggerClass = usePrefixedClassNames('timeinput-trigger');\n const panelClass = usePrefixedClassNames('timeinput-panel');\n const footerClass = usePrefixedClassNames('timeinput-footer');\n const footerButton = usePrefixedClassNames('button', 'is-small');\n const footerOkClass = usePrefixedClassNames(\n 'button',\n 'is-small',\n 'timeinput-footer-ok'\n );\n const mobileFooterClass = usePrefixedClassNames('timeinput-footer-mobile');\n const mobileFooterResetClass = usePrefixedClassNames(\n 'timeinput-footer-reset'\n );\n const mobileFooterDoneClass = usePrefixedClassNames(\n 'timeinput-footer-done'\n );\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) {\n valueAtOpenRef.current = value;\n onOpen?.();\n } else {\n onClose?.();\n }\n },\n [onOpen, onClose, value]\n );\n\n useEffect(() => {\n setText(value ? formatTime(value, defaultFormat, locale) : '');\n }, [value, defaultFormat, locale]);\n\n // A value's date before year 1 is out of range, as in the date pickers.\n const lowerBound = useMemo(() => floorMin(min), [min]);\n\n const commitValue = useCallback(\n (next: Date | null) => {\n if (!isControlled) setInternalValue(next);\n onChange?.(next);\n },\n [isControlled, onChange]\n );\n\n // An empty field starts from today, at the whole minute or second the\n // wheels show.\n const handleSpinnerChange = useCallback(\n (parts: { hours: number; minutes: number; seconds?: number }) => {\n // The wheels start nothing while read-only. This catches a drag or a\n // fling already under way when `readOnly` turns on.\n if (readOnly) return;\n const next = value\n ? setTimeOfDay(value, parts)\n : setTimeOfDay(new Date(), {\n ...parts,\n seconds: parts.seconds ?? 0,\n milliseconds: 0,\n });\n if (!isWithin(next, lowerBound, max)) return;\n commitValue(next);\n },\n [readOnly, value, lowerBound, max, commitValue]\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 : parseTime(\n trimmed,\n fmt ??\n (typeof defaultFormat === 'string'\n ? defaultFormat\n : DEFAULT_TIME_FORMAT_24)\n );\n },\n [parse, format, defaultFormat]\n );\n\n // The Date the user edits when starting without a current value. Noon so\n // the 12h / 24h hour calculations are unambiguous.\n const makeBaseDate = useCallback((): Date => {\n const d = new Date();\n d.setHours(12, 0, 0, 0);\n return d;\n }, []);\n\n const inputReadOnlyAttr = !!readOnly || !editable;\n const canOpen = !!popover && !disabled && !readOnly;\n\n const { inputHandlers } = useSegmentedEntry({\n format: defaultFormat,\n value,\n commitValue,\n formatFn: formatTime,\n tryParse,\n text,\n setText,\n makeBaseDate,\n locale,\n min: lowerBound,\n max,\n isBlocked: unselectableTimes,\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 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 if (useNative) {\n const nativeStep = enableSeconds\n ? incrementSeconds\n : incrementMinutes * 60;\n return (\n <input\n {...localeScope.rootAttrs}\n {...cleanRest}\n ref={combinedRef}\n type=\"time\"\n step={nativeStep}\n className={classNames(inputClass, bulmaHelperClasses, className)}\n value={value ? toIsoTime(value, enableSeconds) : ''}\n onChange={e => {\n const parsed = e.target.value ? fromIsoTime(e.target.value) : null;\n commitValue(parsed);\n }}\n min={min ? toIsoTime(min, enableSeconds) : undefined}\n max={max ? toIsoTime(max, enableSeconds) : 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 spinnerValue = {\n hours: value?.getHours() ?? 0,\n minutes: value?.getMinutes() ?? 0,\n seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,\n };\n\n const panel = (\n <div className={panelClass}>\n <TimeWheels\n value={spinnerValue}\n onChange={handleSpinnerChange}\n hourFormat={effectiveHourFormat}\n enableSeconds={enableSeconds}\n incrementHours={incrementHours}\n incrementMinutes={incrementMinutes}\n incrementSeconds={incrementSeconds}\n unselectableTimes={unselectableTimes}\n color={color}\n size={size}\n disabled={disabled}\n readOnly={readOnly}\n // The popover panel takes `popoverId`, so the wheels inside it take\n // one of their own. Inline there is no panel, and the wheels keep\n // the id they released with.\n id={inline ? popoverId : `${popoverId}-time`}\n labels={labels}\n itemHeight={wheelItemHeight}\n audioTick={effectiveAudioTick}\n onCommit={() => setOpen(false)}\n />\n {/* Footer is popover-only. Desktop gets the OK / Now / Cancel triad;\n mobile drops to an iOS-style \"Reset / ✓\" pair to match the OS\n picker's footer affordances and free up vertical space on small\n screens. */}\n {!inline && !isSmallViewport && (\n <Buttons className={footerClass} hasAddons>\n <button\n type=\"button\"\n className={footerOkClass}\n onClick={() => setOpen(false)}\n >\n {t.ok}\n </button>\n <button\n type=\"button\"\n className={footerButton}\n onClick={() => {\n commitValue(\n snapTimeToIncrement(new Date(), {\n incrementHours,\n incrementMinutes,\n incrementSeconds,\n enableSeconds,\n })\n );\n setOpen(false);\n }}\n >\n {t.now}\n </button>\n <button\n type=\"button\"\n className={footerButton}\n onClick={() => {\n commitValue(valueAtOpenRef.current);\n setOpen(false);\n }}\n >\n {t.cancel}\n </button>\n </Buttons>\n )}\n {!inline && isSmallViewport && (\n <div className={mobileFooterClass}>\n <button\n type=\"button\"\n className={mobileFooterResetClass}\n onClick={() => {\n commitValue(valueAtOpenRef.current);\n setOpen(false);\n }}\n >\n {t.reset}\n </button>\n <button\n type=\"button\"\n className={mobileFooterDoneClass}\n aria-label={t.done}\n onClick={() => setOpen(false)}\n >\n <svg\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 22 22\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M5 11l4 4 8-8\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n )}\n </div>\n );\n\n if (inline) {\n return (\n <div\n {...localeScope.rootAttrs}\n {...cleanRest}\n ref={containerRef}\n className={classNames(containerClass, bulmaHelperClasses, className)}\n >\n {panel}\n {name && (\n <input\n type=\"hidden\"\n name={name}\n form={form}\n value={value ? toIsoTime(value, enableSeconds) : ''}\n required={required}\n />\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={containerRef}\n className={classNames(\n containerClass,\n otherClasses,\n textClasses,\n className\n )}\n {...localeScope.rootAttrs}\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={classNames(inputClass, textClasses, backgroundClasses)}\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={t.chooseTime}\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 localeScope={localeScope.panel}\n isOpen={open}\n onClose={() => setOpen(false)}\n anchorRef={containerRef}\n position={position}\n appendToBody={appendToBody}\n ariaLabel={t.chooseTime}\n id={popoverId}\n restoreFocusRef={inputRef}\n >\n {panel}\n </PickerPopover>\n )}\n </div>\n );\n }\n);\n\nTimeInputBase.displayName = 'TimeInputBase';\n\nexport default TimeInputBase;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TimeInputBase.js","sources":["../../../src/form/TimeInputBase.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 { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { useFieldHelperClasses } from '../helpers/useFieldHelperClasses';\nimport {\n PickerPosition,\n HourFormat,\n PickerLabels,\n mergeLabels,\n} from './_pickerInternals/pickerTypes';\nimport {\n formatTime,\n hourCycleFromFormat,\n parseTime,\n DateFormatOption,\n DEFAULT_TIME_FORMAT_24,\n DEFAULT_TIME_FORMAT_12,\n} from './_pickerInternals/formatters';\nimport {\n setTimeOfDay,\n floorMin,\n isWithin,\n snapTimeToIncrement,\n} from './_pickerInternals/dateUtils';\nimport { TimeWheels } from './_pickerInternals/TimeWheels';\nimport { PickerPopover } from './_pickerInternals/PickerPopover';\nimport { useNativeMobilePicker } from './_pickerInternals/useNativeMobilePicker';\nimport { useSegmentedEntry } from './_pickerInternals/useSegmentedEntry';\nimport {\n usePickerLocale,\n usePickerLocaleScope,\n} from './_pickerInternals/useLocaleDefaults';\nimport { useControlLoading } from './controlLoading';\nimport { useFieldLabelTarget, useFieldsetDisabled } from './FormContext';\nimport { Icon } from '../elements/Icon';\nimport { Buttons } from '../elements/Buttons';\n\nconst toIsoTime = (d: Date, withSeconds: boolean): string => {\n const hh = String(d.getHours()).padStart(2, '0');\n const mm = String(d.getMinutes()).padStart(2, '0');\n if (!withSeconds) return `${hh}:${mm}`;\n const ss = String(d.getSeconds()).padStart(2, '0');\n return `${hh}:${mm}:${ss}`;\n};\n\nconst fromIsoTime = (s: string): Date | null => {\n // The HTML time value may carry fractional seconds (the spec allows them\n // and some engines normalize to `:ss.sss`); accept and drop.\n const m = /^(\\d{2}):(\\d{2})(?::(\\d{2})(?:\\.\\d{1,3})?)?$/.exec(s);\n if (!m) return null;\n const today = new Date();\n return new Date(\n today.getFullYear(),\n today.getMonth(),\n today.getDate(),\n Number(m[1]),\n Number(m[2]),\n m[3] ? Number(m[3]) : 0,\n 0\n );\n};\n\n/**\n * Props for the raw TimeInput base. Use the higher-level `TimeInput` for\n * Field/Control composition; `TimeInputBase` is the input + popover only.\n *\n * @helperProps Helper props go on the `.timeinput-container` `<div>`, with\n * `className` and the other attributes, except that the background helpers\n * go on the `<input>`, and the text helpers on both, since Bulma's `.input`\n * sets its own background and font, and the popover inside the `<div>`\n * takes the text ones. Inline they all go on the `<div>`, and on the native\n * mobile input, on the `<input>`.\n */\nexport interface TimeInputBaseProps\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 time (date portion is preserved). */\n value?: Date | null;\n /** Initial value for uncontrolled usage. */\n defaultValue?: Date | null;\n /** Fired when the value changes. */\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 time. A `min` before year 1 is raised to midnight on\n * 1 January of year 1, and a `value` dated before then is out of range, so\n * the wheels and typing change nothing on it, as in the date pickers.\n */\n min?: Date;\n /** Latest selectable time. */\n max?: Date;\n /** Disable the input. */\n disabled?: boolean;\n /**\n * Make the input read-only. An `inline` picker's wheels keep their tab\n * stops and carry `aria-readonly`, but no key, scroll, drag or click turns\n * them, so the time can't change.\n */\n readOnly?: boolean;\n /** Placeholder text for the input. */\n placeholder?: string;\n /**\n * Token format string or `Intl.DateTimeFormat` options.\n * @defaultValue (see below)\n */\n format?: DateFormatOption;\n /**\n * Custom parser. Enter and leaving the field call it only if the user\n * changed the text, so focus passing through commits nothing and the value\n * keeps what the format leaves out, such as seconds and the date.\n */\n parse?: (s: string) => Date | null;\n /**\n * BCP-47 locale tag for Intl formatting. Unset, it is the `locale` of a\n * `LocaleProvider` around the picker, and with neither, `Intl` uses the\n * runtime's own locale.\n */\n locale?: string;\n /** Render the spinner inline (no popover). */\n inline?: boolean;\n /** Use `<input type=\"time\">` on coarse-pointer + small-viewport devices. */\n mobileNative?: boolean | 'auto';\n /** Allow segmented keyboard typing in the input (type the time directly, auto-advancing across segments). `false` makes the field picker-only. */\n editable?: boolean;\n /** Whether the spinner 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 time is selected (off by default). */\n closeOnSelect?: boolean;\n /**\n * Where the popover opens against the field. Left out, it opens below and\n * lines up with the field's start edge, which is its right edge when the\n * picker reads right to left. A corner you pass stays physical, so\n * `bottom-left` lines up the left edges either way.\n * @defaultValue 'bottom-left'\n */\n position?: PickerPosition;\n /**\n * Render the popover through a portal, into the `portalContainer` a\n * `ConfigProvider` sets, else the overlay it's in that takes its popups,\n * such as a `Modal`, else `document.body`. On a narrow screen\n * an in-place popover spans the bottom of the viewport, while a portaled\n * one stays on its `position` corner.\n */\n appendToBody?: boolean;\n /**\n * Bulma color modifier for the input, also carried by the wheels, where it\n * colors the selection band. A focused wheel's keyboard focus ring is drawn\n * inside the band in the color's `-invert`, like the selected value, so it\n * shows on the fill. Unset, the wheels use\n * `--bulma-timeinput-wheel-selected-bg`, which defaults to `primary`.\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 /** Hour format. `'12'` adds an AM/PM column to the wheels. */\n hourFormat?: HourFormat;\n /** Show a seconds column. Note: iOS Safari's native time picker UI does not include a seconds wheel; pass `mobileNative={false}` if you need one on iOS. */\n enableSeconds?: boolean;\n /** Hour step for the spinner. */\n incrementHours?: number;\n /** Minute step. Combine with `min`/`max` for slot-style pickers. */\n incrementMinutes?: number;\n /** Second step. Default `1`. */\n incrementSeconds?: number;\n /** Predicate returning `true` for times that should be skipped. Blocked times are also rejected during manual typing. */\n unselectableTimes?: (d: Date) => 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 /**\n * Optional translatable string overrides. In a 12-hour picker, `ampm`\n * names the AM/PM column, `'AM/PM'` by default.\n */\n labels?: PickerLabels;\n /** Play a short audible click on each wheel-item crossing. Substitute for haptic feedback on iOS Safari (which has no web haptic API as of May 2026); on Android, `navigator.vibrate(5)` fires automatically regardless. */\n audioTick?: boolean;\n /** Auto-route platform-appropriate feedback: vibrate on Android (already happening), audio thunk on iOS (where vibrate is unavailable). One switch instead of platform-sniffing on the consumer side. `audioTick={true}` always wins. */\n haptics?: boolean;\n}\n\n/**\n * Raw TimeInput — input + popover spinner without Field/Control wrapping.\n * Use `TimeInput` for the convenience wrapper.\n *\n * @function\n * @param {TimeInputBaseProps} props\n * @returns {JSX.Element}\n */\nexport const TimeInputBase = forwardRef<HTMLInputElement, TimeInputBaseProps>(\n (props, ref) => {\n const {\n value: controlledValue,\n defaultValue,\n onChange,\n onOpen,\n onClose,\n min,\n max,\n disabled: disabledProp,\n readOnly,\n placeholder,\n format,\n parse,\n locale: localeProp,\n inline = false,\n mobileNative = 'auto',\n editable = true,\n popover = true,\n openOnFocus = true,\n closeOnSelect = false,\n position,\n appendToBody = false,\n color,\n size,\n isRounded,\n hourFormat = '24',\n enableSeconds = false,\n incrementHours = 1,\n incrementMinutes = 1,\n incrementSeconds = 1,\n unselectableTimes,\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 audioTick = false,\n haptics = false,\n ...rest\n } = props;\n // A LocaleProvider around the picker sets its default locale.\n const locale = usePickerLocale(localeProp);\n // Its own language and direction, which its root and a portaled panel\n // carry inside a provider.\n const localeScope = usePickerLocaleScope(localeProp, props.dir);\n const disabled = useFieldsetDisabled(disabledProp);\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 id = useFieldLabelTarget(idProp, !inline);\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 // Platform-appropriate feedback routing: when `haptics` is opted in and\n // the runtime has no Vibration API (notably iOS Safari), enable the\n // audio thunk so the user still gets *some* tactile cue. When vibrate\n // is available (Android Chrome etc.), the existing unconditional\n // `navigator.vibrate(5)` carries the haptic — no audio added unless\n // the consumer explicitly set `audioTick`. `audioTick` always wins.\n const hasVibrate =\n typeof navigator !== 'undefined' &&\n typeof navigator.vibrate === 'function';\n const effectiveAudioTick = audioTick || (haptics && !hasVibrate);\n const t = mergeLabels(labels);\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 const defaultFormat: DateFormatOption =\n format ??\n (hourFormat === '12'\n ? enableSeconds\n ? 'hh:mm:ss A'\n : DEFAULT_TIME_FORMAT_12\n : enableSeconds\n ? 'HH:mm:ss'\n : DEFAULT_TIME_FORMAT_24);\n\n // The displayed format is the source of truth for the hour cycle: an\n // explicit 12-hour `format` must drive a 12-hour wheel even when\n // `hourFormat` was left at its default. Fall back to the raw prop only when\n // the cycle can't be read from the format (an Intl-options object, or no\n // hour token).\n const effectiveHourFormat =\n hourCycleFromFormat(defaultFormat) ?? hourFormat;\n\n const [open, setOpenState] = useState(false);\n const [text, setText] = useState<string>(\n value ? formatTime(value, defaultFormat, locale) : ''\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n // Snapshot of value at the moment the popover opens, used by Cancel.\n const valueAtOpenRef = useRef<Date | null>(null);\n const reactId = useId();\n const popoverId = id ? `${id}-popover` : `picker-${reactId}`;\n\n // The field takes the background and text helpers, since Bulma's `.input`\n // sets its own background and font. The container keeps the rest, and the\n // text helpers too where a popover inside it takes them.\n const {\n bulmaHelperClasses,\n backgroundClasses,\n textClasses,\n otherClasses,\n rest: cleanRest,\n } = useFieldHelperClasses(rest);\n\n const { shouldUseNative, isSmallViewport } = useNativeMobilePicker({\n force: mobileNative === 'auto' ? undefined : mobileNative,\n });\n const useNative = !inline && shouldUseNative;\n const wheelItemHeight = isSmallViewport ? 40 : 32;\n\n const inputClass = usePrefixedClassNames('input', {\n [`is-${color}`]: !!color,\n [`is-${size}`]: !!size,\n 'is-rounded': isRounded,\n });\n const containerClass = usePrefixedClassNames('timeinput-container');\n const triggerClass = usePrefixedClassNames('timeinput-trigger');\n const panelClass = usePrefixedClassNames('timeinput-panel');\n const footerClass = usePrefixedClassNames('timeinput-footer');\n const footerButton = usePrefixedClassNames('button', 'is-small');\n const footerOkClass = usePrefixedClassNames(\n 'button',\n 'is-small',\n 'timeinput-footer-ok'\n );\n const mobileFooterClass = usePrefixedClassNames('timeinput-footer-mobile');\n const mobileFooterResetClass = usePrefixedClassNames(\n 'timeinput-footer-reset'\n );\n const mobileFooterDoneClass = usePrefixedClassNames(\n 'timeinput-footer-done'\n );\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) {\n valueAtOpenRef.current = value;\n onOpen?.();\n } else {\n onClose?.();\n }\n },\n [onOpen, onClose, value]\n );\n\n useEffect(() => {\n setText(value ? formatTime(value, defaultFormat, locale) : '');\n }, [value, defaultFormat, locale]);\n\n // A value's date before year 1 is out of range, as in the date pickers.\n const lowerBound = useMemo(() => floorMin(min), [min]);\n\n const commitValue = useCallback(\n (next: Date | null) => {\n if (!isControlled) setInternalValue(next);\n onChange?.(next);\n },\n [isControlled, onChange]\n );\n\n // An empty field starts from today, at the whole minute or second the\n // wheels show.\n const handleSpinnerChange = useCallback(\n (parts: { hours: number; minutes: number; seconds?: number }) => {\n // The wheels start nothing while read-only. This catches a drag or a\n // fling already under way when `readOnly` turns on.\n if (readOnly) return;\n const next = value\n ? setTimeOfDay(value, parts)\n : setTimeOfDay(new Date(), {\n ...parts,\n seconds: parts.seconds ?? 0,\n milliseconds: 0,\n });\n if (!isWithin(next, lowerBound, max)) return;\n commitValue(next);\n },\n [readOnly, value, lowerBound, max, commitValue]\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 : parseTime(\n trimmed,\n fmt ??\n (typeof defaultFormat === 'string'\n ? defaultFormat\n : DEFAULT_TIME_FORMAT_24)\n );\n },\n [parse, format, defaultFormat]\n );\n\n // The Date the user edits when starting without a current value. Noon so\n // the 12h / 24h hour calculations are unambiguous.\n const makeBaseDate = useCallback((): Date => {\n const d = new Date();\n d.setHours(12, 0, 0, 0);\n return d;\n }, []);\n\n const inputReadOnlyAttr = !!readOnly || !editable;\n const canOpen = !!popover && !disabled && !readOnly;\n\n const { inputHandlers } = useSegmentedEntry({\n format: defaultFormat,\n value,\n commitValue,\n formatFn: formatTime,\n tryParse,\n text,\n setText,\n makeBaseDate,\n locale,\n min: lowerBound,\n max,\n isBlocked: unselectableTimes,\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 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 if (useNative) {\n const nativeStep = enableSeconds\n ? incrementSeconds\n : incrementMinutes * 60;\n return (\n <input\n {...localeScope.rootAttrs}\n {...cleanRest}\n ref={combinedRef}\n type=\"time\"\n step={nativeStep}\n className={classNames(inputClass, bulmaHelperClasses, className)}\n value={value ? toIsoTime(value, enableSeconds) : ''}\n onChange={e => {\n const parsed = e.target.value ? fromIsoTime(e.target.value) : null;\n commitValue(parsed);\n }}\n min={min ? toIsoTime(min, enableSeconds) : undefined}\n max={max ? toIsoTime(max, enableSeconds) : 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 spinnerValue = {\n hours: value?.getHours() ?? 0,\n minutes: value?.getMinutes() ?? 0,\n seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,\n };\n\n const panel = (\n <div className={panelClass}>\n <TimeWheels\n value={spinnerValue}\n onChange={handleSpinnerChange}\n hourFormat={effectiveHourFormat}\n enableSeconds={enableSeconds}\n incrementHours={incrementHours}\n incrementMinutes={incrementMinutes}\n incrementSeconds={incrementSeconds}\n unselectableTimes={unselectableTimes}\n color={color}\n size={size}\n disabled={disabled}\n readOnly={readOnly}\n // The popover panel takes `popoverId`, so the wheels inside it take\n // one of their own. Inline there is no panel, and the wheels keep\n // the id they released with.\n id={inline ? popoverId : `${popoverId}-time`}\n labels={labels}\n itemHeight={wheelItemHeight}\n audioTick={effectiveAudioTick}\n onCommit={() => setOpen(false)}\n />\n {/* Footer is popover-only. Desktop gets the OK / Now / Cancel triad;\n mobile drops to an iOS-style \"Reset / ✓\" pair to match the OS\n picker's footer affordances and free up vertical space on small\n screens. */}\n {!inline && !isSmallViewport && (\n <Buttons className={footerClass} hasAddons>\n <button\n type=\"button\"\n className={footerOkClass}\n onClick={() => setOpen(false)}\n >\n {t.ok}\n </button>\n <button\n type=\"button\"\n className={footerButton}\n onClick={() => {\n commitValue(\n snapTimeToIncrement(new Date(), {\n incrementHours,\n incrementMinutes,\n incrementSeconds,\n enableSeconds,\n })\n );\n setOpen(false);\n }}\n >\n {t.now}\n </button>\n <button\n type=\"button\"\n className={footerButton}\n onClick={() => {\n commitValue(valueAtOpenRef.current);\n setOpen(false);\n }}\n >\n {t.cancel}\n </button>\n </Buttons>\n )}\n {!inline && isSmallViewport && (\n <div className={mobileFooterClass}>\n <button\n type=\"button\"\n className={mobileFooterResetClass}\n onClick={() => {\n commitValue(valueAtOpenRef.current);\n setOpen(false);\n }}\n >\n {t.reset}\n </button>\n <button\n type=\"button\"\n className={mobileFooterDoneClass}\n aria-label={t.done}\n onClick={() => setOpen(false)}\n >\n <svg\n width=\"22\"\n height=\"22\"\n viewBox=\"0 0 22 22\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M5 11l4 4 8-8\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n </button>\n </div>\n )}\n </div>\n );\n\n if (inline) {\n return (\n <div\n {...localeScope.rootAttrs}\n {...cleanRest}\n ref={containerRef}\n className={classNames(containerClass, bulmaHelperClasses, className)}\n >\n {panel}\n {name && (\n <input\n type=\"hidden\"\n name={name}\n form={form}\n value={value ? toIsoTime(value, enableSeconds) : ''}\n required={required}\n />\n )}\n </div>\n );\n }\n\n return (\n <div\n ref={containerRef}\n className={classNames(\n containerClass,\n otherClasses,\n textClasses,\n className\n )}\n {...localeScope.rootAttrs}\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={classNames(inputClass, textClasses, backgroundClasses)}\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={t.chooseTime}\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 localeScope={localeScope.panel}\n isOpen={open}\n onClose={() => setOpen(false)}\n anchorRef={containerRef}\n position={position}\n appendToBody={appendToBody}\n ariaLabel={t.chooseTime}\n id={popoverId}\n restoreFocusRef={inputRef}\n >\n {panel}\n </PickerPopover>\n )}\n </div>\n );\n }\n);\n\nTimeInputBase.displayName = 'TimeInputBase';\n\nexport default TimeInputBase;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeSelect.js","sources":["../../../src/form/TreeSelect.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { usePrefixedClassNames } from '../helpers/classNames';\nimport type { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { useLocaleMatcher } from '../helpers/localeFormat';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\nimport {\n TreeViewHiddenContext,\n readChecks,\n toggledList,\n} from '../helpers/useTreeView';\nimport { useControlled } from '../helpers/useControlled';\nimport {\n checkRecords,\n checkedByStrategy,\n childNodes,\n indexTree,\n isParentNode,\n nodeLabel,\n searchTree,\n} from '../helpers/treeData';\nimport { TreeView } from '../components/TreeView';\nimport type { FormFieldProps } from './fieldProps';\nimport { useFieldsetDisabled } from './FormContext';\nimport type { PickerPosition } from './_pickerInternals/pickerTypes';\nimport { DialogSelect } from './_selectInternals/DialogSelect';\nimport { ValueTags, tagIds } from './_selectInternals/ValueTags';\n\n/**\n * One node in a TreeSelect's `data`: Combobox's item fields plus\n * TreeView.Item's, with `children` for the nodes under it.\n */\nexport interface TreeItemData {\n /** **Required.** What the value holds and `name` posts. Unique in the whole tree. */\n value: string;\n /** What the row, the field and the tags show, and what search matches. The `value` when it's left out. */\n label?: string;\n /** Reachable, but never picked, checked, opened or closed. */\n disabled?: boolean;\n /** A picture before the label: an `Icon` name, or a node. Hidden from assistive tech. */\n icon?: React.ReactNode;\n /** The nodes under this one. */\n children?: TreeItemData[];\n /** Shows the node as a parent before its children are known, for a branch that loads when it opens. */\n hasChildren?: boolean;\n /** Its children are on their way: an open branch ends in a row that says so, and the live region says it too. */\n isLoading?: boolean;\n /** Its children didn't load: an open branch ends in this message, with a Retry button when there's an `onRetry`. */\n loadError?: React.ReactNode;\n /** Called by the Retry button on a failed load's row. Set `isLoading` while the retry runs. */\n onRetry?: () => void;\n}\n\n/** What a checked branch puts in the value a check makes. */\nexport type TreeSelectCheckedStrategy = 'child' | 'parent' | 'all';\n\n/** The visible and accessible strings, in your app's language. */\nexport interface TreeSelectLabels {\n /**\n * Names the panel and the tree in it.\n * @defaultValue the field's label\n */\n choose?: string;\n /**\n * Names the search box.\n * @defaultValue 'Search'\n */\n search?: string;\n /**\n * Names the clear button.\n * @defaultValue 'Clear'\n */\n clear?: string;\n /**\n * What a loading branch's row says, as on TreeView.\n * @defaultValue 'Loading…'\n */\n loading?: string;\n /**\n * The Retry button's text on a failed load's row, as on TreeView.\n * @defaultValue 'Retry'\n */\n retry?: string;\n /**\n * What the live region says when an open branch starts loading, built\n * from its name, as on TreeView.\n * @defaultValue name => `Loading ${name}`\n */\n loadingAnnouncement?: (name: string) => string;\n /**\n * What the live region says when that load finishes, as on TreeView.\n * @defaultValue name => `${name} loaded`\n */\n loadedAnnouncement?: (name: string) => string;\n}\n\n/**\n * What every TreeSelect takes. The helper props and the other attributes\n * land on the root `<div>`, as Combobox's do, and the `ref` on the field.\n */\ninterface TreeSelectBaseProps\n extends\n Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'color' | 'onChange' | 'defaultValue' | 'children'\n >,\n Omit<BulmaClassesProps, 'color'>,\n FormFieldProps {\n /** **Required.** The tree, as nodes nested through `children`. */\n data: TreeItemData[];\n /**\n * The field's label, which names the field through `htmlFor`, and the\n * panel and the tree in it through `aria-labelledby`. Dropped inside an\n * outer `Field`, whose label names them instead.\n */\n label?: React.ReactNode;\n /** The field's `id`, which the label then points at. The panel's is this one with `-panel` after it. */\n id?: string;\n /** Names the field, and the panel and the tree, in place of a `label`. */\n 'aria-label'?: string;\n /** The ids of what names the field, and the panel and the tree, in place of a `label`. */\n 'aria-labelledby'?: string;\n /** The ids of what describes the field, ahead of the tags. */\n 'aria-describedby'?: string;\n /** The open branches' values when you hold the state, as TreeView's `expanded`. */\n expanded?: string[];\n /** The branches open to begin with, when TreeSelect holds its own state. */\n defaultExpanded?: string[];\n /**\n * Called with the new list whenever a branch opens or closes, opening the\n * panel on the picked item's branch included. Fetch a lazy branch's\n * children from here. The branches a search opens aren't in it.\n */\n onExpandedChange?: (expanded: string[]) => void;\n /** Whether the panel is open, controlled: opening and closing then only call `onOpenChange`. */\n open?: boolean;\n /** The panel is open to begin with. */\n defaultOpen?: boolean;\n /** Called with the new state when the panel opens or closes. */\n onOpenChange?: (open: boolean) => void;\n /**\n * Puts a search box at the top of the panel. It matches labels, keeps a\n * match's ancestors and the nodes under it, and opens every branch with a\n * match. A printable key on the field opens the panel with it in the box,\n * and the search empties when the panel closes.\n */\n searchable?: boolean;\n /** The search text when you hold the state. */\n query?: string;\n /** The search text to begin with. */\n defaultQuery?: string;\n /** Called with the search text as it changes. */\n onQueryChange?: (query: string) => void;\n /**\n * Whether a node matches the search, in place of the locale-aware match on\n * its label. It's handed the search text trimmed, the node, and its path\n * from the top node down, the node last, as Cascader's `filter` is. A\n * match's ancestors stay either way. The search runs again when the search\n * text or `data` changes, not when only this does, so one written inline\n * costs nothing.\n */\n filter?: (query: string, item: TreeItemData, path: TreeItemData[]) => boolean;\n /** What the panel shows when the search matches nothing, such as \"No folders match\". Announced once. */\n empty?: React.ReactNode;\n /** Renders a row's content in place of its label. The field and the tags still show the label. */\n itemTemplate?: (item: TreeItemData) => React.ReactNode;\n /** What the field shows while nothing is picked. */\n placeholder?: string;\n /** A form field name. A hidden input posts the value, or one per value in the checkbox modes. */\n name?: string;\n /** The id of the form the hidden inputs belong to, when it isn't an ancestor. */\n form?: string;\n /**\n * A value is needed: the field is `aria-required`, and the form won't\n * submit while nothing is picked. The browser's message points at the\n * field, which shows focus, and the next key goes to it.\n */\n required?: boolean;\n /** The field can't be used: it can't be focused or opened, its tags lose their buttons, and its hidden inputs don't post. */\n disabled?: boolean;\n /**\n * Shows a clear button at the field's inline end while something it can\n * take off is picked. It leaves checked disabled items, which no control\n * unchecks.\n */\n clearable?: boolean;\n /** Bulma color modifier for the field. */\n color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n /** The field's size, which the tree in the panel follows. */\n size?: 'small' | 'medium' | 'large';\n /** Rounds the field's corners (Bulma's `is-rounded`). */\n isRounded?: boolean;\n /**\n * Where the panel opens against the field, as on the pickers. Left out, it\n * opens below and lines up with the field's start edge, which is its right\n * edge on a right-to-left page. A corner you pass stays physical, so\n * `bottom-left` lines up the left edges either way.\n * @defaultValue 'bottom-left'\n */\n position?: PickerPosition;\n /** Renders the panel through a portal, into a `ConfigProvider`'s `portalContainer`, else the `Modal`, `Dialog` or `Command.Dialog` it's in, else `document.body`. */\n appendToBody?: boolean;\n /** The visible and accessible strings, in your app's language. */\n labels?: TreeSelectLabels;\n}\n\n/** Props for a TreeSelect that picks one item. */\nexport interface TreeSelectSingleProps extends TreeSelectBaseProps {\n /**\n * `'single'`: one item, picked with Enter, Space or a click on its row.\n * `'checkbox'`: any number, with a box on every item. A check reaches every\n * enabled item under it, and a parent with some of them checked is mixed.\n * `'checkbox-independent'`: any number, each box checking its own item, so\n * a parent means the parent alone (Mantine's and Ant Design's\n * `checkStrictly`). The checkbox modes show the value as tags.\n */\n selectionMode?: 'single';\n /**\n * The value when you hold the state: in `'single'` the picked item's\n * value, or `null` for none, and in the checkbox modes the checked values.\n * In `'checkbox'` a parent's value checks its whole branch, so the list any\n * `checkedStrategy` gives checks the same boxes.\n */\n value?: string | null;\n /** The value to begin with, when TreeSelect holds its own state: a value or `null`, or a list in the checkbox modes. */\n defaultValue?: string | null;\n /**\n * Called with the new value: in `'single'` the picked item's value, or\n * `null` when it's cleared, and in the checkbox modes the new list, after a\n * check, an uncheck, a tag's button or the clear button, each shaped by\n * `checkedStrategy`. A reset of the field's form calls it too, with\n * `defaultValue` as it was given, or with `null` or `[]` when you hold\n * the value, for you to set.\n */\n onChange?: (value: string | null) => void;\n /**\n * A parent's row picks the parent. `false` makes the row, Enter and Space\n * open it instead, so only leaves are picked.\n * @defaultValue true\n */\n parentsSelectable?: boolean;\n /**\n * Closes the panel after a pick and puts focus back on the field.\n * @defaultValue true\n */\n closeOnSelect?: boolean;\n /** Read with the checkbox modes only. */\n checkedStrategy?: never;\n /** Read with the checkbox modes only. */\n ariaCloseLabel?: never;\n}\n\n/** Props for a TreeSelect with a box on every item. */\nexport interface TreeSelectCheckboxProps extends TreeSelectBaseProps {\n /**\n * `'checkbox'`: a check reaches every enabled item under it, and a parent\n * with some of them checked is mixed. `'checkbox-independent'`: each box\n * checks its own item, so a parent means the parent alone.\n */\n selectionMode: 'checkbox' | 'checkbox-independent';\n /**\n * The checked values when you hold the state. In `'checkbox'`, a parent's\n * value checks its whole branch, so the list any `checkedStrategy` gives\n * checks the same boxes.\n */\n value?: string[];\n /** The values checked to begin with, when TreeSelect holds its own state. */\n defaultValue?: string[];\n /**\n * Called with the new list after a check, an uncheck, a tag's button or\n * the clear button, shaped by `checkedStrategy`, and after a reset of the\n * field's form, with `defaultValue` as given, or `[]` when you hold the\n * value.\n */\n onChange?: (value: string[]) => void;\n /**\n * What a checked branch puts in the value, in `'checkbox'`: `'child'` its\n * leaves, `'parent'` its topmost checked item, `'all'` every checked item,\n * parents included. A checked disabled item is in all three, since only\n * its own value checks it. It shapes the value a check, an uncheck, a\n * tag's button or the clear button makes, which `onChange` reports, and\n * not `defaultValue`, a value you pass or the one a form reset puts back.\n * The tags and the hidden\n * inputs show the value as it's held, so a value you pass shows as you\n * pass it, and a branch that loads later changes nothing the form posts.\n * `'checkbox-independent'` always reports exactly the checked items.\n * @defaultValue 'child'\n */\n checkedStrategy?: TreeSelectCheckedStrategy;\n /** Names each tag's button, in place of \"Remove\" and the item's label, as on Combobox. */\n ariaCloseLabel?: string;\n /** Read with `'single'` only. */\n parentsSelectable?: never;\n /** Read with `'single'` only: the panel stays open while boxes are checked. */\n closeOnSelect?: never;\n}\n\n/**\n * Props for the TreeSelect component. The helper props and the other\n * attributes land on the `div.tree-select` around the field, and the `ref`\n * on the field. It renders the `Field` and the label itself, unless an outer\n * `Field` already does.\n *\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the field, the read-only `<input role=\"combobox\">`.\n */\nexport type TreeSelectProps = TreeSelectSingleProps | TreeSelectCheckboxProps;\n\nconst NOTHING_HIDDEN: ReadonlySet<string> = new Set();\nconst noMatches = [{ id: 'empty' }];\nconst nothingToSay: Array<{ id: string }> = [];\n/** What takes focus as the panel opens. */\nconst INITIAL_FOCUS = '[data-initial-focus]';\n\n/** One value or several, as a list. */\nconst asList = (value: string | string[] | null | undefined): string[] =>\n value == null ? [] : Array.isArray(value) ? value : [value];\n\n/** Whether two lists hold the same values, whatever their order and repeats. */\nconst sameValues = (a: string[], b: string[]): boolean => {\n const inA = new Set(a);\n const inB = new Set(b);\n return inA.size === inB.size && [...inA].every(value => inB.has(value));\n};\n\n/** The list with every value of `more` it doesn't have added at the end. */\nconst withAll = (list: string[], more: string[]): string[] => [\n ...list,\n ...more.filter(value => !list.includes(value)),\n];\n\n/**\n * The `TreeSelect` component is a form field whose options are a tree, such as categories, places or teams: it opens a panel holding a real `TreeView`, picks one item or checks a branch at a time, and searches labels.\n *\n * The field is a read-only `role=\"combobox\"` that opens a dialog, wired as\n * DateInput's is, so focus moves into the tree for real and the tree keeps\n * TreeView's keys, type-ahead and spoken output. The tree is given as `data`,\n * so the field and the tags can name what's picked while the panel is shut,\n * and on the server.\n *\n * `selectionMode` picks the kind. `'single'` picks one item and closes. With\n * `'checkbox'`, a check reaches every enabled item under it, closed or hidden\n * by a search, and `checkedStrategy` decides what the value holds: the\n * leaves, the topmost checked items or every one. With\n * `'checkbox-independent'`, each box is its own item's, so a parent means\n * itself alone (Mantine's and Ant Design's `checkStrictly`). The value shows\n * as tags under the field.\n *\n * A value no node has is kept and shown as it is, with a warning in\n * development, so a value under a branch that hasn't loaded survives until\n * it does.\n *\n * @function\n * @param {TreeSelectProps} props - Props for the TreeSelect component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the field.\n * @returns {JSX.Element} The field, its tags and its panel, in a `Field` with the label unless one is around it.\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/combobox/ | APG Combobox Pattern}\n *\n * @example\n * <TreeSelect\n * label=\"Save to\"\n * data={[\n * { value: 'docs', label: 'Documents', children: [{ value: 'invoices', label: 'Invoices' }] },\n * { value: 'photos', label: 'Photos' },\n * ]}\n * searchable\n * />\n *\n * @example\n * <TreeSelect label=\"Regions\" selectionMode=\"checkbox\" checkedStrategy=\"parent\" data={regions} />\n */\nexport const TreeSelect = forwardRef<HTMLInputElement, TreeSelectProps>(\n (props, ref) => {\n const {\n data,\n expanded: expandedProp,\n defaultExpanded = [],\n onExpandedChange,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n searchable = false,\n query: queryProp,\n defaultQuery = '',\n onQueryChange,\n filter,\n empty,\n itemTemplate,\n disabled: disabledProp,\n clearable = false,\n size,\n labels,\n selectionMode = 'single',\n value: valueProp,\n defaultValue,\n // Called below through `props`, which knows which value it takes.\n onChange: _onChange,\n parentsSelectable = true,\n closeOnSelect = true,\n checkedStrategy = 'child',\n ariaCloseLabel,\n ...rest\n } = props;\n const disabled = useFieldsetDisabled(disabledProp);\n const single = selectionMode === 'single';\n const cascade = selectionMode === 'checkbox';\n\n const index = useMemo(() => indexTree(data), [data]);\n const records = useMemo(() => checkRecords(index), [index]);\n const labelFor = (value: string) => {\n const entry = index.get(value);\n return entry ? nodeLabel(entry.node) : value;\n };\n\n // The value, as a list: none or one in `single`.\n const [held, setHeld] = useControlled<string | string[] | null>(\n valueProp,\n defaultValue ?? null\n );\n const listed = asList(held);\n const change = (next: string[]) => {\n const value = single ? (next[0] ?? null) : next;\n setHeld(value);\n // The mode decides which of the two `onChange` takes.\n const report = props.onChange as\n ((value: string | string[] | null) => void) | undefined;\n report?.(value);\n };\n // What the field, the tags and the hidden inputs show: the value as it's\n // held. `checkedStrategy` shapes a new value as a check makes it, so a\n // branch that loads later changes nothing the form posts.\n const picked = single ? listed.slice(0, 1) : Array.from(new Set(listed));\n\n const unknown = picked.find(value => !index.has(value));\n useEffect(() => {\n if (unknown !== undefined) {\n warnOnce(\n 'TreeSelect:unknown-value',\n `[bestax-bulma] <TreeSelect> was given the value \"${unknown}\", ` +\n 'which no node in its data has. It is kept and shown as it is, ' +\n 'as it should be for a node under a branch that has not loaded ' +\n 'yet. Otherwise, check the value against the data.'\n );\n }\n }, [unknown]);\n\n const [expanded, setExpanded] = useControlled(\n expandedProp,\n defaultExpanded\n );\n const changeExpanded = (next: string[]) => {\n setExpanded(next);\n onExpandedChange?.(next);\n };\n\n // The picked item focus goes to: the first in the tree's order.\n const pickedSet = new Set(picked);\n const target = Array.from(index.keys()).find(value => pickedSet.has(value));\n\n const [query, setQueryState] = useControlled(queryProp, defaultQuery);\n const setQuery = (next: string) => {\n if (next === query) return;\n setQueryState(next);\n onQueryChange?.(next);\n };\n\n const [isOpen, setOpenState] = useControlled(openProp, defaultOpen);\n const setOpen = (next: boolean) => {\n if (next === isOpen) return;\n if (next) {\n // Opening shows the picked item, its branch open.\n const path = (target !== undefined && index.get(target)?.path) || [];\n if (path.some(value => !expanded.includes(value))) {\n changeExpanded(withAll(expanded, path));\n }\n } else {\n setQuery('');\n }\n setOpenState(next);\n onOpenChange?.(next);\n };\n\n const matchText = useLocaleMatcher();\n const typed = searchable ? query.trim() : '';\n // Every item reads the hidden set, so it's only built again when the\n // search text or the data changes.\n const search = useMemo(\n () =>\n typed\n ? searchTree(data, (node, path) => {\n if (filter) return filter(typed, node, path);\n const text = nodeLabel(node);\n return matchText\n ? matchText(text, typed)\n : text.toLowerCase().includes(typed.toLowerCase());\n })\n : null,\n // `filter` is read as it is when the text or the data changes: one\n // written inline is a new function every render, and listing it would\n // search again on each.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [data, typed, matchText]\n );\n // The branches a search opened that were closed during it, for the\n // search text they were closed under: any new text, from the box or\n // from a held `query`, starts over.\n const [searchClosed, setSearchClosed] = useState({\n query: typed,\n values: [] as string[],\n });\n if (searchClosed.query !== typed) {\n setSearchClosed({ query: typed, values: [] });\n }\n const closedHere = searchClosed.query === typed ? searchClosed.values : [];\n // The branches a search opens show open over the ones you opened, and\n // close again once it's cleared.\n const forced = search\n ? search.open.filter(value => !closedHere.includes(value))\n : [];\n const shownExpanded = withAll(expanded, forced);\n // TreeView's click on a row selects it and opens it. A pick by click, as\n // a pick by Enter, only picks, so the open the tree asks for right after\n // one on a parent is dropped, and a lazy parent isn't fetched to be\n // picked.\n const clickPickedRef = useRef(false);\n const onTreeExpandedChange = (next: string[]) => {\n if (clickPickedRef.current) {\n clickPickedRef.current = false;\n return;\n }\n const closed = shownExpanded.filter(value => !next.includes(value));\n const opened = next.filter(value => !shownExpanded.includes(value));\n const closedForced = closed.filter(value => forced.includes(value));\n if (closedForced.length > 0) {\n setSearchClosed({\n query: typed,\n values: [...closedHere, ...closedForced],\n });\n }\n if (opened.length > 0 || closed.some(value => expanded.includes(value))) {\n changeExpanded([\n ...expanded.filter(value => !closed.includes(value)),\n ...opened,\n ]);\n }\n };\n\n // Whether an item is on the page with the panel open: every branch\n // above it open, and the search not hiding it.\n const visible = (value: string) =>\n !search?.hidden.has(value) &&\n index.get(value)!.path.every(above => shownExpanded.includes(above));\n const focusTarget =\n target !== undefined && visible(target)\n ? target\n : data.find(node => visible(node.value))?.value;\n\n // Picking in `single`. TreeView shows `selected`, held here, and the\n // picks are made from the rows' own keys and clicks, so a parent can\n // open instead and a pick of the picked item still closes.\n const pickable = (node: TreeItemData) =>\n !node.disabled && (parentsSelectable || !isParentNode(node));\n const pick = (value: string) => {\n if (listed.length !== 1 || listed[0] !== value) change([value]);\n if (closeOnSelect) setOpen(false);\n };\n const toggleClass = usePrefixedClassNames('tree-view-toggle');\n const rowHandlers = (node: TreeItemData) =>\n single\n ? {\n onKeyDown: (event: React.KeyboardEvent<HTMLLIElement>) => {\n if (\n event.target !== event.currentTarget ||\n event.repeat ||\n event.altKey ||\n event.ctrlKey ||\n event.metaKey ||\n (event.key !== 'Enter' && event.key !== ' ')\n ) {\n return;\n }\n if (pickable(node)) {\n pick(node.value);\n } else if (!node.disabled && isParentNode(node)) {\n // TreeView leaves a key that's been used alone.\n event.preventDefault();\n onTreeExpandedChange(\n shownExpanded.includes(node.value)\n ? shownExpanded.filter(value => value !== node.value)\n : [...shownExpanded, node.value]\n );\n }\n },\n onClick: (event: React.MouseEvent<HTMLLIElement>) => {\n const item = event.currentTarget;\n const target = event.target as Element;\n // A click in this item's own row, where TreeView reads one,\n // not one in the group of items inside it, and not on its\n // chevron, which only opens it.\n const inRow =\n target === item || item.firstElementChild!.contains(target);\n const onChevron =\n isParentNode(node) && !!target.closest(`.${toggleClass}`);\n if (inRow && !onChevron && pickable(node)) {\n // TreeView opens a parent it's handed this click on, in\n // this same click: the flag goes once the click is over.\n clickPickedRef.current = isParentNode(node);\n queueMicrotask(() => {\n clickPickedRef.current = false;\n });\n pick(node.value);\n }\n },\n }\n : undefined;\n\n const renderNode = (node: TreeItemData): React.ReactNode => (\n <TreeView.Item\n key={node.value}\n value={node.value}\n label={itemTemplate ? itemTemplate(node) : nodeLabel(node)}\n icon={node.icon}\n hasChildren={node.hasChildren}\n isLoading={node.isLoading}\n loadError={node.loadError}\n onRetry={node.onRetry}\n disabled={node.disabled}\n data-initial-focus={\n !searchable && node.value === focusTarget ? '' : undefined\n }\n {...rowHandlers(node)}\n >\n {childNodes(node).map(renderNode)}\n </TreeView.Item>\n );\n\n // In `checkbox`, TreeView reports every checked item, read here into\n // the list `checkedStrategy` gives.\n const shaped = (next: string[]) =>\n cascade ? checkedByStrategy(records, next, checkedStrategy) : next;\n const onCheckedChange = (next: string[]) => change(shaped(next));\n // Every item's check state, read once a render, which the clear button\n // and the tags' buttons decide from. Only `checkbox` reads TreeView's\n // rules: in `checkbox-independent` a listed item is a checked one.\n const listedKey = JSON.stringify(listed);\n const checks = useMemo(\n () => (cascade ? readChecks(records, new Set(listed)) : null),\n // `listed` by what it holds, since a held list is a new array each\n // render.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [cascade, records, listedKey]\n );\n const isDisabled = (value: string) => !!index.get(value)?.node.disabled;\n // Read in `checkbox` only, where there are states to read.\n const isChecked = (value: string) => checks!.states.get(value) === true;\n // What a control can uncheck. In `checkbox`, that's each checked end no\n // checked disabled item above it keeps checked, and every item above it,\n // which takes it along; elsewhere it's each listed item that isn't\n // disabled. A disabled item is checked only by its own value, so nothing\n // unchecks it, or what it keeps checked.\n const uncheckable = new Set<string>();\n if (checks) {\n for (const end of checks.ends) {\n const { path } = index.get(end)!;\n if (\n isChecked(end) &&\n !path.some(above => isDisabled(above) && isChecked(above))\n ) {\n uncheckable.add(end);\n path.forEach(above => uncheckable.add(above));\n }\n }\n } else if (!single) {\n picked.forEach(value => !isDisabled(value) && uncheckable.add(value));\n }\n // A tag's button takes its value off where that changes what's checked,\n // the way its box would. A value no node has can always go.\n const removable = (value: string) =>\n !index.has(value) || (!isDisabled(value) && uncheckable.has(value));\n const without = (value: string) =>\n cascade && records.has(value)\n ? shaped(toggledList(records, listed, value))\n : listed.filter(item => item !== value);\n // What the clear button leaves: the checked disabled items, and in\n // `checkbox` what they keep checked, shaped as a check's value is.\n const cleared = single\n ? []\n : shaped(\n checks\n ? Array.from(records.keys()).filter(\n value => isDisabled(value) && isChecked(value)\n )\n : picked.filter(isDisabled)\n );\n const canClear = single\n ? picked.length > 0\n : uncheckable.size > 0 || picked.some(value => !index.has(value));\n const inputRef = useRef<HTMLInputElement | null>(null);\n // A forwarded callback's cleanup, which React 19 lets it return, run on\n // detach in place of a call with `null`, on React 18 as well.\n const refCleanupRef = useRef<(() => void) | null>(null);\n const fieldRef = useCallback(\n (node: HTMLInputElement | null) => {\n inputRef.current = node;\n if (typeof ref === 'function') {\n if (node === null) {\n const cleanup = refCleanupRef.current;\n refCleanupRef.current = null;\n if (cleanup) cleanup();\n else ref(null);\n return;\n }\n const cleanup: unknown = ref(node);\n refCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n ref.current = node;\n }\n },\n [ref]\n );\n const tagsId = useId();\n const ids = tagIds(tagsId, picked);\n\n const searchClass = usePrefixedClassNames('input', 'tree-select-search', {\n [`is-${size}`]: !!size,\n });\n const emptyClass = usePrefixedClassNames('tree-select-empty');\n const treeRef = useRef<HTMLUListElement>(null);\n const emptyRef = useRef<HTMLDivElement>(null);\n const nothingFound = !!search && !search.found;\n // The region reads the text on screen, whatever `empty` renders.\n const describeEmpty = useCallback(() => {\n const node = emptyRef.current;\n /* istanbul ignore if: it's only announced while it's on screen */\n if (!node) return null;\n return spokenText(node);\n }, []);\n\n return (\n <DialogSelect\n {...rest}\n component=\"TreeSelect\"\n rootClass=\"tree-select\"\n panelClass=\"tree-select-panel\"\n text={single && picked.length > 0 ? labelFor(picked[0]) : ''}\n values={single ? [picked[0] ?? ''] : picked}\n hasValue={picked.length > 0}\n open={isOpen}\n onOpenChange={setOpen}\n onPrintableKey={\n searchable\n ? key => {\n setQuery(key);\n setOpen(true);\n return true;\n }\n : undefined\n }\n onClear={() => change(cleared)}\n clearable={clearable && canClear}\n onFormReset={() => {\n // Back to `defaultValue`, or to nothing for a held value, which\n // its owner sets from `onChange`.\n const back = valueProp === undefined ? asList(defaultValue) : [];\n if (!sameValues(back, listed)) change(back);\n }}\n clearLabel={labels?.clear || 'Clear'}\n chooseLabel={labels?.choose}\n disabled={disabled}\n size={size}\n inputRef={inputRef}\n fieldRef={fieldRef}\n describedBy={single ? undefined : ids.join(' ')}\n below={\n single ? undefined : (\n <ValueTags\n values={picked}\n ids={ids}\n labelFor={labelFor}\n disabled={disabled}\n ariaCloseLabel={ariaCloseLabel}\n removable={removable}\n onRemove={value => {\n change(without(value));\n inputRef.current?.focus();\n }}\n />\n )\n }\n initialFocusSelector={INITIAL_FOCUS}\n >\n {panelName => (\n <>\n {searchable && (\n <input\n className={searchClass}\n type=\"search\"\n aria-label={labels?.search || 'Search'}\n autoComplete=\"off\"\n value={query}\n data-initial-focus=\"\"\n onChange={event => setQuery(event.target.value)}\n onFocus={event => {\n // A key that opened the panel is in the box: type after it.\n const { length } = event.currentTarget.value;\n event.currentTarget.setSelectionRange(length, length);\n }}\n onKeyDown={event => {\n if (event.key === 'Enter') {\n // The search box's Enter would submit the form.\n event.preventDefault();\n } else if (event.key === 'ArrowDown' && !event.altKey) {\n event.preventDefault();\n const tree = treeRef.current;\n (\n tree?.querySelector<HTMLElement>(\n '[role=\"treeitem\"][tabindex=\"0\"]'\n ) ?? tree?.querySelector<HTMLElement>('[role=\"treeitem\"]')\n )?.focus();\n }\n }}\n />\n )}\n {nothingFound ? (\n empty && (\n <div className={emptyClass} ref={emptyRef}>\n {empty}\n </div>\n )\n ) : (\n <TreeViewHiddenContext.Provider\n value={search?.hidden ?? NOTHING_HIDDEN}\n >\n <TreeView\n {...panelName}\n ref={treeRef}\n // It scrolls, and Firefox makes a scroller a Tab stop of\n // its own: the roving one on its items is the tree's.\n tabIndex={-1}\n selectionMode={selectionMode}\n size={size}\n selected={single ? (picked[0] ?? null) : undefined}\n checked={single ? undefined : listed}\n onCheckedChange={onCheckedChange}\n expanded={shownExpanded}\n onExpandedChange={onTreeExpandedChange}\n loadingLabel={labels?.loading}\n retryLabel={labels?.retry}\n loadingAnnouncement={labels?.loadingAnnouncement}\n loadedAnnouncement={labels?.loadedAnnouncement}\n >\n {data.map(renderNode)}\n </TreeView>\n </TreeViewHiddenContext.Provider>\n )}\n <StatusRegion\n items={nothingFound && empty ? noMatches : nothingToSay}\n describe={describeEmpty}\n />\n </>\n )}\n </DialogSelect>\n );\n }\n);\n\nTreeSelect.displayName = 'TreeSelect';\n\nexport default TreeSelect;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;;;;;;;;;;AA2TA,MAAM,cAAc,GAAwB,IAAI,GAAG,EAAE;AACrD,MAAM,SAAS,GAAG,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC;AACnC,MAAM,YAAY,GAA0B,EAAE;AAC9C;AACA,MAAM,aAAa,GAAG,sBAAsB;AAE5C;AACA,MAAM,MAAM,GAAG,CAAC,KAA2C,KACzD,KAAK,IAAI,IAAI,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC;AAE7D;AACA,MAAM,UAAU,GAAG,CAAC,CAAW,EAAE,CAAW,KAAa;AACvD,IAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC;AACtB,IAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC;IACtB,OAAO,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,IAAI,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AACzE,CAAC;AAED;AACA,MAAM,OAAO,GAAG,CAAC,IAAc,EAAE,IAAc,KAAe;AAC5D,IAAA,GAAG,IAAI;AACP,IAAA,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCG;AACI,MAAM,UAAU,GAAG,UAAU,CAClC,CAAC,KAAK,EAAE,GAAG,KAAI;AACb,IAAA,MAAM,EACJ,IAAI,EACJ,QAAQ,EAAE,YAAY,EACtB,eAAe,GAAG,EAAE,EACpB,gBAAgB,EAChB,IAAI,EAAE,QAAQ,EACd,WAAW,GAAG,KAAK,EACnB,YAAY,EACZ,UAAU,GAAG,KAAK,EAClB,KAAK,EAAE,SAAS,EAChB,YAAY,GAAG,EAAE,EACjB,aAAa,EACb,MAAM,EACN,KAAK,EACL,YAAY,EACZ,QAAQ,EAAE,YAAY,EACtB,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,MAAM,EACN,aAAa,GAAG,QAAQ,EACxB,KAAK,EAAE,SAAS,EAChB,YAAY;;IAEZ,QAAQ,EAAE,SAAS,EACnB,iBAAiB,GAAG,IAAI,EACxB,aAAa,GAAG,IAAI,EACpB,eAAe,GAAG,OAAO,EACzB,cAAc,EACd,GAAG,IAAI,EACR,GAAG,KAAK;AACT,IAAA,MAAM,QAAQ,GAAG,mBAAmB,CAAC,YAAY,CAAC;AAClD,IAAA,MAAM,MAAM,GAAG,aAAa,KAAK,QAAQ;AACzC,IAAA,MAAM,OAAO,GAAG,aAAa,KAAK,UAAU;AAE5C,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AACpD,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAC3D,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAI;QACjC,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;AAC9B,QAAA,OAAO,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK;AAC9C,IAAA,CAAC;;AAGD,IAAA,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,aAAa,CACnC,SAAS,EACT,YAAY,IAAI,IAAI,CACrB;AACD,IAAA,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC;AAC3B,IAAA,MAAM,MAAM,GAAG,CAAC,IAAc,KAAI;AAChC,QAAA,MAAM,KAAK,GAAG,MAAM,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,IAAI,IAAI;QAC/C,OAAO,CAAC,KAAK,CAAC;;AAEd,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,QACoC;AACzD,QAAA,MAAM,GAAG,KAAK,CAAC;AACjB,IAAA,CAAC;;;;IAID,MAAM,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC;AAExE,IAAA,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IACvD,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,OAAO,KAAK,SAAS,EAAE;AACzB,YAAA,QAAQ,CACN,0BAA0B,EAC1B,CAAA,iDAAA,EAAoD,OAAO,CAAA,GAAA,CAAK;gBAC9D,gEAAgE;gBAChE,gEAAgE;AAChE,gBAAA,mDAAmD,CACtD;QACH;AACF,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAEb,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,aAAa,CAC3C,YAAY,EACZ,eAAe,CAChB;AACD,IAAA,MAAM,cAAc,GAAG,CAAC,IAAc,KAAI;QACxC,WAAW,CAAC,IAAI,CAAC;AACjB,QAAA,gBAAgB,GAAG,IAAI,CAAC;AAC1B,IAAA,CAAC;;AAGD,IAAA,MAAM,SAAS,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC;IACjC,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AAE3E,IAAA,MAAM,CAAC,KAAK,EAAE,aAAa,CAAC,GAAG,aAAa,CAAC,SAAS,EAAE,YAAY,CAAC;AACrE,IAAA,MAAM,QAAQ,GAAG,CAAC,IAAY,KAAI;QAChC,IAAI,IAAI,KAAK,KAAK;YAAE;QACpB,aAAa,CAAC,IAAI,CAAC;AACnB,QAAA,aAAa,GAAG,IAAI,CAAC;AACvB,IAAA,CAAC;AAED,IAAA,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,GAAG,aAAa,CAAC,QAAQ,EAAE,WAAW,CAAC;AACnE,IAAA,MAAM,OAAO,GAAG,CAAC,IAAa,KAAI;QAChC,IAAI,IAAI,KAAK,MAAM;YAAE;QACrB,IAAI,IAAI,EAAE;;AAER,YAAA,MAAM,IAAI,GAAG,CAAC,MAAM,KAAK,SAAS,IAAI,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,EAAE;AACpE,YAAA,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE;gBACjD,cAAc,CAAC,OAAO,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;YACzC;QACF;aAAO;YACL,QAAQ,CAAC,EAAE,CAAC;QACd;QACA,YAAY,CAAC,IAAI,CAAC;AAClB,QAAA,YAAY,GAAG,IAAI,CAAC;AACtB,IAAA,CAAC;AAED,IAAA,MAAM,SAAS,GAAG,gBAAgB,EAAE;AACpC,IAAA,MAAM,KAAK,GAAG,UAAU,GAAG,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE;;;AAG5C,IAAA,MAAM,MAAM,GAAG,OAAO,CACpB,MACE;UACI,UAAU,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,KAAI;AAC9B,YAAA,IAAI,MAAM;gBAAE,OAAO,MAAM,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC;AAC5C,YAAA,MAAM,IAAI,GAAG,SAAS,CAAC,IAAI,CAAC;AAC5B,YAAA,OAAO;AACL,kBAAE,SAAS,CAAC,IAAI,EAAE,KAAK;AACvB,kBAAE,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;AACtD,QAAA,CAAC;AACH,UAAE,IAAI;;;;;AAKV,IAAA,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,CAAC,CACzB;;;;AAID,IAAA,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC;AAC/C,QAAA,KAAK,EAAE,KAAK;AACZ,QAAA,MAAM,EAAE,EAAc;AACvB,KAAA,CAAC;AACF,IAAA,IAAI,YAAY,CAAC,KAAK,KAAK,KAAK,EAAE;QAChC,eAAe,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;IAC/C;AACA,IAAA,MAAM,UAAU,GAAG,YAAY,CAAC,KAAK,KAAK,KAAK,GAAG,YAAY,CAAC,MAAM,GAAG,EAAE;;;IAG1E,MAAM,MAAM,GAAG;AACb,UAAE,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC;UACvD,EAAE;IACN,MAAM,aAAa,GAAG,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC;;;;;AAK/C,IAAA,MAAM,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC;AACpC,IAAA,MAAM,oBAAoB,GAAG,CAAC,IAAc,KAAI;AAC9C,QAAA,IAAI,cAAc,CAAC,OAAO,EAAE;AAC1B,YAAA,cAAc,CAAC,OAAO,GAAG,KAAK;YAC9B;QACF;AACA,QAAA,MAAM,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnE,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnE,QAAA,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnE,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,eAAe,CAAC;AACd,gBAAA,KAAK,EAAE,KAAK;AACZ,gBAAA,MAAM,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,YAAY,CAAC;AACzC,aAAA,CAAC;QACJ;QACA,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE;AACvE,YAAA,cAAc,CAAC;AACb,gBAAA,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACpD,gBAAA,GAAG,MAAM;AACV,aAAA,CAAC;QACJ;AACF,IAAA,CAAC;;;AAID,IAAA,MAAM,OAAO,GAAG,CAAC,KAAa,KAC5B,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;QAC1B,KAAK,CAAC,GAAG,CAAC,KAAK,CAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtE,MAAM,WAAW,GACf,MAAM,KAAK,SAAS,IAAI,OAAO,CAAC,MAAM;AACpC,UAAE;AACF,UAAE,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK;;;;IAKnD,MAAM,QAAQ,GAAG,CAAC,IAAkB,KAClC,CAAC,IAAI,CAAC,QAAQ,KAAK,iBAAiB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;AAC9D,IAAA,MAAM,IAAI,GAAG,CAAC,KAAa,KAAI;QAC7B,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,KAAK;AAAE,YAAA,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC;AAC/D,QAAA,IAAI,aAAa;YAAE,OAAO,CAAC,KAAK,CAAC;AACnC,IAAA,CAAC;AACD,IAAA,MAAM,WAAW,GAAG,qBAAqB,CAAC,kBAAkB,CAAC;AAC7D,IAAA,MAAM,WAAW,GAAG,CAAC,IAAkB,KACrC;AACE,UAAE;AACE,YAAA,SAAS,EAAE,CAAC,KAAyC,KAAI;AACvD,gBAAA,IACE,KAAK,CAAC,MAAM,KAAK,KAAK,CAAC,aAAa;AACpC,oBAAA,KAAK,CAAC,MAAM;AACZ,oBAAA,KAAK,CAAC,MAAM;AACZ,oBAAA,KAAK,CAAC,OAAO;AACb,oBAAA,KAAK,CAAC,OAAO;AACb,qBAAC,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,EAC5C;oBACA;gBACF;AACA,gBAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE;AAClB,oBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;gBAClB;qBAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,YAAY,CAAC,IAAI,CAAC,EAAE;;oBAE/C,KAAK,CAAC,cAAc,EAAE;oBACtB,oBAAoB,CAClB,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK;AAC/B,0BAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK;0BAClD,CAAC,GAAG,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CACnC;gBACH;YACF,CAAC;AACD,YAAA,OAAO,EAAE,CAAC,KAAsC,KAAI;AAClD,gBAAA,MAAM,IAAI,GAAG,KAAK,CAAC,aAAa;AAChC,gBAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAiB;;;;AAItC,gBAAA,MAAM,KAAK,GACT,MAAM,KAAK,IAAI,IAAI,IAAI,CAAC,iBAAkB,CAAC,QAAQ,CAAC,MAAM,CAAC;AAC7D,gBAAA,MAAM,SAAS,GACb,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,WAAW,CAAA,CAAE,CAAC;gBAC3D,IAAI,KAAK,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE;;;AAGzC,oBAAA,cAAc,CAAC,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC;oBAC3C,cAAc,CAAC,MAAK;AAClB,wBAAA,cAAc,CAAC,OAAO,GAAG,KAAK;AAChC,oBAAA,CAAC,CAAC;AACF,oBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;gBAClB;YACF,CAAC;AACF;UACD,SAAS;IAEf,MAAM,UAAU,GAAG,CAAC,IAAkB,MACpCA,GAAA,CAAC,QAAQ,CAAC,IAAI,IAEZ,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,YAAY,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,SAAS,CAAC,IAAI,CAAC,EAC1D,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,oBAAA,EAErB,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,KAAK,WAAW,GAAG,EAAE,GAAG,SAAS,EAAA,GAExD,WAAW,CAAC,IAAI,CAAC,EAAA,QAAA,EAEpB,UAAU,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,EAAA,EAd5B,IAAI,CAAC,KAAK,CAeD,CACjB;;;IAID,MAAM,MAAM,GAAG,CAAC,IAAc,KAC5B,OAAO,GAAG,iBAAiB,CAAC,OAAO,EAAE,IAAI,EAAE,eAAe,CAAC,GAAG,IAAI;AACpE,IAAA,MAAM,eAAe,GAAG,CAAC,IAAc,KAAK,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;;;;IAIhE,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC;IACxC,MAAM,MAAM,GAAG,OAAO,CACpB,OAAO,OAAO,GAAG,UAAU,CAAC,OAAO,EAAE,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC;;;;AAI7D,IAAA,CAAC,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAC9B;AACD,IAAA,MAAM,UAAU,GAAG,CAAC,KAAa,KAAK,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,QAAQ;;AAEvE,IAAA,MAAM,SAAS,GAAG,CAAC,KAAa,KAAK,MAAO,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,IAAI;;;;;;AAMvE,IAAA,MAAM,WAAW,GAAG,IAAI,GAAG,EAAU;IACrC,IAAI,MAAM,EAAE;AACV,QAAA,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,EAAE;YAC7B,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,GAAG,CAAC,GAAG,CAAE;YAChC,IACE,SAAS,CAAC,GAAG,CAAC;AACd,gBAAA,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,UAAU,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,CAAC,EAC1D;AACA,gBAAA,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC;AACpB,gBAAA,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;YAC/C;QACF;IACF;SAAO,IAAI,CAAC,MAAM,EAAE;QAClB,MAAM,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IACvE;;;AAGA,IAAA,MAAM,SAAS,GAAG,CAAC,KAAa,KAC9B,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AACrE,IAAA,MAAM,OAAO,GAAG,CAAC,KAAa,KAC5B,OAAO,IAAI,OAAO,CAAC,GAAG,CAAC,KAAK;UACxB,MAAM,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC;AAC5C,UAAE,MAAM,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,KAAK,KAAK,CAAC;;;IAG3C,MAAM,OAAO,GAAG;AACd,UAAE;UACA,MAAM,CACJ;cACI,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,MAAM,CAC/B,KAAK,IAAI,UAAU,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC;cAEhD,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,CAC9B;IACL,MAAM,QAAQ,GAAG;AACf,UAAE,MAAM,CAAC,MAAM,GAAG;UAChB,WAAW,CAAC,IAAI,GAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AACnE,IAAA,MAAM,QAAQ,GAAG,MAAM,CAA0B,IAAI,CAAC;;;AAGtD,IAAA,MAAM,aAAa,GAAG,MAAM,CAAsB,IAAI,CAAC;AACvD,IAAA,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,IAA6B,KAAI;AAChC,QAAA,QAAQ,CAAC,OAAO,GAAG,IAAI;AACvB,QAAA,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC7B,YAAA,IAAI,IAAI,KAAK,IAAI,EAAE;AACjB,gBAAA,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO;AACrC,gBAAA,aAAa,CAAC,OAAO,GAAG,IAAI;AAC5B,gBAAA,IAAI,OAAO;AAAE,oBAAA,OAAO,EAAE;;oBACjB,GAAG,CAAC,IAAI,CAAC;gBACd;YACF;AACA,YAAA,MAAM,OAAO,GAAY,GAAG,CAAC,IAAI,CAAC;AAClC,YAAA,aAAa,CAAC,OAAO;gBACnB,OAAO,OAAO,KAAK,UAAU,GAAI,OAAsB,GAAG,IAAI;QAClE;aAAO,IAAI,GAAG,EAAE;AACd,YAAA,GAAG,CAAC,OAAO,GAAG,IAAI;QACpB;AACF,IAAA,CAAC,EACD,CAAC,GAAG,CAAC,CACN;AACD,IAAA,MAAM,MAAM,GAAG,KAAK,EAAE;IACtB,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;AAElC,IAAA,MAAM,WAAW,GAAG,qBAAqB,CAAC,OAAO,EAAE,oBAAoB,EAAE;AACvE,QAAA,CAAC,MAAM,IAAI,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI;AACvB,KAAA,CAAC;AACF,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,mBAAmB,CAAC;AAC7D,IAAA,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC;AAC9C,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;IAC7C,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,KAAK;;AAE9C,IAAA,MAAM,aAAa,GAAG,WAAW,CAAC,MAAK;AACrC,QAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,OAAO;;AAE7B,QAAA,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,IAAI;AACtB,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC;IACzB,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,QACEA,GAAA,CAAC,YAAY,EAAA,EAAA,GACP,IAAI,EACR,SAAS,EAAC,YAAY,EACtB,SAAS,EAAC,aAAa,EACvB,UAAU,EAAC,mBAAmB,EAC9B,IAAI,EAAE,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAC5D,MAAM,EAAE,MAAM,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,GAAG,MAAM,EAC3C,QAAQ,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,EAC3B,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,OAAO,EACrB,cAAc,EACZ;cACI,GAAG,IAAG;gBACJ,QAAQ,CAAC,GAAG,CAAC;gBACb,OAAO,CAAC,IAAI,CAAC;AACb,gBAAA,OAAO,IAAI;YACb;cACA,SAAS,EAEf,OAAO,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,EAC9B,SAAS,EAAE,SAAS,IAAI,QAAQ,EAChC,WAAW,EAAE,MAAK;;;AAGhB,YAAA,MAAM,IAAI,GAAG,SAAS,KAAK,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC,GAAG,EAAE;AAChE,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,MAAM,CAAC;gBAAE,MAAM,CAAC,IAAI,CAAC;AAC7C,QAAA,CAAC,EACD,UAAU,EAAE,MAAM,EAAE,KAAK,IAAI,OAAO,EACpC,WAAW,EAAE,MAAM,EAAE,MAAM,EAC3B,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,MAAM,GAAG,SAAS,GAAG,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,EAC/C,KAAK,EACH,MAAM,GAAG,SAAS,IAChBA,IAAC,SAAS,EAAA,EACR,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,KAAK,IAAG;AAChB,gBAAA,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AACtB,gBAAA,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE;AAC3B,YAAA,CAAC,EAAA,CACD,CACH,EAEH,oBAAoB,EAAE,aAAa,EAAA,QAAA,EAElC,SAAS,KACRC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACG,UAAU,KACTF,GAAA,CAAA,OAAA,EAAA,EACE,SAAS,EAAE,WAAW,EACtB,IAAI,EAAC,QAAQ,EAAA,YAAA,EACD,MAAM,EAAE,MAAM,IAAI,QAAQ,EACtC,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,KAAK,EAAA,oBAAA,EACO,EAAE,EACrB,QAAQ,EAAE,KAAK,IAAI,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAC/C,OAAO,EAAE,KAAK,IAAG;;wBAEf,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK;wBAC5C,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,MAAM,EAAE,MAAM,CAAC;AACvD,oBAAA,CAAC,EACD,SAAS,EAAE,KAAK,IAAG;AACjB,wBAAA,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;;4BAEzB,KAAK,CAAC,cAAc,EAAE;wBACxB;6BAAO,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;4BACrD,KAAK,CAAC,cAAc,EAAE;AACtB,4BAAA,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO;AAC5B,4BAAA,CACE,IAAI,EAAE,aAAa,CACjB,iCAAiC,CAClC,IAAI,IAAI,EAAE,aAAa,CAAc,mBAAmB,CAAC,GACzD,KAAK,EAAE;wBACZ;oBACF,CAAC,EAAA,CACD,CACH,EACA,YAAY,IACX,KAAK,KACHA,aAAK,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,QAAQ,EAAA,QAAA,EACtC,KAAK,EAAA,CACF,CACP,KAEDA,GAAA,CAAC,qBAAqB,CAAC,QAAQ,EAAA,EAC7B,KAAK,EAAE,MAAM,EAAE,MAAM,IAAI,cAAc,YAEvCA,GAAA,CAAC,QAAQ,OACH,SAAS,EACb,GAAG,EAAE,OAAO;;;wBAGZ,QAAQ,EAAE,EAAE,EACZ,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,IAAI,IAAI,SAAS,EAClD,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,EACpC,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,aAAa,EACvB,gBAAgB,EAAE,oBAAoB,EACtC,YAAY,EAAE,MAAM,EAAE,OAAO,EAC7B,UAAU,EAAE,MAAM,EAAE,KAAK,EACzB,mBAAmB,EAAE,MAAM,EAAE,mBAAmB,EAChD,kBAAkB,EAAE,MAAM,EAAE,kBAAkB,EAAA,QAAA,EAE7C,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,EAAA,CACZ,GACoB,CAClC,EACDA,GAAA,CAAC,YAAY,EAAA,EACX,KAAK,EAAE,YAAY,IAAI,KAAK,GAAG,SAAS,GAAG,YAAY,EACvD,QAAQ,EAAE,aAAa,EAAA,CACvB,CAAA,EAAA,CACD,CACJ,EAAA,CACY;AAEnB,CAAC;AAGH,UAAU,CAAC,WAAW,GAAG,YAAY;;"}
|
|
1
|
+
{"version":3,"file":"TreeSelect.js","sources":["../../../src/form/TreeSelect.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { usePrefixedClassNames } from '../helpers/classNames';\nimport type { BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { useLocaleMatcher } from '../helpers/localeFormat';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\nimport {\n TreeViewHiddenContext,\n readChecks,\n toggledList,\n} from '../helpers/useTreeView';\nimport { useControlled } from '../helpers/useControlled';\nimport {\n checkRecords,\n checkedByStrategy,\n childNodes,\n indexTree,\n isParentNode,\n nodeLabel,\n searchTree,\n} from '../helpers/treeData';\nimport { TreeView } from '../components/TreeView';\nimport type { FormFieldProps } from './fieldProps';\nimport { useFieldsetDisabled } from './FormContext';\nimport type { PickerPosition } from './_pickerInternals/pickerTypes';\nimport { DialogSelect } from './_selectInternals/DialogSelect';\nimport { ValueTags, tagIds } from './_selectInternals/ValueTags';\n\n/**\n * One node in a TreeSelect's `data`: Combobox's item fields plus\n * TreeView.Item's, with `children` for the nodes under it.\n */\nexport interface TreeItemData {\n /** **Required.** What the value holds and `name` posts. Unique in the whole tree. */\n value: string;\n /** What the row, the field and the tags show, and what search matches. The `value` when it's left out. */\n label?: string;\n /** Reachable, but never picked, checked, opened or closed. */\n disabled?: boolean;\n /** A picture before the label: an `Icon` name, or a node. Hidden from assistive tech. */\n icon?: React.ReactNode;\n /** The nodes under this one. */\n children?: TreeItemData[];\n /** Shows the node as a parent before its children are known, for a branch that loads when it opens. */\n hasChildren?: boolean;\n /** Its children are on their way: an open branch ends in a row that says so, and the live region says it too. */\n isLoading?: boolean;\n /** Its children didn't load: an open branch ends in this message, with a Retry button when there's an `onRetry`. */\n loadError?: React.ReactNode;\n /** Called by the Retry button on a failed load's row. Set `isLoading` while the retry runs. */\n onRetry?: () => void;\n}\n\n/** What a checked branch puts in the value a check makes. */\nexport type TreeSelectCheckedStrategy = 'child' | 'parent' | 'all';\n\n/** The visible and accessible strings, in your app's language. */\nexport interface TreeSelectLabels {\n /**\n * Names the panel and the tree in it.\n * @defaultValue the field's label\n */\n choose?: string;\n /**\n * Names the search box.\n * @defaultValue 'Search'\n */\n search?: string;\n /**\n * Names the clear button.\n * @defaultValue 'Clear'\n */\n clear?: string;\n /**\n * What a loading branch's row says, as on TreeView.\n * @defaultValue 'Loading…'\n */\n loading?: string;\n /**\n * The Retry button's text on a failed load's row, as on TreeView.\n * @defaultValue 'Retry'\n */\n retry?: string;\n /**\n * What the live region says when an open branch starts loading, built\n * from its name, as on TreeView.\n * @defaultValue name => `Loading ${name}`\n */\n loadingAnnouncement?: (name: string) => string;\n /**\n * What the live region says when that load finishes, as on TreeView.\n * @defaultValue name => `${name} loaded`\n */\n loadedAnnouncement?: (name: string) => string;\n}\n\n/**\n * What every TreeSelect takes. The helper props and the other attributes\n * land on the root `<div>`, as Combobox's do, and the `ref` on the field.\n */\ninterface TreeSelectBaseProps\n extends\n Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'color' | 'onChange' | 'defaultValue' | 'children'\n >,\n Omit<BulmaClassesProps, 'color'>,\n FormFieldProps {\n /** **Required.** The tree, as nodes nested through `children`. */\n data: TreeItemData[];\n /**\n * The field's label, which names the field through `htmlFor`, and the\n * panel and the tree in it through `aria-labelledby`. Dropped inside an\n * outer `Field`, whose label names them instead.\n */\n label?: React.ReactNode;\n /** The field's `id`, which the label then points at. The panel's is this one with `-panel` after it. */\n id?: string;\n /** Names the field, and the panel and the tree, in place of a `label`. */\n 'aria-label'?: string;\n /** The ids of what names the field, and the panel and the tree, in place of a `label`. */\n 'aria-labelledby'?: string;\n /** The ids of what describes the field, ahead of the tags. */\n 'aria-describedby'?: string;\n /** The open branches' values when you hold the state, as TreeView's `expanded`. */\n expanded?: string[];\n /** The branches open to begin with, when TreeSelect holds its own state. */\n defaultExpanded?: string[];\n /**\n * Called with the new list whenever a branch opens or closes, opening the\n * panel on the picked item's branch included. Fetch a lazy branch's\n * children from here. The branches a search opens aren't in it.\n */\n onExpandedChange?: (expanded: string[]) => void;\n /** Whether the panel is open, controlled: opening and closing then only call `onOpenChange`. */\n open?: boolean;\n /** The panel is open to begin with. */\n defaultOpen?: boolean;\n /** Called with the new state when the panel opens or closes. */\n onOpenChange?: (open: boolean) => void;\n /**\n * Puts a search box at the top of the panel. It matches labels, keeps a\n * match's ancestors and the nodes under it, and opens every branch with a\n * match. A printable key on the field opens the panel with it in the box,\n * and the search empties when the panel closes.\n */\n searchable?: boolean;\n /** The search text when you hold the state. */\n query?: string;\n /** The search text to begin with. */\n defaultQuery?: string;\n /** Called with the search text as it changes. */\n onQueryChange?: (query: string) => void;\n /**\n * Whether a node matches the search, in place of the locale-aware match on\n * its label. It's handed the search text trimmed, the node, and its path\n * from the top node down, the node last, as Cascader's `filter` is. A\n * match's ancestors stay either way. The search runs again when the search\n * text or `data` changes, not when only this does, so one written inline\n * costs nothing.\n */\n filter?: (query: string, item: TreeItemData, path: TreeItemData[]) => boolean;\n /** What the panel shows when the search matches nothing, such as \"No folders match\". Announced once. */\n empty?: React.ReactNode;\n /** Renders a row's content in place of its label. The field and the tags still show the label. */\n itemTemplate?: (item: TreeItemData) => React.ReactNode;\n /** What the field shows while nothing is picked. */\n placeholder?: string;\n /** A form field name. A hidden input posts the value, or one per value in the checkbox modes. */\n name?: string;\n /** The id of the form the hidden inputs belong to, when it isn't an ancestor. */\n form?: string;\n /**\n * A value is needed: the field is `aria-required`, and the form won't\n * submit while nothing is picked. The browser's message points at the\n * field, which shows focus, and the next key goes to it.\n */\n required?: boolean;\n /** The field can't be used: it can't be focused or opened, its tags lose their buttons, and its hidden inputs don't post. */\n disabled?: boolean;\n /**\n * Shows a clear button at the field's inline end while something it can\n * take off is picked. It leaves checked disabled items, which no control\n * unchecks.\n */\n clearable?: boolean;\n /** Bulma color modifier for the field. */\n color?: 'primary' | 'link' | 'info' | 'success' | 'warning' | 'danger';\n /** The field's size, which the tree in the panel follows. */\n size?: 'small' | 'medium' | 'large';\n /** Rounds the field's corners (Bulma's `is-rounded`). */\n isRounded?: boolean;\n /**\n * Where the panel opens against the field, as on the pickers. Left out, it\n * opens below and lines up with the field's start edge, which is its right\n * edge on a right-to-left page. A corner you pass stays physical, so\n * `bottom-left` lines up the left edges either way.\n * @defaultValue 'bottom-left'\n */\n position?: PickerPosition;\n /** Renders the panel through a portal, into a `ConfigProvider`'s `portalContainer`, else the overlay it's in that takes its popups, such as a `Modal`, else `document.body`. */\n appendToBody?: boolean;\n /** The visible and accessible strings, in your app's language. */\n labels?: TreeSelectLabels;\n}\n\n/** Props for a TreeSelect that picks one item. */\nexport interface TreeSelectSingleProps extends TreeSelectBaseProps {\n /**\n * `'single'`: one item, picked with Enter, Space or a click on its row.\n * `'checkbox'`: any number, with a box on every item. A check reaches every\n * enabled item under it, and a parent with some of them checked is mixed.\n * `'checkbox-independent'`: any number, each box checking its own item, so\n * a parent means the parent alone (Mantine's and Ant Design's\n * `checkStrictly`). The checkbox modes show the value as tags.\n */\n selectionMode?: 'single';\n /**\n * The value when you hold the state: in `'single'` the picked item's\n * value, or `null` for none, and in the checkbox modes the checked values.\n * In `'checkbox'` a parent's value checks its whole branch, so the list any\n * `checkedStrategy` gives checks the same boxes.\n */\n value?: string | null;\n /** The value to begin with, when TreeSelect holds its own state: a value or `null`, or a list in the checkbox modes. */\n defaultValue?: string | null;\n /**\n * Called with the new value: in `'single'` the picked item's value, or\n * `null` when it's cleared, and in the checkbox modes the new list, after a\n * check, an uncheck, a tag's button or the clear button, each shaped by\n * `checkedStrategy`. A reset of the field's form calls it too, with\n * `defaultValue` as it was given, or with `null` or `[]` when you hold\n * the value, for you to set.\n */\n onChange?: (value: string | null) => void;\n /**\n * A parent's row picks the parent. `false` makes the row, Enter and Space\n * open it instead, so only leaves are picked.\n * @defaultValue true\n */\n parentsSelectable?: boolean;\n /**\n * Closes the panel after a pick and puts focus back on the field.\n * @defaultValue true\n */\n closeOnSelect?: boolean;\n /** Read with the checkbox modes only. */\n checkedStrategy?: never;\n /** Read with the checkbox modes only. */\n ariaCloseLabel?: never;\n}\n\n/** Props for a TreeSelect with a box on every item. */\nexport interface TreeSelectCheckboxProps extends TreeSelectBaseProps {\n /**\n * `'checkbox'`: a check reaches every enabled item under it, and a parent\n * with some of them checked is mixed. `'checkbox-independent'`: each box\n * checks its own item, so a parent means the parent alone.\n */\n selectionMode: 'checkbox' | 'checkbox-independent';\n /**\n * The checked values when you hold the state. In `'checkbox'`, a parent's\n * value checks its whole branch, so the list any `checkedStrategy` gives\n * checks the same boxes.\n */\n value?: string[];\n /** The values checked to begin with, when TreeSelect holds its own state. */\n defaultValue?: string[];\n /**\n * Called with the new list after a check, an uncheck, a tag's button or\n * the clear button, shaped by `checkedStrategy`, and after a reset of the\n * field's form, with `defaultValue` as given, or `[]` when you hold the\n * value.\n */\n onChange?: (value: string[]) => void;\n /**\n * What a checked branch puts in the value, in `'checkbox'`: `'child'` its\n * leaves, `'parent'` its topmost checked item, `'all'` every checked item,\n * parents included. A checked disabled item is in all three, since only\n * its own value checks it. It shapes the value a check, an uncheck, a\n * tag's button or the clear button makes, which `onChange` reports, and\n * not `defaultValue`, a value you pass or the one a form reset puts back.\n * The tags and the hidden\n * inputs show the value as it's held, so a value you pass shows as you\n * pass it, and a branch that loads later changes nothing the form posts.\n * `'checkbox-independent'` always reports exactly the checked items.\n * @defaultValue 'child'\n */\n checkedStrategy?: TreeSelectCheckedStrategy;\n /** Names each tag's button, in place of \"Remove\" and the item's label, as on Combobox. */\n ariaCloseLabel?: string;\n /** Read with `'single'` only. */\n parentsSelectable?: never;\n /** Read with `'single'` only: the panel stays open while boxes are checked. */\n closeOnSelect?: never;\n}\n\n/**\n * Props for the TreeSelect component. The helper props and the other\n * attributes land on the `div.tree-select` around the field, and the `ref`\n * on the field. It renders the `Field` and the label itself, unless an outer\n * `Field` already does.\n *\n * @extraProp {React.Ref<HTMLInputElement>} [ref] - Ref forwarded to the field, the read-only `<input role=\"combobox\">`.\n */\nexport type TreeSelectProps = TreeSelectSingleProps | TreeSelectCheckboxProps;\n\nconst NOTHING_HIDDEN: ReadonlySet<string> = new Set();\nconst noMatches = [{ id: 'empty' }];\nconst nothingToSay: Array<{ id: string }> = [];\n/** What takes focus as the panel opens. */\nconst INITIAL_FOCUS = '[data-initial-focus]';\n\n/** One value or several, as a list. */\nconst asList = (value: string | string[] | null | undefined): string[] =>\n value == null ? [] : Array.isArray(value) ? value : [value];\n\n/** Whether two lists hold the same values, whatever their order and repeats. */\nconst sameValues = (a: string[], b: string[]): boolean => {\n const inA = new Set(a);\n const inB = new Set(b);\n return inA.size === inB.size && [...inA].every(value => inB.has(value));\n};\n\n/** The list with every value of `more` it doesn't have added at the end. */\nconst withAll = (list: string[], more: string[]): string[] => [\n ...list,\n ...more.filter(value => !list.includes(value)),\n];\n\n/**\n * The `TreeSelect` component is a form field whose options are a tree, such as categories, places or teams: it opens a panel holding a real `TreeView`, picks one item or checks a branch at a time, and searches labels.\n *\n * The field is a read-only `role=\"combobox\"` that opens a dialog, wired as\n * DateInput's is, so focus moves into the tree for real and the tree keeps\n * TreeView's keys, type-ahead and spoken output. The tree is given as `data`,\n * so the field and the tags can name what's picked while the panel is shut,\n * and on the server.\n *\n * `selectionMode` picks the kind. `'single'` picks one item and closes. With\n * `'checkbox'`, a check reaches every enabled item under it, closed or hidden\n * by a search, and `checkedStrategy` decides what the value holds: the\n * leaves, the topmost checked items or every one. With\n * `'checkbox-independent'`, each box is its own item's, so a parent means\n * itself alone (Mantine's and Ant Design's `checkStrictly`). The value shows\n * as tags under the field.\n *\n * A value no node has is kept and shown as it is, with a warning in\n * development, so a value under a branch that hasn't loaded survives until\n * it does.\n *\n * @function\n * @param {TreeSelectProps} props - Props for the TreeSelect component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the field.\n * @returns {JSX.Element} The field, its tags and its panel, in a `Field` with the label unless one is around it.\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/combobox/ | APG Combobox Pattern}\n *\n * @example\n * <TreeSelect\n * label=\"Save to\"\n * data={[\n * { value: 'docs', label: 'Documents', children: [{ value: 'invoices', label: 'Invoices' }] },\n * { value: 'photos', label: 'Photos' },\n * ]}\n * searchable\n * />\n *\n * @example\n * <TreeSelect label=\"Regions\" selectionMode=\"checkbox\" checkedStrategy=\"parent\" data={regions} />\n */\nexport const TreeSelect = forwardRef<HTMLInputElement, TreeSelectProps>(\n (props, ref) => {\n const {\n data,\n expanded: expandedProp,\n defaultExpanded = [],\n onExpandedChange,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n searchable = false,\n query: queryProp,\n defaultQuery = '',\n onQueryChange,\n filter,\n empty,\n itemTemplate,\n disabled: disabledProp,\n clearable = false,\n size,\n labels,\n selectionMode = 'single',\n value: valueProp,\n defaultValue,\n // Called below through `props`, which knows which value it takes.\n onChange: _onChange,\n parentsSelectable = true,\n closeOnSelect = true,\n checkedStrategy = 'child',\n ariaCloseLabel,\n ...rest\n } = props;\n const disabled = useFieldsetDisabled(disabledProp);\n const single = selectionMode === 'single';\n const cascade = selectionMode === 'checkbox';\n\n const index = useMemo(() => indexTree(data), [data]);\n const records = useMemo(() => checkRecords(index), [index]);\n const labelFor = (value: string) => {\n const entry = index.get(value);\n return entry ? nodeLabel(entry.node) : value;\n };\n\n // The value, as a list: none or one in `single`.\n const [held, setHeld] = useControlled<string | string[] | null>(\n valueProp,\n defaultValue ?? null\n );\n const listed = asList(held);\n const change = (next: string[]) => {\n const value = single ? (next[0] ?? null) : next;\n setHeld(value);\n // The mode decides which of the two `onChange` takes.\n const report = props.onChange as\n ((value: string | string[] | null) => void) | undefined;\n report?.(value);\n };\n // What the field, the tags and the hidden inputs show: the value as it's\n // held. `checkedStrategy` shapes a new value as a check makes it, so a\n // branch that loads later changes nothing the form posts.\n const picked = single ? listed.slice(0, 1) : Array.from(new Set(listed));\n\n const unknown = picked.find(value => !index.has(value));\n useEffect(() => {\n if (unknown !== undefined) {\n warnOnce(\n 'TreeSelect:unknown-value',\n `[bestax-bulma] <TreeSelect> was given the value \"${unknown}\", ` +\n 'which no node in its data has. It is kept and shown as it is, ' +\n 'as it should be for a node under a branch that has not loaded ' +\n 'yet. Otherwise, check the value against the data.'\n );\n }\n }, [unknown]);\n\n const [expanded, setExpanded] = useControlled(\n expandedProp,\n defaultExpanded\n );\n const changeExpanded = (next: string[]) => {\n setExpanded(next);\n onExpandedChange?.(next);\n };\n\n // The picked item focus goes to: the first in the tree's order.\n const pickedSet = new Set(picked);\n const target = Array.from(index.keys()).find(value => pickedSet.has(value));\n\n const [query, setQueryState] = useControlled(queryProp, defaultQuery);\n const setQuery = (next: string) => {\n if (next === query) return;\n setQueryState(next);\n onQueryChange?.(next);\n };\n\n const [isOpen, setOpenState] = useControlled(openProp, defaultOpen);\n const setOpen = (next: boolean) => {\n if (next === isOpen) return;\n if (next) {\n // Opening shows the picked item, its branch open.\n const path = (target !== undefined && index.get(target)?.path) || [];\n if (path.some(value => !expanded.includes(value))) {\n changeExpanded(withAll(expanded, path));\n }\n } else {\n setQuery('');\n }\n setOpenState(next);\n onOpenChange?.(next);\n };\n\n const matchText = useLocaleMatcher();\n const typed = searchable ? query.trim() : '';\n // Every item reads the hidden set, so it's only built again when the\n // search text or the data changes.\n const search = useMemo(\n () =>\n typed\n ? searchTree(data, (node, path) => {\n if (filter) return filter(typed, node, path);\n const text = nodeLabel(node);\n return matchText\n ? matchText(text, typed)\n : text.toLowerCase().includes(typed.toLowerCase());\n })\n : null,\n // `filter` is read as it is when the text or the data changes: one\n // written inline is a new function every render, and listing it would\n // search again on each.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [data, typed, matchText]\n );\n // The branches a search opened that were closed during it, for the\n // search text they were closed under: any new text, from the box or\n // from a held `query`, starts over.\n const [searchClosed, setSearchClosed] = useState({\n query: typed,\n values: [] as string[],\n });\n if (searchClosed.query !== typed) {\n setSearchClosed({ query: typed, values: [] });\n }\n const closedHere = searchClosed.query === typed ? searchClosed.values : [];\n // The branches a search opens show open over the ones you opened, and\n // close again once it's cleared.\n const forced = search\n ? search.open.filter(value => !closedHere.includes(value))\n : [];\n const shownExpanded = withAll(expanded, forced);\n // TreeView's click on a row selects it and opens it. A pick by click, as\n // a pick by Enter, only picks, so the open the tree asks for right after\n // one on a parent is dropped, and a lazy parent isn't fetched to be\n // picked.\n const clickPickedRef = useRef(false);\n const onTreeExpandedChange = (next: string[]) => {\n if (clickPickedRef.current) {\n clickPickedRef.current = false;\n return;\n }\n const closed = shownExpanded.filter(value => !next.includes(value));\n const opened = next.filter(value => !shownExpanded.includes(value));\n const closedForced = closed.filter(value => forced.includes(value));\n if (closedForced.length > 0) {\n setSearchClosed({\n query: typed,\n values: [...closedHere, ...closedForced],\n });\n }\n if (opened.length > 0 || closed.some(value => expanded.includes(value))) {\n changeExpanded([\n ...expanded.filter(value => !closed.includes(value)),\n ...opened,\n ]);\n }\n };\n\n // Whether an item is on the page with the panel open: every branch\n // above it open, and the search not hiding it.\n const visible = (value: string) =>\n !search?.hidden.has(value) &&\n index.get(value)!.path.every(above => shownExpanded.includes(above));\n const focusTarget =\n target !== undefined && visible(target)\n ? target\n : data.find(node => visible(node.value))?.value;\n\n // Picking in `single`. TreeView shows `selected`, held here, and the\n // picks are made from the rows' own keys and clicks, so a parent can\n // open instead and a pick of the picked item still closes.\n const pickable = (node: TreeItemData) =>\n !node.disabled && (parentsSelectable || !isParentNode(node));\n const pick = (value: string) => {\n if (listed.length !== 1 || listed[0] !== value) change([value]);\n if (closeOnSelect) setOpen(false);\n };\n const toggleClass = usePrefixedClassNames('tree-view-toggle');\n const rowHandlers = (node: TreeItemData) =>\n single\n ? {\n onKeyDown: (event: React.KeyboardEvent<HTMLLIElement>) => {\n if (\n event.target !== event.currentTarget ||\n event.repeat ||\n event.altKey ||\n event.ctrlKey ||\n event.metaKey ||\n (event.key !== 'Enter' && event.key !== ' ')\n ) {\n return;\n }\n if (pickable(node)) {\n pick(node.value);\n } else if (!node.disabled && isParentNode(node)) {\n // TreeView leaves a key that's been used alone.\n event.preventDefault();\n onTreeExpandedChange(\n shownExpanded.includes(node.value)\n ? shownExpanded.filter(value => value !== node.value)\n : [...shownExpanded, node.value]\n );\n }\n },\n onClick: (event: React.MouseEvent<HTMLLIElement>) => {\n const item = event.currentTarget;\n const target = event.target as Element;\n // A click in this item's own row, where TreeView reads one,\n // not one in the group of items inside it, and not on its\n // chevron, which only opens it.\n const inRow =\n target === item || item.firstElementChild!.contains(target);\n const onChevron =\n isParentNode(node) && !!target.closest(`.${toggleClass}`);\n if (inRow && !onChevron && pickable(node)) {\n // TreeView opens a parent it's handed this click on, in\n // this same click: the flag goes once the click is over.\n clickPickedRef.current = isParentNode(node);\n queueMicrotask(() => {\n clickPickedRef.current = false;\n });\n pick(node.value);\n }\n },\n }\n : undefined;\n\n const renderNode = (node: TreeItemData): React.ReactNode => (\n <TreeView.Item\n key={node.value}\n value={node.value}\n label={itemTemplate ? itemTemplate(node) : nodeLabel(node)}\n icon={node.icon}\n hasChildren={node.hasChildren}\n isLoading={node.isLoading}\n loadError={node.loadError}\n onRetry={node.onRetry}\n disabled={node.disabled}\n data-initial-focus={\n !searchable && node.value === focusTarget ? '' : undefined\n }\n {...rowHandlers(node)}\n >\n {childNodes(node).map(renderNode)}\n </TreeView.Item>\n );\n\n // In `checkbox`, TreeView reports every checked item, read here into\n // the list `checkedStrategy` gives.\n const shaped = (next: string[]) =>\n cascade ? checkedByStrategy(records, next, checkedStrategy) : next;\n const onCheckedChange = (next: string[]) => change(shaped(next));\n // Every item's check state, read once a render, which the clear button\n // and the tags' buttons decide from. Only `checkbox` reads TreeView's\n // rules: in `checkbox-independent` a listed item is a checked one.\n const listedKey = JSON.stringify(listed);\n const checks = useMemo(\n () => (cascade ? readChecks(records, new Set(listed)) : null),\n // `listed` by what it holds, since a held list is a new array each\n // render.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [cascade, records, listedKey]\n );\n const isDisabled = (value: string) => !!index.get(value)?.node.disabled;\n // Read in `checkbox` only, where there are states to read.\n const isChecked = (value: string) => checks!.states.get(value) === true;\n // What a control can uncheck. In `checkbox`, that's each checked end no\n // checked disabled item above it keeps checked, and every item above it,\n // which takes it along; elsewhere it's each listed item that isn't\n // disabled. A disabled item is checked only by its own value, so nothing\n // unchecks it, or what it keeps checked.\n const uncheckable = new Set<string>();\n if (checks) {\n for (const end of checks.ends) {\n const { path } = index.get(end)!;\n if (\n isChecked(end) &&\n !path.some(above => isDisabled(above) && isChecked(above))\n ) {\n uncheckable.add(end);\n path.forEach(above => uncheckable.add(above));\n }\n }\n } else if (!single) {\n picked.forEach(value => !isDisabled(value) && uncheckable.add(value));\n }\n // A tag's button takes its value off where that changes what's checked,\n // the way its box would. A value no node has can always go.\n const removable = (value: string) =>\n !index.has(value) || (!isDisabled(value) && uncheckable.has(value));\n const without = (value: string) =>\n cascade && records.has(value)\n ? shaped(toggledList(records, listed, value))\n : listed.filter(item => item !== value);\n // What the clear button leaves: the checked disabled items, and in\n // `checkbox` what they keep checked, shaped as a check's value is.\n const cleared = single\n ? []\n : shaped(\n checks\n ? Array.from(records.keys()).filter(\n value => isDisabled(value) && isChecked(value)\n )\n : picked.filter(isDisabled)\n );\n const canClear = single\n ? picked.length > 0\n : uncheckable.size > 0 || picked.some(value => !index.has(value));\n const inputRef = useRef<HTMLInputElement | null>(null);\n // A forwarded callback's cleanup, which React 19 lets it return, run on\n // detach in place of a call with `null`, on React 18 as well.\n const refCleanupRef = useRef<(() => void) | null>(null);\n const fieldRef = useCallback(\n (node: HTMLInputElement | null) => {\n inputRef.current = node;\n if (typeof ref === 'function') {\n if (node === null) {\n const cleanup = refCleanupRef.current;\n refCleanupRef.current = null;\n if (cleanup) cleanup();\n else ref(null);\n return;\n }\n const cleanup: unknown = ref(node);\n refCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n ref.current = node;\n }\n },\n [ref]\n );\n const tagsId = useId();\n const ids = tagIds(tagsId, picked);\n\n const searchClass = usePrefixedClassNames('input', 'tree-select-search', {\n [`is-${size}`]: !!size,\n });\n const emptyClass = usePrefixedClassNames('tree-select-empty');\n const treeRef = useRef<HTMLUListElement>(null);\n const emptyRef = useRef<HTMLDivElement>(null);\n const nothingFound = !!search && !search.found;\n // The region reads the text on screen, whatever `empty` renders.\n const describeEmpty = useCallback(() => {\n const node = emptyRef.current;\n /* istanbul ignore if: it's only announced while it's on screen */\n if (!node) return null;\n return spokenText(node);\n }, []);\n\n return (\n <DialogSelect\n {...rest}\n component=\"TreeSelect\"\n rootClass=\"tree-select\"\n panelClass=\"tree-select-panel\"\n text={single && picked.length > 0 ? labelFor(picked[0]) : ''}\n values={single ? [picked[0] ?? ''] : picked}\n hasValue={picked.length > 0}\n open={isOpen}\n onOpenChange={setOpen}\n onPrintableKey={\n searchable\n ? key => {\n setQuery(key);\n setOpen(true);\n return true;\n }\n : undefined\n }\n onClear={() => change(cleared)}\n clearable={clearable && canClear}\n onFormReset={() => {\n // Back to `defaultValue`, or to nothing for a held value, which\n // its owner sets from `onChange`.\n const back = valueProp === undefined ? asList(defaultValue) : [];\n if (!sameValues(back, listed)) change(back);\n }}\n clearLabel={labels?.clear || 'Clear'}\n chooseLabel={labels?.choose}\n disabled={disabled}\n size={size}\n inputRef={inputRef}\n fieldRef={fieldRef}\n describedBy={single ? undefined : ids.join(' ')}\n below={\n single ? undefined : (\n <ValueTags\n values={picked}\n ids={ids}\n labelFor={labelFor}\n disabled={disabled}\n ariaCloseLabel={ariaCloseLabel}\n removable={removable}\n onRemove={value => {\n change(without(value));\n inputRef.current?.focus();\n }}\n />\n )\n }\n initialFocusSelector={INITIAL_FOCUS}\n >\n {panelName => (\n <>\n {searchable && (\n <input\n className={searchClass}\n type=\"search\"\n aria-label={labels?.search || 'Search'}\n autoComplete=\"off\"\n value={query}\n data-initial-focus=\"\"\n onChange={event => setQuery(event.target.value)}\n onFocus={event => {\n // A key that opened the panel is in the box: type after it.\n const { length } = event.currentTarget.value;\n event.currentTarget.setSelectionRange(length, length);\n }}\n onKeyDown={event => {\n if (event.key === 'Enter') {\n // The search box's Enter would submit the form.\n event.preventDefault();\n } else if (event.key === 'ArrowDown' && !event.altKey) {\n event.preventDefault();\n const tree = treeRef.current;\n (\n tree?.querySelector<HTMLElement>(\n '[role=\"treeitem\"][tabindex=\"0\"]'\n ) ?? tree?.querySelector<HTMLElement>('[role=\"treeitem\"]')\n )?.focus();\n }\n }}\n />\n )}\n {nothingFound ? (\n empty && (\n <div className={emptyClass} ref={emptyRef}>\n {empty}\n </div>\n )\n ) : (\n <TreeViewHiddenContext.Provider\n value={search?.hidden ?? NOTHING_HIDDEN}\n >\n <TreeView\n {...panelName}\n ref={treeRef}\n // It scrolls, and Firefox makes a scroller a Tab stop of\n // its own: the roving one on its items is the tree's.\n tabIndex={-1}\n selectionMode={selectionMode}\n size={size}\n selected={single ? (picked[0] ?? null) : undefined}\n checked={single ? undefined : listed}\n onCheckedChange={onCheckedChange}\n expanded={shownExpanded}\n onExpandedChange={onTreeExpandedChange}\n loadingLabel={labels?.loading}\n retryLabel={labels?.retry}\n loadingAnnouncement={labels?.loadingAnnouncement}\n loadedAnnouncement={labels?.loadedAnnouncement}\n >\n {data.map(renderNode)}\n </TreeView>\n </TreeViewHiddenContext.Provider>\n )}\n <StatusRegion\n items={nothingFound && empty ? noMatches : nothingToSay}\n describe={describeEmpty}\n />\n </>\n )}\n </DialogSelect>\n );\n }\n);\n\nTreeSelect.displayName = 'TreeSelect';\n\nexport default TreeSelect;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Config.js","sources":["../../../src/helpers/Config.tsx"],"sourcesContent":["import React, { createContext, useContext, ReactNode } from 'react';\n\n/** Supported icon library identifiers. */\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Shape of the configuration context value.\n */\nexport interface ConfigContextProps {\n /** Prefix applied to all Bulma class names. */\n classPrefix?: string;\n /** Default icon library for Icon components. */\n iconLibrary?: IconLibrary;\n /** Where portaled content goes when it has no target of its own. */\n portalContainer?: string | HTMLElement;\n}\n\nconst ConfigContext = createContext<ConfigContextProps>({});\n\n/**\n * Hook to access the bulma-ui configuration context.\n *\n * @function\n * @returns {ConfigContextProps} The current configuration values.\n */\nexport const useConfig = () => useContext(ConfigContext);\n\n/**\n * Props for the ConfigProvider component.\n */\nexport interface ConfigProviderProps {\n /** Child components to receive configuration. */\n children: ReactNode;\n /** Prefix applied to all Bulma class names. */\n classPrefix?: string;\n /** Default icon library for Icon components. */\n iconLibrary?: IconLibrary;\n /**\n * Where portaled content goes when it has no target of its own: what a\n * `Portal` without a `container` renders, and what the library's components\n * portal, such as Popover's `appendToBody` panel, a `Modal` with `portal`\n * set to `true`, or a `Toast`. An element, or a `document.querySelector`\n * selector. Unset, or a selector that matches nothing, that content goes to\n * `document.body`, except a popup, such as Popover's panel or a picker's,\n * opened inside
|
|
1
|
+
{"version":3,"file":"Config.js","sources":["../../../src/helpers/Config.tsx"],"sourcesContent":["import React, { createContext, useContext, ReactNode } from 'react';\n\n/** Supported icon library identifiers. */\ntype IconLibrary = 'fa' | 'mdi' | 'ion' | 'material-icons' | 'material-symbols';\n\n/**\n * Shape of the configuration context value.\n */\nexport interface ConfigContextProps {\n /** Prefix applied to all Bulma class names. */\n classPrefix?: string;\n /** Default icon library for Icon components. */\n iconLibrary?: IconLibrary;\n /** Where portaled content goes when it has no target of its own. */\n portalContainer?: string | HTMLElement;\n}\n\nconst ConfigContext = createContext<ConfigContextProps>({});\n\n/**\n * Hook to access the bulma-ui configuration context.\n *\n * @function\n * @returns {ConfigContextProps} The current configuration values.\n */\nexport const useConfig = () => useContext(ConfigContext);\n\n/**\n * Props for the ConfigProvider component.\n */\nexport interface ConfigProviderProps {\n /** Child components to receive configuration. */\n children: ReactNode;\n /** Prefix applied to all Bulma class names. */\n classPrefix?: string;\n /** Default icon library for Icon components. */\n iconLibrary?: IconLibrary;\n /**\n * Where portaled content goes when it has no target of its own: what a\n * `Portal` without a `container` renders, and what the library's components\n * portal, such as Popover's `appendToBody` panel, a `Modal` with `portal`\n * set to `true`, or a `Toast`. An element, or a `document.querySelector`\n * selector. Unset, or a selector that matches nothing, that content goes to\n * `document.body`, except a popup, such as Popover's panel or a picker's,\n * opened inside an overlay that takes its popups. A `Modal`, a `Dialog`\n * and a `Command.Dialog` do, so screen readers that honor their\n * `aria-modal` reach the popup, and so does AppFrame's nav while it's a\n * drawer, so the popup shows above it. A `Sidebar` doesn't, so Popover's\n * or a picker's panel opened in an open one renders under it. Set, it\n * takes those popups too, which is how one in a `Sidebar` shows above it:\n * point it at an element of your own outside the sidebar that stacks above\n * it. A target a component is given, such as a `Toast`'s `container`,\n * still wins, and nothing portals that would otherwise render in place.\n *\n * The overlays and panels this moves are `position: fixed`, so pick an\n * element with no ancestor that has a `transform`, `filter`,\n * `backdrop-filter`, `perspective`, `will-change: transform`, or a\n * `contain` that includes `paint` or `layout`. That ancestor becomes their\n * containing block, and they cover or line up against it instead of the\n * viewport. An ancestor that starts a stacking context, with a `z-index` or\n * `isolation: isolate`, keeps them inside it, under anything the page\n * stacks above it. `NotificationContainer`'s status region moves too, so\n * this also decides where its announcements come from, and an `aria-hidden`\n * ancestor silences them.\n *\n * A selector can't find an element inside a shadow root, so pass the\n * element itself there, held in state from a ref callback. Content that\n * portals before the element is set goes to `document.body` and moves when\n * it is, which remounts it, as `Portal`'s `container` describes.\n */\n portalContainer?: string | HTMLElement;\n}\n\n/**\n * ConfigProvider injects configuration into all child components via React context.\n *\n * A nested provider replaces the outer one's settings rather than adding to\n * them, so inside it any setting it leaves out is back to its default.\n *\n * @function\n * @param {ConfigProviderProps} props - Provider props.\n * @returns {JSX.Element} The context provider wrapping children.\n *\n * @example\n * <ConfigProvider classPrefix=\"my-\" iconLibrary=\"mdi\">\n * <App />\n * </ConfigProvider>\n */\nexport const ConfigProvider: React.FC<ConfigProviderProps> = ({\n classPrefix,\n iconLibrary,\n portalContainer,\n children,\n}) => {\n return (\n <ConfigContext.Provider\n value={{ classPrefix, iconLibrary, portalContainer }}\n >\n {children}\n </ConfigContext.Provider>\n );\n};\n\n/**\n * Utility hook to get the configured class prefix string.\n *\n * @function\n * @returns {string} The class prefix, or empty string if none configured.\n */\nexport const useClassPrefix = () => {\n const { classPrefix } = useConfig();\n return classPrefix || '';\n};\n\n/**\n * Hook that returns a function to prefix a class name with the configured prefix.\n *\n * @function\n * @returns {(className: string) => string} A function that applies the class prefix.\n */\nexport const usePrefixedClass = () => {\n const { classPrefix } = useConfig();\n return (className: string) =>\n classPrefix ? `${classPrefix}${className}` : className;\n};\n\n/**\n * Hook to get the default icon library from configuration.\n *\n * @function\n * @returns {IconLibrary | undefined} The configured icon library, or undefined.\n */\nexport const useIconLibrary = () => {\n const { iconLibrary } = useConfig();\n return iconLibrary;\n};\n"],"names":["_jsx"],"mappings":";;;;;AAiBA,MAAM,aAAa,GAAG,aAAa,CAAqB,EAAE,CAAC;AAE3D;;;;;AAKG;AACI,MAAM,SAAS,GAAG,MAAM,UAAU,CAAC,aAAa;AAgDvD;;;;;;;;;;;;;;AAcG;AACI,MAAM,cAAc,GAAkC,CAAC,EAC5D,WAAW,EACX,WAAW,EACX,eAAe,EACf,QAAQ,GACT,KAAI;AACH,IAAA,QACEA,GAAA,CAAC,aAAa,CAAC,QAAQ,EAAA,EACrB,KAAK,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,eAAe,EAAE,YAEnD,QAAQ,EAAA,CACc;AAE7B;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;IACnC,OAAO,WAAW,IAAI,EAAE;AAC1B;AAEA;;;;;AAKG;AACI,MAAM,gBAAgB,GAAG,MAAK;AACnC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,CAAC,SAAiB,KACvB,WAAW,GAAG,CAAA,EAAG,WAAW,GAAG,SAAS,CAAA,CAAE,GAAG,SAAS;AAC1D;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,MAAK;AACjC,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE;AACnC,IAAA,OAAO,WAAW;AACpB;;"}
|
|
@@ -59,15 +59,20 @@ const PortalScopeContext = createContext(null);
|
|
|
59
59
|
* the popups inside it portal, unless a `ConfigProvider` sets a
|
|
60
60
|
* `portalContainer`. Modal, Dialog and Command.Dialog wrap their content in
|
|
61
61
|
* it, each with the element that carries their `aria-modal`, since a screen
|
|
62
|
-
* reader that honors it hides everything outside that element.
|
|
63
|
-
*
|
|
62
|
+
* reader that honors it hides everything outside that element. AppFrame's
|
|
63
|
+
* nav does too while it's a drawer, which draws over the page, so its popups
|
|
64
|
+
* show above it. The nearest one wins, so a Dialog's own box wins over the
|
|
65
|
+
* Modal it renders. An `undefined` node leaves the scope around it in place,
|
|
66
|
+
* for a part that only takes its popups some of the time, so its content
|
|
67
|
+
* keeps one tree either way.
|
|
64
68
|
*
|
|
65
69
|
* @function PortalScope
|
|
66
70
|
* @param props - `node`, the element popups portal into, and `children`.
|
|
67
71
|
* @returns The children, inside the scope.
|
|
68
72
|
*/
|
|
69
73
|
function PortalScope({ node, children, }) {
|
|
70
|
-
|
|
74
|
+
const outer = useContext(PortalScopeContext);
|
|
75
|
+
return (jsx(PortalScopeContext.Provider, { value: node === undefined ? outer : node, children: children }));
|
|
71
76
|
}
|
|
72
77
|
/**
|
|
73
78
|
* INTERNAL. Where a popup portals, a panel a component opens against
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal.js","sources":["../../../src/helpers/portal.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsHydrated } from './useIsHydrated';\nimport { useConfig } from './Config';\nimport { LocalePortalScope } from './LocaleProvider';\n\n/**\n * Resolves a portal target: an `HTMLElement` is used directly, a non-empty\n * `string` is treated as a `document.querySelector` selector (falling back to\n * `document.body` when it matches nothing), and any falsy value — `undefined`\n * or the empty string — resolves to `document.body`.\n *\n * The empty string is deliberately treated as \"no target\" rather than passed\n * through: `document.querySelector('')` throws a `SyntaxError`, and callers\n * building a selector from state can easily hand us `''`.\n *\n * @function resolvePortalContainer\n * @param container - The requested portal target, if any.\n * @returns The resolved DOM node to portal into.\n */\nexport function resolvePortalContainer(\n container?: string | HTMLElement\n): HTMLElement {\n if (!container) {\n return document.body;\n }\n if (typeof container === 'string') {\n return (\n (document.querySelector(container) as HTMLElement | null) ?? document.body\n );\n }\n return container;\n}\n\n/**\n * Where a component's portal goes, as a function to call when the portal is\n * created: the target the component was given, else the `portalContainer` a\n * `ConfigProvider` sets, else `document.body`, each read as\n * `resolvePortalContainer` reads it. A component that portals resolves its\n * target through this, so the provider's default reaches it.\n *\n * The hook only reads context, so it is safe to call on the server, ahead of\n * any early return. The function it returns reads the DOM, so call it only\n * where the portal is created, which the server never reaches.\n *\n * @function usePortalContainer\n * @returns A function that takes the component's own target, if any, and\n * returns the DOM node to portal into.\n */\nexport function usePortalContainer(): (\n container?: string | HTMLElement\n) => HTMLElement {\n const { portalContainer } = useConfig();\n return container => resolvePortalContainer(container || portalContainer);\n}\n\n/**\n * The element the overlay around a popup hands it to portal into, `null`\n * outside any, and inside one whose element hasn't mounted yet.\n */\nconst PortalScopeContext = createContext<HTMLElement | null>(null);\n\n/**\n * INTERNAL, deliberately not exported from `src/index.ts`. Makes `node` where\n * the popups inside it portal, unless a `ConfigProvider` sets a\n * `portalContainer`. Modal, Dialog and Command.Dialog wrap their content in\n * it, each with the element that carries their `aria-modal`, since a screen\n * reader that honors it hides everything outside that element. The nearest\n * one wins, so a Dialog's own box wins over the Modal it renders.\n *\n * @function PortalScope\n * @param props - `node`, the element popups portal into, and `children`.\n * @returns The children, inside the scope.\n */\nexport function PortalScope({\n node,\n children,\n}: {\n node: HTMLElement | null;\n children?: React.ReactNode;\n}) {\n return (\n <PortalScopeContext.Provider value={node}>\n {children}\n </PortalScopeContext.Provider>\n );\n}\n\n/**\n * INTERNAL. Where a popup portals, a panel a component opens against\n * something on the page, such as Popover's: the `portalContainer` a\n * `ConfigProvider` sets, else the overlay it's in (see `PortalScope`), else\n * `undefined`, which `resolvePortalContainer` reads as `document.body`.\n *\n * The overlay's element only exists once it has mounted, so a popup open as\n * the overlay first renders mounts in `document.body`, and moves into the\n * overlay in the update that follows, before the browser paints. Moving\n * remounts it, as any change of portal target does. It isn't held back\n * instead, because the popups measure their panel against the trigger as\n * they open, and a panel that isn't there yet is never placed.\n *\n * @function usePopupContainer\n * @returns The popup's container, `undefined` for `document.body`.\n */\nexport function usePopupContainer(): string | HTMLElement | undefined {\n const { portalContainer } = useConfig();\n const scope = useContext(PortalScopeContext);\n return portalContainer || scope || undefined;\n}\n\n/**\n * What a component that takes Modal's `portal` prop does with it now. See\n * `usePortalProp`.\n */\nexport interface PortalPropState {\n /**\n * Whether the content renders in its portal: `portal` is set and\n * hydration is over. Before that it renders in place.\n */\n isPortaled: boolean;\n /**\n * The target to pass `Portal` as its `container`: the selector or element\n * `portal` names, or `undefined` for `true`, which leaves the choice to the\n * `portalContainer` a `ConfigProvider` sets and then `document.body`.\n */\n container?: string | HTMLElement;\n /**\n * The `portalContainer` a `ConfigProvider` sets, while it's what places the\n * content (portaled, with `portal` set to `true`), else `undefined`. A\n * change to it moves the content, so effects that hold its nodes depend\n * on it.\n */\n defaultTarget?: string | HTMLElement;\n}\n\n/**\n * Reads Modal's `portal` prop (`boolean | string | HTMLElement`) for a\n * component that takes it: whether the content is in its portal yet, and\n * where it goes.\n *\n * A portal has no server-rendered counterpart, so such a component renders in\n * place on the server and while hydrating, and moves into its portal once the\n * client takes over. Render the content in `Portal` with\n * `disabled={!isPortaled}` and this `container`. Moving remounts the content,\n * so an effect that holds one of its nodes depends on `isPortaled`, `portal`\n * and `defaultTarget`.\n *\n * @function usePortalProp\n * @param portal - The component's `portal` prop.\n * @returns Whether it's portaled now, its `container`, and the provider's\n * target while that places it.\n */\nexport function usePortalProp(\n portal?: boolean | string | HTMLElement\n): PortalPropState {\n const hydrated = useIsHydrated();\n const { portalContainer } = useConfig();\n const isPortaled = Boolean(portal) && hydrated;\n return {\n isPortaled,\n container: typeof portal === 'boolean' ? undefined : portal,\n defaultTarget: isPortaled && portal === true ? portalContainer : undefined,\n };\n}\n\n/**\n * Props for the Portal component.\n */\nexport interface PortalProps {\n /** Content to render into the container. */\n children?: React.ReactNode;\n /**\n * Where the content goes: an element, or a `document.querySelector`\n * selector. Omitted or empty, it goes to the `portalContainer` a\n * `ConfigProvider` sets, and to `document.body` when none is set. A\n * selector that matches nothing means `document.body` too. A selector is\n * looked up again on each render, so the\n * content follows the target when it changes. Moving to another target\n * remounts the children and resets their state, which includes a selector\n * that only starts matching after the content has shown in `document.body`.\n * Render the target first, or pass the element once you have it.\n */\n container?: string | HTMLElement;\n /**\n * Render the children in place instead, on the server as well as the\n * client. Lets a component that portals only sometimes keep a single code\n * path.\n * @defaultValue false\n */\n disabled?: boolean;\n}\n\n/**\n * Renders its children into another part of the page, `document.body` unless `container` or a `ConfigProvider` says otherwise, so floating content escapes an ancestor's `overflow`, `transform` or stacking context.\n *\n * React's server renderer can't render a portal, so `Portal` renders nothing\n * on the server and during hydration, and mounts its children in the commit\n * that follows. The first client render then matches the server markup. In an app\n * without server rendering it portals on the first render.\n *\n * React context, such as `ConfigProvider`'s class prefix, reaches the\n * portaled children, and their React events bubble through the React tree.\n * CSS inheritance follows the DOM instead: a scoped (non-`isRoot`) `Theme`\n * sets its variables on a wrapper element the portaled content has left, so\n * that content sees the page-level theme, and styles scoped to a shadow root\n * don't reach `document.body` at all. To keep them, portal into an element\n * inside the themed area or the shadow root: pass it as `container`, or as\n * the `portalContainer` of a `ConfigProvider` around that area. The second\n * also reaches what the library's components portal, such as Popover's\n * `appendToBody` panel or a `Modal` with `portal`.\n *\n * Inside a `LocaleProvider`, the children keep its `dir` and `lang`. A\n * container inside the provider's own wrapper takes the children as they\n * are, and they follow the provider through the page. Any other,\n * `document.body` included, gets them inside one `<div>` carrying the\n * provider's values, with `display: contents` so it adds no box. It is\n * still an element, so content that must be the container's direct child,\n * a `<tr>` in a `<tbody>`, or that a direct-child selector styles, belongs\n * in a container inside the provider. Which of the two is settled when the\n * children mount, so a change of locale updates them in place rather than\n * remounting them.\n *\n * Tab order and focus follow the DOM too. Content portaled from inside a\n * focus trap is no longer inside the trapped element, so the trap neither\n * reaches it nor holds focus there: render nested overlays inside the\n * trapped element, or give them a trap of their own. To trap portaled\n * content, put `useFocusTrap`'s ref on the element inside the `Portal`.\n *\n * @function\n * @param {PortalProps} props - Props for the Portal component.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n *\n * @example\n * <Portal>\n * <div className=\"box\">Rendered at the end of document.body</div>\n * </Portal>\n *\n * @example\n * // Into a dedicated overlay root\n * <Portal container=\"#overlays\">\n * <CommandPalette />\n * </Portal>\n */\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n const hydrated = useIsHydrated();\n const resolveContainer = usePortalContainer();\n if (disabled) return <>{children}</>;\n if (!hydrated) return null;\n const target = resolveContainer(container);\n return createPortal(\n <LocalePortalScope target={target}>{children}</LocalePortalScope>,\n target\n );\n}\n\n/**\n * INTERNAL. `Portal` for a popup, into the container `usePopupContainer`\n * names, so a popup opened inside a Modal, Dialog or Command.Dialog stays\n * inside it. `disabled` renders the children in place, as `Portal`'s does.\n *\n * @function PopupPortal\n * @param props - The children, and `disabled`.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n */\nexport function PopupPortal({\n children,\n disabled = false,\n}: Omit<PortalProps, 'container'>) {\n const container = usePopupContainer();\n return (\n <Portal disabled={disabled} container={container}>\n {children}\n </Portal>\n );\n}\n"],"names":["_jsx","_Fragment"],"mappings":";;;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,SAAU,sBAAsB,CACpC,SAAgC,EAAA;IAEhC,IAAI,CAAC,SAAS,EAAE;QACd,OAAO,QAAQ,CAAC,IAAI;IACtB;AACA,IAAA,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACjC,QAAA,QACG,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAwB,IAAI,QAAQ,CAAC,IAAI;IAE9E;AACA,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;AAcG;SACa,kBAAkB,GAAA;AAGhC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,OAAO,SAAS,IAAI,sBAAsB,CAAC,SAAS,IAAI,eAAe,CAAC;AAC1E;AAEA;;;AAGG;AACH,MAAM,kBAAkB,GAAG,aAAa,CAAqB,IAAI,CAAC;AAElE;;;;;;;;;;;AAWG;SACa,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,GAIT,EAAA;AACC,IAAA,QACEA,GAAA,CAAC,kBAAkB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,IAAI,EAAA,QAAA,EACrC,QAAQ,EAAA,CACmB;AAElC;AAEA;;;;;;;;;;;;;;;AAeG;SACa,iBAAiB,GAAA;AAC/B,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;AACvC,IAAA,MAAM,KAAK,GAAG,UAAU,CAAC,kBAAkB,CAAC;AAC5C,IAAA,OAAO,eAAe,IAAI,KAAK,IAAI,SAAS;AAC9C;AA2BA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,aAAa,CAC3B,MAAuC,EAAA;AAEvC,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,QAAQ;IAC9C,OAAO;QACL,UAAU;AACV,QAAA,SAAS,EAAE,OAAO,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM;AAC3D,QAAA,aAAa,EAAE,UAAU,IAAI,MAAM,KAAK,IAAI,GAAG,eAAe,GAAG,SAAS;KAC3E;AACH;AA6BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDG;AACG,SAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAe,EAAA;AAC3E,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAG,kBAAkB,EAAE;AAC7C,IAAA,IAAI,QAAQ;QAAE,OAAOA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI;AACpC,IAAA,IAAI,CAAC,QAAQ;AAAE,QAAA,OAAO,IAAI;AAC1B,IAAA,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC;AAC1C,IAAA,OAAO,YAAY,CACjBD,GAAA,CAAC,iBAAiB,IAAC,MAAM,EAAE,MAAM,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAqB,EACjE,MAAM,CACP;AACH;AAEA;;;;;;;;;AASG;AACG,SAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,QAAQ,GAAG,KAAK,GACe,EAAA;AAC/B,IAAA,MAAM,SAAS,GAAG,iBAAiB,EAAE;AACrC,IAAA,QACEA,GAAA,CAAC,MAAM,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA,QAAA,EAC7C,QAAQ,EAAA,CACF;AAEb;;"}
|
|
1
|
+
{"version":3,"file":"portal.js","sources":["../../../src/helpers/portal.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useIsHydrated } from './useIsHydrated';\nimport { useConfig } from './Config';\nimport { LocalePortalScope } from './LocaleProvider';\n\n/**\n * Resolves a portal target: an `HTMLElement` is used directly, a non-empty\n * `string` is treated as a `document.querySelector` selector (falling back to\n * `document.body` when it matches nothing), and any falsy value — `undefined`\n * or the empty string — resolves to `document.body`.\n *\n * The empty string is deliberately treated as \"no target\" rather than passed\n * through: `document.querySelector('')` throws a `SyntaxError`, and callers\n * building a selector from state can easily hand us `''`.\n *\n * @function resolvePortalContainer\n * @param container - The requested portal target, if any.\n * @returns The resolved DOM node to portal into.\n */\nexport function resolvePortalContainer(\n container?: string | HTMLElement\n): HTMLElement {\n if (!container) {\n return document.body;\n }\n if (typeof container === 'string') {\n return (\n (document.querySelector(container) as HTMLElement | null) ?? document.body\n );\n }\n return container;\n}\n\n/**\n * Where a component's portal goes, as a function to call when the portal is\n * created: the target the component was given, else the `portalContainer` a\n * `ConfigProvider` sets, else `document.body`, each read as\n * `resolvePortalContainer` reads it. A component that portals resolves its\n * target through this, so the provider's default reaches it.\n *\n * The hook only reads context, so it is safe to call on the server, ahead of\n * any early return. The function it returns reads the DOM, so call it only\n * where the portal is created, which the server never reaches.\n *\n * @function usePortalContainer\n * @returns A function that takes the component's own target, if any, and\n * returns the DOM node to portal into.\n */\nexport function usePortalContainer(): (\n container?: string | HTMLElement\n) => HTMLElement {\n const { portalContainer } = useConfig();\n return container => resolvePortalContainer(container || portalContainer);\n}\n\n/**\n * The element the overlay around a popup hands it to portal into, `null`\n * outside any, and inside one whose element hasn't mounted yet.\n */\nconst PortalScopeContext = createContext<HTMLElement | null>(null);\n\n/**\n * INTERNAL, deliberately not exported from `src/index.ts`. Makes `node` where\n * the popups inside it portal, unless a `ConfigProvider` sets a\n * `portalContainer`. Modal, Dialog and Command.Dialog wrap their content in\n * it, each with the element that carries their `aria-modal`, since a screen\n * reader that honors it hides everything outside that element. AppFrame's\n * nav does too while it's a drawer, which draws over the page, so its popups\n * show above it. The nearest one wins, so a Dialog's own box wins over the\n * Modal it renders. An `undefined` node leaves the scope around it in place,\n * for a part that only takes its popups some of the time, so its content\n * keeps one tree either way.\n *\n * @function PortalScope\n * @param props - `node`, the element popups portal into, and `children`.\n * @returns The children, inside the scope.\n */\nexport function PortalScope({\n node,\n children,\n}: {\n node: HTMLElement | null | undefined;\n children?: React.ReactNode;\n}) {\n const outer = useContext(PortalScopeContext);\n return (\n <PortalScopeContext.Provider value={node === undefined ? outer : node}>\n {children}\n </PortalScopeContext.Provider>\n );\n}\n\n/**\n * INTERNAL. Where a popup portals, a panel a component opens against\n * something on the page, such as Popover's: the `portalContainer` a\n * `ConfigProvider` sets, else the overlay it's in (see `PortalScope`), else\n * `undefined`, which `resolvePortalContainer` reads as `document.body`.\n *\n * The overlay's element only exists once it has mounted, so a popup open as\n * the overlay first renders mounts in `document.body`, and moves into the\n * overlay in the update that follows, before the browser paints. Moving\n * remounts it, as any change of portal target does. It isn't held back\n * instead, because the popups measure their panel against the trigger as\n * they open, and a panel that isn't there yet is never placed.\n *\n * @function usePopupContainer\n * @returns The popup's container, `undefined` for `document.body`.\n */\nexport function usePopupContainer(): string | HTMLElement | undefined {\n const { portalContainer } = useConfig();\n const scope = useContext(PortalScopeContext);\n return portalContainer || scope || undefined;\n}\n\n/**\n * What a component that takes Modal's `portal` prop does with it now. See\n * `usePortalProp`.\n */\nexport interface PortalPropState {\n /**\n * Whether the content renders in its portal: `portal` is set and\n * hydration is over. Before that it renders in place.\n */\n isPortaled: boolean;\n /**\n * The target to pass `Portal` as its `container`: the selector or element\n * `portal` names, or `undefined` for `true`, which leaves the choice to the\n * `portalContainer` a `ConfigProvider` sets and then `document.body`.\n */\n container?: string | HTMLElement;\n /**\n * The `portalContainer` a `ConfigProvider` sets, while it's what places the\n * content (portaled, with `portal` set to `true`), else `undefined`. A\n * change to it moves the content, so effects that hold its nodes depend\n * on it.\n */\n defaultTarget?: string | HTMLElement;\n}\n\n/**\n * Reads Modal's `portal` prop (`boolean | string | HTMLElement`) for a\n * component that takes it: whether the content is in its portal yet, and\n * where it goes.\n *\n * A portal has no server-rendered counterpart, so such a component renders in\n * place on the server and while hydrating, and moves into its portal once the\n * client takes over. Render the content in `Portal` with\n * `disabled={!isPortaled}` and this `container`. Moving remounts the content,\n * so an effect that holds one of its nodes depends on `isPortaled`, `portal`\n * and `defaultTarget`.\n *\n * @function usePortalProp\n * @param portal - The component's `portal` prop.\n * @returns Whether it's portaled now, its `container`, and the provider's\n * target while that places it.\n */\nexport function usePortalProp(\n portal?: boolean | string | HTMLElement\n): PortalPropState {\n const hydrated = useIsHydrated();\n const { portalContainer } = useConfig();\n const isPortaled = Boolean(portal) && hydrated;\n return {\n isPortaled,\n container: typeof portal === 'boolean' ? undefined : portal,\n defaultTarget: isPortaled && portal === true ? portalContainer : undefined,\n };\n}\n\n/**\n * Props for the Portal component.\n */\nexport interface PortalProps {\n /** Content to render into the container. */\n children?: React.ReactNode;\n /**\n * Where the content goes: an element, or a `document.querySelector`\n * selector. Omitted or empty, it goes to the `portalContainer` a\n * `ConfigProvider` sets, and to `document.body` when none is set. A\n * selector that matches nothing means `document.body` too. A selector is\n * looked up again on each render, so the\n * content follows the target when it changes. Moving to another target\n * remounts the children and resets their state, which includes a selector\n * that only starts matching after the content has shown in `document.body`.\n * Render the target first, or pass the element once you have it.\n */\n container?: string | HTMLElement;\n /**\n * Render the children in place instead, on the server as well as the\n * client. Lets a component that portals only sometimes keep a single code\n * path.\n * @defaultValue false\n */\n disabled?: boolean;\n}\n\n/**\n * Renders its children into another part of the page, `document.body` unless `container` or a `ConfigProvider` says otherwise, so floating content escapes an ancestor's `overflow`, `transform` or stacking context.\n *\n * React's server renderer can't render a portal, so `Portal` renders nothing\n * on the server and during hydration, and mounts its children in the commit\n * that follows. The first client render then matches the server markup. In an app\n * without server rendering it portals on the first render.\n *\n * React context, such as `ConfigProvider`'s class prefix, reaches the\n * portaled children, and their React events bubble through the React tree.\n * CSS inheritance follows the DOM instead: a scoped (non-`isRoot`) `Theme`\n * sets its variables on a wrapper element the portaled content has left, so\n * that content sees the page-level theme, and styles scoped to a shadow root\n * don't reach `document.body` at all. To keep them, portal into an element\n * inside the themed area or the shadow root: pass it as `container`, or as\n * the `portalContainer` of a `ConfigProvider` around that area. The second\n * also reaches what the library's components portal, such as Popover's\n * `appendToBody` panel or a `Modal` with `portal`.\n *\n * Inside a `LocaleProvider`, the children keep its `dir` and `lang`. A\n * container inside the provider's own wrapper takes the children as they\n * are, and they follow the provider through the page. Any other,\n * `document.body` included, gets them inside one `<div>` carrying the\n * provider's values, with `display: contents` so it adds no box. It is\n * still an element, so content that must be the container's direct child,\n * a `<tr>` in a `<tbody>`, or that a direct-child selector styles, belongs\n * in a container inside the provider. Which of the two is settled when the\n * children mount, so a change of locale updates them in place rather than\n * remounting them.\n *\n * Tab order and focus follow the DOM too. Content portaled from inside a\n * focus trap is no longer inside the trapped element, so the trap neither\n * reaches it nor holds focus there: render nested overlays inside the\n * trapped element, or give them a trap of their own. To trap portaled\n * content, put `useFocusTrap`'s ref on the element inside the `Portal`.\n *\n * @function\n * @param {PortalProps} props - Props for the Portal component.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n *\n * @example\n * <Portal>\n * <div className=\"box\">Rendered at the end of document.body</div>\n * </Portal>\n *\n * @example\n * // Into a dedicated overlay root\n * <Portal container=\"#overlays\">\n * <CommandPalette />\n * </Portal>\n */\nexport function Portal({ children, container, disabled = false }: PortalProps) {\n const hydrated = useIsHydrated();\n const resolveContainer = usePortalContainer();\n if (disabled) return <>{children}</>;\n if (!hydrated) return null;\n const target = resolveContainer(container);\n return createPortal(\n <LocalePortalScope target={target}>{children}</LocalePortalScope>,\n target\n );\n}\n\n/**\n * INTERNAL. `Portal` for a popup, into the container `usePopupContainer`\n * names, so a popup opened inside a Modal, Dialog or Command.Dialog stays\n * inside it. `disabled` renders the children in place, as `Portal`'s does.\n *\n * @function PopupPortal\n * @param props - The children, and `disabled`.\n * @returns The portal, the children in place when `disabled`, or nothing\n * before hydration.\n */\nexport function PopupPortal({\n children,\n disabled = false,\n}: Omit<PortalProps, 'container'>) {\n const container = usePopupContainer();\n return (\n <Portal disabled={disabled} container={container}>\n {children}\n </Portal>\n );\n}\n"],"names":["_jsx","_Fragment"],"mappings":";;;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,SAAU,sBAAsB,CACpC,SAAgC,EAAA;IAEhC,IAAI,CAAC,SAAS,EAAE;QACd,OAAO,QAAQ,CAAC,IAAI;IACtB;AACA,IAAA,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACjC,QAAA,QACG,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAwB,IAAI,QAAQ,CAAC,IAAI;IAE9E;AACA,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;AAcG;SACa,kBAAkB,GAAA;AAGhC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,OAAO,SAAS,IAAI,sBAAsB,CAAC,SAAS,IAAI,eAAe,CAAC;AAC1E;AAEA;;;AAGG;AACH,MAAM,kBAAkB,GAAG,aAAa,CAAqB,IAAI,CAAC;AAElE;;;;;;;;;;;;;;;AAeG;SACa,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,GAIT,EAAA;AACC,IAAA,MAAM,KAAK,GAAG,UAAU,CAAC,kBAAkB,CAAC;IAC5C,QACEA,IAAC,kBAAkB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,IAAI,KAAK,SAAS,GAAG,KAAK,GAAG,IAAI,EAAA,QAAA,EAClE,QAAQ,EAAA,CACmB;AAElC;AAEA;;;;;;;;;;;;;;;AAeG;SACa,iBAAiB,GAAA;AAC/B,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;AACvC,IAAA,MAAM,KAAK,GAAG,UAAU,CAAC,kBAAkB,CAAC;AAC5C,IAAA,OAAO,eAAe,IAAI,KAAK,IAAI,SAAS;AAC9C;AA2BA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,aAAa,CAC3B,MAAuC,EAAA;AAEvC,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE;IACvC,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,QAAQ;IAC9C,OAAO;QACL,UAAU;AACV,QAAA,SAAS,EAAE,OAAO,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM;AAC3D,QAAA,aAAa,EAAE,UAAU,IAAI,MAAM,KAAK,IAAI,GAAG,eAAe,GAAG,SAAS;KAC3E;AACH;AA6BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDG;AACG,SAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAe,EAAA;AAC3E,IAAA,MAAM,QAAQ,GAAG,aAAa,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAG,kBAAkB,EAAE;AAC7C,IAAA,IAAI,QAAQ;QAAE,OAAOA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI;AACpC,IAAA,IAAI,CAAC,QAAQ;AAAE,QAAA,OAAO,IAAI;AAC1B,IAAA,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC;AAC1C,IAAA,OAAO,YAAY,CACjBD,GAAA,CAAC,iBAAiB,IAAC,MAAM,EAAE,MAAM,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAqB,EACjE,MAAM,CACP;AACH;AAEA;;;;;;;;;AASG;AACG,SAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,QAAQ,GAAG,KAAK,GACe,EAAA;AAC/B,IAAA,MAAM,SAAS,GAAG,iBAAiB,EAAE;AACrC,IAAA,QACEA,GAAA,CAAC,MAAM,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA,QAAA,EAC7C,QAAQ,EAAA,CACF;AAEb;;"}
|