@salt-ds/core 1.25.0 → 1.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/salt-core.css +122 -32
- package/dist-cjs/accordion/Accordion.js +8 -1
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +8 -1
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +8 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +8 -1
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +8 -1
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +8 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +8 -1
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +8 -1
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +8 -1
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +8 -1
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +8 -1
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +8 -1
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +8 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +8 -1
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/breakpoints/BreakpointProvider.js +169 -0
- package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -0
- package/dist-cjs/breakpoints/Breakpoints.js +1 -2
- package/dist-cjs/breakpoints/Breakpoints.js.map +1 -1
- package/dist-cjs/button/Button.css.js +1 -1
- package/dist-cjs/button/Button.js +8 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.css.js +1 -1
- package/dist-cjs/card/Card.js +8 -1
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.js +8 -1
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +8 -1
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +8 -1
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +8 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.js +10 -2
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +23 -2
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dialog/Dialog.js +7 -0
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +8 -1
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +8 -1
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +8 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.css.js +1 -1
- package/dist-cjs/dialog/DialogHeader.js +8 -1
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js +7 -0
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +8 -1
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js +8 -1
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js +8 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +8 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +12 -4
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.css.js +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +29 -15
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +8 -1
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +8 -1
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +8 -1
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +8 -1
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +13 -5
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.css.js +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +31 -11
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +13 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +8 -1
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCard.css.js +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js +8 -1
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js +8 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js +8 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-cjs/link/Link.js +8 -1
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.css.js +1 -1
- package/dist-cjs/link-card/LinkCard.js +8 -1
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js +8 -1
- package/dist-cjs/list-control/ListControlContext.js.map +1 -1
- package/dist-cjs/list-control/ListControlState.js +8 -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 +8 -1
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +8 -1
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/option/Option.css.js +1 -1
- package/dist-cjs/option/Option.js +8 -1
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.js +8 -1
- package/dist-cjs/option/OptionGroup.js.map +1 -1
- package/dist-cjs/option/OptionList.js +8 -1
- package/dist-cjs/option/OptionList.js.map +1 -1
- package/dist-cjs/option/OptionListBase.js +8 -1
- package/dist-cjs/option/OptionListBase.js.map +1 -1
- package/dist-cjs/overlay/Overlay.js +8 -1
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js +8 -1
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.js +8 -1
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js +8 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.js +8 -1
- package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-cjs/overlay/OverlayTrigger.js +8 -1
- package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
- package/dist-cjs/pagination/CompactInput.js +8 -1
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +8 -1
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +8 -1
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +8 -1
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +8 -1
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +8 -1
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +8 -1
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +8 -1
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js +8 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js +8 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-cjs/pill/Pill.js +8 -1
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.js +8 -1
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +8 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +8 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.js +8 -1
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +8 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +8 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +8 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +16 -5
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +8 -1
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js +8 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +8 -1
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +8 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +8 -1
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.css.js +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +20 -6
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +8 -1
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +8 -1
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.css.js +1 -1
- package/dist-cjs/switch/Switch.js +8 -1
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/text/Text.js +8 -1
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/toast/Toast.js +8 -1
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +8 -1
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +8 -1
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +8 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +8 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.css.js +1 -1
- package/dist-cjs/tooltip/Tooltip.js +9 -1
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +7 -0
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +8 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +12 -4
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/useResponsiveProp.js +15 -0
- package/dist-cjs/utils/useResponsiveProp.js.map +1 -1
- package/dist-cjs/utils/useValueEffect.js +8 -1
- package/dist-cjs/utils/useValueEffect.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +8 -1
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +8 -1
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +8 -1
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +8 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +8 -1
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +8 -1
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +8 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +8 -1
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +8 -1
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +8 -1
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +8 -1
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +8 -1
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +8 -1
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +8 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +8 -1
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/breakpoints/BreakpointProvider.js +163 -0
- package/dist-es/breakpoints/BreakpointProvider.js.map +1 -0
- package/dist-es/breakpoints/Breakpoints.js +1 -2
- package/dist-es/breakpoints/Breakpoints.js.map +1 -1
- package/dist-es/button/Button.css.js +1 -1
- package/dist-es/button/Button.js +8 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.css.js +1 -1
- package/dist-es/card/Card.js +8 -1
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/checkbox/Checkbox.js +8 -1
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +8 -1
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +8 -1
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +8 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.js +10 -2
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +23 -2
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dialog/Dialog.js +7 -0
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +8 -1
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +8 -1
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +8 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.css.js +1 -1
- package/dist-es/dialog/DialogHeader.js +8 -1
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/drawer/Drawer.js +7 -0
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +8 -1
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js +8 -1
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.js +8 -1
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +8 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +13 -5
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.css.js +1 -1
- package/dist-es/flex-layout/FlexLayout.js +30 -16
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +8 -1
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +8 -1
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +8 -1
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +8 -1
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +14 -6
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.css.js +1 -1
- package/dist-es/grid-layout/GridLayout.js +32 -12
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +7 -1
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +8 -1
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/interactable-card/InteractableCard.css.js +1 -1
- package/dist-es/interactable-card/InteractableCard.js +8 -1
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroup.js +8 -1
- package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js +8 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-es/link/Link.js +8 -1
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.css.js +1 -1
- package/dist-es/link-card/LinkCard.js +8 -1
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js +8 -1
- package/dist-es/list-control/ListControlContext.js.map +1 -1
- package/dist-es/list-control/ListControlState.js +8 -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 +8 -1
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +8 -1
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/option/Option.css.js +1 -1
- package/dist-es/option/Option.js +8 -1
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.js +8 -1
- package/dist-es/option/OptionGroup.js.map +1 -1
- package/dist-es/option/OptionList.js +8 -1
- package/dist-es/option/OptionList.js.map +1 -1
- package/dist-es/option/OptionListBase.js +8 -1
- package/dist-es/option/OptionListBase.js.map +1 -1
- package/dist-es/overlay/Overlay.js +8 -1
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js +8 -1
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.js +8 -1
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js +8 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-es/overlay/OverlayPanelContent.js +8 -1
- package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-es/overlay/OverlayTrigger.js +8 -1
- package/dist-es/overlay/OverlayTrigger.js.map +1 -1
- package/dist-es/pagination/CompactInput.js +8 -1
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +8 -1
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +8 -1
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +8 -1
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +8 -1
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +8 -1
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +8 -1
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +8 -1
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js +8 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js +8 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-es/pill/Pill.js +8 -1
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.js +8 -1
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +8 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +8 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.js +8 -1
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +8 -1
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +8 -1
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +8 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +16 -5
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +8 -1
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js +8 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-es/spinner/Spinner.js +8 -1
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +8 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +8 -1
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.css.js +1 -1
- package/dist-es/stack-layout/StackLayout.js +21 -7
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +8 -1
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +8 -1
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.css.js +1 -1
- package/dist-es/switch/Switch.js +8 -1
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/text/Text.js +8 -1
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/toast/Toast.js +8 -1
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +8 -1
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +8 -1
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +8 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +8 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.css.js +1 -1
- package/dist-es/tooltip/Tooltip.js +9 -1
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +7 -0
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +8 -1
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +12 -4
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/useResponsiveProp.js +15 -1
- package/dist-es/utils/useResponsiveProp.js.map +1 -1
- package/dist-es/utils/useValueEffect.js +8 -1
- package/dist-es/utils/useValueEffect.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js +8 -1
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/breakpoints/BreakpointProvider.d.ts +16 -0
- package/dist-types/breakpoints/Breakpoints.d.ts +2 -2
- package/dist-types/breakpoints/index.d.ts +1 -0
- package/dist-types/combo-box/useComboBox.d.ts +1 -0
- package/dist-types/flex-layout/FlexLayout.d.ts +1 -1
- package/dist-types/grid-layout/GridLayout.d.ts +5 -5
- package/dist-types/index.d.ts +2 -1
- 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/tooltip/useTooltip.d.ts +4 -0
- package/dist-types/utils/useResponsiveProp.d.ts +1 -0
- package/package.json +2 -2
|
@@ -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;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* Styles applied to root component */\n.saltTooltip {\n --tooltip-background: var(--saltTooltip-background, var(--salt-container-primary-background));\n --tooltip-zIndex: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n /* apply icon margin based on the text line height so it's aligned on all densities */\n --tooltip-icon-marginTop: calc((var(--salt-text-lineHeight) - max(var(--salt-icon-size-base), 12px)) / 2);\n --tooltip-status-borderColor: var(--salt-container-primary-borderColor);\n}\n\n.saltTooltip {\n background: var(--tooltip-background);\n border-color: var(--saltTooltip-borderColor, var(--tooltip-status-borderColor));\n border-style: var(--saltTooltip-borderStyle, var(--salt-container-borderStyle));\n border-width: var(--saltTooltip-borderWidth, var(--salt-size-border));\n border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n color: var(--saltTooltip-text-color, var(--salt-content-primary-foreground));\n font-family: var(--salt-text-fontFamily);\n font-size: var(--saltTooltip-fontSize, var(--salt-text-fontSize));\n font-weight: var(--saltTooltip-fontWeight, var(--salt-text-fontWeight));\n line-height: var(--saltTooltip-lineHeight, var(--salt-text-lineHeight));\n max-width: var(--saltTooltip-maxWidth, 230px);\n padding: var(--saltTooltip-padding, var(--salt-
|
|
3
|
+
var css_248z = "/* Styles applied to root component */\n.saltTooltip {\n --tooltip-background: var(--saltTooltip-background, var(--salt-container-primary-background));\n --tooltip-zIndex: var(--saltTooltip-zIndex, var(--salt-zIndex-flyover));\n /* apply icon margin based on the text line height so it's aligned on all densities */\n --tooltip-icon-marginTop: calc((var(--salt-text-lineHeight) - max(var(--salt-icon-size-base), 12px)) / 2);\n --tooltip-status-borderColor: var(--salt-container-primary-borderColor);\n}\n\n.saltTooltip {\n background: var(--tooltip-background);\n border-color: var(--saltTooltip-borderColor, var(--tooltip-status-borderColor));\n border-style: var(--saltTooltip-borderStyle, var(--salt-container-borderStyle));\n border-width: var(--saltTooltip-borderWidth, var(--salt-size-border));\n border-radius: var(--saltTooltip-borderRadius, var(--salt-palette-corner-weak, 0));\n box-shadow: var(--saltTooltip-shadow, var(--salt-overlayable-shadow-popout));\n color: var(--saltTooltip-text-color, var(--salt-content-primary-foreground));\n font-family: var(--salt-text-fontFamily);\n font-size: var(--saltTooltip-fontSize, var(--salt-text-fontSize));\n font-weight: var(--saltTooltip-fontWeight, var(--salt-text-fontWeight));\n line-height: var(--saltTooltip-lineHeight, var(--salt-text-lineHeight));\n max-width: var(--saltTooltip-maxWidth, 230px);\n padding: var(--saltTooltip-padding, var(--salt-spacing-100));\n position: relative;\n text-align: var(--saltTooltip-textAlign, left);\n z-index: var(--tooltip-zIndex);\n}\n\n/* Styles applied to container */\n.saltTooltip-container {\n display: flex;\n align-items: baseline;\n position: relative;\n}\n\n/* Styles applied to content */\n.saltTooltip-content {\n overflow: hidden;\n}\n\n/* Styles applied to status indicator */\n.saltTooltip-icon {\n --saltIcon-margin: var(--tooltip-icon-marginTop) var(--salt-spacing-75) 0 0;\n vertical-align: top;\n align-self: flex-start;\n}\n\n/* Styles applied when status = \"info\" */\n.saltTooltip-info {\n --tooltip-status-borderColor: var(--salt-status-info-borderColor);\n}\n\n/* Styles applied when status = \"error\" */\n.saltTooltip-error {\n --tooltip-status-borderColor: var(--salt-status-error-borderColor);\n}\n\n/* Styles applied when status = \"warning\" */\n.saltTooltip-warning {\n --tooltip-status-borderColor: var(--salt-status-warning-borderColor);\n}\n\n/* Styles applied when status = \"success\" */\n.saltTooltip-success {\n --tooltip-status-borderColor: var(--salt-status-success-borderColor);\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=Tooltip.css.js.map
|
|
@@ -26,6 +26,7 @@ require('../banner/BannerActions.js');
|
|
|
26
26
|
require('../banner/BannerContent.js');
|
|
27
27
|
require('../border-item/BorderItem.js');
|
|
28
28
|
require('../border-layout/BorderLayout.js');
|
|
29
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
29
30
|
require('../button/Button.js');
|
|
30
31
|
require('../card/Card.js');
|
|
31
32
|
require('../checkbox/Checkbox.js');
|
|
@@ -68,12 +69,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
68
69
|
require('../link/Link.js');
|
|
69
70
|
require('../link-card/LinkCard.js');
|
|
70
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');
|
|
71
79
|
require('../multiline-input/MultilineInput.js');
|
|
72
80
|
require('../navigation-item/NavigationItem.js');
|
|
73
81
|
require('../option/Option.js');
|
|
74
82
|
require('../option/OptionGroup.js');
|
|
75
83
|
require('../overlay/OverlayContext.js');
|
|
76
|
-
require('@floating-ui/react');
|
|
77
84
|
require('../overlay/OverlayPanel.js');
|
|
78
85
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
79
86
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -130,6 +137,7 @@ const Tooltip = React.forwardRef(
|
|
|
130
137
|
const { Component: FloatingComponent } = useFloatingUI.useFloatingComponent();
|
|
131
138
|
const hookProps = {
|
|
132
139
|
open: openProp,
|
|
140
|
+
disabled,
|
|
133
141
|
placement,
|
|
134
142
|
enterDelay,
|
|
135
143
|
leaveDelay,
|
|
@@ -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 = !!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":"
|
|
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;\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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"}
|
|
@@ -24,6 +24,7 @@ require('../banner/BannerActions.js');
|
|
|
24
24
|
require('../banner/BannerContent.js');
|
|
25
25
|
require('../border-item/BorderItem.js');
|
|
26
26
|
require('../border-layout/BorderLayout.js');
|
|
27
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
27
28
|
require('../button/Button.js');
|
|
28
29
|
require('../card/Card.js');
|
|
29
30
|
require('../checkbox/Checkbox.js');
|
|
@@ -66,6 +67,12 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
66
67
|
require('../link/Link.js');
|
|
67
68
|
require('../link-card/LinkCard.js');
|
|
68
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');
|
|
69
76
|
require('../multiline-input/MultilineInput.js');
|
|
70
77
|
require('../navigation-item/NavigationItem.js');
|
|
71
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;;;;"}
|
|
@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
|
|
|
23
23
|
require('../banner/BannerContent.js');
|
|
24
24
|
require('../border-item/BorderItem.js');
|
|
25
25
|
require('../border-layout/BorderLayout.js');
|
|
26
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
26
27
|
require('../button/Button.js');
|
|
27
28
|
require('../card/Card.js');
|
|
28
29
|
require('../checkbox/Checkbox.js');
|
|
@@ -65,12 +66,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
67
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');
|
|
68
76
|
require('../multiline-input/MultilineInput.js');
|
|
69
77
|
require('../navigation-item/NavigationItem.js');
|
|
70
78
|
require('../option/Option.js');
|
|
71
79
|
require('../option/OptionGroup.js');
|
|
72
80
|
require('../overlay/OverlayContext.js');
|
|
73
|
-
require('@floating-ui/react');
|
|
74
81
|
require('../overlay/OverlayPanel.js');
|
|
75
82
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
76
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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"}
|
|
@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
|
|
|
23
23
|
require('../banner/BannerContent.js');
|
|
24
24
|
require('../border-item/BorderItem.js');
|
|
25
25
|
require('../border-layout/BorderLayout.js');
|
|
26
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
26
27
|
require('../button/Button.js');
|
|
27
28
|
require('../card/Card.js');
|
|
28
29
|
require('../checkbox/Checkbox.js');
|
|
@@ -65,6 +66,12 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
67
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');
|
|
68
75
|
require('../multiline-input/MultilineInput.js');
|
|
69
76
|
require('../navigation-item/NavigationItem.js');
|
|
70
77
|
require('../option/Option.js');
|
|
@@ -103,6 +110,7 @@ var useAriaAnnounce = require('./useAriaAnnounce.js');
|
|
|
103
110
|
function useTooltip(props) {
|
|
104
111
|
const {
|
|
105
112
|
enterDelay,
|
|
113
|
+
disabled,
|
|
106
114
|
leaveDelay,
|
|
107
115
|
open: openProp,
|
|
108
116
|
onOpenChange,
|
|
@@ -122,7 +130,7 @@ function useTooltip(props) {
|
|
|
122
130
|
onOpenChange == null ? void 0 : onOpenChange(open2);
|
|
123
131
|
};
|
|
124
132
|
const { floating, reference, x, y, strategy, placement, context, elements } = useFloatingUI.useFloatingUI({
|
|
125
|
-
open,
|
|
133
|
+
open: disabled ? false : open,
|
|
126
134
|
onOpenChange: handleOpenChange,
|
|
127
135
|
placement: placementProp,
|
|
128
136
|
middleware: [
|
|
@@ -141,12 +149,12 @@ function useTooltip(props) {
|
|
|
141
149
|
open: enterDelay,
|
|
142
150
|
close: leaveDelay
|
|
143
151
|
},
|
|
144
|
-
enabled: !disableHoverListener,
|
|
152
|
+
enabled: !(disableHoverListener || disabled),
|
|
145
153
|
handleClose: react.safePolygon()
|
|
146
154
|
}),
|
|
147
|
-
react.useFocus(context, { enabled: !disableFocusListener }),
|
|
155
|
+
react.useFocus(context, { enabled: !(disableFocusListener || disabled) }),
|
|
148
156
|
react.useRole(context, { role: "tooltip" }),
|
|
149
|
-
react.useDismiss(context),
|
|
157
|
+
react.useDismiss(context, { enabled: !disabled }),
|
|
150
158
|
useAriaAnnounce.useAriaAnnounce(context, {
|
|
151
159
|
delay: {
|
|
152
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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"}
|
|
@@ -65,8 +65,23 @@ const useResponsiveProp = (value, defaultValue) => {
|
|
|
65
65
|
}
|
|
66
66
|
return value;
|
|
67
67
|
};
|
|
68
|
+
function isBreakpointProp(value) {
|
|
69
|
+
return typeof value === "object" && !Array.isArray(value);
|
|
70
|
+
}
|
|
71
|
+
function resolveResponsiveValue(value, matchedBreakpoints) {
|
|
72
|
+
if (value && isBreakpointProp(value)) {
|
|
73
|
+
for (const breakpoint of matchedBreakpoints) {
|
|
74
|
+
if (value[breakpoint] != null) {
|
|
75
|
+
return value[breakpoint];
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return void 0;
|
|
79
|
+
}
|
|
80
|
+
return value;
|
|
81
|
+
}
|
|
68
82
|
|
|
69
83
|
exports.getCurrentBreakpoint = getCurrentBreakpoint;
|
|
84
|
+
exports.resolveResponsiveValue = resolveResponsiveValue;
|
|
70
85
|
exports.useCurrentBreakpoint = useCurrentBreakpoint;
|
|
71
86
|
exports.useOrderedBreakpoints = useOrderedBreakpoints;
|
|
72
87
|
exports.useResponsiveProp = useResponsiveProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResponsiveProp.js","sources":["../src/utils/useResponsiveProp.ts"],"sourcesContent":["import { Breakpoints } from \"../breakpoints\";\nimport { useBreakpoints } from \"../salt-provider\";\nimport { useViewport } from \"../viewport\";\n\ntype BreakpointProp<T> = {\n [K in keyof Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | BreakpointProp<T>;\n\nexport const getCurrentBreakpoint = (\n breakpoints: Breakpoints,\n width: number\n) => {\n const breakpointList = Object.entries(breakpoints).sort(\n ([, a], [, b]) => a - b\n );\n const [currentBreakpoint] = (\n breakpointList as [keyof Breakpoints, number][]\n ).reduce((acc, val) => {\n const [, accWidth] = acc;\n const [breakpoint, breakpointWidth] = val;\n if (breakpointWidth < width && breakpointWidth > accWidth) {\n return [breakpoint, breakpointWidth];\n }\n return [...acc];\n }, breakpointList[0] as [keyof Breakpoints, number]);\n\n return currentBreakpoint;\n};\n\nexport const useCurrentBreakpoint = () => {\n const viewport = useViewport();\n\n const breakpoints = useBreakpoints();\n\n return getCurrentBreakpoint(breakpoints, viewport);\n};\n\nexport const useOrderedBreakpoints = () => {\n const breakpoints = useBreakpoints();\n\n return Object.entries(breakpoints)\n .sort(([, a], [, b]) => a - b)\n .map(([key]) => key);\n};\n\nconst isObject = <T>(\n value: T\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): value is Record<string | number | symbol, any> => {\n const type = typeof value;\n return value !== null && (type === \"object\" || type === \"function\");\n};\n\nconst hasBreakpointValues = <T>(\n value: ResponsiveProp<T>,\n breakpoints: Breakpoints\n): value is BreakpointProp<T> => {\n return (\n isObject(value) && Object.keys(value).every((key) => key in breakpoints)\n );\n};\n\nconst getResponsiveValue = <T>(\n breakpointValues: BreakpointProp<T>,\n breakpoints: Breakpoints,\n viewport: keyof Breakpoints,\n defaultValue: T\n) => {\n return Object.entries(breakpointValues).reduce<[number, T]>(\n (acc, val) => {\n const [accWidth] = acc;\n const [breakpoint, breakpointValue] = val;\n\n const breakpointWidth =\n breakpoints[breakpoint as keyof typeof breakpoints];\n\n if (\n breakpointWidth >= accWidth &&\n breakpointWidth <= breakpoints[viewport]\n ) {\n return [breakpointWidth, breakpointValue];\n }\n\n return acc;\n },\n [0, defaultValue]\n )[1];\n};\n\nexport const useResponsiveProp = <T>(\n value: ResponsiveProp<T>,\n defaultValue: T\n) => {\n const breakpoints = useBreakpoints();\n const viewport = useViewport();\n // return early if the values are the same\n if (value === defaultValue) return defaultValue;\n\n const currentViewport = getCurrentBreakpoint(breakpoints, viewport);\n if (hasBreakpointValues(value, breakpoints)) {\n return getResponsiveValue(\n value,\n breakpoints,\n currentViewport,\n defaultValue\n );\n }\n return value;\n};\n"],"names":["useViewport","useBreakpoints"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"useResponsiveProp.js","sources":["../src/utils/useResponsiveProp.ts"],"sourcesContent":["import { Breakpoints } from \"../breakpoints\";\nimport { useBreakpoints } from \"../salt-provider\";\nimport { useViewport } from \"../viewport\";\n\ntype BreakpointProp<T> = {\n [K in keyof Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | BreakpointProp<T>;\n\nexport const getCurrentBreakpoint = (\n breakpoints: Breakpoints,\n width: number\n) => {\n const breakpointList = Object.entries(breakpoints).sort(\n ([, a], [, b]) => a - b\n );\n const [currentBreakpoint] = (\n breakpointList as [keyof Breakpoints, number][]\n ).reduce((acc, val) => {\n const [, accWidth] = acc;\n const [breakpoint, breakpointWidth] = val;\n if (breakpointWidth < width && breakpointWidth > accWidth) {\n return [breakpoint, breakpointWidth];\n }\n return [...acc];\n }, breakpointList[0] as [keyof Breakpoints, number]);\n\n return currentBreakpoint;\n};\n\nexport const useCurrentBreakpoint = () => {\n const viewport = useViewport();\n\n const breakpoints = useBreakpoints();\n\n return getCurrentBreakpoint(breakpoints, viewport);\n};\n\nexport const useOrderedBreakpoints = () => {\n const breakpoints = useBreakpoints();\n\n return Object.entries(breakpoints)\n .sort(([, a], [, b]) => a - b)\n .map(([key]) => key);\n};\n\nconst isObject = <T>(\n value: T\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): value is Record<string | number | symbol, any> => {\n const type = typeof value;\n return value !== null && (type === \"object\" || type === \"function\");\n};\n\nconst hasBreakpointValues = <T>(\n value: ResponsiveProp<T>,\n breakpoints: Breakpoints\n): value is BreakpointProp<T> => {\n return (\n isObject(value) && Object.keys(value).every((key) => key in breakpoints)\n );\n};\n\nconst getResponsiveValue = <T>(\n breakpointValues: BreakpointProp<T>,\n breakpoints: Breakpoints,\n viewport: keyof Breakpoints,\n defaultValue: T\n) => {\n return Object.entries(breakpointValues).reduce<[number, T]>(\n (acc, val) => {\n const [accWidth] = acc;\n const [breakpoint, breakpointValue] = val;\n\n const breakpointWidth =\n breakpoints[breakpoint as keyof typeof breakpoints];\n\n if (\n breakpointWidth >= accWidth &&\n breakpointWidth <= breakpoints[viewport]\n ) {\n return [breakpointWidth, breakpointValue];\n }\n\n return acc;\n },\n [0, defaultValue]\n )[1];\n};\n\nexport const useResponsiveProp = <T>(\n value: ResponsiveProp<T>,\n defaultValue: T\n) => {\n const breakpoints = useBreakpoints();\n const viewport = useViewport();\n // return early if the values are the same\n if (value === defaultValue) return defaultValue;\n\n const currentViewport = getCurrentBreakpoint(breakpoints, viewport);\n if (hasBreakpointValues(value, breakpoints)) {\n return getResponsiveValue(\n value,\n breakpoints,\n currentViewport,\n defaultValue\n );\n }\n return value;\n};\n\nfunction isBreakpointProp<T>(\n value: ResponsiveProp<T>\n): value is BreakpointProp<T> {\n return typeof value === \"object\" && !Array.isArray(value);\n}\n\nexport function resolveResponsiveValue<Value>(\n value: ResponsiveProp<Value>,\n matchedBreakpoints: (keyof Breakpoints)[]\n) {\n if (value && isBreakpointProp(value)) {\n for (const breakpoint of matchedBreakpoints) {\n if (value[breakpoint] != null) {\n return value[breakpoint];\n }\n }\n return undefined;\n }\n return value;\n}\n"],"names":["useViewport","useBreakpoints"],"mappings":"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"}
|
|
@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
|
|
|
23
23
|
require('../banner/BannerContent.js');
|
|
24
24
|
require('../border-item/BorderItem.js');
|
|
25
25
|
require('../border-layout/BorderLayout.js');
|
|
26
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
26
27
|
require('../button/Button.js');
|
|
27
28
|
require('../card/Card.js');
|
|
28
29
|
require('../checkbox/Checkbox.js');
|
|
@@ -65,12 +66,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
67
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');
|
|
68
76
|
require('../multiline-input/MultilineInput.js');
|
|
69
77
|
require('../navigation-item/NavigationItem.js');
|
|
70
78
|
require('../option/Option.js');
|
|
71
79
|
require('../option/OptionGroup.js');
|
|
72
80
|
require('../overlay/OverlayContext.js');
|
|
73
|
-
require('@floating-ui/react');
|
|
74
81
|
require('../overlay/OverlayPanel.js');
|
|
75
82
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
76
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;;;;"}
|
|
@@ -21,6 +21,7 @@ require('../banner/BannerActions.js');
|
|
|
21
21
|
require('../banner/BannerContent.js');
|
|
22
22
|
require('../border-item/BorderItem.js');
|
|
23
23
|
require('../border-layout/BorderLayout.js');
|
|
24
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
24
25
|
require('../button/Button.js');
|
|
25
26
|
require('../card/Card.js');
|
|
26
27
|
require('../checkbox/Checkbox.js');
|
|
@@ -63,12 +64,18 @@ require('../interactable-card/InteractableCardGroupContext.js');
|
|
|
63
64
|
require('../link/Link.js');
|
|
64
65
|
require('../link-card/LinkCard.js');
|
|
65
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');
|
|
66
74
|
require('../multiline-input/MultilineInput.js');
|
|
67
75
|
require('../navigation-item/NavigationItem.js');
|
|
68
76
|
require('../option/Option.js');
|
|
69
77
|
require('../option/OptionGroup.js');
|
|
70
78
|
require('../overlay/OverlayContext.js');
|
|
71
|
-
require('@floating-ui/react');
|
|
72
79
|
require('../overlay/OverlayPanel.js');
|
|
73
80
|
require('../overlay/OverlayPanelCloseButton.js');
|
|
74
81
|
require('../overlay/OverlayPanelContent.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, useState, useContext, ReactNode } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n const existingViewport = useContext(ViewportContext);\n const [viewport, setViewport] = useState(existingViewport);\n\n const noExistingViewport = existingViewport === null;\n const viewportValue = existingViewport || viewport || 0;\n\n useIsomorphicLayoutEffect(() => {\n let observer: ResizeObserver | null = null;\n\n if (noExistingViewport) {\n observer = new ResizeObserver(\n (observerEntries: ResizeObserverEntry[]) => {\n setViewport(observerEntries[0].contentRect.width);\n }\n );\n\n observer.observe(document.body);\n setViewport(document.body.getBoundingClientRect().width);\n }\n\n return () => {\n if (observer) {\n observer.disconnect();\n }\n };\n }, [noExistingViewport]);\n\n return (\n <ViewportContext.Provider value={viewportValue}>\n {children}\n </ViewportContext.Provider>\n );\n};\n\nconst useViewport = (): number => {\n const value = useContext(ViewportContext);\n return value === null ? 0 : value;\n};\n\nexport { ViewportProvider, ViewportContext, useViewport };\n"],"names":["createContext","useContext","useState","useIsomorphicLayoutEffect","jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, useState, useContext, ReactNode } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n const existingViewport = useContext(ViewportContext);\n const [viewport, setViewport] = useState(existingViewport);\n\n const noExistingViewport = existingViewport === null;\n const viewportValue = existingViewport || viewport || 0;\n\n useIsomorphicLayoutEffect(() => {\n let observer: ResizeObserver | null = null;\n\n if (noExistingViewport) {\n observer = new ResizeObserver(\n (observerEntries: ResizeObserverEntry[]) => {\n setViewport(observerEntries[0].contentRect.width);\n }\n );\n\n observer.observe(document.body);\n setViewport(document.body.getBoundingClientRect().width);\n }\n\n return () => {\n if (observer) {\n observer.disconnect();\n }\n };\n }, [noExistingViewport]);\n\n return (\n <ViewportContext.Provider value={viewportValue}>\n {children}\n </ViewportContext.Provider>\n );\n};\n\nconst useViewport = (): number => {\n const value = useContext(ViewportContext);\n return value === null ? 0 : value;\n};\n\nexport { ViewportProvider, ViewportContext, useViewport };\n"],"names":["createContext","useContext","useState","useIsomorphicLayoutEffect","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGM,MAAA,eAAA,GAAkBA,oBAA6B,IAAI,EAAA;AAMzD,MAAM,gBAAmB,GAAA,CAAC,EAAE,QAAA,EAAsC,KAAA;AAEhE,EAAM,MAAA,gBAAA,GAAmBC,iBAAW,eAAe,CAAA,CAAA;AACnD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIC,eAAS,gBAAgB,CAAA,CAAA;AAEzD,EAAA,MAAM,qBAAqB,gBAAqB,KAAA,IAAA,CAAA;AAChD,EAAM,MAAA,aAAA,GAAgB,oBAAoB,QAAY,IAAA,CAAA,CAAA;AAEtD,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAkC,GAAA,IAAA,CAAA;AAEtC,IAAA,IAAI,kBAAoB,EAAA;AACtB,MAAA,QAAA,GAAW,IAAI,cAAA;AAAA,QACb,CAAC,eAA2C,KAAA;AAC1C,UAAY,WAAA,CAAA,eAAA,CAAgB,CAAG,CAAA,CAAA,WAAA,CAAY,KAAK,CAAA,CAAA;AAAA,SAClD;AAAA,OACF,CAAA;AAEA,MAAS,QAAA,CAAA,OAAA,CAAQ,SAAS,IAAI,CAAA,CAAA;AAC9B,MAAA,WAAA,CAAY,QAAS,CAAA,IAAA,CAAK,qBAAsB,EAAA,CAAE,KAAK,CAAA,CAAA;AAAA,KACzD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,QAAA,CAAS,UAAW,EAAA,CAAA;AAAA,OACtB;AAAA,KACF,CAAA;AAAA,GACF,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,EACE,uBAAAC,cAAA,CAAC,gBAAgB,QAAhB,EAAA;AAAA,IAAyB,KAAO,EAAA,aAAA;AAAA,IAC9B,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,EAAA;AAEA,MAAM,cAAc,MAAc;AAChC,EAAM,MAAA,KAAA,GAAQH,iBAAW,eAAe,CAAA,CAAA;AACxC,EAAO,OAAA,KAAA,KAAU,OAAO,CAAI,GAAA,KAAA,CAAA;AAC9B;;;;;;"}
|
|
@@ -21,6 +21,7 @@ import '../banner/BannerActions.js';
|
|
|
21
21
|
import '../banner/BannerContent.js';
|
|
22
22
|
import '../border-item/BorderItem.js';
|
|
23
23
|
import '../border-layout/BorderLayout.js';
|
|
24
|
+
import '../breakpoints/BreakpointProvider.js';
|
|
24
25
|
import '../button/Button.js';
|
|
25
26
|
import '../card/Card.js';
|
|
26
27
|
import '../checkbox/Checkbox.js';
|
|
@@ -61,12 +62,18 @@ import '../interactable-card/InteractableCardGroupContext.js';
|
|
|
61
62
|
import '../link/Link.js';
|
|
62
63
|
import '../link-card/LinkCard.js';
|
|
63
64
|
import '../list-control/ListControlContext.js';
|
|
65
|
+
import '../menu/MenuContext.js';
|
|
66
|
+
import '@floating-ui/react';
|
|
67
|
+
import '../menu/MenuItem.js';
|
|
68
|
+
import '../menu/MenuPanel.js';
|
|
69
|
+
import '../menu/MenuTriggerContext.js';
|
|
70
|
+
import '../menu/MenuPanelContext.js';
|
|
71
|
+
import '../menu/MenuGroup.js';
|
|
64
72
|
import '../multiline-input/MultilineInput.js';
|
|
65
73
|
import '../navigation-item/NavigationItem.js';
|
|
66
74
|
import '../option/Option.js';
|
|
67
75
|
import '../option/OptionGroup.js';
|
|
68
76
|
import '../overlay/OverlayContext.js';
|
|
69
|
-
import '@floating-ui/react';
|
|
70
77
|
import '../overlay/OverlayPanel.js';
|
|
71
78
|
import '../overlay/OverlayPanelCloseButton.js';
|
|
72
79
|
import '../overlay/OverlayPanelContent.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, SyntheticEvent } from \"react\";\nimport { clsx } from \"clsx\";\nimport { AccordionContext } from \"./AccordionContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport accordionCss from \"./Accordion.css\";\nexport interface AccordionProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * AccordionGroup value.\n */\n value: string;\n /**\n * Whether the accordion is expanded.\n */\n expanded?: boolean;\n /**\n * Whether the accordion is expanded by default.\n */\n defaultExpanded?: boolean;\n /**\n * Callback fired when the accordion is toggled.\n */\n onToggle?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * Whether the accordion is disabled.\n */\n disabled?: boolean;\n /**\n * The status of the accordion.\n */\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion(props, ref) {\n const {\n className,\n defaultExpanded,\n expanded: expandedProp,\n disabled,\n id: idProp,\n onToggle,\n status,\n value,\n ...rest\n } = props;\n\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion\",\n css: accordionCss,\n window: targetWindow,\n });\n\n const [expanded, setExpanded] = useControlled({\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n name: \"Accordion\",\n state: \"expanded\",\n });\n\n const toggle = (event: SyntheticEvent<HTMLButtonElement>) => {\n setExpanded((prev) => !prev);\n onToggle?.(event);\n };\n\n return (\n <AccordionContext.Provider\n value={{\n value,\n toggle,\n expanded,\n disabled: Boolean(disabled),\n id: id ?? \"\",\n status,\n }}\n >\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n { [withBaseName(status ?? \"\")]: status },\n className\n )}\n {...rest}\n />\n </AccordionContext.Provider>\n );\n }\n);\n"],"names":["Accordion","accordionCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, SyntheticEvent } from \"react\";\nimport { clsx } from \"clsx\";\nimport { AccordionContext } from \"./AccordionContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport accordionCss from \"./Accordion.css\";\nexport interface AccordionProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * AccordionGroup value.\n */\n value: string;\n /**\n * Whether the accordion is expanded.\n */\n expanded?: boolean;\n /**\n * Whether the accordion is expanded by default.\n */\n defaultExpanded?: boolean;\n /**\n * Callback fired when the accordion is toggled.\n */\n onToggle?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * Whether the accordion is disabled.\n */\n disabled?: boolean;\n /**\n * The status of the accordion.\n */\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion(props, ref) {\n const {\n className,\n defaultExpanded,\n expanded: expandedProp,\n disabled,\n id: idProp,\n onToggle,\n status,\n value,\n ...rest\n } = props;\n\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion\",\n css: accordionCss,\n window: targetWindow,\n });\n\n const [expanded, setExpanded] = useControlled({\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n name: \"Accordion\",\n state: \"expanded\",\n });\n\n const toggle = (event: SyntheticEvent<HTMLButtonElement>) => {\n setExpanded((prev) => !prev);\n onToggle?.(event);\n };\n\n return (\n <AccordionContext.Provider\n value={{\n value,\n toggle,\n expanded,\n disabled: Boolean(disabled),\n id: id ?? \"\",\n status,\n }}\n >\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n { [withBaseName(status ?? \"\")]: status },\n className\n )}\n {...rest}\n />\n </AccordionContext.Provider>\n );\n }\n);\n"],"names":["Accordion","accordionCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,SAASA,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAU,EAAA,YAAA;AAAA,MACV,QAAA;AAAA,MACA,EAAI,EAAA,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AACvB,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,aAAc,CAAA;AAAA,MAC5C,UAAY,EAAA,YAAA;AAAA,MACZ,OAAA,EAAS,QAAQ,eAAe,CAAA;AAAA,MAChC,IAAM,EAAA,WAAA;AAAA,MACN,KAAO,EAAA,UAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,CAAC,KAA6C,KAAA;AAC3D,MAAY,WAAA,CAAA,CAAC,IAAS,KAAA,CAAC,IAAI,CAAA,CAAA;AAC3B,MAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACb,CAAA;AAEA,IACE,uBAAA,GAAA,CAAC,iBAAiB,QAAjB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,QAC1B,IAAI,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,EAAA;AAAA,QACV,MAAA;AAAA,OACF;AAAA,MAEA,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb,EAAE,CAAC,YAAA,CAAa,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,IAAI,MAAO,EAAA;AAAA,UACvC,SAAA;AAAA,SACF;AAAA,QACC,GAAG,IAAA;AAAA,OACN,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -18,6 +18,7 @@ import '../banner/BannerActions.js';
|
|
|
18
18
|
import '../banner/BannerContent.js';
|
|
19
19
|
import '../border-item/BorderItem.js';
|
|
20
20
|
import '../border-layout/BorderLayout.js';
|
|
21
|
+
import '../breakpoints/BreakpointProvider.js';
|
|
21
22
|
import '../button/Button.js';
|
|
22
23
|
import '../card/Card.js';
|
|
23
24
|
import '../checkbox/Checkbox.js';
|
|
@@ -60,12 +61,18 @@ import '../interactable-card/InteractableCardGroupContext.js';
|
|
|
60
61
|
import '../link/Link.js';
|
|
61
62
|
import '../link-card/LinkCard.js';
|
|
62
63
|
import '../list-control/ListControlContext.js';
|
|
64
|
+
import '../menu/MenuContext.js';
|
|
65
|
+
import '@floating-ui/react';
|
|
66
|
+
import '../menu/MenuItem.js';
|
|
67
|
+
import '../menu/MenuPanel.js';
|
|
68
|
+
import '../menu/MenuTriggerContext.js';
|
|
69
|
+
import '../menu/MenuPanelContext.js';
|
|
70
|
+
import '../menu/MenuGroup.js';
|
|
63
71
|
import '../multiline-input/MultilineInput.js';
|
|
64
72
|
import '../navigation-item/NavigationItem.js';
|
|
65
73
|
import '../option/Option.js';
|
|
66
74
|
import '../option/OptionGroup.js';
|
|
67
75
|
import '../overlay/OverlayContext.js';
|
|
68
|
-
import '@floating-ui/react';
|
|
69
76
|
import '../overlay/OverlayPanel.js';
|
|
70
77
|
import '../overlay/OverlayPanelCloseButton.js';
|
|
71
78
|
import '../overlay/OverlayPanelContent.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n value: string;\n expanded: boolean;\n toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n disabled: boolean;\n id: string;\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n \"AccordionContext\",\n {\n value: \"\",\n expanded: false,\n toggle: () => undefined,\n disabled: false,\n id: \"\",\n }\n);\n\nexport function useAccordion() {\n return useContext(AccordionContext);\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n value: string;\n expanded: boolean;\n toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n disabled: boolean;\n id: string;\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n \"AccordionContext\",\n {\n value: \"\",\n expanded: false,\n toggle: () => undefined,\n disabled: false,\n id: \"\",\n }\n);\n\nexport function useAccordion() {\n return useContext(AccordionContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,KAAO,EAAA,EAAA;AAAA,IACP,QAAU,EAAA,KAAA;AAAA,IACV,QAAQ,MAAM,KAAA,CAAA;AAAA,IACd,QAAU,EAAA,KAAA;AAAA,IACV,EAAI,EAAA,EAAA;AAAA,GACN;AACF,EAAA;AAEO,SAAS,YAAe,GAAA;AAC7B,EAAA,OAAO,WAAW,gBAAgB,CAAA,CAAA;AACpC;;;;"}
|
|
@@ -17,6 +17,7 @@ import '../banner/BannerActions.js';
|
|
|
17
17
|
import '../banner/BannerContent.js';
|
|
18
18
|
import '../border-item/BorderItem.js';
|
|
19
19
|
import '../border-layout/BorderLayout.js';
|
|
20
|
+
import '../breakpoints/BreakpointProvider.js';
|
|
20
21
|
import '../button/Button.js';
|
|
21
22
|
import '../card/Card.js';
|
|
22
23
|
import '../checkbox/Checkbox.js';
|
|
@@ -59,12 +60,18 @@ import '../interactable-card/InteractableCardGroupContext.js';
|
|
|
59
60
|
import '../link/Link.js';
|
|
60
61
|
import '../link-card/LinkCard.js';
|
|
61
62
|
import '../list-control/ListControlContext.js';
|
|
63
|
+
import '../menu/MenuContext.js';
|
|
64
|
+
import '@floating-ui/react';
|
|
65
|
+
import '../menu/MenuItem.js';
|
|
66
|
+
import '../menu/MenuPanel.js';
|
|
67
|
+
import '../menu/MenuTriggerContext.js';
|
|
68
|
+
import '../menu/MenuPanelContext.js';
|
|
69
|
+
import '../menu/MenuGroup.js';
|
|
62
70
|
import '../multiline-input/MultilineInput.js';
|
|
63
71
|
import '../navigation-item/NavigationItem.js';
|
|
64
72
|
import '../option/Option.js';
|
|
65
73
|
import '../option/OptionGroup.js';
|
|
66
74
|
import '../overlay/OverlayContext.js';
|
|
67
|
-
import '@floating-ui/react';
|
|
68
75
|
import '../overlay/OverlayPanel.js';
|
|
69
76
|
import '../overlay/OverlayPanelCloseButton.js';
|
|
70
77
|
import '../overlay/OverlayPanelContent.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The child Accordions to be rendered\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n function AccordionGroup(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-group\",\n css: accordionGroupCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n );\n }\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The child Accordions to be rendered\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n function AccordionGroup(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-group\",\n css: accordionGroupCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n );\n }\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAG,GAAA;AAAA,MAAW,GAAG,IAAA;AAAA,KAAM,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}
|
|
@@ -21,6 +21,7 @@ import '../banner/BannerActions.js';
|
|
|
21
21
|
import '../banner/BannerContent.js';
|
|
22
22
|
import '../border-item/BorderItem.js';
|
|
23
23
|
import '../border-layout/BorderLayout.js';
|
|
24
|
+
import '../breakpoints/BreakpointProvider.js';
|
|
24
25
|
import '../button/Button.js';
|
|
25
26
|
import '../card/Card.js';
|
|
26
27
|
import '../checkbox/Checkbox.js';
|
|
@@ -59,12 +60,18 @@ import '../interactable-card/InteractableCardGroupContext.js';
|
|
|
59
60
|
import '../link/Link.js';
|
|
60
61
|
import '../link-card/LinkCard.js';
|
|
61
62
|
import '../list-control/ListControlContext.js';
|
|
63
|
+
import '../menu/MenuContext.js';
|
|
64
|
+
import '@floating-ui/react';
|
|
65
|
+
import '../menu/MenuItem.js';
|
|
66
|
+
import '../menu/MenuPanel.js';
|
|
67
|
+
import '../menu/MenuTriggerContext.js';
|
|
68
|
+
import '../menu/MenuPanelContext.js';
|
|
69
|
+
import '../menu/MenuGroup.js';
|
|
62
70
|
import '../multiline-input/MultilineInput.js';
|
|
63
71
|
import '../navigation-item/NavigationItem.js';
|
|
64
72
|
import '../option/Option.js';
|
|
65
73
|
import '../option/OptionGroup.js';
|
|
66
74
|
import '../overlay/OverlayContext.js';
|
|
67
|
-
import '@floating-ui/react';
|
|
68
75
|
import '../overlay/OverlayPanel.js';
|
|
69
76
|
import '../overlay/OverlayPanelCloseButton.js';
|
|
70
77
|
import '../overlay/OverlayPanelContent.js';
|