@salt-ds/core 1.26.0 → 1.27.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/salt-core.css +104 -5
- package/dist-cjs/accordion/Accordion.js +7 -1
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +7 -1
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +7 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +7 -1
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +7 -1
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +7 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +7 -1
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +7 -1
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +7 -1
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +7 -1
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +7 -1
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +7 -1
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +7 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +7 -1
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/breakpoints/BreakpointProvider.js +7 -1
- package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-cjs/button/Button.js +7 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +7 -1
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.css.js +1 -1
- package/dist-cjs/checkbox/Checkbox.js +7 -1
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +7 -1
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +7 -1
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +7 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.js +18 -6
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +22 -2
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dialog/Dialog.js +6 -0
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +7 -1
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +7 -1
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +7 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.js +7 -1
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js +6 -0
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +7 -1
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js +7 -1
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js +7 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +7 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +7 -1
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +7 -1
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +7 -1
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +7 -1
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +7 -1
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +7 -1
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +7 -1
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +7 -1
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +10 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +7 -1
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js +7 -1
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js +7 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js +7 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-cjs/link/Link.js +9 -1
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js +7 -1
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js +7 -1
- package/dist-cjs/list-control/ListControlContext.js.map +1 -1
- package/dist-cjs/list-control/ListControlState.js +7 -1
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/menu/Menu.js +24 -0
- package/dist-cjs/menu/Menu.js.map +1 -0
- package/dist-cjs/menu/MenuBase.js +228 -0
- package/dist-cjs/menu/MenuBase.js.map +1 -0
- package/dist-cjs/menu/MenuContext.js +126 -0
- package/dist-cjs/menu/MenuContext.js.map +1 -0
- package/dist-cjs/menu/MenuGroup.css.js +6 -0
- package/dist-cjs/menu/MenuGroup.css.js.map +1 -0
- package/dist-cjs/menu/MenuGroup.js +140 -0
- package/dist-cjs/menu/MenuGroup.js.map +1 -0
- package/dist-cjs/menu/MenuItem.css.js +6 -0
- package/dist-cjs/menu/MenuItem.css.js.map +1 -0
- package/dist-cjs/menu/MenuItem.js +185 -0
- package/dist-cjs/menu/MenuItem.js.map +1 -0
- package/dist-cjs/menu/MenuPanel.css.js +6 -0
- package/dist-cjs/menu/MenuPanel.css.js.map +1 -0
- package/dist-cjs/menu/MenuPanel.js +157 -0
- package/dist-cjs/menu/MenuPanel.js.map +1 -0
- package/dist-cjs/menu/MenuPanelBase.js +29 -0
- package/dist-cjs/menu/MenuPanelBase.js.map +1 -0
- package/dist-cjs/menu/MenuPanelContext.js +122 -0
- package/dist-cjs/menu/MenuPanelContext.js.map +1 -0
- package/dist-cjs/menu/MenuTrigger.js +141 -0
- package/dist-cjs/menu/MenuTrigger.js.map +1 -0
- package/dist-cjs/menu/MenuTriggerContext.js +118 -0
- package/dist-cjs/menu/MenuTriggerContext.js.map +1 -0
- package/dist-cjs/multiline-input/MultilineInput.js +7 -1
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +7 -1
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/option/Option.js +7 -1
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.js +7 -1
- package/dist-cjs/option/OptionGroup.js.map +1 -1
- package/dist-cjs/option/OptionList.js +7 -1
- package/dist-cjs/option/OptionList.js.map +1 -1
- package/dist-cjs/option/OptionListBase.js +7 -1
- package/dist-cjs/option/OptionListBase.js.map +1 -1
- package/dist-cjs/overlay/Overlay.js +7 -1
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js +7 -1
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.js +7 -1
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js +7 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.js +7 -1
- package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-cjs/overlay/OverlayTrigger.js +7 -1
- package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
- package/dist-cjs/pagination/CompactInput.js +7 -1
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +7 -1
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +7 -1
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +7 -1
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +7 -1
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +7 -1
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +7 -1
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +7 -1
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js +7 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js +7 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-cjs/pill/Pill.js +7 -1
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.js +7 -1
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +7 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +7 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.css.js +1 -1
- package/dist-cjs/radio-button/RadioButton.js +7 -1
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +7 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +7 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +7 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +7 -1
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +7 -1
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.css.js +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js +7 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +7 -1
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +7 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +7 -1
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +7 -1
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +7 -1
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +7 -1
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.js +7 -1
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/text/Text.css.js +1 -1
- package/dist-cjs/text/Text.js +14 -5
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/toast/Toast.js +7 -1
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +7 -1
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +7 -1
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +7 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +7 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js +9 -2
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +6 -0
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +7 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +11 -4
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/useValueEffect.js +7 -1
- package/dist-cjs/utils/useValueEffect.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +7 -1
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +7 -1
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +7 -1
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +7 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +7 -1
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +7 -1
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +7 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +7 -1
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +7 -1
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +7 -1
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +7 -1
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +7 -1
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +7 -1
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +7 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +7 -1
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/breakpoints/BreakpointProvider.js +7 -1
- package/dist-es/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-es/button/Button.js +7 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +7 -1
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/checkbox/Checkbox.css.js +1 -1
- package/dist-es/checkbox/Checkbox.js +7 -1
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +7 -1
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +7 -1
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +7 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.js +18 -6
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +22 -2
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dialog/Dialog.js +6 -0
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +7 -1
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +7 -1
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +7 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.js +7 -1
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/drawer/Drawer.js +6 -0
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +7 -1
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js +7 -1
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.js +7 -1
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +7 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +7 -1
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +7 -1
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +7 -1
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +7 -1
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +7 -1
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +7 -1
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +7 -1
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +7 -1
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +5 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +7 -1
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/interactable-card/InteractableCard.js +7 -1
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroup.js +7 -1
- package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js +7 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-es/link/Link.js +9 -1
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.js +7 -1
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js +7 -1
- package/dist-es/list-control/ListControlContext.js.map +1 -1
- package/dist-es/list-control/ListControlState.js +7 -1
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/menu/Menu.js +20 -0
- package/dist-es/menu/Menu.js.map +1 -0
- package/dist-es/menu/MenuBase.js +224 -0
- package/dist-es/menu/MenuBase.js.map +1 -0
- package/dist-es/menu/MenuContext.js +121 -0
- package/dist-es/menu/MenuContext.js.map +1 -0
- package/dist-es/menu/MenuGroup.css.js +4 -0
- package/dist-es/menu/MenuGroup.css.js.map +1 -0
- package/dist-es/menu/MenuGroup.js +136 -0
- package/dist-es/menu/MenuGroup.js.map +1 -0
- package/dist-es/menu/MenuItem.css.js +4 -0
- package/dist-es/menu/MenuItem.css.js.map +1 -0
- package/dist-es/menu/MenuItem.js +181 -0
- package/dist-es/menu/MenuItem.js.map +1 -0
- package/dist-es/menu/MenuPanel.css.js +4 -0
- package/dist-es/menu/MenuPanel.css.js.map +1 -0
- package/dist-es/menu/MenuPanel.js +153 -0
- package/dist-es/menu/MenuPanel.js.map +1 -0
- package/dist-es/menu/MenuPanelBase.js +25 -0
- package/dist-es/menu/MenuPanelBase.js.map +1 -0
- package/dist-es/menu/MenuPanelContext.js +117 -0
- package/dist-es/menu/MenuPanelContext.js.map +1 -0
- package/dist-es/menu/MenuTrigger.js +137 -0
- package/dist-es/menu/MenuTrigger.js.map +1 -0
- package/dist-es/menu/MenuTriggerContext.js +113 -0
- package/dist-es/menu/MenuTriggerContext.js.map +1 -0
- package/dist-es/multiline-input/MultilineInput.js +7 -1
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +7 -1
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/option/Option.js +7 -1
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.js +7 -1
- package/dist-es/option/OptionGroup.js.map +1 -1
- package/dist-es/option/OptionList.js +7 -1
- package/dist-es/option/OptionList.js.map +1 -1
- package/dist-es/option/OptionListBase.js +7 -1
- package/dist-es/option/OptionListBase.js.map +1 -1
- package/dist-es/overlay/Overlay.js +7 -1
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js +7 -1
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.js +7 -1
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js +7 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-es/overlay/OverlayPanelContent.js +7 -1
- package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-es/overlay/OverlayTrigger.js +7 -1
- package/dist-es/overlay/OverlayTrigger.js.map +1 -1
- package/dist-es/pagination/CompactInput.js +7 -1
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +7 -1
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +7 -1
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +7 -1
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +7 -1
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +7 -1
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +7 -1
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +7 -1
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js +7 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js +7 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-es/pill/Pill.js +7 -1
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.js +7 -1
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +7 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +7 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.css.js +1 -1
- package/dist-es/radio-button/RadioButton.js +7 -1
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +7 -1
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +7 -1
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +7 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +7 -1
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +7 -1
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js +7 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-es/spinner/Spinner.js +7 -1
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +7 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +7 -1
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js +7 -1
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +7 -1
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +7 -1
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.js +7 -1
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/text/Text.css.js +1 -1
- package/dist-es/text/Text.js +14 -5
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/toast/Toast.js +7 -1
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +7 -1
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +7 -1
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +7 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +7 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js +9 -2
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +6 -0
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +7 -1
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +11 -4
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/useValueEffect.js +7 -1
- package/dist-es/utils/useValueEffect.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js +7 -1
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/aria-announcer/AriaAnnouncerProvider.d.ts +1 -1
- package/dist-types/breakpoints/BreakpointProvider.d.ts +1 -1
- package/dist-types/combo-box/useComboBox.d.ts +1 -0
- package/dist-types/dialog/Dialog.d.ts +1 -1
- package/dist-types/form-field/FormFieldHelperText.d.ts +1 -1
- package/dist-types/form-field/FormFieldLabel.d.ts +1 -1
- package/dist-types/index.d.ts +1 -0
- package/dist-types/menu/Menu.d.ts +4 -0
- package/dist-types/menu/MenuBase.d.ts +27 -0
- package/dist-types/menu/MenuContext.d.ts +16 -0
- package/dist-types/menu/MenuGroup.d.ts +12 -0
- package/dist-types/menu/MenuItem.d.ts +8 -0
- package/dist-types/menu/MenuPanel.d.ts +8 -0
- package/dist-types/menu/MenuPanelBase.d.ts +4 -0
- package/dist-types/menu/MenuPanelContext.d.ts +5 -0
- package/dist-types/menu/MenuTrigger.d.ts +8 -0
- package/dist-types/menu/MenuTriggerContext.d.ts +6 -0
- package/dist-types/menu/index.d.ts +5 -0
- package/dist-types/navigation-item/ConditionalWrapper.d.ts +1 -1
- package/dist-types/navigation-item/ExpansionIcon.d.ts +1 -1
- package/dist-types/overlay/Overlay.d.ts +1 -1
- package/dist-types/overlay/OverlayTrigger.d.ts +1 -1
- package/dist-types/pagination/PageRanges.d.ts +1 -1
- package/dist-types/radio-button/RadioButtonIcon.d.ts +1 -1
- package/dist-types/salt-provider/SaltProvider.d.ts +2 -2
- package/dist-types/spinner/svgSpinners/SpinnerSVG.d.ts +1 -1
- package/dist-types/text/Text.d.ts +2 -0
- package/dist-types/tooltip/TooltipBase.d.ts +1 -1
- package/dist-types/tooltip/useTooltip.d.ts +4 -0
- package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +2 -2
- package/dist-types/viewport/ViewportProvider.d.ts +1 -1
- package/package.json +2 -2
package/dist-cjs/text/Text.js
CHANGED
|
@@ -64,12 +64,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
64
64
|
require('../link/Link.js');
|
|
65
65
|
require('../link-card/LinkCard.js');
|
|
66
66
|
require('../list-control/ListControlContext.js');
|
|
67
|
+
require('../menu/MenuContext.js');
|
|
68
|
+
require('@floating-ui/react');
|
|
69
|
+
require('../menu/MenuItem.js');
|
|
70
|
+
require('../menu/MenuPanel.js');
|
|
71
|
+
require('../menu/MenuTriggerContext.js');
|
|
72
|
+
require('../menu/MenuPanelContext.js');
|
|
73
|
+
require('../menu/MenuGroup.js');
|
|
67
74
|
require('../multiline-input/MultilineInput.js');
|
|
68
75
|
require('../navigation-item/NavigationItem.js');
|
|
69
76
|
require('../option/Option.js');
|
|
70
77
|
require('../option/OptionGroup.js');
|
|
71
78
|
require('../overlay/OverlayContext.js');
|
|
72
|
-
require('@floating-ui/react');
|
|
73
79
|
require('../overlay/OverlayPanel.js');
|
|
74
80
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
75
81
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -110,25 +116,28 @@ const Text = React.forwardRef(
|
|
|
110
116
|
maxRows,
|
|
111
117
|
style,
|
|
112
118
|
styleAs,
|
|
113
|
-
variant
|
|
119
|
+
variant,
|
|
120
|
+
color: colorProp,
|
|
114
121
|
...restProps
|
|
115
122
|
}, ref) => {
|
|
123
|
+
var _a;
|
|
116
124
|
const targetWindow = window.useWindow();
|
|
117
125
|
styles.useComponentCssInjection({
|
|
118
126
|
testId: "salt-text",
|
|
119
127
|
css: Text$1,
|
|
120
128
|
window: targetWindow
|
|
121
129
|
});
|
|
122
|
-
const Component = as
|
|
130
|
+
const Component = as != null ? as : "div";
|
|
123
131
|
const textStyles = { "--text-max-rows": maxRows, ...style };
|
|
132
|
+
const color = (_a = variant != null ? variant : colorProp) != null ? _a : "primary";
|
|
124
133
|
return /* @__PURE__ */ jsxRuntime.jsx(Component, {
|
|
125
134
|
className: clsx.clsx(
|
|
126
135
|
withBaseName(),
|
|
127
136
|
{
|
|
128
137
|
[withBaseName("disabled")]: disabled,
|
|
129
138
|
[withBaseName("lineClamp")]: maxRows,
|
|
130
|
-
[withBaseName(styleAs
|
|
131
|
-
[withBaseName(
|
|
139
|
+
[withBaseName(styleAs)]: styleAs,
|
|
140
|
+
[withBaseName(color)]: color !== "inherit"
|
|
132
141
|
},
|
|
133
142
|
className
|
|
134
143
|
),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"notation\"\n | \"action\"\n | \"code\";\n /**\n * Change text color palette\n */\n variant?: \"primary\" | \"secondary\";\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant
|
|
1
|
+
{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"notation\"\n | \"action\"\n | \"code\";\n /**\n * Change text color palette\n * @deprecated Use `color` instead\n */\n variant?: \"primary\" | \"secondary\";\n /*\n * The color of the text. Defaults to \"primary\".\n */\n color?: \"inherit\" | \"primary\" | \"secondary\";\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant,\n color: colorProp,\n ...restProps\n }: TextProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-text\",\n css: textCss,\n window: targetWindow,\n });\n\n const Component = as ?? \"div\";\n\n const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n const color = variant ?? colorProp ?? \"primary\";\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"lineClamp\")]: maxRows,\n [withBaseName(styleAs as string)]: styleAs,\n [withBaseName(color)]: color !== \"inherit\",\n },\n className\n )}\n {...restProps}\n ref={ref}\n style={textStyles}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","textCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsDA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAsB,GAAAC,gBAAA;AAAA,EACjC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACJ,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AAvEP,IAAA,IAAA,EAAA,CAAA;AAwEI,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAC,MAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA;AAExB,IAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,IAAM,MAAA,KAAA,GAAA,CAAQ,EAAW,GAAA,OAAA,IAAA,IAAA,GAAA,OAAA,GAAA,SAAA,KAAX,IAAwB,GAAA,EAAA,GAAA,SAAA,CAAA;AAEtC,IAAA,uBACGC,cAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,UAC7B,CAAC,YAAa,CAAA,OAAiB,CAAI,GAAA,OAAA;AAAA,UACnC,CAAC,YAAA,CAAa,KAAK,CAAA,GAAI,KAAU,KAAA,SAAA;AAAA,SACnC;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAO,EAAA,UAAA;AAAA,MAEN,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-cjs/toast/Toast.js
CHANGED
|
@@ -65,12 +65,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
65
|
require('../link/Link.js');
|
|
66
66
|
require('../link-card/LinkCard.js');
|
|
67
67
|
require('../list-control/ListControlContext.js');
|
|
68
|
+
require('../menu/MenuContext.js');
|
|
69
|
+
require('@floating-ui/react');
|
|
70
|
+
require('../menu/MenuItem.js');
|
|
71
|
+
require('../menu/MenuPanel.js');
|
|
72
|
+
require('../menu/MenuTriggerContext.js');
|
|
73
|
+
require('../menu/MenuPanelContext.js');
|
|
74
|
+
require('../menu/MenuGroup.js');
|
|
68
75
|
require('../multiline-input/MultilineInput.js');
|
|
69
76
|
require('../navigation-item/NavigationItem.js');
|
|
70
77
|
require('../option/Option.js');
|
|
71
78
|
require('../option/OptionGroup.js');
|
|
72
79
|
require('../overlay/OverlayContext.js');
|
|
73
|
-
require('@floating-ui/react');
|
|
74
80
|
require('../overlay/OverlayPanel.js');
|
|
75
81
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
76
82
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * A string to determine the current state of the Toast.\n */\n status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n props,\n ref\n) {\n const { children, className, status = \"info\", ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast\",\n css: toastCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(status), className)}\n role=\"alert\"\n {...rest}\n ref={ref}\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Toast","useWindow","useComponentCssInjection","toastCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * A string to determine the current state of the Toast.\n */\n status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n props,\n ref\n) {\n const { children, className, status = \"info\", ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast\",\n css: toastCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(status), className)}\n role=\"alert\"\n {...rest}\n ref={ref}\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Toast","useWindow","useComponentCssInjection","toastCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAStC,MAAM,KAAQ,GAAAC,gBAAA,CAAuC,SAASC,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,MAAS,GAAA,MAAA,EAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AAC1D,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,+BAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -65,12 +65,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
65
|
require('../link/Link.js');
|
|
66
66
|
require('../link-card/LinkCard.js');
|
|
67
67
|
require('../list-control/ListControlContext.js');
|
|
68
|
+
require('../menu/MenuContext.js');
|
|
69
|
+
require('@floating-ui/react');
|
|
70
|
+
require('../menu/MenuItem.js');
|
|
71
|
+
require('../menu/MenuPanel.js');
|
|
72
|
+
require('../menu/MenuTriggerContext.js');
|
|
73
|
+
require('../menu/MenuPanelContext.js');
|
|
74
|
+
require('../menu/MenuGroup.js');
|
|
68
75
|
require('../multiline-input/MultilineInput.js');
|
|
69
76
|
require('../navigation-item/NavigationItem.js');
|
|
70
77
|
require('../option/Option.js');
|
|
71
78
|
require('../option/OptionGroup.js');
|
|
72
79
|
require('../overlay/OverlayContext.js');
|
|
73
|
-
require('@floating-ui/react');
|
|
74
80
|
require('../overlay/OverlayPanel.js');
|
|
75
81
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
76
82
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n ForwardedRef,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastContentCss from \"./ToastContent.css\";\n\nconst withBaseName = makePrefixer(\"saltToastContent\");\n\nexport interface ToastContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Toast Content\n */\n children?: ReactNode;\n}\n\nexport const ToastContent = forwardRef(function ToastContent(\n { children, className, ...restProps }: ToastContentProps,\n ref: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast-content\",\n css: toastContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","ToastContent","useWindow","useComponentCssInjection","toastContentCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n ForwardedRef,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastContentCss from \"./ToastContent.css\";\n\nconst withBaseName = makePrefixer(\"saltToastContent\");\n\nexport interface ToastContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Toast Content\n */\n children?: ReactNode;\n}\n\nexport const ToastContent = forwardRef(function ToastContent(\n { children, className, ...restProps }: ToastContentProps,\n ref: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast-content\",\n css: toastContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","ToastContent","useWindow","useComponentCssInjection","toastContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AASvC,MAAA,YAAA,GAAeC,iBAAW,SAASC,aAAAA,CAC9C,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACpC,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC7D,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -69,12 +69,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
69
69
|
require('../link/Link.js');
|
|
70
70
|
require('../link-card/LinkCard.js');
|
|
71
71
|
require('../list-control/ListControlContext.js');
|
|
72
|
+
require('../menu/MenuContext.js');
|
|
73
|
+
require('@floating-ui/react');
|
|
74
|
+
require('../menu/MenuItem.js');
|
|
75
|
+
require('../menu/MenuPanel.js');
|
|
76
|
+
require('../menu/MenuTriggerContext.js');
|
|
77
|
+
require('../menu/MenuPanelContext.js');
|
|
78
|
+
require('../menu/MenuGroup.js');
|
|
72
79
|
require('../multiline-input/MultilineInput.js');
|
|
73
80
|
require('../navigation-item/NavigationItem.js');
|
|
74
81
|
require('../option/Option.js');
|
|
75
82
|
require('../option/OptionGroup.js');
|
|
76
83
|
require('../overlay/OverlayContext.js');
|
|
77
|
-
require('@floating-ui/react');
|
|
78
84
|
require('../overlay/OverlayPanel.js');
|
|
79
85
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
80
86
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n forwardRef,\n useRef,\n MouseEvent,\n FocusEvent,\n ComponentPropsWithoutRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n selected?: boolean;\n onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n function ToggleButton(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp,\n value,\n onClick,\n onFocus,\n onChange,\n selected: selectedProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button\",\n css: toggleButtonCss,\n window: targetWindow,\n });\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleRef = useForkRef(ref, buttonRef);\n\n const toggleButtonGroup = useToggleButtonGroup();\n\n const toggleButtonGroupSelected = toggleButtonGroup\n ? toggleButtonGroup.isSelected(value)\n : selectedProp;\n const focusable = toggleButtonGroup\n ? toggleButtonGroup?.isFocused(value)\n : true;\n const disabled = toggleButtonGroup?.disabled || disabledProp;\n\n const [selected, setSelected] = useControlled({\n controlled: toggleButtonGroupSelected,\n default: Boolean(selectedProp),\n name: \"ToggleButton\",\n state: \"selected\",\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.select(event);\n setSelected(!selected);\n onChange?.(event);\n onClick?.(event);\n };\n\n const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.focus(value);\n onFocus?.(event);\n };\n\n const ariaChecked = selected && !disabled;\n\n return (\n <button\n aria-pressed={!toggleButtonGroup ? ariaChecked : undefined}\n aria-checked={toggleButtonGroup ? ariaChecked : undefined}\n role={toggleButtonGroup ? \"radio\" : undefined}\n className={clsx(withBaseName(), className)}\n disabled={disabled}\n ref={handleRef}\n onClick={handleClick}\n onFocus={handleFocus}\n tabIndex={focusable && !disabled ? 0 : -1}\n value={value}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","ToggleButton","useWindow","useComponentCssInjection","toggleButtonCss","useRef","useForkRef","useToggleButtonGroup","useControlled","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n forwardRef,\n useRef,\n MouseEvent,\n FocusEvent,\n ComponentPropsWithoutRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n selected?: boolean;\n onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n function ToggleButton(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp,\n value,\n onClick,\n onFocus,\n onChange,\n selected: selectedProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button\",\n css: toggleButtonCss,\n window: targetWindow,\n });\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleRef = useForkRef(ref, buttonRef);\n\n const toggleButtonGroup = useToggleButtonGroup();\n\n const toggleButtonGroupSelected = toggleButtonGroup\n ? toggleButtonGroup.isSelected(value)\n : selectedProp;\n const focusable = toggleButtonGroup\n ? toggleButtonGroup?.isFocused(value)\n : true;\n const disabled = toggleButtonGroup?.disabled || disabledProp;\n\n const [selected, setSelected] = useControlled({\n controlled: toggleButtonGroupSelected,\n default: Boolean(selectedProp),\n name: \"ToggleButton\",\n state: \"selected\",\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.select(event);\n setSelected(!selected);\n onChange?.(event);\n onClick?.(event);\n };\n\n const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.focus(value);\n onFocus?.(event);\n };\n\n const ariaChecked = selected && !disabled;\n\n return (\n <button\n aria-pressed={!toggleButtonGroup ? ariaChecked : undefined}\n aria-checked={toggleButtonGroup ? ariaChecked : undefined}\n role={toggleButtonGroup ? \"radio\" : undefined}\n className={clsx(withBaseName(), className)}\n disabled={disabled}\n ref={handleRef}\n onClick={handleClick}\n onFocus={handleFocus}\n tabIndex={focusable && !disabled ? 0 : -1}\n value={value}\n type=\"button\"\n {...rest}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","ToggleButton","useWindow","useComponentCssInjection","toggleButtonCss","useRef","useForkRef","useToggleButtonGroup","useControlled","jsx","clsx"],"mappings":"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"}
|
|
@@ -67,12 +67,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
67
67
|
require('../link/Link.js');
|
|
68
68
|
require('../link-card/LinkCard.js');
|
|
69
69
|
require('../list-control/ListControlContext.js');
|
|
70
|
+
require('../menu/MenuContext.js');
|
|
71
|
+
require('@floating-ui/react');
|
|
72
|
+
require('../menu/MenuItem.js');
|
|
73
|
+
require('../menu/MenuPanel.js');
|
|
74
|
+
require('../menu/MenuTriggerContext.js');
|
|
75
|
+
require('../menu/MenuPanelContext.js');
|
|
76
|
+
require('../menu/MenuGroup.js');
|
|
70
77
|
require('../multiline-input/MultilineInput.js');
|
|
71
78
|
require('../navigation-item/NavigationItem.js');
|
|
72
79
|
require('../option/Option.js');
|
|
73
80
|
require('../option/OptionGroup.js');
|
|
74
81
|
require('../overlay/OverlayContext.js');
|
|
75
|
-
require('@floating-ui/react');
|
|
76
82
|
require('../overlay/OverlayPanel.js');
|
|
77
83
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
78
84
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButtonGroup.js","sources":["../src/toggle-button-group/ToggleButtonGroup.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n KeyboardEvent,\n SyntheticEvent,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\nimport { ToggleButtonGroupContext, Value } from \"./ToggleButtonGroupContext\";\nimport toggleButtonGroupCss from \"./ToggleButtonGroup.css\";\n\nexport interface ToggleButtonGroupProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: Value;\n /**\n * If `true`, the Toggle Button Group will be disabled.\n */\n disabled?: boolean;\n /**\n * The value. Use when the component is controlled.\n */\n value?: Value;\n /**\n * Callback fired when the selection changes.\n * @param event\n */\n onChange?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * The orientation of the toggle buttons.\n */\n orientation?: \"horizontal\" | \"vertical\";\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButtonGroup\");\n\nexport const ToggleButtonGroup = forwardRef<\n HTMLDivElement,\n ToggleButtonGroupProps\n>(function ToggleButtonGroup(props, ref) {\n const {\n children,\n className,\n value: valueProp,\n defaultValue,\n disabled,\n onChange,\n onKeyDown,\n orientation = \"horizontal\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button-group\",\n css: toggleButtonGroupCss,\n window: targetWindow,\n });\n\n const groupRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(ref, groupRef);\n\n const [value, setValue] = useControlled({\n default: defaultValue,\n controlled: valueProp,\n name: \"ToggleButtonGroup\",\n state: \"value\",\n });\n const [focused, setFocused] = useState<Value>(value);\n\n const select = useCallback(\n (event: SyntheticEvent<HTMLButtonElement>) => {\n const newValue = event.currentTarget.value;\n setValue(newValue);\n if (value !== newValue) {\n onChange?.(event);\n }\n },\n [onChange, value, setValue]\n );\n\n const isSelected = useCallback(\n (id: Value) => {\n return value === id;\n },\n [value]\n );\n\n const focus = (id: Value) => {\n setFocused(id);\n };\n\n const isFocused = useCallback(\n (id: Value) => {\n return focused === id || !focused;\n },\n [focused]\n );\n\n const contextValue = useMemo(\n () => ({\n select,\n isSelected,\n focus,\n isFocused,\n disabled,\n orientation,\n }),\n [select, isSelected, isFocused, disabled, orientation]\n );\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n const elements: HTMLElement[] = Array.from(\n groupRef.current?.querySelectorAll(\"button:not([disabled])\") ?? []\n );\n const currentIndex = elements.findIndex(\n (element) => element === document.activeElement\n );\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n elements[(currentIndex + 1) % elements.length]?.focus();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n elements[\n (currentIndex - 1 + elements.length) % elements.length\n ]?.focus();\n break;\n }\n\n onKeyDown?.(event);\n };\n\n return (\n <ToggleButtonGroupContext.Provider value={contextValue}>\n <div\n className={clsx(withBaseName(), withBaseName(orientation), className)}\n role=\"radiogroup\"\n ref={handleRef}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {children}\n </div>\n </ToggleButtonGroupContext.Provider>\n );\n});\n"],"names":["makePrefixer","forwardRef","ToggleButtonGroup","useWindow","useComponentCssInjection","toggleButtonGroupCss","useRef","useForkRef","useControlled","useState","useCallback","useMemo","jsx","ToggleButtonGroupContext","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleButtonGroup.js","sources":["../src/toggle-button-group/ToggleButtonGroup.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n KeyboardEvent,\n SyntheticEvent,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\nimport { ToggleButtonGroupContext, Value } from \"./ToggleButtonGroupContext\";\nimport toggleButtonGroupCss from \"./ToggleButtonGroup.css\";\n\nexport interface ToggleButtonGroupProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: Value;\n /**\n * If `true`, the Toggle Button Group will be disabled.\n */\n disabled?: boolean;\n /**\n * The value. Use when the component is controlled.\n */\n value?: Value;\n /**\n * Callback fired when the selection changes.\n * @param event\n */\n onChange?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * The orientation of the toggle buttons.\n */\n orientation?: \"horizontal\" | \"vertical\";\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButtonGroup\");\n\nexport const ToggleButtonGroup = forwardRef<\n HTMLDivElement,\n ToggleButtonGroupProps\n>(function ToggleButtonGroup(props, ref) {\n const {\n children,\n className,\n value: valueProp,\n defaultValue,\n disabled,\n onChange,\n onKeyDown,\n orientation = \"horizontal\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button-group\",\n css: toggleButtonGroupCss,\n window: targetWindow,\n });\n\n const groupRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(ref, groupRef);\n\n const [value, setValue] = useControlled({\n default: defaultValue,\n controlled: valueProp,\n name: \"ToggleButtonGroup\",\n state: \"value\",\n });\n const [focused, setFocused] = useState<Value>(value);\n\n const select = useCallback(\n (event: SyntheticEvent<HTMLButtonElement>) => {\n const newValue = event.currentTarget.value;\n setValue(newValue);\n if (value !== newValue) {\n onChange?.(event);\n }\n },\n [onChange, value, setValue]\n );\n\n const isSelected = useCallback(\n (id: Value) => {\n return value === id;\n },\n [value]\n );\n\n const focus = (id: Value) => {\n setFocused(id);\n };\n\n const isFocused = useCallback(\n (id: Value) => {\n return focused === id || !focused;\n },\n [focused]\n );\n\n const contextValue = useMemo(\n () => ({\n select,\n isSelected,\n focus,\n isFocused,\n disabled,\n orientation,\n }),\n [select, isSelected, isFocused, disabled, orientation]\n );\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n const elements: HTMLElement[] = Array.from(\n groupRef.current?.querySelectorAll(\"button:not([disabled])\") ?? []\n );\n const currentIndex = elements.findIndex(\n (element) => element === document.activeElement\n );\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n elements[(currentIndex + 1) % elements.length]?.focus();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n elements[\n (currentIndex - 1 + elements.length) % elements.length\n ]?.focus();\n break;\n }\n\n onKeyDown?.(event);\n };\n\n return (\n <ToggleButtonGroupContext.Provider value={contextValue}>\n <div\n className={clsx(withBaseName(), withBaseName(orientation), className)}\n role=\"radiogroup\"\n ref={handleRef}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {children}\n </div>\n </ToggleButtonGroupContext.Provider>\n );\n});\n"],"names":["makePrefixer","forwardRef","ToggleButtonGroup","useWindow","useComponentCssInjection","toggleButtonGroupCss","useRef","useForkRef","useControlled","useState","useCallback","useMemo","jsx","ToggleButtonGroupContext","clsx"],"mappings":"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"}
|
|
@@ -65,12 +65,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
65
|
require('../link/Link.js');
|
|
66
66
|
require('../link-card/LinkCard.js');
|
|
67
67
|
require('../list-control/ListControlContext.js');
|
|
68
|
+
require('../menu/MenuContext.js');
|
|
69
|
+
require('@floating-ui/react');
|
|
70
|
+
require('../menu/MenuItem.js');
|
|
71
|
+
require('../menu/MenuPanel.js');
|
|
72
|
+
require('../menu/MenuTriggerContext.js');
|
|
73
|
+
require('../menu/MenuPanelContext.js');
|
|
74
|
+
require('../menu/MenuGroup.js');
|
|
68
75
|
require('../multiline-input/MultilineInput.js');
|
|
69
76
|
require('../navigation-item/NavigationItem.js');
|
|
70
77
|
require('../option/Option.js');
|
|
71
78
|
require('../option/OptionGroup.js');
|
|
72
79
|
require('../overlay/OverlayContext.js');
|
|
73
|
-
require('@floating-ui/react');
|
|
74
80
|
require('../overlay/OverlayPanel.js');
|
|
75
81
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
76
82
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButtonGroupContext.js","sources":["../src/toggle-button-group/ToggleButtonGroupContext.ts"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport type Value = string | readonly string[] | number | undefined;\n\nexport interface ToggleButtonGroupContextValue {\n disabled?: boolean;\n select: (event: SyntheticEvent<HTMLButtonElement>) => void;\n isSelected: (id: Value) => boolean;\n focus: (id: Value) => void;\n isFocused: (id: Value) => boolean;\n orientation: \"horizontal\" | \"vertical\";\n}\n\nexport const ToggleButtonGroupContext = createContext<\n ToggleButtonGroupContextValue | undefined\n>(\"ToggleButtonGroupContext\", undefined);\n\nexport function useToggleButtonGroup() {\n return useContext(ToggleButtonGroupContext);\n}\n"],"names":["createContext","useContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleButtonGroupContext.js","sources":["../src/toggle-button-group/ToggleButtonGroupContext.ts"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport type Value = string | readonly string[] | number | undefined;\n\nexport interface ToggleButtonGroupContextValue {\n disabled?: boolean;\n select: (event: SyntheticEvent<HTMLButtonElement>) => void;\n isSelected: (id: Value) => boolean;\n focus: (id: Value) => void;\n isFocused: (id: Value) => boolean;\n orientation: \"horizontal\" | \"vertical\";\n}\n\nexport const ToggleButtonGroupContext = createContext<\n ToggleButtonGroupContextValue | undefined\n>(\"ToggleButtonGroupContext\", undefined);\n\nexport function useToggleButtonGroup() {\n return useContext(ToggleButtonGroupContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAca,MAAA,wBAAA,GAA2BA,2BAEtC,CAAA,0BAAA,EAA4B,KAAS,CAAA,EAAA;AAEhC,SAAS,oBAAuB,GAAA;AACrC,EAAA,OAAOC,iBAAW,wBAAwB,CAAA,CAAA;AAC5C;;;;;"}
|
|
@@ -69,12 +69,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
69
69
|
require('../link/Link.js');
|
|
70
70
|
require('../link-card/LinkCard.js');
|
|
71
71
|
require('../list-control/ListControlContext.js');
|
|
72
|
+
require('../menu/MenuContext.js');
|
|
73
|
+
require('@floating-ui/react');
|
|
74
|
+
require('../menu/MenuItem.js');
|
|
75
|
+
require('../menu/MenuPanel.js');
|
|
76
|
+
require('../menu/MenuTriggerContext.js');
|
|
77
|
+
require('../menu/MenuPanelContext.js');
|
|
78
|
+
require('../menu/MenuGroup.js');
|
|
72
79
|
require('../multiline-input/MultilineInput.js');
|
|
73
80
|
require('../navigation-item/NavigationItem.js');
|
|
74
81
|
require('../option/Option.js');
|
|
75
82
|
require('../option/OptionGroup.js');
|
|
76
83
|
require('../overlay/OverlayContext.js');
|
|
77
|
-
require('@floating-ui/react');
|
|
78
84
|
require('../overlay/OverlayPanel.js');
|
|
79
85
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
80
86
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -131,6 +137,7 @@ const Tooltip = React.forwardRef(
|
|
|
131
137
|
const { Component: FloatingComponent } = useFloatingUI.useFloatingComponent();
|
|
132
138
|
const hookProps = {
|
|
133
139
|
open: openProp,
|
|
140
|
+
disabled,
|
|
134
141
|
placement,
|
|
135
142
|
enterDelay,
|
|
136
143
|
leaveDelay,
|
|
@@ -150,7 +157,7 @@ const Tooltip = React.forwardRef(
|
|
|
150
157
|
reference
|
|
151
158
|
);
|
|
152
159
|
const floatingRef = useForkRef.useForkRef(floating, ref);
|
|
153
|
-
const hasContent =
|
|
160
|
+
const hasContent = content != void 0 && content !== "";
|
|
154
161
|
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
155
162
|
children: [
|
|
156
163
|
React.isValidElement(children) && React.cloneElement(children, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sources":["../src/tooltip/Tooltip.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n cloneElement,\n forwardRef,\n HTMLAttributes,\n isValidElement,\n ReactNode,\n} from \"react\";\n\nimport { ValidationStatus, VALIDATION_NAMED_STATUS } from \"../status-indicator\";\nimport {\n makePrefixer,\n mergeProps,\n UseFloatingUIProps,\n useForkRef,\n useFloatingComponent,\n} from \"../utils\";\n\nimport { useTooltip, UseTooltipProps } from \"./useTooltip\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { TooltipBase } from \"./TooltipBase\";\n\nconst withBaseName = makePrefixer(\"saltTooltip\");\n\nexport interface TooltipProps\n extends Pick<UseFloatingUIProps, \"open\" | \"onOpenChange\" | \"placement\">,\n Omit<HTMLAttributes<HTMLDivElement>, \"content\"> {\n /**\n * The children will be the Tooltip's trigger.\n */\n children: ReactNode;\n /**\n * Whether to hide the Tooltip arrow. Defaults to `false`.\n */\n hideArrow?: boolean;\n /**\n * Whether to hide the status icon within the Tooltip. Defaults to `false`.\n * If no status is provided, icon will also be hidden.\n */\n hideIcon?: boolean;\n /**\n * Content displayed inside the Tooltip. Can be a string or a React component.\n */\n content: ReactNode;\n /**\n * Optional string to determine the status of the Tooltip.\n */\n status?: ValidationStatus;\n /**\n * Delay in milliseconds before the Tooltip is shown.\n */\n enterDelay?: number;\n /**\n * Delay in milliseconds before the Tooltip is hidden. Defaults to 300ms.\n */\n leaveDelay?: number;\n /**\n * Option to not display the Tooltip. Can be used in conditional situations like text truncation. Defaults to 0.\n */\n disabled?: boolean;\n /**\n * Option to remove the hover listener.\n */\n disableHoverListener?: boolean;\n /**\n * Option to remove the focus listener.\n */\n disableFocusListener?: boolean;\n}\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n function Tooltip(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp = false,\n hideArrow = false,\n hideIcon = false,\n open: openProp,\n content,\n status: statusProp,\n placement = \"right\",\n enterDelay = 300,\n leaveDelay = 0,\n ...rest\n } = props;\n\n const {\n disabled: formFieldDisabled,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const disabled = disabledProp || formFieldDisabled;\n const status =\n formFieldValidationStatus !== undefined &&\n VALIDATION_NAMED_STATUS.includes(formFieldValidationStatus)\n ? formFieldValidationStatus\n : statusProp;\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const hookProps: UseTooltipProps = {\n open: openProp,\n placement,\n enterDelay,\n leaveDelay,\n ...rest,\n };\n\n const {\n arrowProps,\n open,\n floating,\n reference,\n getTriggerProps,\n getTooltipProps,\n getTooltipPosition,\n } = useTooltip(hookProps);\n\n const triggerRef = useForkRef(\n // @ts-expect-error children.ref cannot currently be typed.\n isValidElement(children) ? children.ref : null,\n reference\n );\n\n const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n const hasContent =
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sources":["../src/tooltip/Tooltip.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n cloneElement,\n forwardRef,\n HTMLAttributes,\n isValidElement,\n ReactNode,\n} from \"react\";\n\nimport { ValidationStatus, VALIDATION_NAMED_STATUS } from \"../status-indicator\";\nimport {\n makePrefixer,\n mergeProps,\n UseFloatingUIProps,\n useForkRef,\n useFloatingComponent,\n} from \"../utils\";\n\nimport { useTooltip, UseTooltipProps } from \"./useTooltip\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { TooltipBase } from \"./TooltipBase\";\n\nconst withBaseName = makePrefixer(\"saltTooltip\");\n\nexport interface TooltipProps\n extends Pick<UseFloatingUIProps, \"open\" | \"onOpenChange\" | \"placement\">,\n Omit<HTMLAttributes<HTMLDivElement>, \"content\"> {\n /**\n * The children will be the Tooltip's trigger.\n */\n children: ReactNode;\n /**\n * Whether to hide the Tooltip arrow. Defaults to `false`.\n */\n hideArrow?: boolean;\n /**\n * Whether to hide the status icon within the Tooltip. Defaults to `false`.\n * If no status is provided, icon will also be hidden.\n */\n hideIcon?: boolean;\n /**\n * Content displayed inside the Tooltip. Can be a string or a React component.\n */\n content: ReactNode;\n /**\n * Optional string to determine the status of the Tooltip.\n */\n status?: ValidationStatus;\n /**\n * Delay in milliseconds before the Tooltip is shown.\n */\n enterDelay?: number;\n /**\n * Delay in milliseconds before the Tooltip is hidden. Defaults to 300ms.\n */\n leaveDelay?: number;\n /**\n * Option to not display the Tooltip. Can be used in conditional situations like text truncation. Defaults to 0.\n */\n disabled?: boolean;\n /**\n * Option to remove the hover listener.\n */\n disableHoverListener?: boolean;\n /**\n * Option to remove the focus listener.\n */\n disableFocusListener?: boolean;\n}\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n function Tooltip(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp = false,\n hideArrow = false,\n hideIcon = false,\n open: openProp,\n content,\n status: statusProp,\n placement = \"right\",\n enterDelay = 300,\n leaveDelay = 0,\n ...rest\n } = props;\n\n const {\n disabled: formFieldDisabled,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const disabled = disabledProp || formFieldDisabled;\n const status =\n formFieldValidationStatus !== undefined &&\n VALIDATION_NAMED_STATUS.includes(formFieldValidationStatus)\n ? formFieldValidationStatus\n : statusProp;\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const hookProps: UseTooltipProps = {\n open: openProp,\n disabled,\n placement,\n enterDelay,\n leaveDelay,\n ...rest,\n };\n\n const {\n arrowProps,\n open,\n floating,\n reference,\n getTriggerProps,\n getTooltipProps,\n getTooltipPosition,\n } = useTooltip(hookProps);\n\n const triggerRef = useForkRef(\n // @ts-expect-error children.ref cannot currently be typed.\n isValidElement(children) ? children.ref : null,\n reference\n );\n\n const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n const hasContent = content != undefined && content !== \"\";\n\n return (\n <>\n {isValidElement(children) &&\n cloneElement(children, {\n ...mergeProps(getTriggerProps(), children.props),\n ref: triggerRef,\n })}\n\n <FloatingComponent\n className={clsx(\n withBaseName(),\n { [withBaseName(status ?? \"\")]: status },\n className\n )}\n open={open && !disabled && hasContent}\n {...getTooltipProps()}\n ref={floatingRef}\n {...getTooltipPosition()}\n >\n <TooltipBase\n hideIcon={hideIcon}\n status={status}\n content={content}\n hideArrow={hideArrow}\n arrowProps={arrowProps}\n />\n </FloatingComponent>\n </>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Tooltip","useFormFieldProps","VALIDATION_NAMED_STATUS","useFloatingComponent","useTooltip","useForkRef","isValidElement","jsxs","Fragment","cloneElement","mergeProps","jsx","clsx","TooltipBase"],"mappings":"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"}
|
|
@@ -67,6 +67,12 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
67
67
|
require('../link/Link.js');
|
|
68
68
|
require('../link-card/LinkCard.js');
|
|
69
69
|
require('../list-control/ListControlContext.js');
|
|
70
|
+
require('../menu/MenuContext.js');
|
|
71
|
+
require('../menu/MenuItem.js');
|
|
72
|
+
require('../menu/MenuPanel.js');
|
|
73
|
+
require('../menu/MenuTriggerContext.js');
|
|
74
|
+
require('../menu/MenuPanelContext.js');
|
|
75
|
+
require('../menu/MenuGroup.js');
|
|
70
76
|
require('../multiline-input/MultilineInput.js');
|
|
71
77
|
require('../navigation-item/NavigationItem.js');
|
|
72
78
|
require('../option/Option.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipBase.js","sources":["../src/tooltip/TooltipBase.tsx"],"sourcesContent":["import { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { FloatingArrow, FloatingArrowProps } from \"@floating-ui/react\";\nimport { TooltipProps } from \"./Tooltip\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport tooltipCss from \"./Tooltip.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltTooltip\");\n\ninterface TooltipBaseProps extends Omit<TooltipProps, \"children\"> {\n arrowProps: FloatingArrowProps;\n /**\n * Optional string to determine the status of the Tooltip.\n */\n status?: ValidationStatus;\n}\n\nexport const TooltipBase = (props: TooltipBaseProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tooltip\",\n css: tooltipCss,\n window: targetWindow,\n });\n\n const { a11yProps } = useFormFieldProps();\n\n const { arrowProps, content, hideArrow, hideIcon, status } = props;\n\n return (\n <>\n <div className={withBaseName(\"container\")}>\n {!hideIcon && status && (\n <StatusIndicator\n status={status}\n size={1}\n className={withBaseName(\"icon\")}\n />\n )}\n <span\n id={a11yProps?.[\"aria-describedby\"]}\n className={withBaseName(\"content\")}\n >\n {content}\n </span>\n </div>\n {!hideArrow && (\n <FloatingArrow\n {...arrowProps}\n className={withBaseName(\"arrow\")}\n strokeWidth={1}\n fill=\"var(--salt-container-primary-background)\"\n stroke=\"var(--tooltip-status-borderColor)\"\n height={5}\n width={10}\n />\n )}\n </>\n );\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","tooltipCss","useFormFieldProps","jsxs","Fragment","jsx","StatusIndicator","FloatingArrow"],"mappings":"
|
|
1
|
+
{"version":3,"file":"TooltipBase.js","sources":["../src/tooltip/TooltipBase.tsx"],"sourcesContent":["import { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { FloatingArrow, FloatingArrowProps } from \"@floating-ui/react\";\nimport { TooltipProps } from \"./Tooltip\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport tooltipCss from \"./Tooltip.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltTooltip\");\n\ninterface TooltipBaseProps extends Omit<TooltipProps, \"children\"> {\n arrowProps: FloatingArrowProps;\n /**\n * Optional string to determine the status of the Tooltip.\n */\n status?: ValidationStatus;\n}\n\nexport const TooltipBase = (props: TooltipBaseProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tooltip\",\n css: tooltipCss,\n window: targetWindow,\n });\n\n const { a11yProps } = useFormFieldProps();\n\n const { arrowProps, content, hideArrow, hideIcon, status } = props;\n\n return (\n <>\n <div className={withBaseName(\"container\")}>\n {!hideIcon && status && (\n <StatusIndicator\n status={status}\n size={1}\n className={withBaseName(\"icon\")}\n />\n )}\n <span\n id={a11yProps?.[\"aria-describedby\"]}\n className={withBaseName(\"content\")}\n >\n {content}\n </span>\n </div>\n {!hideArrow && (\n <FloatingArrow\n {...arrowProps}\n className={withBaseName(\"arrow\")}\n strokeWidth={1}\n fill=\"var(--salt-container-primary-background)\"\n stroke=\"var(--tooltip-status-borderColor)\"\n height={5}\n width={10}\n />\n )}\n </>\n );\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","tooltipCss","useFormFieldProps","jsxs","Fragment","jsx","StatusIndicator","FloatingArrow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,aAAa,CAAA,CAAA;AAUlC,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AACtD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,cAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,EAAE,SAAU,EAAA,GAAIC,mCAAkB,EAAA,CAAA;AAExC,EAAA,MAAM,EAAE,UAAY,EAAA,OAAA,EAAS,SAAW,EAAA,QAAA,EAAU,QAAW,GAAA,KAAA,CAAA;AAE7D,EACE,uBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAACD,eAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QACrC,QAAA,EAAA;AAAA,UAAC,CAAA,QAAA,IAAY,0BACXE,cAAA,CAAAC,+BAAA,EAAA;AAAA,YACC,MAAA;AAAA,YACA,IAAM,EAAA,CAAA;AAAA,YACN,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,WAChC,CAAA;AAAA,0BAEDD,cAAA,CAAA,MAAA,EAAA;AAAA,YACC,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,YAChB,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,YAEhC,QAAA,EAAA,OAAA;AAAA,WACH,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,MACC,CAAC,6BACCA,cAAA,CAAAE,mBAAA,EAAA;AAAA,QACE,GAAG,UAAA;AAAA,QACJ,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,QAC/B,WAAa,EAAA,CAAA;AAAA,QACb,IAAK,EAAA,0CAAA;AAAA,QACL,MAAO,EAAA,mCAAA;AAAA,QACP,MAAQ,EAAA,CAAA;AAAA,QACR,KAAO,EAAA,EAAA;AAAA,OACT,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -66,12 +66,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
66
66
|
require('../link/Link.js');
|
|
67
67
|
require('../link-card/LinkCard.js');
|
|
68
68
|
require('../list-control/ListControlContext.js');
|
|
69
|
+
require('../menu/MenuContext.js');
|
|
70
|
+
require('@floating-ui/react');
|
|
71
|
+
require('../menu/MenuItem.js');
|
|
72
|
+
require('../menu/MenuPanel.js');
|
|
73
|
+
require('../menu/MenuTriggerContext.js');
|
|
74
|
+
require('../menu/MenuPanelContext.js');
|
|
75
|
+
require('../menu/MenuGroup.js');
|
|
69
76
|
require('../multiline-input/MultilineInput.js');
|
|
70
77
|
require('../navigation-item/NavigationItem.js');
|
|
71
78
|
require('../option/Option.js');
|
|
72
79
|
require('../option/OptionGroup.js');
|
|
73
80
|
require('../overlay/OverlayContext.js');
|
|
74
|
-
require('@floating-ui/react');
|
|
75
81
|
require('../overlay/OverlayPanel.js');
|
|
76
82
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
77
83
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAriaAnnounce.js","sources":["../src/tooltip/useAriaAnnounce.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { PointerEvent, useEffect, useRef } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nfunction getDocument(floating: HTMLElement | null) {\n return floating?.ownerDocument ?? document;\n}\n\n// TODO: Check whether can be anything more restrictive than `any`\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction getWindow(value: any) {\n return getDocument(value).defaultView ?? window;\n}\n\nfunction isElement(value: unknown): value is HTMLElement {\n return value ? value instanceof getWindow(value).Element : false;\n}\n\nfunction getDelay(\n value: Props[\"delay\"],\n prop: \"open\" | \"close\",\n pointerType?: PointerEvent[\"pointerType\"]\n) {\n if (pointerType && pointerType !== \"mouse\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return value;\n }\n\n return value?.[prop];\n}\n\ntype Props = {\n delay?: number | Partial<{ open: number; close: number }>;\n};\n\nexport const useAriaAnnounce = (\n context: FloatingContext,\n { delay = 0 }: Props\n): ElementProps => {\n const { open, dataRef, refs } = context;\n\n const pointerTypeRef = useRef<PointerEvent[\"pointerType\"]>();\n const timeoutRef = useRef<number>();\n const blockMouseMoveRef = useRef(true);\n const { announce } = useAriaAnnouncer();\n\n useIsomorphicLayoutEffect(() => {\n if (!open) {\n pointerTypeRef.current = undefined;\n }\n });\n\n useEffect(() => {\n const reference = refs.reference.current;\n function announceFloating() {\n const tooltipContent = refs.floating.current?.innerText;\n\n if (tooltipContent) {\n announce(tooltipContent);\n }\n }\n\n function onMouseEnter(event: MouseEvent) {\n clearTimeout(timeoutRef.current);\n\n if (open) {\n return;\n }\n\n blockMouseMoveRef.current = false;\n dataRef.current.openEvent = event;\n\n if (delay) {\n timeoutRef.current = window.setTimeout(() => {\n announceFloating();\n }, getDelay(delay, \"open\", pointerTypeRef.current));\n } else {\n announceFloating();\n }\n }\n\n if (isElement(reference)) {\n reference.addEventListener(\"mouseenter\", onMouseEnter);\n return () => {\n reference.removeEventListener(\"mouseenter\", onMouseEnter);\n };\n }\n }, [dataRef, delay, open, refs.reference, refs.floating, announce]);\n\n function setPointerRef(event: PointerEvent) {\n pointerTypeRef.current = event.pointerType;\n }\n\n return {\n reference: {\n onPointerDown: setPointerRef,\n onPointerEnter: setPointerRef,\n },\n floating: {\n onMouseEnter() {\n clearTimeout(timeoutRef.current);\n },\n },\n };\n};\n"],"names":["useRef","useAriaAnnouncer","useIsomorphicLayoutEffect","useEffect"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useAriaAnnounce.js","sources":["../src/tooltip/useAriaAnnounce.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { PointerEvent, useEffect, useRef } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nfunction getDocument(floating: HTMLElement | null) {\n return floating?.ownerDocument ?? document;\n}\n\n// TODO: Check whether can be anything more restrictive than `any`\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction getWindow(value: any) {\n return getDocument(value).defaultView ?? window;\n}\n\nfunction isElement(value: unknown): value is HTMLElement {\n return value ? value instanceof getWindow(value).Element : false;\n}\n\nfunction getDelay(\n value: Props[\"delay\"],\n prop: \"open\" | \"close\",\n pointerType?: PointerEvent[\"pointerType\"]\n) {\n if (pointerType && pointerType !== \"mouse\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return value;\n }\n\n return value?.[prop];\n}\n\ntype Props = {\n delay?: number | Partial<{ open: number; close: number }>;\n};\n\nexport const useAriaAnnounce = (\n context: FloatingContext,\n { delay = 0 }: Props\n): ElementProps => {\n const { open, dataRef, refs } = context;\n\n const pointerTypeRef = useRef<PointerEvent[\"pointerType\"]>();\n const timeoutRef = useRef<number>();\n const blockMouseMoveRef = useRef(true);\n const { announce } = useAriaAnnouncer();\n\n useIsomorphicLayoutEffect(() => {\n if (!open) {\n pointerTypeRef.current = undefined;\n }\n });\n\n useEffect(() => {\n const reference = refs.reference.current;\n function announceFloating() {\n const tooltipContent = refs.floating.current?.innerText;\n\n if (tooltipContent) {\n announce(tooltipContent);\n }\n }\n\n function onMouseEnter(event: MouseEvent) {\n clearTimeout(timeoutRef.current);\n\n if (open) {\n return;\n }\n\n blockMouseMoveRef.current = false;\n dataRef.current.openEvent = event;\n\n if (delay) {\n timeoutRef.current = window.setTimeout(() => {\n announceFloating();\n }, getDelay(delay, \"open\", pointerTypeRef.current));\n } else {\n announceFloating();\n }\n }\n\n if (isElement(reference)) {\n reference.addEventListener(\"mouseenter\", onMouseEnter);\n return () => {\n reference.removeEventListener(\"mouseenter\", onMouseEnter);\n };\n }\n }, [dataRef, delay, open, refs.reference, refs.floating, announce]);\n\n function setPointerRef(event: PointerEvent) {\n pointerTypeRef.current = event.pointerType;\n }\n\n return {\n reference: {\n onPointerDown: setPointerRef,\n onPointerEnter: setPointerRef,\n },\n floating: {\n onMouseEnter() {\n clearTimeout(timeoutRef.current);\n },\n },\n };\n};\n"],"names":["useRef","useAriaAnnouncer","useIsomorphicLayoutEffect","useEffect"],"mappings":"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"}
|
|
@@ -66,6 +66,12 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
66
66
|
require('../link/Link.js');
|
|
67
67
|
require('../link-card/LinkCard.js');
|
|
68
68
|
require('../list-control/ListControlContext.js');
|
|
69
|
+
require('../menu/MenuContext.js');
|
|
70
|
+
require('../menu/MenuItem.js');
|
|
71
|
+
require('../menu/MenuPanel.js');
|
|
72
|
+
require('../menu/MenuTriggerContext.js');
|
|
73
|
+
require('../menu/MenuPanelContext.js');
|
|
74
|
+
require('../menu/MenuGroup.js');
|
|
69
75
|
require('../multiline-input/MultilineInput.js');
|
|
70
76
|
require('../navigation-item/NavigationItem.js');
|
|
71
77
|
require('../option/Option.js');
|
|
@@ -104,6 +110,7 @@ var useAriaAnnounce = require('./useAriaAnnounce.js');
|
|
|
104
110
|
function useTooltip(props) {
|
|
105
111
|
const {
|
|
106
112
|
enterDelay,
|
|
113
|
+
disabled,
|
|
107
114
|
leaveDelay,
|
|
108
115
|
open: openProp,
|
|
109
116
|
onOpenChange,
|
|
@@ -123,7 +130,7 @@ function useTooltip(props) {
|
|
|
123
130
|
onOpenChange == null ? void 0 : onOpenChange(open2);
|
|
124
131
|
};
|
|
125
132
|
const { floating, reference, x, y, strategy, placement, context, elements } = useFloatingUI.useFloatingUI({
|
|
126
|
-
open,
|
|
133
|
+
open: disabled ? false : open,
|
|
127
134
|
onOpenChange: handleOpenChange,
|
|
128
135
|
placement: placementProp,
|
|
129
136
|
middleware: [
|
|
@@ -142,12 +149,12 @@ function useTooltip(props) {
|
|
|
142
149
|
open: enterDelay,
|
|
143
150
|
close: leaveDelay
|
|
144
151
|
},
|
|
145
|
-
enabled: !disableHoverListener,
|
|
152
|
+
enabled: !(disableHoverListener || disabled),
|
|
146
153
|
handleClose: react.safePolygon()
|
|
147
154
|
}),
|
|
148
|
-
react.useFocus(context, { enabled: !disableFocusListener }),
|
|
155
|
+
react.useFocus(context, { enabled: !(disableFocusListener || disabled) }),
|
|
149
156
|
react.useRole(context, { role: "tooltip" }),
|
|
150
|
-
react.useDismiss(context),
|
|
157
|
+
react.useDismiss(context, { enabled: !disabled }),
|
|
151
158
|
useAriaAnnounce.useAriaAnnounce(context, {
|
|
152
159
|
delay: {
|
|
153
160
|
open: enterDelay,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTooltip.js","sources":["../src/tooltip/useTooltip.ts"],"sourcesContent":["import {\n arrow,\n flip,\n offset,\n safePolygon,\n shift,\n useDismiss,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n limitShift,\n} from \"@floating-ui/react\";\nimport { HTMLProps, useRef } from \"react\";\nimport { useControlled, UseFloatingUIProps, useFloatingUI } from \"../utils\";\nimport { useAriaAnnounce } from \"./useAriaAnnounce\";\n\nexport interface UseTooltipProps\n extends Partial<\n Pick<UseFloatingUIProps, \"onOpenChange\" | \"open\" | \"placement\">\n > {\n /**\n * Do not respond to focus events.\n */\n disableFocusListener?: boolean;\n /**\n * Do not respond to hover events.\n */\n disableHoverListener?: boolean;\n /**\n * The number of milliseconds to wait before showing the tooltip.\n * This prop won't impact the enter touch delay (`enterTouchDelay`).\n */\n enterDelay?: number;\n /**\n * The number of milliseconds to wait before hiding the tooltip.\n * This prop won't impact the leave touch delay (`leaveTouchDelay`).\n */\n leaveDelay?: number;\n}\n\nexport function useTooltip(props?: UseTooltipProps) {\n const {\n enterDelay,\n leaveDelay,\n open: openProp,\n onOpenChange,\n placement: placementProp,\n disableHoverListener,\n disableFocusListener,\n } = props ?? {};\n\n const arrowRef = useRef<SVGSVGElement | null>(null);\n\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: false,\n name: \"Tooltip\",\n state: \"open\",\n });\n const handleOpenChange = (open: boolean) => {\n setOpen(open);\n onOpenChange?.(open);\n };\n\n const { floating, reference, x, y, strategy, placement, context, elements } =\n useFloatingUI({\n open,\n onOpenChange: handleOpenChange,\n placement: placementProp,\n middleware: [\n offset(8),\n shift({ limiter: limitShift() }),\n flip({\n fallbackAxisSideDirection: \"end\",\n fallbackStrategy: \"initialPlacement\",\n }),\n arrow({ element: arrowRef }),\n ],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(context, {\n delay: {\n open: enterDelay,\n close: leaveDelay,\n },\n enabled: !disableHoverListener,\n handleClose: safePolygon(),\n }),\n useFocus(context, { enabled: !disableFocusListener }),\n useRole(context, { role: \"tooltip\" }),\n useDismiss(context),\n useAriaAnnounce(context, {\n delay: {\n open: enterDelay,\n close: leaveDelay,\n },\n }),\n ]);\n\n const arrowProps = {\n ref: arrowRef,\n context,\n };\n\n const getTooltipProps = (): HTMLProps<HTMLDivElement> => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars -- tabIndex raises false positives because it is set to \"-1\".\n const { tabIndex, ...tooltipProps } = getFloatingProps({\n // @ts-expect-error - `data-*` props need extra typing when not used on a DOM element.\n \"data-placement\": placement,\n ref: floating,\n });\n\n return tooltipProps;\n };\n\n const getTriggerProps = () =>\n getReferenceProps({\n ref: reference,\n });\n\n const getTooltipPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n return {\n arrowProps,\n open,\n floating,\n reference,\n getTooltipProps,\n getTriggerProps,\n getTooltipPosition,\n };\n}\n"],"names":["useRef","useControlled","open","useFloatingUI","offset","shift","limitShift","flip","arrow","useInteractions","useHover","safePolygon","useFocus","useRole","useDismiss","useAriaAnnounce"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTooltip.js","sources":["../src/tooltip/useTooltip.ts"],"sourcesContent":["import {\n arrow,\n flip,\n offset,\n safePolygon,\n shift,\n useDismiss,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n limitShift,\n} from \"@floating-ui/react\";\nimport { HTMLProps, useRef } from \"react\";\nimport { useControlled, UseFloatingUIProps, useFloatingUI } from \"../utils\";\nimport { useAriaAnnounce } from \"./useAriaAnnounce\";\n\nexport interface UseTooltipProps\n extends Partial<\n Pick<UseFloatingUIProps, \"onOpenChange\" | \"open\" | \"placement\">\n > {\n /**\n * When `true`, the tooltip will be disabled.\n */\n disabled?: boolean;\n /**\n * Do not respond to focus events.\n */\n disableFocusListener?: boolean;\n /**\n * Do not respond to hover events.\n */\n disableHoverListener?: boolean;\n /**\n * The number of milliseconds to wait before showing the tooltip.\n * This prop won't impact the enter touch delay (`enterTouchDelay`).\n */\n enterDelay?: number;\n /**\n * The number of milliseconds to wait before hiding the tooltip.\n * This prop won't impact the leave touch delay (`leaveTouchDelay`).\n */\n leaveDelay?: number;\n}\n\nexport function useTooltip(props?: UseTooltipProps) {\n const {\n enterDelay,\n disabled,\n leaveDelay,\n open: openProp,\n onOpenChange,\n placement: placementProp,\n disableHoverListener,\n disableFocusListener,\n } = props ?? {};\n\n const arrowRef = useRef<SVGSVGElement | null>(null);\n\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: false,\n name: \"Tooltip\",\n state: \"open\",\n });\n const handleOpenChange = (open: boolean) => {\n setOpen(open);\n onOpenChange?.(open);\n };\n\n const { floating, reference, x, y, strategy, placement, context, elements } =\n useFloatingUI({\n open: disabled ? false : open,\n onOpenChange: handleOpenChange,\n placement: placementProp,\n middleware: [\n offset(8),\n shift({ limiter: limitShift() }),\n flip({\n fallbackAxisSideDirection: \"end\",\n fallbackStrategy: \"initialPlacement\",\n }),\n arrow({ element: arrowRef }),\n ],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(context, {\n delay: {\n open: enterDelay,\n close: leaveDelay,\n },\n enabled: !(disableHoverListener || disabled),\n handleClose: safePolygon(),\n }),\n useFocus(context, { enabled: !(disableFocusListener || disabled) }),\n useRole(context, { role: \"tooltip\" }),\n useDismiss(context, { enabled: !disabled }),\n useAriaAnnounce(context, {\n delay: {\n open: enterDelay,\n close: leaveDelay,\n },\n }),\n ]);\n\n const arrowProps = {\n ref: arrowRef,\n context,\n };\n\n const getTooltipProps = (): HTMLProps<HTMLDivElement> => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars -- tabIndex raises false positives because it is set to \"-1\".\n const { tabIndex, ...tooltipProps } = getFloatingProps({\n // @ts-expect-error - `data-*` props need extra typing when not used on a DOM element.\n \"data-placement\": placement,\n ref: floating,\n });\n\n return tooltipProps;\n };\n\n const getTriggerProps = () =>\n getReferenceProps({\n ref: reference,\n });\n\n const getTooltipPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n return {\n arrowProps,\n open,\n floating,\n reference,\n getTooltipProps,\n getTriggerProps,\n getTooltipPosition,\n };\n}\n"],"names":["useRef","useControlled","open","useFloatingUI","offset","shift","limitShift","flip","arrow","useInteractions","useHover","safePolygon","useFocus","useRole","useDismiss","useAriaAnnounce"],"mappings":"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"}
|
|
@@ -66,12 +66,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
66
66
|
require('../link/Link.js');
|
|
67
67
|
require('../link-card/LinkCard.js');
|
|
68
68
|
require('../list-control/ListControlContext.js');
|
|
69
|
+
require('../menu/MenuContext.js');
|
|
70
|
+
require('@floating-ui/react');
|
|
71
|
+
require('../menu/MenuItem.js');
|
|
72
|
+
require('../menu/MenuPanel.js');
|
|
73
|
+
require('../menu/MenuTriggerContext.js');
|
|
74
|
+
require('../menu/MenuPanelContext.js');
|
|
75
|
+
require('../menu/MenuGroup.js');
|
|
69
76
|
require('../multiline-input/MultilineInput.js');
|
|
70
77
|
require('../navigation-item/NavigationItem.js');
|
|
71
78
|
require('../option/Option.js');
|
|
72
79
|
require('../option/OptionGroup.js');
|
|
73
80
|
require('../overlay/OverlayContext.js');
|
|
74
|
-
require('@floating-ui/react');
|
|
75
81
|
require('../overlay/OverlayPanel.js');
|
|
76
82
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
77
83
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useValueEffect.js","sources":["../src/utils/useValueEffect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { Dispatch, MutableRefObject, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../index\";\nimport { useEventCallback } from \"./useEventCallback\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype SetValueAction<S> = (prev: S) => Generator<any, void, unknown>;\n\n// This hook works like `useState`, but when setting the value, you pass a generator function\n// that can yield multiple values. Each yielded value updates the state and waits for the next\n// layout effect, then continues the generator. This allows sequential updates to state to be\n// written linearly.\nexport function useValueEffect<S>(\n defaultValue: S | (() => S)\n): [S, Dispatch<SetValueAction<S>>] {\n const [value, setValue] = useState(defaultValue);\n const effect: MutableRefObject<Generator<S> | null> =\n useRef<Generator<S> | null>(null);\n\n // Store the function in a ref so we can always access the current version\n // which has the proper `value` in scope.\n const nextRef = useEventCallback(() => {\n if (!effect.current) {\n return;\n }\n // Run the generator to the next yield.\n const newValue = effect.current.next();\n\n // If the generator is done, reset the effect.\n if (newValue.done) {\n effect.current = null;\n return;\n }\n\n // If the value is the same as the current value,\n // then continue to the next yield. Otherwise,\n // set the value in state and wait for the next layout effect.\n if (value === newValue.value) {\n nextRef();\n } else {\n setValue(newValue.value);\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // If there is an effect currently running, continue to the next yield.\n if (effect.current) {\n nextRef();\n }\n });\n\n const queue: Dispatch<SetValueAction<S>> = useEventCallback((fn) => {\n effect.current = fn(value);\n nextRef();\n });\n\n return [value, queue];\n}\n"],"names":["useState","useRef","useEventCallback","useIsomorphicLayoutEffect"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useValueEffect.js","sources":["../src/utils/useValueEffect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { Dispatch, MutableRefObject, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../index\";\nimport { useEventCallback } from \"./useEventCallback\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype SetValueAction<S> = (prev: S) => Generator<any, void, unknown>;\n\n// This hook works like `useState`, but when setting the value, you pass a generator function\n// that can yield multiple values. Each yielded value updates the state and waits for the next\n// layout effect, then continues the generator. This allows sequential updates to state to be\n// written linearly.\nexport function useValueEffect<S>(\n defaultValue: S | (() => S)\n): [S, Dispatch<SetValueAction<S>>] {\n const [value, setValue] = useState(defaultValue);\n const effect: MutableRefObject<Generator<S> | null> =\n useRef<Generator<S> | null>(null);\n\n // Store the function in a ref so we can always access the current version\n // which has the proper `value` in scope.\n const nextRef = useEventCallback(() => {\n if (!effect.current) {\n return;\n }\n // Run the generator to the next yield.\n const newValue = effect.current.next();\n\n // If the generator is done, reset the effect.\n if (newValue.done) {\n effect.current = null;\n return;\n }\n\n // If the value is the same as the current value,\n // then continue to the next yield. Otherwise,\n // set the value in state and wait for the next layout effect.\n if (value === newValue.value) {\n nextRef();\n } else {\n setValue(newValue.value);\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // If there is an effect currently running, continue to the next yield.\n if (effect.current) {\n nextRef();\n }\n });\n\n const queue: Dispatch<SetValueAction<S>> = useEventCallback((fn) => {\n effect.current = fn(value);\n nextRef();\n });\n\n return [value, queue];\n}\n"],"names":["useState","useRef","useEventCallback","useIsomorphicLayoutEffect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,SAAS,eACd,YACkC,EAAA;AAClC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,eAAS,YAAY,CAAA,CAAA;AAC/C,EAAM,MAAA,MAAA,GACJC,aAA4B,IAAI,CAAA,CAAA;AAIlC,EAAM,MAAA,OAAA,GAAUC,kCAAiB,MAAM;AACrC,IAAI,IAAA,CAAC,OAAO,OAAS,EAAA;AACnB,MAAA,OAAA;AAAA,KACF;AAEA,IAAM,MAAA,QAAA,GAAW,MAAO,CAAA,OAAA,CAAQ,IAAK,EAAA,CAAA;AAGrC,IAAA,IAAI,SAAS,IAAM,EAAA;AACjB,MAAA,MAAA,CAAO,OAAU,GAAA,IAAA,CAAA;AACjB,MAAA,OAAA;AAAA,KACF;AAKA,IAAI,IAAA,KAAA,KAAU,SAAS,KAAO,EAAA;AAC5B,MAAQ,OAAA,EAAA,CAAA;AAAA,KACH,MAAA;AACL,MAAA,QAAA,CAAS,SAAS,KAAK,CAAA,CAAA;AAAA,KACzB;AAAA,GACD,CAAA,CAAA;AAED,EAAAC,mDAAA,CAA0B,MAAM;AAE9B,IAAA,IAAI,OAAO,OAAS,EAAA;AAClB,MAAQ,OAAA,EAAA,CAAA;AAAA,KACV;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,KAAA,GAAqCD,iCAAiB,CAAA,CAAC,EAAO,KAAA;AAClE,IAAO,MAAA,CAAA,OAAA,GAAU,GAAG,KAAK,CAAA,CAAA;AACzB,IAAQ,OAAA,EAAA,CAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAO,OAAA,CAAC,OAAO,KAAK,CAAA,CAAA;AACtB;;;;"}
|
|
@@ -64,12 +64,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
64
64
|
require('../link/Link.js');
|
|
65
65
|
require('../link-card/LinkCard.js');
|
|
66
66
|
require('../list-control/ListControlContext.js');
|
|
67
|
+
require('../menu/MenuContext.js');
|
|
68
|
+
require('@floating-ui/react');
|
|
69
|
+
require('../menu/MenuItem.js');
|
|
70
|
+
require('../menu/MenuPanel.js');
|
|
71
|
+
require('../menu/MenuTriggerContext.js');
|
|
72
|
+
require('../menu/MenuPanelContext.js');
|
|
73
|
+
require('../menu/MenuGroup.js');
|
|
67
74
|
require('../multiline-input/MultilineInput.js');
|
|
68
75
|
require('../navigation-item/NavigationItem.js');
|
|
69
76
|
require('../option/Option.js');
|
|
70
77
|
require('../option/OptionGroup.js');
|
|
71
78
|
require('../overlay/OverlayContext.js');
|
|
72
|
-
require('@floating-ui/react');
|
|
73
79
|
require('../overlay/OverlayPanel.js');
|
|
74
80
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
75
81
|
require('../overlay/OverlayPanelContent.js');
|