@allxsmith/bestax-bulma 5.51.0 → 5.53.0

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.
Files changed (133) hide show
  1. package/dist/bestax.css +1 -1
  2. package/dist/bestax.css.map +1 -1
  3. package/dist/esm/components/Command.js +637 -0
  4. package/dist/esm/components/Command.js.map +1 -0
  5. package/dist/esm/components/Modal.js +2 -1
  6. package/dist/esm/components/Modal.js.map +1 -1
  7. package/dist/esm/components/Sidebar.js +3 -1
  8. package/dist/esm/components/Sidebar.js.map +1 -1
  9. package/dist/esm/components/Toast.js +8 -5
  10. package/dist/esm/components/Toast.js.map +1 -1
  11. package/dist/esm/elements/Notification.js +4 -2
  12. package/dist/esm/elements/Notification.js.map +1 -1
  13. package/dist/esm/form/Autocomplete.js +5 -4
  14. package/dist/esm/form/Autocomplete.js.map +1 -1
  15. package/dist/esm/form/Checkbox.js +3 -2
  16. package/dist/esm/form/Checkbox.js.map +1 -1
  17. package/dist/esm/form/CheckboxCard.js +119 -0
  18. package/dist/esm/form/CheckboxCard.js.map +1 -0
  19. package/dist/esm/form/Checkboxes.js +14 -3
  20. package/dist/esm/form/Checkboxes.js.map +1 -1
  21. package/dist/esm/form/Combobox.js +3 -2
  22. package/dist/esm/form/Combobox.js.map +1 -1
  23. package/dist/esm/form/DateInputBase.js +15 -6
  24. package/dist/esm/form/DateInputBase.js.map +1 -1
  25. package/dist/esm/form/DateRangeInputBase.js +15 -5
  26. package/dist/esm/form/DateRangeInputBase.js.map +1 -1
  27. package/dist/esm/form/DateTimeInputBase.js +15 -6
  28. package/dist/esm/form/DateTimeInputBase.js.map +1 -1
  29. package/dist/esm/form/Fieldset.js +64 -0
  30. package/dist/esm/form/Fieldset.js.map +1 -0
  31. package/dist/esm/form/FormContext.js +17 -1
  32. package/dist/esm/form/FormContext.js.map +1 -1
  33. package/dist/esm/form/InputBase.js +3 -2
  34. package/dist/esm/form/InputBase.js.map +1 -1
  35. package/dist/esm/form/Numberinput.js +3 -2
  36. package/dist/esm/form/Numberinput.js.map +1 -1
  37. package/dist/esm/form/PinInput.js +3 -2
  38. package/dist/esm/form/PinInput.js.map +1 -1
  39. package/dist/esm/form/Radio.js +3 -2
  40. package/dist/esm/form/Radio.js.map +1 -1
  41. package/dist/esm/form/RadioCard.js +86 -0
  42. package/dist/esm/form/RadioCard.js.map +1 -0
  43. package/dist/esm/form/Radios.js +14 -3
  44. package/dist/esm/form/Radios.js.map +1 -1
  45. package/dist/esm/form/Rate.js +3 -2
  46. package/dist/esm/form/Rate.js.map +1 -1
  47. package/dist/esm/form/SelectBase.js +3 -2
  48. package/dist/esm/form/SelectBase.js.map +1 -1
  49. package/dist/esm/form/Slider.js +3 -2
  50. package/dist/esm/form/Slider.js.map +1 -1
  51. package/dist/esm/form/Switch.js +3 -1
  52. package/dist/esm/form/Switch.js.map +1 -1
  53. package/dist/esm/form/Taginput.js +3 -2
  54. package/dist/esm/form/Taginput.js.map +1 -1
  55. package/dist/esm/form/TextAreaBase.js +3 -2
  56. package/dist/esm/form/TextAreaBase.js.map +1 -1
  57. package/dist/esm/form/TimeInputBase.js +13 -6
  58. package/dist/esm/form/TimeInputBase.js.map +1 -1
  59. package/dist/esm/form/_pickerInternals/PickerPopover.js +4 -2
  60. package/dist/esm/form/_pickerInternals/PickerPopover.js.map +1 -1
  61. package/dist/esm/form/_pickerInternals/useLocaleDefaults.js +80 -0
  62. package/dist/esm/form/_pickerInternals/useLocaleDefaults.js.map +1 -0
  63. package/dist/esm/form/groupFieldset.js +38 -0
  64. package/dist/esm/form/groupFieldset.js.map +1 -0
  65. package/dist/esm/form/useAutoLabelId.js +1 -1
  66. package/dist/esm/helpers/LocaleProvider.js +153 -0
  67. package/dist/esm/helpers/LocaleProvider.js.map +1 -0
  68. package/dist/esm/helpers/localeInfo.js +109 -0
  69. package/dist/esm/helpers/localeInfo.js.map +1 -0
  70. package/dist/esm/helpers/portal.js +14 -1
  71. package/dist/esm/helpers/portal.js.map +1 -1
  72. package/dist/esm/helpers/useComboboxEngine.js +3 -3
  73. package/dist/esm/helpers/useFocusTrap.js +2 -2
  74. package/dist/esm/helpers/useFocusTrap.js.map +1 -1
  75. package/dist/extras.css +1 -1
  76. package/dist/extras.css.map +1 -1
  77. package/dist/index.cjs +4905 -3584
  78. package/dist/index.cjs.map +1 -1
  79. package/dist/index.esm.js +5 -0
  80. package/dist/index.esm.js.map +1 -1
  81. package/dist/types/components/Command.d.ts +318 -0
  82. package/dist/types/form/CheckboxCard.d.ts +94 -0
  83. package/dist/types/form/Checkboxes.d.ts +13 -0
  84. package/dist/types/form/DateInputBase.d.ts +25 -3
  85. package/dist/types/form/DateRangeInputBase.d.ts +25 -3
  86. package/dist/types/form/DateTimeInputBase.d.ts +25 -3
  87. package/dist/types/form/Fieldset.d.ts +86 -0
  88. package/dist/types/form/FormContext.d.ts +12 -0
  89. package/dist/types/form/RadioCard.d.ts +81 -0
  90. package/dist/types/form/Radios.d.ts +13 -0
  91. package/dist/types/form/TimeInputBase.d.ts +5 -1
  92. package/dist/types/form/_pickerInternals/PickerPopover.d.ts +6 -0
  93. package/dist/types/form/_pickerInternals/useLocaleDefaults.d.ts +49 -0
  94. package/dist/types/form/groupFieldset.d.ts +32 -0
  95. package/dist/types/helpers/LocaleProvider.d.ts +128 -0
  96. package/dist/types/helpers/localeInfo.d.ts +23 -0
  97. package/dist/types/helpers/portal.d.ts +11 -0
  98. package/dist/types/index.d.ts +6 -0
  99. package/dist/types-cjs/components/Command.d.ts +318 -0
  100. package/dist/types-cjs/form/CheckboxCard.d.ts +94 -0
  101. package/dist/types-cjs/form/Checkboxes.d.ts +13 -0
  102. package/dist/types-cjs/form/DateInputBase.d.ts +25 -3
  103. package/dist/types-cjs/form/DateRangeInputBase.d.ts +25 -3
  104. package/dist/types-cjs/form/DateTimeInputBase.d.ts +25 -3
  105. package/dist/types-cjs/form/Fieldset.d.ts +86 -0
  106. package/dist/types-cjs/form/FormContext.d.ts +12 -0
  107. package/dist/types-cjs/form/RadioCard.d.ts +81 -0
  108. package/dist/types-cjs/form/Radios.d.ts +13 -0
  109. package/dist/types-cjs/form/TimeInputBase.d.ts +5 -1
  110. package/dist/types-cjs/form/_pickerInternals/PickerPopover.d.ts +6 -0
  111. package/dist/types-cjs/form/_pickerInternals/useLocaleDefaults.d.ts +49 -0
  112. package/dist/types-cjs/form/groupFieldset.d.ts +32 -0
  113. package/dist/types-cjs/helpers/LocaleProvider.d.ts +128 -0
  114. package/dist/types-cjs/helpers/localeInfo.d.ts +23 -0
  115. package/dist/types-cjs/helpers/portal.d.ts +11 -0
  116. package/dist/types-cjs/index.d.ts +6 -0
  117. package/dist/versions/bestax-no-dark-mode.css +1 -1
  118. package/dist/versions/bestax-no-dark-mode.css.map +1 -1
  119. package/dist/versions/bestax-no-helpers-prefixed.css +1 -1
  120. package/dist/versions/bestax-no-helpers-prefixed.css.map +1 -1
  121. package/dist/versions/bestax-no-helpers.css +1 -1
  122. package/dist/versions/bestax-no-helpers.css.map +1 -1
  123. package/dist/versions/bestax-prefixed.css +1 -1
  124. package/dist/versions/bestax-prefixed.css.map +1 -1
  125. package/package.json +1 -1
  126. package/src/scss/components/_command.scss +259 -0
  127. package/src/scss/components/_index.scss +1 -0
  128. package/src/scss/form/_checkbox.scss +44 -0
  129. package/src/scss/form/_checkboxcard.scss +355 -0
  130. package/src/scss/form/_fieldset.scss +108 -0
  131. package/src/scss/form/_index.scss +3 -0
  132. package/src/scss/form/_radio.scss +44 -0
  133. package/src/scss/form/_radiocard.scss +291 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Command.js","sources":["../../../src/components/Command.tsx"],"sourcesContent":["import React, {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useClientLayoutEffect } from '../helpers/useClientLayoutEffect';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { flattenChildren } from '../helpers/flattenChildren';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { isModalOverlayOpen } from '../helpers/overlayStack';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\nimport {\n ComboboxEngine,\n useComboboxEngine,\n} from '../helpers/useComboboxEngine';\nimport { Input, InputProps } from '../form/Input';\nimport { Modal } from './Modal';\n\n/** What names a Command that's given no `label`. */\nconst defaultLabel = 'Commands';\n\n/** What a Command given `actions` shows when nothing matches, unless it's given `empty`. */\nconst defaultEmpty = 'No results';\n\n// What the status region announces: the `Command.Empty` content, as the one\n// item it's handed while that content is on screen because of the user's\n// typing.\nconst typedNoMatches = [{ id: 'empty' }];\nconst nothingToAnnounce: Array<{ id: string }> = [];\n\n/** Whether a slot was given something to show. */\nconst isShown = (node: React.ReactNode): boolean =>\n node !== undefined && node !== null && node !== false && node !== '';\n\n/** One action in a Command's `actions`. */\nexport interface CommandAction {\n /** Unique within the Command. It's the item's `value`, so `onSelect` hands it back. */\n id: string;\n /** What the item shows, and what typing matches first. */\n label: string;\n /**\n * A line under the label, such as what the action does or where it goes.\n * Typing matches it too, after the labels. A screen reader hears it after\n * the label, as the item's description.\n */\n description?: string;\n /**\n * More words typing matches, after the labels, such as `['theme']` for\n * \"Dark mode\". They aren't shown.\n */\n keywords?: string[];\n /**\n * The heading the action goes under. Groups show in the order the matches\n * first name them, so the best match is always on top, and the actions with\n * no group show together where the first of them is.\n */\n group?: string;\n /** Shown before the label, and hidden from assistive tech. */\n icon?: React.ReactNode;\n /**\n * Shown at the end of the row, such as the action's own keyboard shortcut in\n * a `Kbd.Group`, or a `Tag`. It only shows: nothing listens for a shortcut\n * written here. A screen reader hears it after the label, with the\n * description.\n */\n hint?: React.ReactNode;\n /** Shown, and reached with the arrows so a screen reader user finds it, but never run. */\n disabled?: boolean;\n /** Runs the action, when it's picked with Enter or a click, before the Command's `onSelect`. */\n onSelect?: () => void;\n}\n\n/** What a Command takes whether it's given `actions` or built from parts. */\ninterface CommandBaseProps\n extends\n Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'onSelect'>,\n Omit<BulmaClassesProps, 'color'> {\n /**\n * What the Command is for, such as \"Commands\" or \"Settings\". It's never\n * shown: it names the search field and the list for assistive tech, and in\n * `Command.Dialog` the dialog too. An empty string counts as none.\n * @defaultValue 'Commands'\n */\n label?: string;\n /**\n * The search, controlled: the text in the field. Pair it with\n * `onQueryChange`.\n */\n query?: string;\n /**\n * The search to start with when uncontrolled.\n * @defaultValue ''\n */\n defaultQuery?: string;\n /**\n * Called with the search as the user types it. Built from parts, this is\n * where the app filters its items.\n */\n onQueryChange?: (query: string) => void;\n /**\n * Called with the picked item's `value`, an action's `id`, when it's run\n * with Enter or a click, after the item's own `onSelect`. A disabled item\n * is never run.\n */\n onSelect?: (value: string) => void;\n}\n\n/** Props for a Command given `actions`. */\nexport interface CommandActionsProps extends CommandBaseProps {\n /**\n * The actions, for a Command that renders the field, the list, the groups\n * and the empty message itself. Typing filters them by label, keywords and\n * description, ignoring case, with label matches first. Leave it out to\n * build the Command from parts.\n */\n actions: CommandAction[];\n /**\n * Takes over the filtering, with `actions`: it's handed the search as typed\n * and every action, and returns the ones to show, in the order to show\n * them, which is how to plug in fuzzy matching or cut the list short. It's\n * called with an empty search too.\n */\n filter?: (query: string, actions: CommandAction[]) => CommandAction[];\n /** The field's placeholder, with `actions`. */\n placeholder?: string;\n /**\n * What shows in place of the list, with `actions`, when nothing matches.\n * It's announced the way `Command.Empty` is. `null` shows nothing.\n * @defaultValue 'No results'\n */\n empty?: React.ReactNode;\n /** @internal With `actions`, the Command renders its own parts. */\n children?: never;\n}\n\n/** Props for a Command built from parts. */\nexport interface CommandPartsProps extends CommandBaseProps {\n /**\n * The parts, in order: `Command.Input`, then `Command.List` while there are\n * items and `Command.Empty` while there aren't. Nothing filters them, so\n * render the items that match the search `onQueryChange` reports. With\n * `actions` there are none to give: children given with it are ignored,\n * with a warning in development.\n */\n children?: React.ReactNode;\n /** @internal Built from parts, the app renders the items. */\n actions?: never;\n /** @internal Built from parts, the app filters. */\n filter?: never;\n /** @internal Built from parts, `Command.Input` takes the placeholder. */\n placeholder?: never;\n /** @internal Built from parts, `Command.Empty` is the empty message. */\n empty?: never;\n}\n\n/**\n * Props for the Command component: given `actions`, it renders, filters and\n * groups them itself, and without them it's built from parts. The helper\n * props, the other attributes and the `ref` land on the `div.command` around\n * the field and the list.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the `div.command` around the field and the list.\n */\nexport type CommandProps = CommandActionsProps | CommandPartsProps;\n\n/** What Command.Dialog takes on top of a Command's props. */\ninterface CommandDialogOwnProps {\n /** Controlled open state. When set, opening and closing only report through `onOpenChange`. */\n open?: boolean;\n /**\n * Initial open state when uncontrolled.\n * @defaultValue false\n */\n defaultOpen?: boolean;\n /**\n * Called with the open state asked for: `true` from the `shortcut`, and\n * `false` from Escape, a click on the background, or a pick while\n * `closeOnSelect` is on. Fires in controlled and uncontrolled use.\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * A key combination that opens the dialog from anywhere on the page, such\n * as `\"mod+k\"`: modifiers and a key joined by `+`, where `mod` is Ctrl or\n * ⌘ (either one, on every platform), and the others are `ctrl`, `meta`,\n * `alt` and `shift`. It's ignored while the user is typing in a text field,\n * a select or editable content, while an IME is composing, while a modal\n * overlay is open (a `Modal`, a `Dialog`, a `Sidebar` with its overlay or a\n * full-page `Loading`), and when something else has already used the key.\n * It only opens the dialog. Off unless given.\n */\n shortcut?: string;\n /**\n * Closes the dialog once an item has run. Turn it off for an item that\n * opens another page of the palette, and close it yourself with `open`.\n * @defaultValue true\n */\n closeOnSelect?: boolean;\n /**\n * Clears the search when the dialog closes: an uncontrolled one itself,\n * and a controlled one through `onQueryChange('')`.\n * @defaultValue true\n */\n clearOnClose?: boolean;\n /**\n * Renders the dialog into a portal target instead of inline. Forwarded to\n * the underlying `Modal`; see its `portal` prop for the accepted values.\n * @defaultValue false\n */\n portal?: boolean | string | HTMLElement;\n}\n\n/** Props for a Command.Dialog given `actions`. */\nexport interface CommandDialogActionsProps\n extends CommandActionsProps, CommandDialogOwnProps {}\n\n/** Props for a Command.Dialog built from parts. */\nexport interface CommandDialogPartsProps\n extends CommandPartsProps, CommandDialogOwnProps {}\n\n/**\n * Props for Command.Dialog, the Command in a modal: a Command's props, given\n * `actions` or built from parts, and the dialog's own. The helper props, the\n * other attributes and the `ref` land on the `div.command` that is the\n * dialog.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the `div.command` that is the dialog.\n */\nexport type CommandDialogProps =\n CommandDialogActionsProps | CommandDialogPartsProps;\n\n/**\n * Props for Command.Input, the search field. It renders `Input`, so its\n * icons, `isLoading` and `color` work as they do there. Its text is the\n * Command's `query`, and it's `autoComplete=\"off\"`, so the browser's own\n * suggestions don't open over the list: neither is yours to set.\n */\nexport type CommandInputProps = Omit<\n InputProps,\n // By name, since the docs read only names out of an Omit. The Field props:\n | 'label'\n | 'labelSize'\n | 'labelProps'\n | 'horizontal'\n | 'message'\n | 'messageColor'\n | 'fieldClassName'\n // And what the Command sets on the field itself:\n | 'role'\n | 'autoComplete'\n | 'value'\n | 'defaultValue'\n>;\n\n/**\n * Props for Command.List, the list. Its `id` is the one the field's\n * `aria-controls` names, so it isn't yours to set.\n */\nexport interface CommandListProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'role' | 'id'\n> {\n /** `Command.Item`s and `Command.Group`s, in the order they're shown. */\n children?: React.ReactNode;\n}\n\n/** Props for Command.Group, items under a heading. */\nexport interface CommandGroupProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'role'\n> {\n /**\n * The heading, which also names the group for assistive tech, unless you\n * give the group an `aria-label` or `aria-labelledby` of its own.\n */\n label: React.ReactNode;\n /** The group's `Command.Item`s. */\n children?: React.ReactNode;\n}\n\n/**\n * Props for Command.Item, one thing to do in the list. Its `id` follows from\n * its `value`, since the field's `aria-activedescendant` names it, so it\n * isn't yours to set.\n */\nexport interface CommandItemProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'role' | 'onSelect' | 'id'\n> {\n /** What the Command's `onSelect` hands back. Unique within the Command. */\n value: string;\n /**\n * Can't be run. The arrows still reach it, so a screen reader user finds\n * it, and it's never `aria-selected`.\n * @defaultValue false\n */\n disabled?: boolean;\n /** Runs the item, when it's picked with Enter or a click, before the Command's `onSelect`. */\n onSelect?: () => void;\n /** Shown before the label, and hidden from assistive tech. */\n icon?: React.ReactNode;\n /**\n * A line under the label. A screen reader hears it after the label, as the\n * item's description.\n */\n description?: React.ReactNode;\n /**\n * Shown at the end of the row, such as a keyboard shortcut in a\n * `Kbd.Group`, or a `Tag`. It only shows. A screen reader hears it after\n * the label, with the description.\n */\n hint?: React.ReactNode;\n /** The label, which names the item. */\n children?: React.ReactNode;\n}\n\n/** Props for Command.Empty, the message shown in place of the list. */\nexport interface CommandEmptyProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * The message, such as \"No commands match\". Its text is announced when\n * typing brings it on screen and isn't read again while it stays, so a\n * message that names the search is heard for the first search only.\n */\n children?: React.ReactNode;\n}\n\n/** A handler an item registers, read when it's run. */\ntype ItemHandler = { readonly current: (() => void) | undefined };\n\n/** What the Command hands its parts. */\ninterface CommandContextValue {\n engine: ComboboxEngine;\n /** What names the field and the list. */\n label: string;\n /** The search. */\n query: string;\n /** A change to the field's value, which is the user typing. */\n onFieldChange: (value: string) => void;\n /** Tells the Command the field's `isLoading`, which holds the empty message's announcement. */\n reportLoading: (loading: boolean) => void;\n /** Records the empty message while it's on screen. Returns the function that forgets it. */\n reportEmpty: (element: HTMLElement) => () => void;\n /** Records an item's `onSelect`. Returns the function that forgets it. */\n registerHandler: (value: string, handler: ItemHandler) => () => void;\n}\n\nconst noop = () => {};\nconst registerNothing = () => noop;\n\n// What a part rendered outside a Command reads: nothing to report to, so it\n// renders its markup and does nothing.\nconst standalone: CommandContextValue = {\n engine: {\n open: false,\n expanded: false,\n highlighted: null,\n typed: false,\n listboxId: '',\n itemId: () => '',\n rootRef: { current: null },\n inputRef: { current: null },\n listboxRef: { current: null },\n registerPopup: registerNothing,\n registerItem: registerNothing,\n onKeyDown: noop,\n onChange: noop,\n onClick: noop,\n onBlur: noop,\n hover: noop,\n pick: noop,\n keepFocus: noop,\n markInside: noop,\n },\n label: defaultLabel,\n query: '',\n onFieldChange: noop,\n reportLoading: noop,\n reportEmpty: registerNothing,\n registerHandler: registerNothing,\n};\n\nconst CommandContext = createContext<CommandContextValue | null>(null);\n\nconst useCommand = () => useContext(CommandContext) ?? standalone;\n\n/** Hands a node to a forwarded ref and to one of the component's own. */\nfunction setRefs<T>(\n node: T | null,\n own: React.MutableRefObject<T | null>,\n forwarded: React.ForwardedRef<T>\n) {\n own.current = node;\n if (typeof forwarded === 'function') forwarded(node);\n else if (forwarded) forwarded.current = node;\n}\n\n/**\n * The default filter: the actions whose label, keywords or description hold\n * the search, ignoring case and the spaces around it, label matches first and\n * the order otherwise kept. An empty search keeps them all.\n */\nconst filterActions = (\n query: string,\n actions: CommandAction[]\n): CommandAction[] => {\n const term = query.trim().toLowerCase();\n if (term === '') return actions;\n const byLabel: CommandAction[] = [];\n const byOther: CommandAction[] = [];\n for (const action of actions) {\n if (action.label.toLowerCase().includes(term)) {\n byLabel.push(action);\n } else if (\n action.description?.toLowerCase().includes(term) ||\n action.keywords?.some(keyword => keyword.toLowerCase().includes(term))\n ) {\n byOther.push(action);\n }\n }\n return [...byLabel, ...byOther];\n};\n\n/** The search icon at the start of the field. */\nconst SearchIcon = () => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.75\"\n strokeLinecap=\"round\"\n width=\"1em\"\n height=\"1em\"\n focusable=\"false\"\n >\n <circle cx=\"7\" cy=\"7\" r=\"4.75\" />\n <path d=\"M10.5 10.5L14 14\" />\n </svg>\n);\n\n/**\n * The Command built from parts: the field, the list, the keys and the run,\n * with the items and their filtering left to the app.\n */\nconst CommandParts = forwardRef<HTMLDivElement, CommandPartsProps>(\n (\n {\n children,\n label,\n query: controlledQuery,\n defaultQuery = '',\n onQueryChange,\n onSelect,\n className,\n ...props\n },\n ref\n ) => {\n const [ownQuery, setOwnQuery] = useState(defaultQuery);\n const query = controlledQuery ?? ownQuery;\n\n // Each item's `onSelect`, by value, read when it runs.\n const handlersRef = useRef(new Map<string, ItemHandler>());\n const registerHandler = useCallback(\n (value: string, handler: ItemHandler) => {\n const handlers = handlersRef.current;\n handlers.set(value, handler);\n return () => {\n if (handlers.get(value) === handler) handlers.delete(value);\n };\n },\n []\n );\n const run = (value: string) => {\n handlersRef.current.get(value)?.current?.();\n onSelect?.(value);\n };\n\n // Inline: the list is always on screen, nothing opens or closes it, and\n // Escape goes on to what's around it. `keepFirst` keeps the highlight on\n // the top match, so Enter runs it.\n const engine = useComboboxEngine({\n defaultOpen: true,\n onSelect: run,\n keepFirst: true,\n multiple: false,\n inline: true,\n deferred: false,\n });\n const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n const rootClass = usePrefixedClassNames('command');\n\n // A polite status region, in the page from the start so it's there\n // before anything is written into it, announces `Command.Empty` when the\n // user's typing leaves it on screen: once each time that happens, not\n // again on each keystroke while it stays. An empty search isn't a search,\n // so it stays quiet then, and while the field's `isLoading` says results\n // are on their way, it waits.\n const [inputLoading, setInputLoading] = useState(false);\n const emptyRef = useRef<HTMLElement | null>(null);\n const [emptyShown, setEmptyShown] = useState(false);\n const announced =\n engine.typed && query !== '' && emptyShown && !inputLoading\n ? typedNoMatches\n : nothingToAnnounce;\n // The region reads the text on screen, whatever the message 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 const reportEmpty = useCallback((element: HTMLElement) => {\n emptyRef.current = element;\n setEmptyShown(true);\n return () => {\n emptyRef.current = null;\n setEmptyShown(false);\n };\n }, []);\n\n const onFieldChange = (value: string) => {\n if (controlledQuery === undefined) setOwnQuery(value);\n onQueryChange?.(value);\n engine.onChange();\n };\n\n // A new value each render: the engine's state and handlers are, and the\n // parts read the highlight from it.\n const context: CommandContextValue = {\n engine,\n label: label || defaultLabel,\n query,\n onFieldChange,\n reportLoading: setInputLoading,\n reportEmpty,\n registerHandler,\n };\n\n const { rootRef } = engine;\n const rootRefs = useCallback(\n (node: HTMLDivElement | null) => setRefs(node, rootRef, ref),\n [rootRef, ref]\n );\n\n return (\n // The ref after the spread, so the element stays the Command's.\n <div\n className={classNames(rootClass, bulmaHelperClasses, className)}\n {...rest}\n ref={rootRefs}\n >\n <CommandContext.Provider value={context}>\n {children}\n </CommandContext.Provider>\n <StatusRegion items={announced} describe={describeEmpty} />\n </div>\n );\n }\n);\nCommandParts.displayName = 'CommandParts';\n\n/**\n * The search field, with the combobox role and the keys, rendered as an `Input` with a search icon.\n *\n * @function\n * @param {CommandInputProps} props - Props for the Command.Input component.\n * @param {React.Ref<HTMLInputElement>} ref - Forwarded ref to the `<input>`.\n * @returns {JSX.Element} The field in its Control.\n */\nexport const CommandInput = forwardRef<HTMLInputElement, CommandInputProps>(\n (\n {\n isLoading,\n iconLeft,\n iconLeftName,\n onKeyDown,\n onChange,\n onClick,\n onBlur,\n 'aria-autocomplete': ariaAutocomplete,\n ...props\n },\n ref\n ) => {\n const context = useCommand();\n const { engine, reportLoading } = context;\n useClientLayoutEffect(() => {\n reportLoading(!!isLoading);\n return () => reportLoading(false);\n }, [reportLoading, isLoading]);\n const { inputRef } = engine;\n const inputRefs = useCallback(\n (node: HTMLInputElement | null) => setRefs(node, inputRef, ref),\n [inputRef, ref]\n );\n const { expanded, highlighted } = engine;\n // A name the caller gave the field wins over the Command's `label`.\n const callerNamed = !!props['aria-label'] || 'aria-labelledby' in props;\n\n return (\n // The attributes the Command owns after the caller's, so a stray\n // `aria-expanded` never wins. A search isn't prose, so the browser's\n // spelling and autocorrect stay out of it unless the caller asks.\n <Input\n autoCorrect=\"off\"\n spellCheck={false}\n {...props}\n ref={inputRefs}\n value={context.query}\n iconLeft={\n iconLeft === undefined && !iconLeftName ? <SearchIcon /> : iconLeft\n }\n iconLeftName={iconLeftName}\n isLoading={isLoading}\n aria-label={callerNamed ? props['aria-label'] : context.label}\n role=\"combobox\"\n aria-autocomplete={ariaAutocomplete ?? 'list'}\n aria-haspopup=\"listbox\"\n aria-expanded={expanded}\n aria-controls={expanded ? engine.listboxId : undefined}\n aria-activedescendant={\n expanded && highlighted !== null\n ? engine.itemId(highlighted)\n : undefined\n }\n autoComplete=\"off\"\n onKeyDown={event => {\n onKeyDown?.(event);\n engine.onKeyDown(event);\n }}\n onChange={event => {\n onChange?.(event);\n context.onFieldChange(event.target.value);\n }}\n onClick={event => {\n onClick?.(event);\n if (!event.defaultPrevented) engine.onClick();\n }}\n onBlur={event => {\n onBlur?.(event);\n engine.onBlur(event);\n }}\n />\n );\n }\n);\nCommandInput.displayName = 'CommandInput';\n\n/**\n * The list of items, a `listbox` named by the Command's `label`.\n *\n * @function\n * @param {CommandListProps} props - Props for the Command.List component.\n * @returns {JSX.Element} The listbox.\n */\nexport const CommandList: React.FC<CommandListProps> = ({\n children,\n className,\n onMouseDown,\n ...props\n}) => {\n const { engine, label } = useCommand();\n const { listboxRef, listboxId, keepFocus } = engine;\n const listClass = usePrefixedClassNames('command-list');\n // A name the caller gave the list wins over the Command's.\n const callerNamed = !!props['aria-label'] || 'aria-labelledby' in props;\n return (\n <div\n className={classNames(listClass, className)}\n {...props}\n ref={listboxRef}\n id={listboxId || undefined}\n role=\"listbox\"\n aria-label={callerNamed ? props['aria-label'] : label}\n onMouseDown={event => {\n onMouseDown?.(event);\n keepFocus(event);\n }}\n >\n {children}\n </div>\n );\n};\nCommandList.displayName = 'CommandList';\n\n/**\n * Items under a heading, a `group` named by it.\n *\n * @function\n * @param {CommandGroupProps} props - Props for the Command.Group component.\n * @returns {JSX.Element} The group and its heading.\n */\nexport const CommandGroup: React.FC<CommandGroupProps> = ({\n label,\n children,\n className,\n ...props\n}) => {\n const labelId = useId();\n const groupClass = usePrefixedClassNames('command-group');\n const labelClass = usePrefixedClassNames('command-group-label');\n // A name the caller gave the group wins over its heading's, as on the list.\n const callerNamed = !!props['aria-label'] || 'aria-labelledby' in props;\n return (\n <div\n className={classNames(groupClass, className)}\n {...props}\n role=\"group\"\n aria-labelledby={callerNamed ? props['aria-labelledby'] : labelId}\n >\n <div className={labelClass} id={labelId}>\n {label}\n </div>\n {children}\n </div>\n );\n};\nCommandGroup.displayName = 'CommandGroup';\n\n/**\n * One thing to do in the list, named by its label and described by its description and hint.\n *\n * @function\n * @param {CommandItemProps} props - Props for the Command.Item component.\n * @returns {JSX.Element} The item.\n */\nexport const CommandItem: React.FC<CommandItemProps> = ({\n value,\n disabled = false,\n onSelect,\n icon,\n description,\n hint,\n children,\n className,\n onClick,\n onPointerMove,\n ...props\n}) => {\n const { engine, registerHandler } = useCommand();\n const itemRef = useRef<HTMLDivElement>(null);\n const { registerItem } = engine;\n useClientLayoutEffect(\n () =>\n registerItem(itemRef.current as HTMLDivElement, {\n value,\n disabled,\n checked: false,\n }),\n [registerItem, value, disabled]\n );\n const onSelectRef = useLatestRef(onSelect);\n useClientLayoutEffect(\n () => registerHandler(value, onSelectRef),\n [registerHandler, value, onSelectRef]\n );\n const highlighted = engine.highlighted === value;\n const itemClass = usePrefixedClassNames('command-item', {\n 'is-active': highlighted,\n 'is-disabled': disabled,\n });\n const iconClass = usePrefixedClassNames('command-item-icon');\n const bodyClass = usePrefixedClassNames('command-item-body');\n const labelClass = usePrefixedClassNames('command-item-label');\n const descriptionClass = usePrefixedClassNames('command-item-description');\n const hintClass = usePrefixedClassNames('command-item-hint');\n\n // Named by its label alone, so a screen reader says what it does before\n // the rest, and described by the description and the hint.\n const baseId = useId();\n const labelId = `${baseId}label`;\n const descriptionId = isShown(description)\n ? `${baseId}description`\n : undefined;\n const hintId = isShown(hint) ? `${baseId}hint` : undefined;\n const describedBy =\n [descriptionId, hintId].filter(Boolean).join(' ') || undefined;\n const callerNamed = !!props['aria-label'] || 'aria-labelledby' in props;\n\n return (\n <div\n className={classNames(itemClass, className)}\n aria-describedby={describedBy}\n {...props}\n ref={itemRef}\n id={engine.itemId(value) || undefined}\n role=\"option\"\n // The highlighted option, as the ARIA Authoring Practices' combobox\n // has it, and no attribute on the rest. Never a disabled option.\n aria-selected={disabled ? undefined : highlighted || undefined}\n aria-disabled={disabled || undefined}\n aria-labelledby={callerNamed ? props['aria-labelledby'] : labelId}\n onClick={event => {\n onClick?.(event);\n if (!disabled && !event.defaultPrevented) engine.pick(value);\n }}\n onPointerMove={event => {\n onPointerMove?.(event);\n if (!disabled && !highlighted) engine.hover(value);\n }}\n >\n {isShown(icon) && (\n <span className={iconClass} aria-hidden=\"true\">\n {icon}\n </span>\n )}\n <span className={bodyClass}>\n <span className={labelClass} id={labelId}>\n {children}\n </span>\n {descriptionId && (\n <span className={descriptionClass} id={descriptionId}>\n {description}\n </span>\n )}\n </span>\n {hintId && (\n <span className={hintClass} id={hintId}>\n {hint}\n </span>\n )}\n </div>\n );\n};\nCommandItem.displayName = 'CommandItem';\n\n/**\n * The message shown in place of the list when nothing matches, announced when typing brings it on screen.\n *\n * @function\n * @param {CommandEmptyProps} props - Props for the Command.Empty component.\n * @returns {JSX.Element} The message.\n */\nexport const CommandEmpty: React.FC<CommandEmptyProps> = ({\n children,\n className,\n onMouseDown,\n ...props\n}) => {\n const { engine, reportEmpty } = useCommand();\n const emptyRef = useRef<HTMLDivElement>(null);\n useClientLayoutEffect(\n () => reportEmpty(emptyRef.current as HTMLDivElement),\n [reportEmpty]\n );\n const emptyClass = usePrefixedClassNames('command-empty');\n return (\n <div\n className={classNames(emptyClass, className)}\n {...props}\n ref={emptyRef}\n onMouseDown={event => {\n onMouseDown?.(event);\n engine.keepFocus(event);\n }}\n >\n {children}\n </div>\n );\n};\nCommandEmpty.displayName = 'CommandEmpty';\n\n/** What a Command given `actions` renders inside its parts root. */\ninterface CommandActionsContentProps {\n actions: CommandAction[];\n filter: CommandActionsProps['filter'];\n placeholder: string | undefined;\n empty: React.ReactNode;\n}\n\n/**\n * The field, and the actions that match the search, grouped, or the empty\n * message. The search is the parts root's, read from its context.\n */\nconst CommandActionsContent = ({\n actions,\n filter = filterActions,\n placeholder,\n empty,\n}: CommandActionsContentProps) => {\n const { query } = useCommand();\n const shown = filter(query, actions);\n\n // Each group where the matches first name it, and the actions with none\n // together where the first of them is, so the best match stays on top.\n const sections = new Map<string, CommandAction[]>();\n for (const action of shown) {\n const group = action.group ?? '';\n sections.set(group, [...(sections.get(group) ?? []), action]);\n }\n const renderItem = (action: CommandAction) => (\n <CommandItem\n key={action.id}\n value={action.id}\n disabled={action.disabled}\n icon={action.icon}\n description={action.description}\n hint={action.hint}\n onSelect={action.onSelect}\n >\n {action.label}\n </CommandItem>\n );\n\n return (\n <>\n <CommandInput placeholder={placeholder} />\n {shown.length > 0 ? (\n <CommandList>\n {Array.from(sections, ([group, members]) =>\n group ? (\n <CommandGroup key={group} label={group}>\n {members.map(renderItem)}\n </CommandGroup>\n ) : (\n members.map(renderItem)\n )\n )}\n </CommandList>\n ) : isShown(empty) ? (\n <CommandEmpty>{empty}</CommandEmpty>\n ) : null}\n </>\n );\n};\n\n/**\n * The Command given `actions`. It renders the parts itself and filters the\n * actions as the user types, so a run goes through the same parts, keys and\n * ARIA as one built by hand.\n */\nconst CommandFromActions = forwardRef<HTMLDivElement, CommandActionsProps>(\n (\n { actions, filter, placeholder, empty = defaultEmpty, children, ...rest },\n ref\n ) => {\n if (flattenChildren(children).length > 0) {\n warnOnce(\n 'Command:actions-children',\n '[bestax-bulma] <Command actions> renders its own field and items, ' +\n 'so its children are ignored. Give it actions or build it from ' +\n 'parts, not both.'\n );\n }\n return (\n <CommandParts {...rest} ref={ref}>\n <CommandActionsContent\n actions={actions}\n filter={filter}\n placeholder={placeholder}\n empty={empty}\n />\n </CommandParts>\n );\n }\n);\nCommandFromActions.displayName = 'CommandFromActions';\n\n/**\n * The `Command` component is a search field over a list of things to do, which narrows as you type and runs the top match on Enter: inline by default, and a command palette in a modal as `Command.Dialog`.\n *\n * Given `actions`, it's one element. It renders the field, the list, the\n * groups and the empty message, and filters the actions by label, keywords\n * and description as the user types, with label matches first. `filter`\n * takes over the matching, for fuzzy search.\n *\n * Built from parts, the app owns the items: what's in the list and how it's\n * filtered, from the search `onQueryChange` reports. Nothing filters them,\n * so a server's answer shows as it came.\n *\n * Either way, focus stays in the field, and the highlighted item is its\n * `aria-activedescendant`. The first enabled item is highlighted whenever\n * the items change, so Enter runs the top match. Running an item calls its\n * own `onSelect`, then the Command's.\n *\n * When typing leaves the empty message on screen, its text is announced\n * through a polite status region, once, after any loading ends. Result\n * counts aren't announced: a screen reader reads the list's size from the\n * markup, and a count on every keystroke talks over the typing.\n *\n * @function\n * @param {CommandProps} props - Props for the Command component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the `div.command`.\n * @returns {JSX.Element} The field and its list.\n *\n * @example\n * <Command\n * label=\"Settings\"\n * placeholder=\"Search settings\"\n * actions={[\n * { id: 'profile', label: 'Edit profile', onSelect: openProfile },\n * { id: 'theme', label: 'Dark mode', keywords: ['theme'], onSelect: toggleTheme },\n * ]}\n * />\n *\n * @example\n * <Command label=\"People\" onQueryChange={setQuery} onSelect={openProfile}>\n * <Command.Input placeholder=\"Find a person\" />\n * {matches.length > 0 ? (\n * <Command.List>\n * {matches.map(person => (\n * <Command.Item key={person.id} value={person.id}>\n * {person.name}\n * </Command.Item>\n * ))}\n * </Command.List>\n * ) : (\n * <Command.Empty>No one matches</Command.Empty>\n * )}\n * </Command>\n */\nconst CommandRoot = forwardRef<HTMLDivElement, CommandProps>((props, ref) =>\n props.actions === undefined ? (\n <CommandParts {...props} ref={ref} />\n ) : (\n <CommandFromActions {...props} ref={ref} />\n )\n);\n\n/** A key combination, read from a `shortcut` string. */\ninterface ParsedShortcut {\n /** The key, lowercased, as `KeyboardEvent.key` names it. */\n key: string;\n mod: boolean;\n ctrl: boolean;\n meta: boolean;\n alt: boolean;\n shift: boolean;\n}\n\n/** Other names a key goes by in a `shortcut`, for the ones `key` spells otherwise. */\nconst keyAliases: Record<string, string> = {\n space: ' ',\n esc: 'escape',\n};\n\n/**\n * Reads a `shortcut` such as `\"mod+k\"` or `\"ctrl + shift + p\"`.\n *\n * @param shortcut - Modifiers and a key, joined by `+`.\n * @returns The combination, or `null` when it doesn't read as one.\n */\nconst parseShortcut = (shortcut: string): ParsedShortcut | null => {\n const parts = shortcut\n .toLowerCase()\n .split('+')\n .map(part => part.trim());\n const key = parts.pop() as string;\n if (key === '') return null;\n const parsed: ParsedShortcut = {\n key: keyAliases[key] ?? key,\n mod: false,\n ctrl: false,\n meta: false,\n alt: false,\n shift: false,\n };\n for (const part of parts) {\n if (part === 'mod') parsed.mod = true;\n else if (part === 'ctrl' || part === 'control') parsed.ctrl = true;\n else if (part === 'meta' || part === 'cmd' || part === 'command')\n parsed.meta = true;\n else if (part === 'alt' || part === 'option') parsed.alt = true;\n else if (part === 'shift') parsed.shift = true;\n else return null;\n }\n return parsed;\n};\n\n/**\n * Whether a keydown is the combination. `mod` takes Ctrl or ⌘, and any other\n * modifier has to be as the combination says, so `mod+k` isn't\n * `mod+shift+k`. A letter or digit is matched by its key, and by where it\n * sits on the keyboard only when the key isn't a Latin letter or digit at\n * all, as on a Cyrillic layout or with Option held on a Mac, so another\n * Latin layout's own letters keep their own shortcuts.\n */\nconst matchesShortcut = (\n event: KeyboardEvent,\n shortcut: ParsedShortcut\n): boolean => {\n if (event.altKey !== shortcut.alt) return false;\n // A symbol such as `?` already says whether Shift was down, and which key\n // takes Shift to type it depends on the layout, so Shift is only checked\n // for a letter, a digit or a named key, unless the combination names it.\n const shiftMatters =\n shortcut.shift ||\n shortcut.key.length > 1 ||\n /^[a-z0-9]$/.test(shortcut.key);\n if (shiftMatters && event.shiftKey !== shortcut.shift) return false;\n if (shortcut.mod) {\n if (!event.ctrlKey && !event.metaKey) return false;\n } else if (\n event.ctrlKey !== shortcut.ctrl ||\n event.metaKey !== shortcut.meta\n ) {\n return false;\n }\n const key = (event.key ?? '').toLowerCase();\n if (key === shortcut.key) return true;\n if (/^[a-z0-9]$/.test(key)) return false;\n if (/^[a-z]$/.test(shortcut.key)) {\n return event.code === `Key${shortcut.key.toUpperCase()}`;\n }\n if (/^[0-9]$/.test(shortcut.key)) {\n return event.code === `Digit${shortcut.key}`;\n }\n return false;\n};\n\n/** Input types that take no typing, so a shortcut pressed in one still counts. */\nconst untypedInputs = new Set([\n 'button',\n 'checkbox',\n 'color',\n 'file',\n 'hidden',\n 'image',\n 'radio',\n 'range',\n 'reset',\n 'submit',\n]);\n\n/**\n * Whether a keydown happened while the user was typing: in a text field, a\n * text area, a select, or editable content. The composed path's first entry\n * is the element itself, even inside a shadow root.\n */\nconst isTyping = (event: KeyboardEvent): boolean => {\n const target = event.composedPath()[0] as Partial<Element> | undefined;\n if (typeof target?.closest !== 'function') return false;\n const element = target as Element;\n const editable = element.closest('[contenteditable]');\n if (editable && editable.getAttribute('contenteditable') !== 'false') {\n return true;\n }\n const tag = element.tagName;\n if (tag === 'TEXTAREA' || tag === 'SELECT') return true;\n return (\n tag === 'INPUT' &&\n !untypedInputs.has((element as HTMLInputElement).type.toLowerCase())\n );\n};\n\n/**\n * The Command in a modal, a command palette, opened by its `shortcut` or by `open`, that closes once an item has run.\n *\n * It renders nothing while it's closed. Open, it's a `Modal` with a\n * background and the Command's box as the `dialog`, named by `label`:\n * focus goes to the search field, Tab stays inside, Escape and a click on\n * the background close it, the page behind it doesn't scroll, and focus goes\n * back to where it was when it closes.\n *\n * @function\n * @param {CommandDialogProps} props - Props for the Command.Dialog component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the `div.command` that is the dialog.\n * @returns {JSX.Element | null} The dialog, or nothing while it's closed.\n */\nexport const CommandDialog = forwardRef<HTMLDivElement, CommandDialogProps>(\n (\n {\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n shortcut,\n closeOnSelect = true,\n clearOnClose = true,\n portal,\n label,\n query: controlledQuery,\n defaultQuery = '',\n onQueryChange,\n onSelect,\n className,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...props\n },\n ref\n ) => {\n const [ownOpen, setOwnOpen] = useState(defaultOpen);\n const open = controlledOpen ?? ownOpen;\n // Only ever asked for the other state: the shortcut listens while it's\n // closed, and everything that closes it is there while it's open.\n const setOpen = (next: boolean) => {\n if (controlledOpen === undefined) setOwnOpen(next);\n onOpenChange?.(next);\n };\n\n // The search is held here rather than in the Command, which is only\n // mounted while the dialog is open, so it can outlive a close when\n // `clearOnClose` is off.\n const [ownQuery, setOwnQuery] = useState(defaultQuery);\n const query = controlledQuery ?? ownQuery;\n const setQuery = (next: string) => {\n if (controlledQuery === undefined) setOwnQuery(next);\n onQueryChange?.(next);\n };\n // Closing clears the search, however the dialog closed. Our own is\n // cleared during render, React's pattern for adjusting state when other\n // state changes, and a controlled one is asked for after the commit.\n const [shownOpen, setShownOpen] = useState(open);\n if (shownOpen !== open) {\n setShownOpen(open);\n if (!open && clearOnClose && controlledQuery === undefined) {\n setOwnQuery('');\n }\n }\n const wasOpenRef = useRef(open);\n const clearRef = useLatestRef(() => {\n if (clearOnClose && controlledQuery !== undefined && query !== '') {\n onQueryChange?.('');\n }\n });\n useEffect(() => {\n const wasOpen = wasOpenRef.current;\n wasOpenRef.current = open;\n if (wasOpen && !open) clearRef.current();\n }, [open, clearRef]);\n\n if (controlledOpen === undefined && !defaultOpen && !shortcut) {\n warnOnce(\n 'Command.Dialog:no-opener',\n '[bestax-bulma] <Command.Dialog> has no way to open. Give it a ' +\n 'shortcut, or open and onOpenChange.'\n );\n }\n if (shortcut && !parseShortcut(shortcut)) {\n warnOnce(\n `Command.Dialog:shortcut:${shortcut}`,\n `[bestax-bulma] <Command.Dialog> can't read the shortcut ` +\n `\"${shortcut}\". Write modifiers and a key joined by +, such as ` +\n `\"mod+k\", where the modifiers are mod, ctrl, meta, alt and shift.`\n );\n }\n\n const openFromShortcut = useLatestRef(() => setOpen(true));\n useEffect(() => {\n const combination = shortcut ? parseShortcut(shortcut) : null;\n if (!combination || open) return undefined;\n const onKeyDown = (event: KeyboardEvent) => {\n if (\n event.defaultPrevented ||\n event.isComposing ||\n event.keyCode === 229 ||\n !matchesShortcut(event, combination) ||\n isTyping(event) ||\n // A Modal, a Dialog, a Sidebar with its overlay or a full-page\n // Loading has the page shut off, so the key isn't the page's. A\n // Sidebar without one leaves the page in use, so it still opens.\n isModalOverlayOpen()\n ) {\n return;\n }\n // The browser's own use of the combination, such as Ctrl+K's search\n // in the address bar, doesn't happen as well.\n event.preventDefault();\n openFromShortcut.current();\n };\n // On `window`, where a keydown arrives last, so anything on the page\n // that used the key first has said so with `preventDefault()`.\n window.addEventListener('keydown', onKeyDown);\n return () => window.removeEventListener('keydown', onKeyDown);\n }, [shortcut, open, openFromShortcut]);\n\n const dialogClass = usePrefixedClassNames('command-dialog');\n\n if (!open) return null;\n\n const close = () => setOpen(false);\n const run = (value: string) => {\n onSelect?.(value);\n if (closeOnSelect) close();\n };\n\n return (\n <Modal isActive onClose={close} role=\"presentation\" portal={portal}>\n <Modal.Background onClick={close} />\n <CommandRoot\n {...(props as CommandProps)}\n ref={ref}\n className={classNames(dialogClass, className)}\n label={label}\n query={query}\n onQueryChange={setQuery}\n onSelect={run}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={\n ariaLabelledBy === undefined\n ? ariaLabel || label || defaultLabel\n : ariaLabel\n }\n aria-labelledby={ariaLabelledBy}\n />\n </Modal>\n );\n }\n);\nCommandDialog.displayName = 'CommandDialog';\n\n/** Command with Input, List, Group, Item, Empty and Dialog sub-components. */\nexport const Command = withSubComponents(\n CommandRoot,\n {\n Input: CommandInput,\n List: CommandList,\n Group: CommandGroup,\n Item: CommandItem,\n Empty: CommandEmpty,\n Dialog: CommandDialog,\n },\n 'Command'\n);\n\nexport default Command;\n"],"names":["typedNoMatches","nothingToAnnounce","noop","registerNothing","standalone","setRefs","_jsxs","_jsx"],"mappings":"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"}
@@ -10,6 +10,7 @@ import { useConfig } from '../helpers/Config.js';
10
10
  import { useScrollLock } from '../helpers/scrollLock.js';
11
11
  import { getDeepestActiveElement, getActiveElementInTree } from '../helpers/shadowDom.js';
12
12
  import { usePortalContainer } from '../helpers/portal.js';
13
+ import { LocalePortalScope } from '../helpers/LocaleProvider.js';
13
14
  import { useIsHydrated } from '../helpers/useIsHydrated.js';
14
15
  import { useLatestRef } from '../helpers/useLatestRef.js';
15
16
  import { useOverlayStack } from '../helpers/overlayStack.js';
@@ -331,7 +332,7 @@ const ModalRoot = forwardRef(function ModalRoot({ active, isActive, onClose, cla
331
332
  modalElement = (jsx(ModalCloseContext.Provider, { value: onClose, children: modalElement }));
332
333
  if (isPortaled) {
333
334
  const target = resolveContainer(typeof portal === 'boolean' ? undefined : portal);
334
- return createPortal(modalElement, target);
335
+ return createPortal(jsx(LocalePortalScope, { target: target, children: modalElement }), target);
335
336
  }
336
337
  return modalElement;
337
338
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":["../../../src/components/Modal.tsx"],"sourcesContent":["import React, {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n classNames,\n usePrefixedClassNames,\n prefixedClassNames,\n} from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { buttonType } from '../helpers/buttonType';\nimport {\n useBulmaClasses,\n BulmaClassesProps,\n validColors,\n} from '../helpers/useBulmaClasses';\nimport { useConfig } from '../helpers/Config';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport {\n getActiveElementInTree,\n getDeepestActiveElement,\n} from '../helpers/shadowDom';\nimport { usePortalContainer } from '../helpers/portal';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { useOverlayStack } from '../helpers/overlayStack';\nimport { focusTabStop, trapTab } from '../helpers/useFocusTrap';\n\n/**\n * Props for the Modal component.\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `.modal` element.\n */\nexport interface ModalProps\n extends\n Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'title'>,\n Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n /** Whether the modal is open/visible. */\n active?: boolean;\n /** Alias for `active`. Whether the modal is open/visible. */\n isActive?: boolean; // Alias for active\n /**\n * Called to ask for the modal to close. The props form calls it from the\n * background and the close button it renders. In the compound form,\n * `Modal.Close` calls it unless you give it an `onClick` of your own, and\n * `Modal.Background` doesn't call it on its own: pass it\n * `onClick={onClose}` for a click on the background to close the modal.\n * Escape calls it in both forms unless `closeOnEscape` is `false`.\n */\n onClose?: () => void;\n /** Additional CSS classes for the modal. */\n className?: string;\n /** Text color for modal content. */\n textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n /** Background color for modal content. */\n bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n /** Title/header for modal-card variant. (Legacy API only) */\n modalCardTitle?: React.ReactNode;\n /** Footer for modal-card variant. (Legacy API only) */\n modalCardFoot?: React.ReactNode;\n /**\n * Modal style: `'card'` for modal-card, `'content'` for modal-content. (Legacy API only)\n * @defaultValue auto\n */\n type?: 'card' | 'content';\n /** Modal body/content or compound components. */\n children?: React.ReactNode;\n /**\n * Close the modal when the Escape key is pressed (calls `onClose`). Only the\n * topmost open overlay responds, whichever Modal, Dialog, Sidebar or\n * full-page Loading opened last, so Escape closes one layer at a time. The\n * modal marks the Escape it closes on as used with `preventDefault()`, and\n * a Toast waits until no overlay is open. Turned off, a modal on top still\n * keeps Escape from the layers under it. A popup inside it, such as a\n * Dropdown's menu or a date picker's calendar, takes its own Escape first,\n * and so does content that calls `preventDefault()` on it.\n * @defaultValue true\n */\n closeOnEscape?: boolean;\n /**\n * Lock body scroll while the modal is active. Ref-counted and shared with\n * `Dialog`, `Sidebar` and `Loading`, so whichever overlay closes first does\n * not unlock the page underneath one that is still open.\n * @defaultValue true\n */\n lockScroll?: boolean;\n /**\n * Renders the modal into a portal target instead of inline, so it isn't\n * clipped by an ancestor with `overflow: hidden`, `filter` or `transform`.\n * `true` portals to the `portalContainer` a `ConfigProvider` sets,\n * `document.body` by default; a string is used as a\n * `document.querySelector` selector; an element is used directly. Renders\n * inline on the server and while hydrating, moving into the portal once the\n * client takes over, so hydration matches.\n * @defaultValue false\n */\n portal?: boolean | string | HTMLElement;\n}\n\n/**\n * Props for Modal.Background component.\n * @extraProp {React.MouseEventHandler<HTMLDivElement>} [onClick] - Called when the background is clicked. The background doesn't call the modal's `onClose` on its own, so pass `onClick={onClose}` for a click on it to close the modal.\n */\nexport interface ModalBackgroundProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Content component.\n */\nexport interface ModalContentProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card component.\n */\nexport interface ModalCardProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Head component.\n */\nexport interface ModalCardHeadProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Title component.\n */\nexport interface ModalCardTitleProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Body component.\n */\nexport interface ModalCardBodyProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Foot component.\n */\nexport interface ModalCardFootProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Close component.\n * @extraProp {'button' | 'submit' | 'reset'} [type='button'] - Button type. Defaults to `'button'`, so a close button inside a form does not submit it. Pass `'submit'` or `'reset'` and yours is used; any other value, or a spread carrying `type: undefined`, renders `'button'`.\n * @extraProp {string} [aria-label='close'] - Accessible name. Pass your own to replace it. An empty one, or a spread carrying `'aria-label': undefined`, keeps the default rather than leaving the button unnamed.\n * @extraProp {React.MouseEventHandler<HTMLButtonElement>} [onClick] - Called when the button is clicked. Without one, the button calls the `onClose` of the `Modal` around it. Yours replaces that rather than running before it, so call `onClose` from it if the button should still close the modal.\n */\nexport interface ModalCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Additional CSS classes. */\n className?: string;\n /** Size of the close button (only applies to 'floating' variant). */\n size?: 'small' | 'medium' | 'large';\n /** Button variant. 'delete' (default) for modal card headers, 'floating' for overlay close button. */\n variant?: 'delete' | 'floating';\n}\n\n// The enclosing modal's `onClose`, for a `Modal.Close` written as a part, so\n// it closes the modal the way the button the props form renders does.\nconst ModalCloseContext = createContext<(() => void) | undefined>(undefined);\n\n/**\n * Modal.Background - Renders the modal background overlay. Pass it\n * `onClick={onClose}` for a click on it to close the modal.\n *\n * @function\n * @param {ModalBackgroundProps} props - Component props.\n * @returns {JSX.Element} Modal background element.\n */\nconst ModalBackground: React.FC<ModalBackgroundProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-background'),\n className\n );\n return <div className={classes} {...props} />;\n};\n\n/**\n * Modal.Content - Renders modal content wrapper for custom content.\n *\n * @function\n * @param {ModalContentProps} props - Component props.\n * @returns {JSX.Element} Modal content element.\n */\nconst ModalContent: React.FC<ModalContentProps> = ({ className, ...props }) => {\n const classes = classNames(usePrefixedClassNames('modal-content'), className);\n return <div className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Head - Renders modal card header section.\n *\n * @function\n * @param {ModalCardHeadProps} props - Component props.\n * @returns {JSX.Element} Modal card header element.\n */\nconst ModalCardHead: React.FC<ModalCardHeadProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-head'),\n className\n );\n return <header className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Title - Renders modal card title.\n *\n * @function\n * @param {ModalCardTitleProps} props - Component props.\n * @returns {JSX.Element} Modal card title element.\n */\nconst ModalCardTitle: React.FC<ModalCardTitleProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-title'),\n className\n );\n return <p className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Body - Renders modal card body section.\n *\n * @function\n * @param {ModalCardBodyProps} props - Component props.\n * @returns {JSX.Element} Modal card body element.\n */\nconst ModalCardBody: React.FC<ModalCardBodyProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-body'),\n className\n );\n return <section className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Foot - Renders modal card footer section.\n *\n * @function\n * @param {ModalCardFootProps} props - Component props.\n * @returns {JSX.Element} Modal card footer element.\n */\nconst ModalCardFoot: React.FC<ModalCardFootProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-foot'),\n className\n );\n return <footer className={classes} {...props} />;\n};\n\n/**\n * Modal.Card - Renders modal card wrapper with compound components.\n * Use with Modal.Card.Head, Modal.Card.Title, Modal.Card.Body, and Modal.Card.Foot.\n *\n * @function\n * @param {ModalCardProps} props - Component props.\n * @returns {JSX.Element} Modal card element.\n */\nconst ModalCardComponent: React.FC<ModalCardProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(usePrefixedClassNames('modal-card'), className);\n return <div className={classes} {...props} />;\n};\n\nconst ModalCard = withSubComponents(ModalCardComponent, {\n Head: ModalCardHead,\n Title: ModalCardTitle,\n Body: ModalCardBody,\n Foot: ModalCardFoot,\n});\n\n/**\n * Modal.Close - Renders modal close button with two variant styles. It calls\n * the modal's `onClose` unless given an `onClick` of its own.\n *\n * @function\n * @param {ModalCloseProps} props - Component props.\n * @returns {JSX.Element} Close button element.\n *\n * @remarks\n * Supports two variants:\n * - 'delete' (default): For use in modal card headers, renders with 'delete' class\n * - 'floating': For floating overlay close button, renders with 'modal-close' class\n *\n * The size prop only applies to the 'floating' variant.\n */\nconst ModalClose: React.FC<ModalCloseProps> = ({\n className,\n size = 'large',\n variant = 'delete',\n onClick,\n ...props\n}) => {\n const onClose = useContext(ModalCloseContext);\n const classes = classNames(\n usePrefixedClassNames(\n variant === 'delete' ? 'delete' : 'modal-close',\n variant === 'floating' && size && { [`is-${size}`]: true }\n ),\n className\n );\n return (\n <button\n className={classes}\n {...props}\n // After the spread, reading through it: a key the spread carries with no\n // value would otherwise erase the default, leaving a nameless button\n // that submits the form around it. An empty label falls back too: the\n // button is drawn as an icon, so `''` would leave it unnamed. A caller's\n // own value still wins; `buttonType` says more.\n aria-label={props['aria-label'] || 'close'}\n type={buttonType(props.type)}\n // A caller's own `onClick` replaces the close rather than running\n // before it, unlike `Popover.Close`: this button used to close only\n // through that handler, so a caller already closing there, as with\n // `onClick={onClose}`, would otherwise close twice.\n onClick={onClick ?? (onClose && (() => onClose()))}\n />\n );\n};\n\n/**\n * The `Modal` component provides an empty, accessible overlay for arbitrary content — for a ready-made confirm or alert, reach for `Dialog` instead.\n *\n * @function\n * @param {ModalProps} props - Props for the Modal component.\n * @returns {JSX.Element} The rendered modal.\n *\n * @example\n * // Legacy API\n * <Modal active={isOpen} onClose={handleClose} modalCardTitle=\"Title\">\n * Content\n * </Modal>\n *\n * @example\n * // Compound Component API\n * <Modal isActive={isOpen} onClose={handleClose}>\n * <Modal.Background onClick={handleClose} />\n * <Modal.Card>\n * <Modal.Card.Head>\n * <Modal.Card.Title>Title</Modal.Card.Title>\n * <Modal.Close />\n * </Modal.Card.Head>\n * <Modal.Card.Body>Content</Modal.Card.Body>\n * </Modal.Card>\n * </Modal>\n *\n * @see {@link https://bulma.io/documentation/components/modal/ | Bulma Modal documentation}\n */\nconst ModalRoot = forwardRef<HTMLDivElement, ModalProps>(function ModalRoot(\n {\n active,\n isActive,\n onClose,\n className,\n textColor,\n bgColor,\n modalCardTitle,\n modalCardFoot,\n type,\n children,\n closeOnEscape = true,\n lockScroll = true,\n portal = false,\n role,\n 'aria-modal': ariaModalProp,\n ...props\n },\n ref\n) {\n const { classPrefix, portalContainer } = useConfig();\n const { bulmaHelperClasses, rest } = useBulmaClasses({\n color: textColor,\n backgroundColor: bgColor,\n ...props,\n });\n\n // Support both active and isActive props\n const isModalActive = active ?? isActive ?? false;\n\n const modalRootRef = useRef<HTMLDivElement>(null);\n\n // Cleanup returned by a consumer's callback ref on attach, held until detach.\n const consumerCleanupRef = useRef<(() => void) | null>(null);\n\n // The forwarded ref and the internal one must both see the node: focus\n // management and the Tab trap read `modalRootRef`, while consumers expect\n // their own ref to resolve.\n const combinedRef = useCallback(\n (node: HTMLDivElement | null) => {\n (modalRootRef as React.MutableRefObject<HTMLDivElement | null>).current =\n node;\n if (typeof ref === 'function') {\n // React 19 lets a callback ref return a cleanup function and detaches\n // by running it instead of calling the ref with `null`; React 18\n // discards the return value entirely. Returning it from here would be\n // a React-19-only contract, so instead we hold the cleanup and run it\n // ourselves on detach — a consumer's cleanup ref then behaves the same\n // on both majors of the CI matrix. Same shape as `Dropdown`.\n if (node === null) {\n const consumerCleanup = consumerCleanupRef.current;\n consumerCleanupRef.current = null;\n if (consumerCleanup) {\n consumerCleanup();\n } else {\n ref(null);\n }\n return;\n }\n const cleanup: unknown = ref(node);\n consumerCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;\n }\n },\n [ref]\n );\n const previouslyFocusedRef = useRef<HTMLElement | null>(null);\n const generatedTitleId = useId();\n // A portal has no server-rendered counterpart, so the server render and the\n // hydrating render have to stay inline and only move into the portal once\n // we're past hydration.\n const onClient = useIsHydrated();\n const resolveContainer = usePortalContainer();\n // Moving into the portal, or from one portal target to another, remounts\n // the modal's subtree, so any effect holding a DOM node from before the move\n // is holding a detached one. Effects that touch the modal's nodes key on\n // this, on `portal` and on `defaultTarget`, so they re-run against the new\n // tree.\n const isPortaled = Boolean(portal) && onClient;\n // The configured `portalContainer` only places a modal portaled with\n // `portal` set to `true`. In place, or with a target of its own, a change\n // to it moves nothing, so it mustn't re-run the effects either.\n const defaultTarget =\n isPortaled && portal === true ? portalContainer : undefined;\n\n useScrollLock(isModalActive && lockScroll);\n\n // Read when Escape arrives, so the key listener stays put while `onClose`\n // changes identity, as an inline one does on every render of the parent.\n const onCloseRef = useLatestRef(onClose);\n\n // Joins the stack of open overlays, so the keyboard handling below only\n // applies while this modal is on top.\n const isTopmost = useOverlayStack(isModalActive);\n\n // Escape closes, only for the topmost overlay. The listener is on\n // `window`, where a keydown arrives last, so everything inside the modal\n // has had the key first: React's handlers, and `document` listeners added\n // after this one, such as a date picker's.\n useEffect(() => {\n if (!isModalActive) return undefined;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key !== 'Escape' || !isTopmost()) return;\n // Something inside already used this Escape, such as a popup that\n // closed on it, so the modal waits for the next one. One the modal\n // closes on is marked used, so nothing under it acts on it as well.\n if (closeOnEscape && onCloseRef.current && !e.defaultPrevented) {\n e.preventDefault();\n onCloseRef.current();\n }\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [isModalActive, closeOnEscape, onCloseRef, isTopmost]);\n\n // Keep Tab within the modal: `aria-modal` hides the rest of the page from\n // assistive technology, so the keyboard order has to agree. Only while\n // it's the topmost modal overlay, so an overlay that isn't modal, such as\n // a Sidebar without an overlay, takes Escape from it but leaves it Tab.\n // It's the trap `useFocusTrap` sets, so it wraps at the stops Tab really\n // visits, skipping hidden, inert and closed content, and sends back a Tab\n // the browser still takes out. On `window` for the same reason as Escape:\n // a trap inside, such as a portaled popup's, has had the Tab first, and\n // one it used is left where it put focus. It reads the modal's node as\n // each key arrives, so a portal move that remounts the node, including one\n // to a selector that only starts matching while the modal is open, keeps\n // it trapped.\n useEffect(() => {\n if (!isModalActive) return undefined;\n return trapTab(\n () => modalRootRef.current,\n window,\n () => isTopmost('modal')\n );\n }, [isModalActive, isTopmost]);\n\n // Move focus into the modal on open, restore it on close\n useEffect(() => {\n if (!isModalActive) return undefined;\n\n // The element that had focus, wherever it sits: a portaled modal renders\n // under `document.body` while its opener can be inside a shadow root.\n previouslyFocusedRef.current =\n getDeepestActiveElement() as HTMLElement | null;\n const node = modalRootRef.current;\n if (node) focusTabStop(node);\n\n return () => {\n // Only hand focus back if this modal still owns it: closing a background\n // modal must not pull focus out of one that is still open on top. A\n // removed subtree leaves focus on <body>, which still counts as ours.\n const activeElement = getActiveElementInTree(node);\n if (\n activeElement &&\n activeElement !== document.body &&\n !node?.contains(activeElement)\n ) {\n return;\n }\n previouslyFocusedRef.current?.focus?.();\n };\n // `isPortaled` flips once when a hydrated portal modal moves out of the\n // inline tree, and `portal` or `defaultTarget` changing moves a portaled\n // one to another target; re-running rebinds focus onto the remounted\n // nodes. The cleanup above restores focus to the pre-open element first\n // (the detached subtree has left focus on <body>), so the re-run re-records\n // the same element and restore-on-close still lands in the right place.\n }, [isModalActive, isPortaled, portal, defaultTarget]);\n\n // Check if children contain compound components\n const hasCompoundComponents = React.Children.toArray(children).some(\n child =>\n React.isValidElement(child) &&\n (child.type === ModalBackground ||\n child.type === ModalContent ||\n child.type === ModalCard ||\n child.type === ModalClose)\n );\n\n // Generate Bulma classes with prefix\n const bulmaClasses = usePrefixedClassNames('modal', {\n 'is-active': isModalActive,\n });\n const deleteClass = usePrefixedClassNames('delete');\n\n const modalClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n const resolvedRole = role ?? (isModalActive ? 'dialog' : undefined);\n const resolvedAriaModal =\n ariaModalProp ??\n (isModalActive && resolvedRole !== 'presentation' ? 'true' : undefined);\n // A dialog needs an accessible name: the legacy card title is wired up\n // automatically, compound users pass their own aria-label/aria-labelledby\n // (both arrive in `rest`, which is spread last and so wins).\n const titleId = modalCardTitle ? generatedTitleId : undefined;\n\n let modalElement: React.ReactElement;\n\n // If using compound components, render children as-is\n if (hasCompoundComponents) {\n modalElement = (\n <div\n className={modalClasses}\n ref={combinedRef}\n role={resolvedRole}\n aria-modal={resolvedAriaModal}\n tabIndex={-1}\n {...rest}\n data-testid=\"modal\"\n >\n {children}\n </div>\n );\n } else {\n // Legacy API: EXPLICIT type wins; fallback to auto detection if not provided\n let isModalCard: boolean;\n if (type === 'card') isModalCard = true;\n else if (type === 'content') isModalCard = false;\n else isModalCard = !!modalCardTitle || !!modalCardFoot;\n\n modalElement = (\n <div\n className={modalClasses}\n ref={combinedRef}\n role={resolvedRole}\n aria-modal={resolvedAriaModal}\n aria-labelledby={titleId}\n tabIndex={-1}\n {...rest}\n data-testid=\"modal\"\n >\n <div\n className={prefixedClassNames(classPrefix, 'modal-background')}\n onClick={onClose}\n data-testid=\"modal-background\"\n />\n {isModalCard ? (\n <div className={prefixedClassNames(classPrefix, 'modal-card')}>\n {modalCardTitle && (\n <header\n className={prefixedClassNames(classPrefix, 'modal-card-head')}\n >\n <p\n id={titleId}\n className={prefixedClassNames(\n classPrefix,\n 'modal-card-title'\n )}\n >\n {modalCardTitle}\n </p>\n {onClose && (\n <button\n className={deleteClass}\n aria-label=\"close\"\n onClick={onClose}\n type=\"button\"\n data-testid=\"modal-close\"\n />\n )}\n </header>\n )}\n <section\n className={prefixedClassNames(classPrefix, 'modal-card-body')}\n data-testid=\"modal-body\"\n >\n {children}\n </section>\n {modalCardFoot && (\n <footer\n className={prefixedClassNames(classPrefix, 'modal-card-foot')}\n >\n {modalCardFoot}\n </footer>\n )}\n </div>\n ) : (\n <div\n className={prefixedClassNames(classPrefix, 'modal-content')}\n data-testid=\"modal-content\"\n >\n {children}\n </div>\n )}\n {/* Show floating close button for modal-content, or for modal-card when no header */}\n {(!isModalCard || (!modalCardTitle && onClose)) && onClose && (\n <button\n className={prefixedClassNames(\n classPrefix,\n 'modal-close',\n 'is-large'\n )}\n aria-label=\"close\"\n onClick={onClose}\n type=\"button\"\n data-testid=\"modal-close-float\"\n />\n )}\n </div>\n );\n }\n\n // In both forms, so a `Modal.Close` anywhere inside closes this modal.\n modalElement = (\n <ModalCloseContext.Provider value={onClose}>\n {modalElement}\n </ModalCloseContext.Provider>\n );\n\n if (isPortaled) {\n const target = resolveContainer(\n typeof portal === 'boolean' ? undefined : portal\n );\n return createPortal(modalElement, target);\n }\n\n return modalElement;\n});\n\nexport const Modal = withSubComponents(\n ModalRoot,\n {\n Background: ModalBackground,\n Content: ModalContent,\n Card: ModalCard,\n Close: ModalClose,\n },\n 'Modal'\n);\nexport default Modal;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"Modal.js","sources":["../../../src/components/Modal.tsx"],"sourcesContent":["import React, {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n classNames,\n usePrefixedClassNames,\n prefixedClassNames,\n} from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { buttonType } from '../helpers/buttonType';\nimport {\n useBulmaClasses,\n BulmaClassesProps,\n validColors,\n} from '../helpers/useBulmaClasses';\nimport { useConfig } from '../helpers/Config';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport {\n getActiveElementInTree,\n getDeepestActiveElement,\n} from '../helpers/shadowDom';\nimport { usePortalContainer } from '../helpers/portal';\nimport { LocalePortalScope } from '../helpers/LocaleProvider';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { useOverlayStack } from '../helpers/overlayStack';\nimport { focusTabStop, trapTab } from '../helpers/useFocusTrap';\n\n/**\n * Props for the Modal component.\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `.modal` element.\n */\nexport interface ModalProps\n extends\n Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'title'>,\n Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n /** Whether the modal is open/visible. */\n active?: boolean;\n /** Alias for `active`. Whether the modal is open/visible. */\n isActive?: boolean; // Alias for active\n /**\n * Called to ask for the modal to close. The props form calls it from the\n * background and the close button it renders. In the compound form,\n * `Modal.Close` calls it unless you give it an `onClick` of your own, and\n * `Modal.Background` doesn't call it on its own: pass it\n * `onClick={onClose}` for a click on the background to close the modal.\n * Escape calls it in both forms unless `closeOnEscape` is `false`.\n */\n onClose?: () => void;\n /** Additional CSS classes for the modal. */\n className?: string;\n /** Text color for modal content. */\n textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n /** Background color for modal content. */\n bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n /** Title/header for modal-card variant. (Legacy API only) */\n modalCardTitle?: React.ReactNode;\n /** Footer for modal-card variant. (Legacy API only) */\n modalCardFoot?: React.ReactNode;\n /**\n * Modal style: `'card'` for modal-card, `'content'` for modal-content. (Legacy API only)\n * @defaultValue auto\n */\n type?: 'card' | 'content';\n /** Modal body/content or compound components. */\n children?: React.ReactNode;\n /**\n * Close the modal when the Escape key is pressed (calls `onClose`). Only the\n * topmost open overlay responds, whichever Modal, Dialog, Sidebar or\n * full-page Loading opened last, so Escape closes one layer at a time. The\n * modal marks the Escape it closes on as used with `preventDefault()`, and\n * a Toast waits until no overlay is open. Turned off, a modal on top still\n * keeps Escape from the layers under it. A popup inside it, such as a\n * Dropdown's menu or a date picker's calendar, takes its own Escape first,\n * and so does content that calls `preventDefault()` on it.\n * @defaultValue true\n */\n closeOnEscape?: boolean;\n /**\n * Lock body scroll while the modal is active. Ref-counted and shared with\n * `Dialog`, `Sidebar` and `Loading`, so whichever overlay closes first does\n * not unlock the page underneath one that is still open.\n * @defaultValue true\n */\n lockScroll?: boolean;\n /**\n * Renders the modal into a portal target instead of inline, so it isn't\n * clipped by an ancestor with `overflow: hidden`, `filter` or `transform`.\n * `true` portals to the `portalContainer` a `ConfigProvider` sets,\n * `document.body` by default; a string is used as a\n * `document.querySelector` selector; an element is used directly. Renders\n * inline on the server and while hydrating, moving into the portal once the\n * client takes over, so hydration matches.\n * @defaultValue false\n */\n portal?: boolean | string | HTMLElement;\n}\n\n/**\n * Props for Modal.Background component.\n * @extraProp {React.MouseEventHandler<HTMLDivElement>} [onClick] - Called when the background is clicked. The background doesn't call the modal's `onClose` on its own, so pass `onClick={onClose}` for a click on it to close the modal.\n */\nexport interface ModalBackgroundProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Content component.\n */\nexport interface ModalContentProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card component.\n */\nexport interface ModalCardProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Head component.\n */\nexport interface ModalCardHeadProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Title component.\n */\nexport interface ModalCardTitleProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Body component.\n */\nexport interface ModalCardBodyProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Card.Foot component.\n */\nexport interface ModalCardFootProps extends React.HTMLAttributes<HTMLElement> {\n /** Additional CSS classes. */\n className?: string;\n}\n\n/**\n * Props for Modal.Close component.\n * @extraProp {'button' | 'submit' | 'reset'} [type='button'] - Button type. Defaults to `'button'`, so a close button inside a form does not submit it. Pass `'submit'` or `'reset'` and yours is used; any other value, or a spread carrying `type: undefined`, renders `'button'`.\n * @extraProp {string} [aria-label='close'] - Accessible name. Pass your own to replace it. An empty one, or a spread carrying `'aria-label': undefined`, keeps the default rather than leaving the button unnamed.\n * @extraProp {React.MouseEventHandler<HTMLButtonElement>} [onClick] - Called when the button is clicked. Without one, the button calls the `onClose` of the `Modal` around it. Yours replaces that rather than running before it, so call `onClose` from it if the button should still close the modal.\n */\nexport interface ModalCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Additional CSS classes. */\n className?: string;\n /** Size of the close button (only applies to 'floating' variant). */\n size?: 'small' | 'medium' | 'large';\n /** Button variant. 'delete' (default) for modal card headers, 'floating' for overlay close button. */\n variant?: 'delete' | 'floating';\n}\n\n// The enclosing modal's `onClose`, for a `Modal.Close` written as a part, so\n// it closes the modal the way the button the props form renders does.\nconst ModalCloseContext = createContext<(() => void) | undefined>(undefined);\n\n/**\n * Modal.Background - Renders the modal background overlay. Pass it\n * `onClick={onClose}` for a click on it to close the modal.\n *\n * @function\n * @param {ModalBackgroundProps} props - Component props.\n * @returns {JSX.Element} Modal background element.\n */\nconst ModalBackground: React.FC<ModalBackgroundProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-background'),\n className\n );\n return <div className={classes} {...props} />;\n};\n\n/**\n * Modal.Content - Renders modal content wrapper for custom content.\n *\n * @function\n * @param {ModalContentProps} props - Component props.\n * @returns {JSX.Element} Modal content element.\n */\nconst ModalContent: React.FC<ModalContentProps> = ({ className, ...props }) => {\n const classes = classNames(usePrefixedClassNames('modal-content'), className);\n return <div className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Head - Renders modal card header section.\n *\n * @function\n * @param {ModalCardHeadProps} props - Component props.\n * @returns {JSX.Element} Modal card header element.\n */\nconst ModalCardHead: React.FC<ModalCardHeadProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-head'),\n className\n );\n return <header className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Title - Renders modal card title.\n *\n * @function\n * @param {ModalCardTitleProps} props - Component props.\n * @returns {JSX.Element} Modal card title element.\n */\nconst ModalCardTitle: React.FC<ModalCardTitleProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-title'),\n className\n );\n return <p className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Body - Renders modal card body section.\n *\n * @function\n * @param {ModalCardBodyProps} props - Component props.\n * @returns {JSX.Element} Modal card body element.\n */\nconst ModalCardBody: React.FC<ModalCardBodyProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-body'),\n className\n );\n return <section className={classes} {...props} />;\n};\n\n/**\n * Modal.Card.Foot - Renders modal card footer section.\n *\n * @function\n * @param {ModalCardFootProps} props - Component props.\n * @returns {JSX.Element} Modal card footer element.\n */\nconst ModalCardFoot: React.FC<ModalCardFootProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(\n usePrefixedClassNames('modal-card-foot'),\n className\n );\n return <footer className={classes} {...props} />;\n};\n\n/**\n * Modal.Card - Renders modal card wrapper with compound components.\n * Use with Modal.Card.Head, Modal.Card.Title, Modal.Card.Body, and Modal.Card.Foot.\n *\n * @function\n * @param {ModalCardProps} props - Component props.\n * @returns {JSX.Element} Modal card element.\n */\nconst ModalCardComponent: React.FC<ModalCardProps> = ({\n className,\n ...props\n}) => {\n const classes = classNames(usePrefixedClassNames('modal-card'), className);\n return <div className={classes} {...props} />;\n};\n\nconst ModalCard = withSubComponents(ModalCardComponent, {\n Head: ModalCardHead,\n Title: ModalCardTitle,\n Body: ModalCardBody,\n Foot: ModalCardFoot,\n});\n\n/**\n * Modal.Close - Renders modal close button with two variant styles. It calls\n * the modal's `onClose` unless given an `onClick` of its own.\n *\n * @function\n * @param {ModalCloseProps} props - Component props.\n * @returns {JSX.Element} Close button element.\n *\n * @remarks\n * Supports two variants:\n * - 'delete' (default): For use in modal card headers, renders with 'delete' class\n * - 'floating': For floating overlay close button, renders with 'modal-close' class\n *\n * The size prop only applies to the 'floating' variant.\n */\nconst ModalClose: React.FC<ModalCloseProps> = ({\n className,\n size = 'large',\n variant = 'delete',\n onClick,\n ...props\n}) => {\n const onClose = useContext(ModalCloseContext);\n const classes = classNames(\n usePrefixedClassNames(\n variant === 'delete' ? 'delete' : 'modal-close',\n variant === 'floating' && size && { [`is-${size}`]: true }\n ),\n className\n );\n return (\n <button\n className={classes}\n {...props}\n // After the spread, reading through it: a key the spread carries with no\n // value would otherwise erase the default, leaving a nameless button\n // that submits the form around it. An empty label falls back too: the\n // button is drawn as an icon, so `''` would leave it unnamed. A caller's\n // own value still wins; `buttonType` says more.\n aria-label={props['aria-label'] || 'close'}\n type={buttonType(props.type)}\n // A caller's own `onClick` replaces the close rather than running\n // before it, unlike `Popover.Close`: this button used to close only\n // through that handler, so a caller already closing there, as with\n // `onClick={onClose}`, would otherwise close twice.\n onClick={onClick ?? (onClose && (() => onClose()))}\n />\n );\n};\n\n/**\n * The `Modal` component provides an empty, accessible overlay for arbitrary content — for a ready-made confirm or alert, reach for `Dialog` instead.\n *\n * @function\n * @param {ModalProps} props - Props for the Modal component.\n * @returns {JSX.Element} The rendered modal.\n *\n * @example\n * // Legacy API\n * <Modal active={isOpen} onClose={handleClose} modalCardTitle=\"Title\">\n * Content\n * </Modal>\n *\n * @example\n * // Compound Component API\n * <Modal isActive={isOpen} onClose={handleClose}>\n * <Modal.Background onClick={handleClose} />\n * <Modal.Card>\n * <Modal.Card.Head>\n * <Modal.Card.Title>Title</Modal.Card.Title>\n * <Modal.Close />\n * </Modal.Card.Head>\n * <Modal.Card.Body>Content</Modal.Card.Body>\n * </Modal.Card>\n * </Modal>\n *\n * @see {@link https://bulma.io/documentation/components/modal/ | Bulma Modal documentation}\n */\nconst ModalRoot = forwardRef<HTMLDivElement, ModalProps>(function ModalRoot(\n {\n active,\n isActive,\n onClose,\n className,\n textColor,\n bgColor,\n modalCardTitle,\n modalCardFoot,\n type,\n children,\n closeOnEscape = true,\n lockScroll = true,\n portal = false,\n role,\n 'aria-modal': ariaModalProp,\n ...props\n },\n ref\n) {\n const { classPrefix, portalContainer } = useConfig();\n const { bulmaHelperClasses, rest } = useBulmaClasses({\n color: textColor,\n backgroundColor: bgColor,\n ...props,\n });\n\n // Support both active and isActive props\n const isModalActive = active ?? isActive ?? false;\n\n const modalRootRef = useRef<HTMLDivElement>(null);\n\n // Cleanup returned by a consumer's callback ref on attach, held until detach.\n const consumerCleanupRef = useRef<(() => void) | null>(null);\n\n // The forwarded ref and the internal one must both see the node: focus\n // management and the Tab trap read `modalRootRef`, while consumers expect\n // their own ref to resolve.\n const combinedRef = useCallback(\n (node: HTMLDivElement | null) => {\n (modalRootRef as React.MutableRefObject<HTMLDivElement | null>).current =\n node;\n if (typeof ref === 'function') {\n // React 19 lets a callback ref return a cleanup function and detaches\n // by running it instead of calling the ref with `null`; React 18\n // discards the return value entirely. Returning it from here would be\n // a React-19-only contract, so instead we hold the cleanup and run it\n // ourselves on detach — a consumer's cleanup ref then behaves the same\n // on both majors of the CI matrix. Same shape as `Dropdown`.\n if (node === null) {\n const consumerCleanup = consumerCleanupRef.current;\n consumerCleanupRef.current = null;\n if (consumerCleanup) {\n consumerCleanup();\n } else {\n ref(null);\n }\n return;\n }\n const cleanup: unknown = ref(node);\n consumerCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;\n }\n },\n [ref]\n );\n const previouslyFocusedRef = useRef<HTMLElement | null>(null);\n const generatedTitleId = useId();\n // A portal has no server-rendered counterpart, so the server render and the\n // hydrating render have to stay inline and only move into the portal once\n // we're past hydration.\n const onClient = useIsHydrated();\n const resolveContainer = usePortalContainer();\n // Moving into the portal, or from one portal target to another, remounts\n // the modal's subtree, so any effect holding a DOM node from before the move\n // is holding a detached one. Effects that touch the modal's nodes key on\n // this, on `portal` and on `defaultTarget`, so they re-run against the new\n // tree.\n const isPortaled = Boolean(portal) && onClient;\n // The configured `portalContainer` only places a modal portaled with\n // `portal` set to `true`. In place, or with a target of its own, a change\n // to it moves nothing, so it mustn't re-run the effects either.\n const defaultTarget =\n isPortaled && portal === true ? portalContainer : undefined;\n\n useScrollLock(isModalActive && lockScroll);\n\n // Read when Escape arrives, so the key listener stays put while `onClose`\n // changes identity, as an inline one does on every render of the parent.\n const onCloseRef = useLatestRef(onClose);\n\n // Joins the stack of open overlays, so the keyboard handling below only\n // applies while this modal is on top.\n const isTopmost = useOverlayStack(isModalActive);\n\n // Escape closes, only for the topmost overlay. The listener is on\n // `window`, where a keydown arrives last, so everything inside the modal\n // has had the key first: React's handlers, and `document` listeners added\n // after this one, such as a date picker's.\n useEffect(() => {\n if (!isModalActive) return undefined;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key !== 'Escape' || !isTopmost()) return;\n // Something inside already used this Escape, such as a popup that\n // closed on it, so the modal waits for the next one. One the modal\n // closes on is marked used, so nothing under it acts on it as well.\n if (closeOnEscape && onCloseRef.current && !e.defaultPrevented) {\n e.preventDefault();\n onCloseRef.current();\n }\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [isModalActive, closeOnEscape, onCloseRef, isTopmost]);\n\n // Keep Tab within the modal: `aria-modal` hides the rest of the page from\n // assistive technology, so the keyboard order has to agree. Only while\n // it's the topmost modal overlay, so an overlay that isn't modal, such as\n // a Sidebar without an overlay, takes Escape from it but leaves it Tab.\n // It's the trap `useFocusTrap` sets, so it wraps at the stops Tab really\n // visits, skipping hidden, inert and closed content, and sends back a Tab\n // the browser still takes out. On `window` for the same reason as Escape:\n // a trap inside, such as a portaled popup's, has had the Tab first, and\n // one it used is left where it put focus. It reads the modal's node as\n // each key arrives, so a portal move that remounts the node, including one\n // to a selector that only starts matching while the modal is open, keeps\n // it trapped.\n useEffect(() => {\n if (!isModalActive) return undefined;\n return trapTab(\n () => modalRootRef.current,\n window,\n () => isTopmost('modal')\n );\n }, [isModalActive, isTopmost]);\n\n // Move focus into the modal on open, restore it on close\n useEffect(() => {\n if (!isModalActive) return undefined;\n\n // The element that had focus, wherever it sits: a portaled modal renders\n // under `document.body` while its opener can be inside a shadow root.\n previouslyFocusedRef.current =\n getDeepestActiveElement() as HTMLElement | null;\n const node = modalRootRef.current;\n if (node) focusTabStop(node);\n\n return () => {\n // Only hand focus back if this modal still owns it: closing a background\n // modal must not pull focus out of one that is still open on top. A\n // removed subtree leaves focus on <body>, which still counts as ours.\n const activeElement = getActiveElementInTree(node);\n if (\n activeElement &&\n activeElement !== document.body &&\n !node?.contains(activeElement)\n ) {\n return;\n }\n previouslyFocusedRef.current?.focus?.();\n };\n // `isPortaled` flips once when a hydrated portal modal moves out of the\n // inline tree, and `portal` or `defaultTarget` changing moves a portaled\n // one to another target; re-running rebinds focus onto the remounted\n // nodes. The cleanup above restores focus to the pre-open element first\n // (the detached subtree has left focus on <body>), so the re-run re-records\n // the same element and restore-on-close still lands in the right place.\n }, [isModalActive, isPortaled, portal, defaultTarget]);\n\n // Check if children contain compound components\n const hasCompoundComponents = React.Children.toArray(children).some(\n child =>\n React.isValidElement(child) &&\n (child.type === ModalBackground ||\n child.type === ModalContent ||\n child.type === ModalCard ||\n child.type === ModalClose)\n );\n\n // Generate Bulma classes with prefix\n const bulmaClasses = usePrefixedClassNames('modal', {\n 'is-active': isModalActive,\n });\n const deleteClass = usePrefixedClassNames('delete');\n\n const modalClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n const resolvedRole = role ?? (isModalActive ? 'dialog' : undefined);\n const resolvedAriaModal =\n ariaModalProp ??\n (isModalActive && resolvedRole !== 'presentation' ? 'true' : undefined);\n // A dialog needs an accessible name: the legacy card title is wired up\n // automatically, compound users pass their own aria-label/aria-labelledby\n // (both arrive in `rest`, which is spread last and so wins).\n const titleId = modalCardTitle ? generatedTitleId : undefined;\n\n let modalElement: React.ReactElement;\n\n // If using compound components, render children as-is\n if (hasCompoundComponents) {\n modalElement = (\n <div\n className={modalClasses}\n ref={combinedRef}\n role={resolvedRole}\n aria-modal={resolvedAriaModal}\n tabIndex={-1}\n {...rest}\n data-testid=\"modal\"\n >\n {children}\n </div>\n );\n } else {\n // Legacy API: EXPLICIT type wins; fallback to auto detection if not provided\n let isModalCard: boolean;\n if (type === 'card') isModalCard = true;\n else if (type === 'content') isModalCard = false;\n else isModalCard = !!modalCardTitle || !!modalCardFoot;\n\n modalElement = (\n <div\n className={modalClasses}\n ref={combinedRef}\n role={resolvedRole}\n aria-modal={resolvedAriaModal}\n aria-labelledby={titleId}\n tabIndex={-1}\n {...rest}\n data-testid=\"modal\"\n >\n <div\n className={prefixedClassNames(classPrefix, 'modal-background')}\n onClick={onClose}\n data-testid=\"modal-background\"\n />\n {isModalCard ? (\n <div className={prefixedClassNames(classPrefix, 'modal-card')}>\n {modalCardTitle && (\n <header\n className={prefixedClassNames(classPrefix, 'modal-card-head')}\n >\n <p\n id={titleId}\n className={prefixedClassNames(\n classPrefix,\n 'modal-card-title'\n )}\n >\n {modalCardTitle}\n </p>\n {onClose && (\n <button\n className={deleteClass}\n aria-label=\"close\"\n onClick={onClose}\n type=\"button\"\n data-testid=\"modal-close\"\n />\n )}\n </header>\n )}\n <section\n className={prefixedClassNames(classPrefix, 'modal-card-body')}\n data-testid=\"modal-body\"\n >\n {children}\n </section>\n {modalCardFoot && (\n <footer\n className={prefixedClassNames(classPrefix, 'modal-card-foot')}\n >\n {modalCardFoot}\n </footer>\n )}\n </div>\n ) : (\n <div\n className={prefixedClassNames(classPrefix, 'modal-content')}\n data-testid=\"modal-content\"\n >\n {children}\n </div>\n )}\n {/* Show floating close button for modal-content, or for modal-card when no header */}\n {(!isModalCard || (!modalCardTitle && onClose)) && onClose && (\n <button\n className={prefixedClassNames(\n classPrefix,\n 'modal-close',\n 'is-large'\n )}\n aria-label=\"close\"\n onClick={onClose}\n type=\"button\"\n data-testid=\"modal-close-float\"\n />\n )}\n </div>\n );\n }\n\n // In both forms, so a `Modal.Close` anywhere inside closes this modal.\n modalElement = (\n <ModalCloseContext.Provider value={onClose}>\n {modalElement}\n </ModalCloseContext.Provider>\n );\n\n if (isPortaled) {\n const target = resolveContainer(\n typeof portal === 'boolean' ? undefined : portal\n );\n return createPortal(\n <LocalePortalScope target={target}>{modalElement}</LocalePortalScope>,\n target\n );\n }\n\n return modalElement;\n});\n\nexport const Modal = withSubComponents(\n ModalRoot,\n {\n Background: ModalBackground,\n Content: ModalContent,\n Card: ModalCard,\n Close: ModalClose,\n },\n 'Modal'\n);\nexport default Modal;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
@@ -7,6 +7,7 @@ import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
7
7
  import { withSubComponents } from '../helpers/withSubComponents.js';
8
8
  import { useScrollLock } from '../helpers/scrollLock.js';
9
9
  import { usePortalContainer } from '../helpers/portal.js';
10
+ import { LocalePortalScope } from '../helpers/LocaleProvider.js';
10
11
  import { useConfig } from '../helpers/Config.js';
11
12
  import { buttonType } from '../helpers/buttonType.js';
12
13
  import { useLatestRef } from '../helpers/useLatestRef.js';
@@ -200,7 +201,8 @@ const SidebarComponent = forwardRef(({ isOpen, onClose, position = 'left', width
200
201
  }
201
202
  // Render to portal for proper stacking
202
203
  if (typeof document !== 'undefined') {
203
- return createPortal(sidebarContent, resolveContainer());
204
+ const target = resolveContainer();
205
+ return createPortal(jsx(LocalePortalScope, { target: target, children: sidebarContent }), target);
204
206
  }
205
207
  return null;
206
208
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Sidebar.js","sources":["../../../src/components/Sidebar.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport { usePortalContainer } from '../helpers/portal';\nimport { useConfig } from '../helpers/Config';\nimport { buttonType } from '../helpers/buttonType';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { isModalOverlayOpen, useOverlayStack } from '../helpers/overlayStack';\nimport { focusTabStop, trapTab } from '../helpers/useFocusTrap';\nimport { inertProps } from '../helpers/inertProps';\nimport {\n getActiveElementInTree,\n getDeepestActiveElement,\n} from '../helpers/shadowDom';\n\n/** Position of the sidebar relative to the viewport. */\nexport type SidebarPosition = 'left' | 'right';\n\n/**\n * Props for the Sidebar component.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the sidebar element.\n */\nexport interface SidebarProps\n extends\n Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'color'>,\n BulmaClassesProps {\n /**\n * Whether the sidebar is open (required). Opening moves focus into the\n * sidebar, to its first tab stop or the sidebar itself, except for a sidebar\n * without an overlay opened while a modal overlay, such as a Modal, is open:\n * that one leaves focus where it is. That's decided as it opens, and\n * changing `overlay` while it's open doesn't move focus. Closing hands\n * focus back to whatever had it when the sidebar opened, unless focus has\n * already left the sidebar, as it does for an overlay opened over it. A\n * closed sidebar stays in the page, so it can slide out, and is `inert` and\n * `aria-hidden` there: Tab passes over its content and assistive\n * technology doesn't read it.\n */\n isOpen: boolean;\n /** Callback when sidebar should close. */\n onClose?: () => void;\n /** Which side the sidebar appears from. Default: 'left'. */\n position?: SidebarPosition;\n /** Custom width of the sidebar. */\n width?: string;\n /** Sidebar takes full width (mobile-style). */\n isFullwidth?: boolean;\n /** Sidebar takes full width (mobile-style). @deprecated Use `isFullwidth` instead — `isFullwidth` wins if both are set. */\n fullWidth?: boolean;\n /**\n * Show an overlay behind the sidebar, which makes it modal: it gets\n * `aria-modal=\"true\"`, locks body scroll, and keeps Tab and Shift+Tab\n * inside it while it is the topmost modal overlay. A Modal or Dialog opened\n * over it, even one rendered inside it, holds Tab until it closes. Without\n * an overlay the sidebar isn't modal and holds no Tab: on the page, Tab\n * moves in and out of it freely, and opened over a Modal, it leaves the\n * Modal holding Tab, and focus, while still taking Escape first. Whether\n * the sidebar takes focus is decided as it opens: changing this while it's\n * open moves the Tab trap, not focus. Default: true.\n */\n overlay?: boolean;\n /** Close sidebar when overlay is clicked. Default: true. */\n overlayClose?: boolean;\n /**\n * Close sidebar on Escape key. Only the topmost open overlay responds,\n * whichever Modal, Dialog, Sidebar or full-page Loading opened last, so\n * Escape closes one layer at a time. The sidebar marks the Escape it closes\n * on as used with `preventDefault()`, and a Toast waits until no overlay is\n * open. Turned off, a sidebar on top still keeps Escape from the layers\n * under it. A popup inside it, such as a Dropdown's menu or a date picker's\n * calendar, takes its own Escape first, and so does content that calls\n * `preventDefault()` on it. Default: true.\n */\n escapeClose?: boolean;\n /** Allow closing the sidebar. Default: true. */\n canCancel?: boolean;\n /** Content to display in the sidebar. */\n children?: React.ReactNode;\n /** Renders inline instead of using a portal. */\n inline?: boolean;\n}\n\n/**\n * The `Sidebar` component provides a slide-out navigation panel that appears from the left or right side of the screen.\n *\n * @function\n * @param {SidebarProps} props - Props for the Sidebar component.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the sidebar element.\n * @returns {JSX.Element | null} The rendered sidebar component.\n *\n * @example\n * // Basic sidebar\n * const [isOpen, setIsOpen] = useState(false);\n * <Sidebar isOpen={isOpen} onClose={() => setIsOpen(false)}>\n * <Menu>...</Menu>\n * </Sidebar>\n *\n * @example\n * // Right-side sidebar with custom width\n * <Sidebar\n * isOpen={isOpen}\n * onClose={() => setIsOpen(false)}\n * position=\"right\"\n * width=\"320px\"\n * >\n * <div>Panel content</div>\n * </Sidebar>\n */\nconst SidebarComponent = forwardRef<HTMLElement, SidebarProps>(\n (\n {\n isOpen,\n onClose,\n position = 'left',\n width = '260px',\n isFullwidth,\n fullWidth,\n overlay = true,\n overlayClose = true,\n escapeClose = true,\n canCancel = true,\n children,\n inline = false,\n className,\n style,\n ...props\n },\n ref\n ) => {\n const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n const resolveContainer = usePortalContainer();\n const { portalContainer } = useConfig();\n // Where the configured default puts the sidebar. An `inline` one doesn't\n // portal, so a change to the default moves nothing.\n const defaultTarget = inline ? undefined : portalContainer;\n const sidebarRef = useRef<HTMLElement>(null);\n // Cleanup returned by a consumer's callback ref on attach, held until detach.\n const consumerCleanupRef = useRef<(() => void) | null>(null);\n const resolvedFullwidth = isFullwidth ?? fullWidth ?? false;\n\n // Close handler\n const handleClose = useCallback(() => {\n if (canCancel && onClose) {\n onClose();\n }\n }, [canCancel, onClose]);\n\n // Handle overlay click\n const handleOverlayClick = useCallback(() => {\n if (overlayClose) {\n handleClose();\n }\n }, [overlayClose, handleClose]);\n\n // Read when Escape arrives, so the key listener stays put while\n // `onClose` changes identity, as an inline one does on every render of\n // the parent.\n const handleCloseRef = useLatestRef(handleClose);\n\n // Joins the stack of open overlays, so the sidebar answers Escape only\n // while it's the topmost overlay, and keeps it from those under it. It's\n // modal with an overlay: without one it leaves Tab to a modal overlay\n // under it.\n const isTopmost = useOverlayStack(isOpen, overlay);\n const closesOnEscape = escapeClose && canCancel && Boolean(onClose);\n\n // Handle escape key. On `window`, as in `Modal`, so everything inside the\n // sidebar has had the key first, and an Escape it used is left to it. One\n // the sidebar closes on is marked used, so nothing under it acts on it.\n useEffect(() => {\n if (!isOpen || !closesOnEscape) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key !== 'Escape' || e.defaultPrevented || !isTopmost()) return;\n e.preventDefault();\n handleCloseRef.current();\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [isOpen, closesOnEscape, handleCloseRef, isTopmost]);\n\n // Keep Tab inside while there's an overlay, as `Modal` does:\n // `aria-modal` hides the rest of the page from assistive technology, so\n // the keyboard order has to agree. Only while it's the topmost modal\n // overlay, so a Modal or Dialog opened over the sidebar, even one\n // rendered inside it, holds Tab instead until it closes, and a sidebar\n // without an overlay opened over it doesn't. On `window` for the same\n // reason as Escape: a trap inside, such as a portaled popup's, has had\n // the Tab first, and one it used is left where it put focus. It's the trap\n // `useFocusTrap` sets, so a Tab the browser still takes out, as Safari\n // does past links, is sent back in. It reads the aside as each key\n // arrives, so one remounted while the sidebar is open, by a new portal\n // target or by switching `inline`, stays trapped.\n useEffect(() => {\n if (!isOpen || !overlay) return undefined;\n return trapTab(\n () => sidebarRef.current,\n window,\n () => isTopmost('modal')\n );\n }, [isOpen, overlay, isTopmost]);\n\n // Prevent body scroll when sidebar is open. Ref-counted through the shared\n // helper so an overlapping Modal/Dialog/Loading doesn't unlock underneath.\n useScrollLock(isOpen && overlay);\n\n // Move focus into the sidebar on open, to the first stop Tab wraps to or\n // the sidebar itself, and hand it back on close, as `Modal` does. A\n // different `defaultTarget` remounts the portaled sidebar: the cleanup\n // hands focus back from the old nodes, which left it on <body>, and the\n // re-run records the same opener and focuses the new nodes. Whether it\n // takes focus is decided as it opens, so `overlay` changing while it's\n // open leaves focus where the user has it.\n useEffect(() => {\n if (!isOpen) return undefined;\n const element = sidebarRef.current;\n /* istanbul ignore if: the aside renders whenever the sidebar is open, so its ref is set before this runs */\n if (!element) return undefined;\n\n // The element that had focus, wherever it sits: a portaled sidebar\n // renders under `document.body` while its opener can be inside a\n // shadow root.\n const opener = getDeepestActiveElement() as HTMLElement | null;\n // Without an overlay the sidebar holds no Tab, so with a modal overlay\n // open under it, the first Tab would take focus back there and leave\n // the sidebar's other controls out of reach. It leaves focus alone\n // then, and the cleanup below finds focus outside and leaves it too.\n if (overlay || !isModalOverlayOpen()) {\n focusTabStop(element);\n }\n\n return () => {\n // Only while the sidebar still holds focus: closing one under another\n // overlay mustn't pull focus out of the one on top, and focus moved\n // out to the page stays there. A removed subtree leaves focus on\n // <body>, which still counts as held.\n const active = getActiveElementInTree(element);\n if (active === document.body || element.contains(active)) {\n opener?.focus();\n }\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- `overlay` is read as the sidebar opens, on purpose\n }, [isOpen, defaultTarget]);\n\n // Use combined ref\n const combinedRef = useCallback(\n (node: HTMLElement | null) => {\n (sidebarRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n if (typeof ref === 'function') {\n // React 19 lets a callback ref return a cleanup function and detaches by\n // running it instead of calling the ref with `null`; React 18 discards the\n // return value entirely. Returning it from here would be a React-19-only\n // contract, so we hold the cleanup and run it ourselves on detach — the\n // same shape as `Dropdown`, `Modal`, `Dialog`, `Toast` and `Carousel`.\n // The form controls that merge a forwarded ref still discard the cleanup\n // and detach with `ref(null)`, so this is not yet library-wide — grep\n // `typeof ref === 'function'` for the current split.\n if (node === null) {\n const consumerCleanup = consumerCleanupRef.current;\n consumerCleanupRef.current = null;\n if (consumerCleanup) {\n consumerCleanup();\n } else {\n ref(null);\n }\n return;\n }\n const cleanup: unknown = ref(node);\n consumerCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n (ref as React.MutableRefObject<HTMLElement | null>).current = node;\n }\n },\n [ref]\n );\n\n // Generate classes\n const sidebarClasses = usePrefixedClassNames('sidebar', {\n 'is-active': isOpen,\n [`is-${position}`]: position,\n 'is-fullwidth': resolvedFullwidth,\n });\n const backgroundClass = usePrefixedClassNames('sidebar-background', {\n 'is-active': isOpen,\n });\n const contentClass = usePrefixedClassNames('sidebar-content');\n\n const combinedClasses = classNames(\n sidebarClasses,\n bulmaHelperClasses,\n className\n );\n\n // Custom style for width\n const sidebarStyle: React.CSSProperties = {\n ...style,\n '--bulma-sidebar-width': resolvedFullwidth ? '100%' : width,\n } as React.CSSProperties;\n\n const sidebarContent = (\n <>\n {overlay && (\n <div\n className={backgroundClass}\n onClick={handleOverlayClick}\n aria-hidden=\"true\"\n />\n )}\n <aside\n ref={combinedRef}\n className={combinedClasses}\n style={sidebarStyle}\n role=\"dialog\"\n aria-modal={overlay ? 'true' : undefined}\n aria-hidden={!isOpen}\n // React commits this before the effect that moves focus in runs, so\n // an opening sidebar is no longer inert by then.\n {...inertProps(!isOpen)}\n tabIndex={-1}\n {...rest}\n >\n <div className={contentClass}>{children}</div>\n </aside>\n </>\n );\n\n if (inline) {\n return sidebarContent;\n }\n\n // Render to portal for proper stacking\n if (typeof document !== 'undefined') {\n return createPortal(sidebarContent, resolveContainer());\n }\n\n return null;\n }\n);\n\n// Sub-components\n\n/**\n * Props for the SidebarHeader component.\n */\ninterface SidebarHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Header content. */\n children?: React.ReactNode;\n}\n\n/**\n * Container for the sidebar header.\n *\n * @function\n * @param {SidebarHeaderProps} props - Props for the SidebarHeader component.\n * @returns {JSX.Element} The rendered sidebar header.\n */\nconst SidebarHeader: React.FC<SidebarHeaderProps> = ({\n className,\n children,\n ...props\n}) => {\n const headerClass = usePrefixedClassNames('sidebar-header');\n return (\n <div className={classNames(headerClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n/**\n * Props for the SidebarTitle component.\n */\ninterface SidebarTitleProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Title content. */\n children?: React.ReactNode;\n}\n\n/**\n * Title text inside the header.\n *\n * @function\n * @param {SidebarTitleProps} props - Props for the SidebarTitle component.\n * @returns {JSX.Element} The rendered sidebar title.\n */\nconst SidebarTitle: React.FC<SidebarTitleProps> = ({\n className,\n children,\n ...props\n}) => {\n const titleClass = usePrefixedClassNames('sidebar-title');\n return (\n <p className={classNames(titleClass, className)} {...props}>\n {children}\n </p>\n );\n};\n\n/**\n * Props for the SidebarClose component.\n * Extends standard button attributes.\n * @extraProp {'button' | 'submit' | 'reset'} [type='button'] - Button type. Defaults to `'button'`, so a close button inside a form does not submit it. Pass `'submit'` or `'reset'` and yours is used; any other value, or a spread carrying `type: undefined`, renders `'button'`.\n * @extraProp {string} [aria-label='Close'] - Accessible name. Pass your own to replace it. An empty one, or a spread carrying `'aria-label': undefined`, keeps the default rather than leaving the button unnamed.\n */\ntype SidebarCloseProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Close button for the sidebar.\n *\n * @function\n * @param {SidebarCloseProps} props - Props for the SidebarClose component.\n * @returns {JSX.Element} The rendered close button.\n */\nconst SidebarClose: React.FC<SidebarCloseProps> = ({\n className,\n children,\n ...props\n}) => {\n const closeClass = usePrefixedClassNames('sidebar-close');\n return (\n <button\n className={classNames(closeClass, className)}\n {...props}\n // After the spread, reading through it: a key the spread carries with no\n // value would otherwise erase the default, leaving a nameless button\n // that submits the form around it. An empty label falls back too: the\n // button is drawn as an icon, so `''` would leave it unnamed. A caller's\n // own value still wins; `buttonType` says more.\n aria-label={props['aria-label'] || 'Close'}\n type={buttonType(props.type)}\n >\n {children}\n </button>\n );\n};\n\n/**\n * Props for the SidebarBody component.\n */\ninterface SidebarBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Body content. */\n children?: React.ReactNode;\n}\n\n/**\n * Main content area of the sidebar.\n *\n * @function\n * @param {SidebarBodyProps} props - Props for the SidebarBody component.\n * @returns {JSX.Element} The rendered sidebar body.\n */\nconst SidebarBody: React.FC<SidebarBodyProps> = ({\n className,\n children,\n ...props\n}) => {\n const bodyClass = usePrefixedClassNames('sidebar-body');\n return (\n <div className={classNames(bodyClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n/**\n * Props for the SidebarFooter component.\n */\ninterface SidebarFooterProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Footer content. */\n children?: React.ReactNode;\n}\n\n/**\n * Footer area of the sidebar.\n *\n * @function\n * @param {SidebarFooterProps} props - Props for the SidebarFooter component.\n * @returns {JSX.Element} The rendered sidebar footer.\n */\nconst SidebarFooter: React.FC<SidebarFooterProps> = ({\n className,\n children,\n ...props\n}) => {\n const footerClass = usePrefixedClassNames('sidebar-footer');\n return (\n <div className={classNames(footerClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n// Attach static subcomponents\nexport const Sidebar = withSubComponents(\n SidebarComponent,\n {\n Header: SidebarHeader,\n Title: SidebarTitle,\n Close: SidebarClose,\n Body: SidebarBody,\n Footer: SidebarFooter,\n },\n 'Sidebar'\n);\n\nexport default Sidebar;\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"Sidebar.js","sources":["../../../src/components/Sidebar.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport { usePortalContainer } from '../helpers/portal';\nimport { LocalePortalScope } from '../helpers/LocaleProvider';\nimport { useConfig } from '../helpers/Config';\nimport { buttonType } from '../helpers/buttonType';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { isModalOverlayOpen, useOverlayStack } from '../helpers/overlayStack';\nimport { focusTabStop, trapTab } from '../helpers/useFocusTrap';\nimport { inertProps } from '../helpers/inertProps';\nimport {\n getActiveElementInTree,\n getDeepestActiveElement,\n} from '../helpers/shadowDom';\n\n/** Position of the sidebar relative to the viewport. */\nexport type SidebarPosition = 'left' | 'right';\n\n/**\n * Props for the Sidebar component.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the sidebar element.\n */\nexport interface SidebarProps\n extends\n Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'color'>,\n BulmaClassesProps {\n /**\n * Whether the sidebar is open (required). Opening moves focus into the\n * sidebar, to its first tab stop or the sidebar itself, except for a sidebar\n * without an overlay opened while a modal overlay, such as a Modal, is open:\n * that one leaves focus where it is. That's decided as it opens, and\n * changing `overlay` while it's open doesn't move focus. Closing hands\n * focus back to whatever had it when the sidebar opened, unless focus has\n * already left the sidebar, as it does for an overlay opened over it. A\n * closed sidebar stays in the page, so it can slide out, and is `inert` and\n * `aria-hidden` there: Tab passes over its content and assistive\n * technology doesn't read it.\n */\n isOpen: boolean;\n /** Callback when sidebar should close. */\n onClose?: () => void;\n /** Which side the sidebar appears from. Default: 'left'. */\n position?: SidebarPosition;\n /** Custom width of the sidebar. */\n width?: string;\n /** Sidebar takes full width (mobile-style). */\n isFullwidth?: boolean;\n /** Sidebar takes full width (mobile-style). @deprecated Use `isFullwidth` instead — `isFullwidth` wins if both are set. */\n fullWidth?: boolean;\n /**\n * Show an overlay behind the sidebar, which makes it modal: it gets\n * `aria-modal=\"true\"`, locks body scroll, and keeps Tab and Shift+Tab\n * inside it while it is the topmost modal overlay. A Modal or Dialog opened\n * over it, even one rendered inside it, holds Tab until it closes. Without\n * an overlay the sidebar isn't modal and holds no Tab: on the page, Tab\n * moves in and out of it freely, and opened over a Modal, it leaves the\n * Modal holding Tab, and focus, while still taking Escape first. Whether\n * the sidebar takes focus is decided as it opens: changing this while it's\n * open moves the Tab trap, not focus. Default: true.\n */\n overlay?: boolean;\n /** Close sidebar when overlay is clicked. Default: true. */\n overlayClose?: boolean;\n /**\n * Close sidebar on Escape key. Only the topmost open overlay responds,\n * whichever Modal, Dialog, Sidebar or full-page Loading opened last, so\n * Escape closes one layer at a time. The sidebar marks the Escape it closes\n * on as used with `preventDefault()`, and a Toast waits until no overlay is\n * open. Turned off, a sidebar on top still keeps Escape from the layers\n * under it. A popup inside it, such as a Dropdown's menu or a date picker's\n * calendar, takes its own Escape first, and so does content that calls\n * `preventDefault()` on it. Default: true.\n */\n escapeClose?: boolean;\n /** Allow closing the sidebar. Default: true. */\n canCancel?: boolean;\n /** Content to display in the sidebar. */\n children?: React.ReactNode;\n /** Renders inline instead of using a portal. */\n inline?: boolean;\n}\n\n/**\n * The `Sidebar` component provides a slide-out navigation panel that appears from the left or right side of the screen.\n *\n * @function\n * @param {SidebarProps} props - Props for the Sidebar component.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the sidebar element.\n * @returns {JSX.Element | null} The rendered sidebar component.\n *\n * @example\n * // Basic sidebar\n * const [isOpen, setIsOpen] = useState(false);\n * <Sidebar isOpen={isOpen} onClose={() => setIsOpen(false)}>\n * <Menu>...</Menu>\n * </Sidebar>\n *\n * @example\n * // Right-side sidebar with custom width\n * <Sidebar\n * isOpen={isOpen}\n * onClose={() => setIsOpen(false)}\n * position=\"right\"\n * width=\"320px\"\n * >\n * <div>Panel content</div>\n * </Sidebar>\n */\nconst SidebarComponent = forwardRef<HTMLElement, SidebarProps>(\n (\n {\n isOpen,\n onClose,\n position = 'left',\n width = '260px',\n isFullwidth,\n fullWidth,\n overlay = true,\n overlayClose = true,\n escapeClose = true,\n canCancel = true,\n children,\n inline = false,\n className,\n style,\n ...props\n },\n ref\n ) => {\n const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n const resolveContainer = usePortalContainer();\n const { portalContainer } = useConfig();\n // Where the configured default puts the sidebar. An `inline` one doesn't\n // portal, so a change to the default moves nothing.\n const defaultTarget = inline ? undefined : portalContainer;\n const sidebarRef = useRef<HTMLElement>(null);\n // Cleanup returned by a consumer's callback ref on attach, held until detach.\n const consumerCleanupRef = useRef<(() => void) | null>(null);\n const resolvedFullwidth = isFullwidth ?? fullWidth ?? false;\n\n // Close handler\n const handleClose = useCallback(() => {\n if (canCancel && onClose) {\n onClose();\n }\n }, [canCancel, onClose]);\n\n // Handle overlay click\n const handleOverlayClick = useCallback(() => {\n if (overlayClose) {\n handleClose();\n }\n }, [overlayClose, handleClose]);\n\n // Read when Escape arrives, so the key listener stays put while\n // `onClose` changes identity, as an inline one does on every render of\n // the parent.\n const handleCloseRef = useLatestRef(handleClose);\n\n // Joins the stack of open overlays, so the sidebar answers Escape only\n // while it's the topmost overlay, and keeps it from those under it. It's\n // modal with an overlay: without one it leaves Tab to a modal overlay\n // under it.\n const isTopmost = useOverlayStack(isOpen, overlay);\n const closesOnEscape = escapeClose && canCancel && Boolean(onClose);\n\n // Handle escape key. On `window`, as in `Modal`, so everything inside the\n // sidebar has had the key first, and an Escape it used is left to it. One\n // the sidebar closes on is marked used, so nothing under it acts on it.\n useEffect(() => {\n if (!isOpen || !closesOnEscape) return;\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key !== 'Escape' || e.defaultPrevented || !isTopmost()) return;\n e.preventDefault();\n handleCloseRef.current();\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [isOpen, closesOnEscape, handleCloseRef, isTopmost]);\n\n // Keep Tab inside while there's an overlay, as `Modal` does:\n // `aria-modal` hides the rest of the page from assistive technology, so\n // the keyboard order has to agree. Only while it's the topmost modal\n // overlay, so a Modal or Dialog opened over the sidebar, even one\n // rendered inside it, holds Tab instead until it closes, and a sidebar\n // without an overlay opened over it doesn't. On `window` for the same\n // reason as Escape: a trap inside, such as a portaled popup's, has had\n // the Tab first, and one it used is left where it put focus. It's the trap\n // `useFocusTrap` sets, so a Tab the browser still takes out, as Safari\n // does past links, is sent back in. It reads the aside as each key\n // arrives, so one remounted while the sidebar is open, by a new portal\n // target or by switching `inline`, stays trapped.\n useEffect(() => {\n if (!isOpen || !overlay) return undefined;\n return trapTab(\n () => sidebarRef.current,\n window,\n () => isTopmost('modal')\n );\n }, [isOpen, overlay, isTopmost]);\n\n // Prevent body scroll when sidebar is open. Ref-counted through the shared\n // helper so an overlapping Modal/Dialog/Loading doesn't unlock underneath.\n useScrollLock(isOpen && overlay);\n\n // Move focus into the sidebar on open, to the first stop Tab wraps to or\n // the sidebar itself, and hand it back on close, as `Modal` does. A\n // different `defaultTarget` remounts the portaled sidebar: the cleanup\n // hands focus back from the old nodes, which left it on <body>, and the\n // re-run records the same opener and focuses the new nodes. Whether it\n // takes focus is decided as it opens, so `overlay` changing while it's\n // open leaves focus where the user has it.\n useEffect(() => {\n if (!isOpen) return undefined;\n const element = sidebarRef.current;\n /* istanbul ignore if: the aside renders whenever the sidebar is open, so its ref is set before this runs */\n if (!element) return undefined;\n\n // The element that had focus, wherever it sits: a portaled sidebar\n // renders under `document.body` while its opener can be inside a\n // shadow root.\n const opener = getDeepestActiveElement() as HTMLElement | null;\n // Without an overlay the sidebar holds no Tab, so with a modal overlay\n // open under it, the first Tab would take focus back there and leave\n // the sidebar's other controls out of reach. It leaves focus alone\n // then, and the cleanup below finds focus outside and leaves it too.\n if (overlay || !isModalOverlayOpen()) {\n focusTabStop(element);\n }\n\n return () => {\n // Only while the sidebar still holds focus: closing one under another\n // overlay mustn't pull focus out of the one on top, and focus moved\n // out to the page stays there. A removed subtree leaves focus on\n // <body>, which still counts as held.\n const active = getActiveElementInTree(element);\n if (active === document.body || element.contains(active)) {\n opener?.focus();\n }\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- `overlay` is read as the sidebar opens, on purpose\n }, [isOpen, defaultTarget]);\n\n // Use combined ref\n const combinedRef = useCallback(\n (node: HTMLElement | null) => {\n (sidebarRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n if (typeof ref === 'function') {\n // React 19 lets a callback ref return a cleanup function and detaches by\n // running it instead of calling the ref with `null`; React 18 discards the\n // return value entirely. Returning it from here would be a React-19-only\n // contract, so we hold the cleanup and run it ourselves on detach — the\n // same shape as `Dropdown`, `Modal`, `Dialog`, `Toast` and `Carousel`.\n // The form controls that merge a forwarded ref still discard the cleanup\n // and detach with `ref(null)`, so this is not yet library-wide — grep\n // `typeof ref === 'function'` for the current split.\n if (node === null) {\n const consumerCleanup = consumerCleanupRef.current;\n consumerCleanupRef.current = null;\n if (consumerCleanup) {\n consumerCleanup();\n } else {\n ref(null);\n }\n return;\n }\n const cleanup: unknown = ref(node);\n consumerCleanupRef.current =\n typeof cleanup === 'function' ? (cleanup as () => void) : null;\n } else if (ref) {\n (ref as React.MutableRefObject<HTMLElement | null>).current = node;\n }\n },\n [ref]\n );\n\n // Generate classes\n const sidebarClasses = usePrefixedClassNames('sidebar', {\n 'is-active': isOpen,\n [`is-${position}`]: position,\n 'is-fullwidth': resolvedFullwidth,\n });\n const backgroundClass = usePrefixedClassNames('sidebar-background', {\n 'is-active': isOpen,\n });\n const contentClass = usePrefixedClassNames('sidebar-content');\n\n const combinedClasses = classNames(\n sidebarClasses,\n bulmaHelperClasses,\n className\n );\n\n // Custom style for width\n const sidebarStyle: React.CSSProperties = {\n ...style,\n '--bulma-sidebar-width': resolvedFullwidth ? '100%' : width,\n } as React.CSSProperties;\n\n const sidebarContent = (\n <>\n {overlay && (\n <div\n className={backgroundClass}\n onClick={handleOverlayClick}\n aria-hidden=\"true\"\n />\n )}\n <aside\n ref={combinedRef}\n className={combinedClasses}\n style={sidebarStyle}\n role=\"dialog\"\n aria-modal={overlay ? 'true' : undefined}\n aria-hidden={!isOpen}\n // React commits this before the effect that moves focus in runs, so\n // an opening sidebar is no longer inert by then.\n {...inertProps(!isOpen)}\n tabIndex={-1}\n {...rest}\n >\n <div className={contentClass}>{children}</div>\n </aside>\n </>\n );\n\n if (inline) {\n return sidebarContent;\n }\n\n // Render to portal for proper stacking\n if (typeof document !== 'undefined') {\n const target = resolveContainer();\n return createPortal(\n <LocalePortalScope target={target}>{sidebarContent}</LocalePortalScope>,\n target\n );\n }\n\n return null;\n }\n);\n\n// Sub-components\n\n/**\n * Props for the SidebarHeader component.\n */\ninterface SidebarHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Header content. */\n children?: React.ReactNode;\n}\n\n/**\n * Container for the sidebar header.\n *\n * @function\n * @param {SidebarHeaderProps} props - Props for the SidebarHeader component.\n * @returns {JSX.Element} The rendered sidebar header.\n */\nconst SidebarHeader: React.FC<SidebarHeaderProps> = ({\n className,\n children,\n ...props\n}) => {\n const headerClass = usePrefixedClassNames('sidebar-header');\n return (\n <div className={classNames(headerClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n/**\n * Props for the SidebarTitle component.\n */\ninterface SidebarTitleProps extends React.HTMLAttributes<HTMLParagraphElement> {\n /** Title content. */\n children?: React.ReactNode;\n}\n\n/**\n * Title text inside the header.\n *\n * @function\n * @param {SidebarTitleProps} props - Props for the SidebarTitle component.\n * @returns {JSX.Element} The rendered sidebar title.\n */\nconst SidebarTitle: React.FC<SidebarTitleProps> = ({\n className,\n children,\n ...props\n}) => {\n const titleClass = usePrefixedClassNames('sidebar-title');\n return (\n <p className={classNames(titleClass, className)} {...props}>\n {children}\n </p>\n );\n};\n\n/**\n * Props for the SidebarClose component.\n * Extends standard button attributes.\n * @extraProp {'button' | 'submit' | 'reset'} [type='button'] - Button type. Defaults to `'button'`, so a close button inside a form does not submit it. Pass `'submit'` or `'reset'` and yours is used; any other value, or a spread carrying `type: undefined`, renders `'button'`.\n * @extraProp {string} [aria-label='Close'] - Accessible name. Pass your own to replace it. An empty one, or a spread carrying `'aria-label': undefined`, keeps the default rather than leaving the button unnamed.\n */\ntype SidebarCloseProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Close button for the sidebar.\n *\n * @function\n * @param {SidebarCloseProps} props - Props for the SidebarClose component.\n * @returns {JSX.Element} The rendered close button.\n */\nconst SidebarClose: React.FC<SidebarCloseProps> = ({\n className,\n children,\n ...props\n}) => {\n const closeClass = usePrefixedClassNames('sidebar-close');\n return (\n <button\n className={classNames(closeClass, className)}\n {...props}\n // After the spread, reading through it: a key the spread carries with no\n // value would otherwise erase the default, leaving a nameless button\n // that submits the form around it. An empty label falls back too: the\n // button is drawn as an icon, so `''` would leave it unnamed. A caller's\n // own value still wins; `buttonType` says more.\n aria-label={props['aria-label'] || 'Close'}\n type={buttonType(props.type)}\n >\n {children}\n </button>\n );\n};\n\n/**\n * Props for the SidebarBody component.\n */\ninterface SidebarBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Body content. */\n children?: React.ReactNode;\n}\n\n/**\n * Main content area of the sidebar.\n *\n * @function\n * @param {SidebarBodyProps} props - Props for the SidebarBody component.\n * @returns {JSX.Element} The rendered sidebar body.\n */\nconst SidebarBody: React.FC<SidebarBodyProps> = ({\n className,\n children,\n ...props\n}) => {\n const bodyClass = usePrefixedClassNames('sidebar-body');\n return (\n <div className={classNames(bodyClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n/**\n * Props for the SidebarFooter component.\n */\ninterface SidebarFooterProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Footer content. */\n children?: React.ReactNode;\n}\n\n/**\n * Footer area of the sidebar.\n *\n * @function\n * @param {SidebarFooterProps} props - Props for the SidebarFooter component.\n * @returns {JSX.Element} The rendered sidebar footer.\n */\nconst SidebarFooter: React.FC<SidebarFooterProps> = ({\n className,\n children,\n ...props\n}) => {\n const footerClass = usePrefixedClassNames('sidebar-footer');\n return (\n <div className={classNames(footerClass, className)} {...props}>\n {children}\n </div>\n );\n};\n\n// Attach static subcomponents\nexport const Sidebar = withSubComponents(\n SidebarComponent,\n {\n Header: SidebarHeader,\n Title: SidebarTitle,\n Close: SidebarClose,\n Body: SidebarBody,\n Footer: SidebarFooter,\n },\n 'Sidebar'\n);\n\nexport default Sidebar;\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
@@ -6,6 +6,7 @@ import { isEventInside } from '../helpers/shadowDom.js';
6
6
  import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
7
7
  import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
8
8
  import { usePortalContainer } from '../helpers/portal.js';
9
+ import { LocalePortalScope } from '../helpers/LocaleProvider.js';
9
10
  import { groupIntoPositionStacks } from '../helpers/positionStacks.js';
10
11
  import { useLatestRef } from '../helpers/useLatestRef.js';
11
12
  import { useOverlayStack } from '../helpers/overlayStack.js';
@@ -165,7 +166,8 @@ const Toast = forwardRef(({ message, type = 'default', actionType, position = 't
165
166
  }
166
167
  const toastContent = jsx("div", { className: containerClasses, children: toastElement });
167
168
  if (typeof document !== 'undefined') {
168
- return createPortal(toastContent, resolveContainer(container));
169
+ const target = resolveContainer(container);
170
+ return createPortal(jsx(LocalePortalScope, { target: target, children: toastContent }), target);
169
171
  }
170
172
  return null;
171
173
  });
@@ -327,10 +329,11 @@ const ToastContainer = ({ position = 'top-right' }) => {
327
329
  return null;
328
330
  }
329
331
  const stacks = groupIntoPositionStacks(toastList, t => t.props.position, position, toastStackOrder);
330
- return createPortal(stacks.map(stack => (jsx("div", { className: `toast-container is-${stack.position}`, children: stack.items.map(t => {
331
- const { queue: _queue, ...toastProps } = t.props;
332
- return (jsx(Toast, { ...toastProps, position: stack.position, onClose: () => toast.close(t.id) }, t.id));
333
- }) }, stack.key))), resolveContainer());
332
+ const target = resolveContainer();
333
+ return createPortal(jsx(LocalePortalScope, { target: target, children: stacks.map(stack => (jsx("div", { className: `toast-container is-${stack.position}`, children: stack.items.map(t => {
334
+ const { queue: _queue, ...toastProps } = t.props;
335
+ return (jsx(Toast, { ...toastProps, position: stack.position, onClose: () => toast.close(t.id) }, t.id));
336
+ }) }, stack.key))) }), target);
334
337
  };
335
338
 
336
339
  export { Toast, ToastContainer, toast };