@salt-ds/core 1.28.1 → 1.30.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 +332 -31
- package/dist-cjs/accordion/Accordion.js +3 -0
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +3 -0
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +3 -0
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +3 -0
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +3 -0
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +3 -0
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +3 -0
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +3 -0
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +3 -0
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +3 -0
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +3 -0
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +3 -0
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +3 -0
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +3 -0
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/breakpoints/BreakpointProvider.js +3 -0
- package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-cjs/button/Button.css.js +1 -1
- package/dist-cjs/button/Button.js +3 -0
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +3 -0
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.js +3 -0
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +3 -0
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +3 -0
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +3 -0
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.js +28 -20
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +5 -2
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dialog/Dialog.js +3 -0
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +3 -0
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +3 -0
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +3 -0
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.js +3 -0
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/divider/Divider.css.js +6 -0
- package/dist-cjs/divider/Divider.css.js.map +1 -0
- package/dist-cjs/divider/Divider.js +143 -0
- package/dist-cjs/divider/Divider.js.map +1 -0
- package/dist-cjs/drawer/Drawer.js +3 -0
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +3 -0
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.css.js +1 -1
- package/dist-cjs/dropdown/Dropdown.js +23 -17
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js +3 -0
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +3 -0
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +3 -0
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +3 -0
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +3 -0
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +3 -0
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +3 -0
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +3 -0
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +3 -0
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +3 -0
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +9 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.css.js +1 -1
- package/dist-cjs/input/Input.js +7 -2
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js +3 -0
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js +3 -0
- package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js +3 -0
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-cjs/link/Link.js +3 -0
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js +3 -0
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-box/ListBox.css.js +6 -0
- package/dist-cjs/list-box/ListBox.css.js.map +1 -0
- package/dist-cjs/list-box/ListBox.js +295 -0
- package/dist-cjs/list-box/ListBox.js.map +1 -0
- package/dist-cjs/list-control/ListControlContext.js +5 -1
- package/dist-cjs/list-control/ListControlContext.js.map +1 -1
- package/dist-cjs/list-control/ListControlState.js +78 -11
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/menu/MenuBase.js +3 -0
- package/dist-cjs/menu/MenuBase.js.map +1 -1
- package/dist-cjs/menu/MenuContext.js +3 -0
- package/dist-cjs/menu/MenuContext.js.map +1 -1
- package/dist-cjs/menu/MenuGroup.css.js +1 -1
- package/dist-cjs/menu/MenuGroup.js +3 -0
- package/dist-cjs/menu/MenuGroup.js.map +1 -1
- package/dist-cjs/menu/MenuItem.css.js +1 -1
- package/dist-cjs/menu/MenuItem.js +3 -0
- package/dist-cjs/menu/MenuItem.js.map +1 -1
- package/dist-cjs/menu/MenuPanel.js +3 -0
- package/dist-cjs/menu/MenuPanel.js.map +1 -1
- package/dist-cjs/menu/MenuPanelContext.js +3 -0
- package/dist-cjs/menu/MenuPanelContext.js.map +1 -1
- package/dist-cjs/menu/MenuTrigger.js +3 -0
- package/dist-cjs/menu/MenuTrigger.js.map +1 -1
- package/dist-cjs/menu/MenuTriggerContext.js +3 -0
- package/dist-cjs/menu/MenuTriggerContext.js.map +1 -1
- package/dist-cjs/multiline-input/MultilineInput.css.js +1 -1
- package/dist-cjs/multiline-input/MultilineInput.js +4 -1
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +3 -0
- 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 +7 -2
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.css.js +1 -1
- package/dist-cjs/option/OptionGroup.js +3 -0
- package/dist-cjs/option/OptionGroup.js.map +1 -1
- package/dist-cjs/option/OptionList.js +3 -0
- package/dist-cjs/option/OptionList.js.map +1 -1
- package/dist-cjs/option/OptionListBase.js +3 -0
- package/dist-cjs/option/OptionListBase.js.map +1 -1
- package/dist-cjs/overlay/Overlay.js +3 -0
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js +3 -0
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.js +3 -0
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js +3 -0
- package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.js +3 -0
- package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-cjs/overlay/OverlayTrigger.js +3 -0
- package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
- package/dist-cjs/pagination/CompactInput.js +3 -0
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +3 -0
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +3 -0
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +3 -0
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +3 -0
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +3 -0
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +3 -0
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +3 -0
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js +3 -0
- package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js +3 -0
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-cjs/pill/Pill.js +3 -0
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.js +3 -0
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +3 -0
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +3 -0
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.js +3 -0
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +3 -0
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +3 -0
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +3 -0
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +34 -10
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +3 -0
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.css.js +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js +3 -0
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +3 -0
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +3 -0
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +3 -0
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +3 -0
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +3 -0
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +3 -0
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.js +4 -1
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/tag/Tag.css.js +6 -0
- package/dist-cjs/tag/Tag.css.js.map +1 -0
- package/dist-cjs/tag/Tag.js +137 -0
- package/dist-cjs/tag/Tag.js.map +1 -0
- package/dist-cjs/text/Display.js +10 -0
- package/dist-cjs/text/Display.js.map +1 -1
- package/dist-cjs/text/Text.css.js +1 -1
- package/dist-cjs/text/Text.js +3 -0
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/theme/ActionFont.js +8 -0
- package/dist-cjs/theme/ActionFont.js.map +1 -0
- package/dist-cjs/toast/Toast.css.js +1 -1
- package/dist-cjs/toast/Toast.js +9 -4
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +3 -0
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.css.js +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +3 -0
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +3 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +3 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js +3 -0
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +3 -0
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +3 -0
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +3 -0
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/useValueEffect.js +3 -0
- package/dist-cjs/utils/useValueEffect.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +3 -0
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +3 -0
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +3 -0
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +3 -0
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +3 -0
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +3 -0
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +3 -0
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +3 -0
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +3 -0
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +3 -0
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +3 -0
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +3 -0
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +3 -0
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +3 -0
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +3 -0
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/breakpoints/BreakpointProvider.js +3 -0
- package/dist-es/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-es/button/Button.css.js +1 -1
- package/dist-es/button/Button.js +3 -0
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +3 -0
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/checkbox/Checkbox.js +3 -0
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +3 -0
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +3 -0
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +3 -0
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.js +28 -20
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +5 -2
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dialog/Dialog.js +3 -0
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +3 -0
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +3 -0
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +3 -0
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.js +3 -0
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/divider/Divider.css.js +4 -0
- package/dist-es/divider/Divider.css.js.map +1 -0
- package/dist-es/divider/Divider.js +139 -0
- package/dist-es/divider/Divider.js.map +1 -0
- package/dist-es/drawer/Drawer.js +3 -0
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +3 -0
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.css.js +1 -1
- package/dist-es/dropdown/Dropdown.js +24 -18
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.js +3 -0
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +3 -0
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +3 -0
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +3 -0
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +3 -0
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +3 -0
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +3 -0
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +3 -0
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +3 -0
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +3 -0
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +5 -1
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.css.js +1 -1
- package/dist-es/input/Input.js +7 -2
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/interactable-card/InteractableCard.js +3 -0
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroup.js +3 -0
- package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js +3 -0
- package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-es/link/Link.js +3 -0
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.js +3 -0
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-box/ListBox.css.js +4 -0
- package/dist-es/list-box/ListBox.css.js.map +1 -0
- package/dist-es/list-box/ListBox.js +291 -0
- package/dist-es/list-box/ListBox.js.map +1 -0
- package/dist-es/list-control/ListControlContext.js +5 -1
- package/dist-es/list-control/ListControlContext.js.map +1 -1
- package/dist-es/list-control/ListControlState.js +79 -12
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/menu/MenuBase.js +3 -0
- package/dist-es/menu/MenuBase.js.map +1 -1
- package/dist-es/menu/MenuContext.js +3 -0
- package/dist-es/menu/MenuContext.js.map +1 -1
- package/dist-es/menu/MenuGroup.css.js +1 -1
- package/dist-es/menu/MenuGroup.js +3 -0
- package/dist-es/menu/MenuGroup.js.map +1 -1
- package/dist-es/menu/MenuItem.css.js +1 -1
- package/dist-es/menu/MenuItem.js +3 -0
- package/dist-es/menu/MenuItem.js.map +1 -1
- package/dist-es/menu/MenuPanel.js +3 -0
- package/dist-es/menu/MenuPanel.js.map +1 -1
- package/dist-es/menu/MenuPanelContext.js +3 -0
- package/dist-es/menu/MenuPanelContext.js.map +1 -1
- package/dist-es/menu/MenuTrigger.js +3 -0
- package/dist-es/menu/MenuTrigger.js.map +1 -1
- package/dist-es/menu/MenuTriggerContext.js +3 -0
- package/dist-es/menu/MenuTriggerContext.js.map +1 -1
- package/dist-es/multiline-input/MultilineInput.css.js +1 -1
- package/dist-es/multiline-input/MultilineInput.js +4 -1
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +3 -0
- 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 +7 -2
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.css.js +1 -1
- package/dist-es/option/OptionGroup.js +3 -0
- package/dist-es/option/OptionGroup.js.map +1 -1
- package/dist-es/option/OptionList.js +3 -0
- package/dist-es/option/OptionList.js.map +1 -1
- package/dist-es/option/OptionListBase.js +3 -0
- package/dist-es/option/OptionListBase.js.map +1 -1
- package/dist-es/overlay/Overlay.js +3 -0
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js +3 -0
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.js +3 -0
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js +3 -0
- package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-es/overlay/OverlayPanelContent.js +3 -0
- package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-es/overlay/OverlayTrigger.js +3 -0
- package/dist-es/overlay/OverlayTrigger.js.map +1 -1
- package/dist-es/pagination/CompactInput.js +3 -0
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +3 -0
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +3 -0
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +3 -0
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +3 -0
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +3 -0
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +3 -0
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +3 -0
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js +3 -0
- package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js +3 -0
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-es/pill/Pill.js +3 -0
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.js +3 -0
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +3 -0
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +3 -0
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.js +3 -0
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +3 -0
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +3 -0
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +3 -0
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +34 -10
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +3 -0
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js +3 -0
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-es/spinner/Spinner.js +3 -0
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +3 -0
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +3 -0
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js +3 -0
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +3 -0
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +3 -0
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.js +4 -1
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/tag/Tag.css.js +4 -0
- package/dist-es/tag/Tag.css.js.map +1 -0
- package/dist-es/tag/Tag.js +133 -0
- package/dist-es/tag/Tag.js.map +1 -0
- package/dist-es/text/Display.js +10 -1
- package/dist-es/text/Display.js.map +1 -1
- package/dist-es/text/Text.css.js +1 -1
- package/dist-es/text/Text.js +3 -0
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/theme/ActionFont.js +4 -0
- package/dist-es/theme/ActionFont.js.map +1 -0
- package/dist-es/toast/Toast.css.js +1 -1
- package/dist-es/toast/Toast.js +9 -4
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +3 -0
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.css.js +1 -1
- package/dist-es/toggle-button/ToggleButton.js +3 -0
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +3 -0
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +3 -0
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js +3 -0
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +3 -0
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +3 -0
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +3 -0
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/useValueEffect.js +3 -0
- package/dist-es/utils/useValueEffect.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js +3 -0
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/combo-box/ComboBox.d.ts +8 -0
- package/dist-types/combo-box/useComboBox.d.ts +33 -2
- package/dist-types/divider/Divider.d.ts +12 -0
- package/dist-types/divider/index.d.ts +1 -0
- package/dist-types/index.d.ts +4 -1
- package/dist-types/input/Input.d.ts +3 -0
- package/dist-types/list-box/ListBox.d.ts +40 -0
- package/dist-types/list-box/index.d.ts +1 -0
- package/dist-types/list-control/ListControlContext.d.ts +1 -0
- package/dist-types/list-control/ListControlState.d.ts +33 -2
- package/dist-types/salt-provider/SaltProvider.d.ts +3 -1
- package/dist-types/tag/Tag.d.ts +16 -0
- package/dist-types/tag/index.d.ts +1 -0
- package/dist-types/text/Display.d.ts +1 -0
- package/dist-types/text/Text.d.ts +1 -1
- package/dist-types/theme/ActionFont.d.ts +2 -0
- package/dist-types/theme/index.d.ts +1 -0
- package/dist-types/toast/Toast.d.ts +6 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport { FloatingArrow } from \"@floating-ui/react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Overlay Panel\n */\n children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n function OverlayPanel(props, ref) {\n const {\n className,\n [\"aria-labelledby\"]: ariaLabelledby,\n children,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel\",\n css: overlayPanelCss,\n window: targetWindow,\n });\n\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const {\n openState,\n floatingStyles,\n context,\n getFloatingProps,\n floating,\n arrowProps,\n } = useOverlayContext();\n\n const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n const { top, left, width, height, position } = floatingStyles;\n\n return (\n <FloatingComponent\n open={openState}\n className={clsx(withBaseName(), className)}\n aria-modal=\"true\"\n {...getFloatingProps()}\n ref={handleRef}\n width={width}\n height={height}\n top={top}\n left={left}\n position={position}\n focusManagerProps={{\n context: context,\n }}\n aria-labelledby={ariaLabelledby}\n >\n <div {...rest}> {children} </div>\n <FloatingArrow\n {...arrowProps}\n strokeWidth={1}\n fill=\"var(--overlay-background)\"\n stroke=\"var(--overlay-borderColor)\"\n height={5}\n width={10}\n />\n </FloatingComponent>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","OverlayPanel","useWindow","useComponentCssInjection","overlayPanelCss","useFloatingComponent","useOverlayContext","useForkRef","jsxs","clsx","jsx","FloatingArrow"],"mappings":"
|
|
1
|
+
{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport { FloatingArrow } from \"@floating-ui/react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Overlay Panel\n */\n children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n function OverlayPanel(props, ref) {\n const {\n className,\n [\"aria-labelledby\"]: ariaLabelledby,\n children,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel\",\n css: overlayPanelCss,\n window: targetWindow,\n });\n\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const {\n openState,\n floatingStyles,\n context,\n getFloatingProps,\n floating,\n arrowProps,\n } = useOverlayContext();\n\n const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n const { top, left, width, height, position } = floatingStyles;\n\n return (\n <FloatingComponent\n open={openState}\n className={clsx(withBaseName(), className)}\n aria-modal=\"true\"\n {...getFloatingProps()}\n ref={handleRef}\n width={width}\n height={height}\n top={top}\n left={left}\n position={position}\n focusManagerProps={{\n context: context,\n }}\n aria-labelledby={ariaLabelledby}\n >\n <div {...rest}> {children} </div>\n <FloatingArrow\n {...arrowProps}\n strokeWidth={1}\n fill=\"var(--overlay-background)\"\n stroke=\"var(--overlay-borderColor)\"\n height={5}\n width={10}\n />\n </FloatingComponent>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","OverlayPanel","useWindow","useComponentCssInjection","overlayPanelCss","useFloatingComponent","useOverlayContext","useForkRef","jsxs","clsx","jsx","FloatingArrow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAQ7C,MAAM,YAAe,GAAAC,gBAAA;AAAA,EAC1B,SAASC,aAAa,CAAA,KAAA,EAAO,GAAK,EAAA;AAChC,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MAAA,CACC,iBAAoB,GAAA,cAAA;AAAA,MACrB,QAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,oBAAA;AAAA,MACR,GAAK,EAAAC,cAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,kCAAqB,EAAA,CAAA;AAE9D,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,QACEC,gCAAkB,EAAA,CAAA;AAEtB,IAAM,MAAA,SAAA,GAAYC,qBAA2B,CAAA,QAAA,EAAU,GAAG,CAAA,CAAA;AAE1D,IAAA,MAAM,EAAE,GAAK,EAAA,IAAA,EAAM,KAAO,EAAA,MAAA,EAAQ,UAAa,GAAA,cAAA,CAAA;AAE/C,IAAA,uBACGC,eAAA,CAAA,iBAAA,EAAA;AAAA,MACC,IAAM,EAAA,SAAA;AAAA,MACN,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,YAAW,EAAA,MAAA;AAAA,MACV,GAAG,gBAAiB,EAAA;AAAA,MACrB,GAAK,EAAA,SAAA;AAAA,MACL,KAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,iBAAmB,EAAA;AAAA,QACjB,OAAA;AAAA,OACF;AAAA,MACA,iBAAiB,EAAA,cAAA;AAAA,MAEjB,QAAA,EAAA;AAAA,wBAACD,eAAA,CAAA,KAAA,EAAA;AAAA,UAAK,GAAG,IAAA;AAAA,UAAM,QAAA,EAAA;AAAA,YAAA,GAAA;AAAA,YAAE,QAAA;AAAA,YAAS,GAAA;AAAA,WAAA;AAAA,SAAC,CAAA;AAAA,wBAC1BE,cAAA,CAAAC,mBAAA,EAAA;AAAA,UACE,GAAG,UAAA;AAAA,UACJ,WAAa,EAAA,CAAA;AAAA,UACb,IAAK,EAAA,2BAAA;AAAA,UACL,MAAO,EAAA,4BAAA;AAAA,UACP,MAAQ,EAAA,CAAA;AAAA,UACR,KAAO,EAAA,EAAA;AAAA,SACT,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayPanelCloseButton.js","sources":["../src/overlay/OverlayPanelCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { Button, ButtonProps } from \"../button\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport overlayPanelCloseButtonCss from \"./OverlayPanelCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelCloseButton\");\n\nexport const OverlayPanelCloseButton = forwardRef<\n HTMLButtonElement,\n ButtonProps\n>(function OverlayPanelButton({ className, ...rest }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel-close-button\",\n css: overlayPanelCloseButtonCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)}>\n <Button\n ref={ref}\n aria-label=\"Close overlay\"\n variant=\"secondary\"\n className={withBaseName(\"button\")}\n {...rest}\n >\n <CloseIcon aria-hidden />\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overlayPanelCloseButtonCss","jsx","clsx","Button","CloseIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"OverlayPanelCloseButton.js","sources":["../src/overlay/OverlayPanelCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { Button, ButtonProps } from \"../button\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport overlayPanelCloseButtonCss from \"./OverlayPanelCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelCloseButton\");\n\nexport const OverlayPanelCloseButton = forwardRef<\n HTMLButtonElement,\n ButtonProps\n>(function OverlayPanelButton({ className, ...rest }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel-close-button\",\n css: overlayPanelCloseButtonCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)}>\n <Button\n ref={ref}\n aria-label=\"Close overlay\"\n variant=\"secondary\"\n className={withBaseName(\"button\")}\n {...rest}\n >\n <CloseIcon aria-hidden />\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overlayPanelCloseButtonCss","jsx","clsx","Button","CloseIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,6BAA6B,CAAA,CAAA;AAElD,MAAA,uBAAA,GAA0BC,iBAGrC,SAAS,kBAAA,CAAmB,EAAE,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACzD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAC5C,QAAC,kBAAAD,cAAA,CAAAE,aAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAW,EAAA,eAAA;AAAA,MACX,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,MAC/B,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAF,cAAA,CAAAG,eAAA,EAAA;AAAA,QAAU,aAAW,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,KACzB,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayPanelContent.js","sources":["../src/overlay/OverlayPanelContent.tsx"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\nimport { ReactNode, ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport overlayPanelContentCss from \"./OverlayPanelContent.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelContent\");\n\nexport interface OverlayPanelContentProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Overlay Panel Content\n */\n children?: ReactNode;\n}\n\nexport const OverlayPanelContent = forwardRef<\n HTMLDivElement,\n OverlayPanelContentProps\n>(function OverlayPanelContent(props, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel-content\",\n css: overlayPanelContentCss,\n window: targetWindow,\n });\n\n const { children, className, ...rest } = props;\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","OverlayPanelContent","useWindow","useComponentCssInjection","overlayPanelContentCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"OverlayPanelContent.js","sources":["../src/overlay/OverlayPanelContent.tsx"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\nimport { ReactNode, ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport overlayPanelContentCss from \"./OverlayPanelContent.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelContent\");\n\nexport interface OverlayPanelContentProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Overlay Panel Content\n */\n children?: ReactNode;\n}\n\nexport const OverlayPanelContent = forwardRef<\n HTMLDivElement,\n OverlayPanelContentProps\n>(function OverlayPanelContent(props, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-overlay-panel-content\",\n css: overlayPanelContentCss,\n window: targetWindow,\n });\n\n const { children, className, ...rest } = props;\n\n return (\n <div className={clsx(withBaseName(), className)} {...rest} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","OverlayPanelContent","useWindow","useComponentCssInjection","overlayPanelContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,yBAAyB,CAAA,CAAA;AAUpD,MAAM,mBAAsB,GAAAC,gBAAA,CAGjC,SAASC,oBAAAA,CAAoB,OAAO,GAAK,EAAA;AACzC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,4BAAA;AAAA,IACR,GAAK,EAAAC,qBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,IAAA;AAAA,IAAM,GAAA;AAAA,IACxD,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
|
|
|
38
38
|
require('../dialog/DialogContent.js');
|
|
39
39
|
require('../dialog/DialogContext.js');
|
|
40
40
|
require('../dialog/DialogCloseButton.js');
|
|
41
|
+
require('../divider/Divider.js');
|
|
41
42
|
require('../drawer/Drawer.js');
|
|
42
43
|
require('../drawer/DrawerCloseButton.js');
|
|
43
44
|
require('../dropdown/Dropdown.js');
|
|
@@ -65,6 +66,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
65
66
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
66
67
|
require('../link/Link.js');
|
|
67
68
|
require('../link-card/LinkCard.js');
|
|
69
|
+
require('../list-box/ListBox.js');
|
|
68
70
|
require('../list-control/ListControlContext.js');
|
|
69
71
|
require('../menu/MenuContext.js');
|
|
70
72
|
require('@floating-ui/react');
|
|
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
|
|
|
102
104
|
require('../toast/ToastContent.js');
|
|
103
105
|
require('../split-layout/SplitLayout.js');
|
|
104
106
|
require('../switch/Switch.js');
|
|
107
|
+
require('../tag/Tag.js');
|
|
105
108
|
require('../toggle-button/ToggleButton.js');
|
|
106
109
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
107
110
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayTrigger.js","sources":["../src/overlay/OverlayTrigger.tsx"],"sourcesContent":["import { cloneElement, isValidElement, ReactNode } from \"react\";\nimport { mergeProps, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\n\nexport interface OverlayTriggerProps {\n children?: ReactNode;\n}\n\nexport function OverlayTrigger(props: OverlayTriggerProps) {\n const { children } = props;\n\n const { reference, getReferenceProps } = useOverlayContext();\n\n const triggerRef = useForkRef(\n // @ts-ignore error TS2339 missing property ref\n isValidElement(children) ? children.ref : null,\n reference\n );\n\n if (!children || !isValidElement(children)) {\n return <>{children}</>;\n }\n\n return (\n <>\n {cloneElement(children, {\n ...mergeProps(getReferenceProps(), children.props),\n ref: triggerRef,\n })}\n </>\n );\n}\n"],"names":["useOverlayContext","useForkRef","isValidElement","jsx","Fragment","mergeProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"OverlayTrigger.js","sources":["../src/overlay/OverlayTrigger.tsx"],"sourcesContent":["import { cloneElement, isValidElement, ReactNode } from \"react\";\nimport { mergeProps, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\n\nexport interface OverlayTriggerProps {\n children?: ReactNode;\n}\n\nexport function OverlayTrigger(props: OverlayTriggerProps) {\n const { children } = props;\n\n const { reference, getReferenceProps } = useOverlayContext();\n\n const triggerRef = useForkRef(\n // @ts-ignore error TS2339 missing property ref\n isValidElement(children) ? children.ref : null,\n reference\n );\n\n if (!children || !isValidElement(children)) {\n return <>{children}</>;\n }\n\n return (\n <>\n {cloneElement(children, {\n ...mergeProps(getReferenceProps(), children.props),\n ref: triggerRef,\n })}\n </>\n );\n}\n"],"names":["useOverlayContext","useForkRef","isValidElement","jsx","Fragment","mergeProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,SAAS,eAAe,KAA4B,EAAA;AACzD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AAErB,EAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIA,gCAAkB,EAAA,CAAA;AAE3D,EAAA,MAAM,UAAa,GAAAC,qBAAA;AAAA,IAEjBC,oBAAe,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,GAAM,GAAA,IAAA;AAAA,IAC1C,SAAA;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACA,oBAAA,CAAe,QAAQ,CAAG,EAAA;AAC1C,IAAO,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,MAAG,QAAA;AAAA,KAAS,CAAA,CAAA;AAAA,GACrB;AAEA,EACE,uBAAAD,cAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,6BAAa,QAAU,EAAA;AAAA,MACtB,GAAGC,qBAAA,CAAW,iBAAkB,EAAA,EAAG,SAAS,KAAK,CAAA;AAAA,MACjD,GAAK,EAAA,UAAA;AAAA,KACN,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -38,6 +38,7 @@ require('../dialog/DialogActions.js');
|
|
|
38
38
|
require('../dialog/DialogContent.js');
|
|
39
39
|
require('../dialog/DialogContext.js');
|
|
40
40
|
require('../dialog/DialogCloseButton.js');
|
|
41
|
+
require('../divider/Divider.js');
|
|
41
42
|
require('../drawer/Drawer.js');
|
|
42
43
|
require('../drawer/DrawerCloseButton.js');
|
|
43
44
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompactInput.js","sources":["../src/pagination/CompactInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n KeyboardEventHandler,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport { Input, InputProps } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactInputCss from \"./CompactInput.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactInput\");\n\nexport const CompactInput = forwardRef<\n HTMLInputElement,\n Pick<InputProps, \"inputRef\" | \"variant\">\n>(function CompactInput(props, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-compact-input\",\n css: compactInputCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const [inputValue, setInputValue] = useState(`${page}`);\n\n useEffect(() => {\n setInputValue(`${page}`);\n }, [page]);\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n setInputValue(event.target.value);\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n const pageValue = Number(inputValue);\n if (!isNaN(pageValue) && pageValue <= count && pageValue > 0) {\n onPageChange(event, pageValue);\n } else {\n setInputValue(`${page}`);\n }\n }\n };\n\n const handleBlur = () => {\n setInputValue(`${page}`);\n };\n\n return (\n <Input\n className={clsx(withBaseName(), {\n [withBaseName(\"defaultSize\")]: count < 100,\n })}\n inputProps={{\n \"aria-label\": `Go to page, ${count} total`,\n style: { width: `${`${count}`.length}ch` },\n }}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n value={inputValue}\n textAlign={\"center\"}\n ref={ref}\n {...props}\n />\n );\n});\n"],"names":["makePrefixer","forwardRef","CompactInput","useWindow","useComponentCssInjection","compactInputCss","usePaginationContext","useState","useEffect","jsx","Input","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CompactInput.js","sources":["../src/pagination/CompactInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n KeyboardEventHandler,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport { Input, InputProps } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactInputCss from \"./CompactInput.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactInput\");\n\nexport const CompactInput = forwardRef<\n HTMLInputElement,\n Pick<InputProps, \"inputRef\" | \"variant\">\n>(function CompactInput(props, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-compact-input\",\n css: compactInputCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const [inputValue, setInputValue] = useState(`${page}`);\n\n useEffect(() => {\n setInputValue(`${page}`);\n }, [page]);\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n setInputValue(event.target.value);\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n const pageValue = Number(inputValue);\n if (!isNaN(pageValue) && pageValue <= count && pageValue > 0) {\n onPageChange(event, pageValue);\n } else {\n setInputValue(`${page}`);\n }\n }\n };\n\n const handleBlur = () => {\n setInputValue(`${page}`);\n };\n\n return (\n <Input\n className={clsx(withBaseName(), {\n [withBaseName(\"defaultSize\")]: count < 100,\n })}\n inputProps={{\n \"aria-label\": `Go to page, ${count} total`,\n style: { width: `${`${count}`.length}ch` },\n }}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n value={inputValue}\n textAlign={\"center\"}\n ref={ref}\n {...props}\n />\n );\n});\n"],"names":["makePrefixer","forwardRef","CompactInput","useWindow","useComponentCssInjection","compactInputCss","usePaginationContext","useState","useEffect","jsx","Input","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAE7C,MAAM,YAAe,GAAAC,gBAAA,CAG1B,SAASC,aAAAA,CAAa,OAAO,GAAK,EAAA;AAClC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAA,MAAM,CAAC,UAAY,EAAA,aAAa,CAAI,GAAAC,cAAA,CAAS,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAEtD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,GACzB,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AACpE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAAA,GAClC,CAAA;AAEA,EAAM,MAAA,aAAA,GAAwD,CAAC,KAAU,KAAA;AACvE,IAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,MAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA,CAAA;AACnC,MAAA,IAAI,CAAC,KAAM,CAAA,SAAS,KAAK,SAAa,IAAA,KAAA,IAAS,YAAY,CAAG,EAAA;AAC5D,QAAA,YAAA,CAAa,OAAO,SAAS,CAAA,CAAA;AAAA,OACxB,MAAA;AACL,QAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,OACzB;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,GACzB,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAAC,WAAA,EAAA;AAAA,IACC,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAA,CAAa,aAAa,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,KACxC,CAAA;AAAA,IACD,UAAY,EAAA;AAAA,MACV,cAAc,CAAe,YAAA,EAAA,KAAA,CAAA,MAAA,CAAA;AAAA,MAC7B,OAAO,EAAE,KAAA,EAAO,CAAG,EAAA,CAAA,EAAG,QAAQ,MAAW,CAAA,EAAA,CAAA,EAAA;AAAA,KAC3C;AAAA,IACA,MAAQ,EAAA,UAAA;AAAA,IACR,QAAU,EAAA,YAAA;AAAA,IACV,SAAW,EAAA,aAAA;AAAA,IACX,KAAO,EAAA,UAAA;AAAA,IACP,SAAW,EAAA,QAAA;AAAA,IACX,GAAA;AAAA,IACC,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -44,6 +44,7 @@ require('../dialog/DialogActions.js');
|
|
|
44
44
|
require('../dialog/DialogContent.js');
|
|
45
45
|
require('../dialog/DialogContext.js');
|
|
46
46
|
require('../dialog/DialogCloseButton.js');
|
|
47
|
+
require('../divider/Divider.js');
|
|
47
48
|
require('../drawer/Drawer.js');
|
|
48
49
|
require('../drawer/DrawerCloseButton.js');
|
|
49
50
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompactPaginator.js","sources":["../src/pagination/CompactPaginator.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { Text } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageButton } from \"./PageButton\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactPaginatorCss from \"./CompactPaginator.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactPaginator\");\n\nexport const CompactPaginator = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(function CompactPaginator({ children, className, ...restProps }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-compact-paginator\",\n css: compactPaginatorCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.max(1, page - 1));\n };\n\n const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.min(page + 1, count));\n };\n\n const isOnFirstPage = page === 1;\n const isOnLastPage = page === count;\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n <Button\n variant=\"secondary\"\n aria-label=\"Previous Page\"\n onClick={onPreviousPage}\n disabled={isOnFirstPage}\n className={withBaseName(\"arrowButton\")}\n >\n <ChevronLeftIcon aria-hidden />\n </Button>\n {children ? children : <PageButton page={page} disabled />}\n <Text as=\"span\" variant=\"secondary\">\n of\n </Text>\n <PageButton page={count} disabled={isOnLastPage} />\n <Button\n variant=\"secondary\"\n aria-label=\"Next Page\"\n onClick={onNextPage}\n disabled={isOnLastPage}\n className={withBaseName(\"arrowButton\")}\n >\n <ChevronRightIcon aria-hidden />\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","CompactPaginator","useWindow","useComponentCssInjection","compactPaginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageButton","Text","ChevronRightIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CompactPaginator.js","sources":["../src/pagination/CompactPaginator.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { Text } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageButton } from \"./PageButton\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactPaginatorCss from \"./CompactPaginator.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactPaginator\");\n\nexport const CompactPaginator = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(function CompactPaginator({ children, className, ...restProps }, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-compact-paginator\",\n css: compactPaginatorCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.max(1, page - 1));\n };\n\n const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.min(page + 1, count));\n };\n\n const isOnFirstPage = page === 1;\n const isOnLastPage = page === count;\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n <Button\n variant=\"secondary\"\n aria-label=\"Previous Page\"\n onClick={onPreviousPage}\n disabled={isOnFirstPage}\n className={withBaseName(\"arrowButton\")}\n >\n <ChevronLeftIcon aria-hidden />\n </Button>\n {children ? children : <PageButton page={page} disabled />}\n <Text as=\"span\" variant=\"secondary\">\n of\n </Text>\n <PageButton page={count} disabled={isOnLastPage} />\n <Button\n variant=\"secondary\"\n aria-label=\"Next Page\"\n onClick={onNextPage}\n disabled={isOnLastPage}\n className={withBaseName(\"arrowButton\")}\n >\n <ChevronRightIcon aria-hidden />\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","CompactPaginator","useWindow","useComponentCssInjection","compactPaginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageButton","Text","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,sBAAsB,CAAA,CAAA;AAE3C,MAAA,gBAAA,GAAmBC,iBAG9B,SAASC,iBAAAA,CAAiB,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EAAG,GAAK,EAAA;AACtE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,GAC3C,CAAA;AAEA,EAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,EAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC9D,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,eAAA;AAAA,QACX,OAAS,EAAA,cAAA;AAAA,QACT,QAAU,EAAA,aAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,UAAgB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAC/B,CAAA;AAAA,MACC,QAAA,GAAW,2BAAYF,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAA;AAAA,QAAY,QAAQ,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,sBACvDH,cAAA,CAAAI,SAAA,EAAA;AAAA,QAAK,EAAG,EAAA,MAAA;AAAA,QAAO,OAAQ,EAAA,WAAA;AAAA,QAAY,QAAA,EAAA,IAAA;AAAA,OAEpC,CAAA;AAAA,sBACCJ,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAM,EAAA,KAAA;AAAA,QAAO,QAAU,EAAA,YAAA;AAAA,OAAc,CAAA;AAAA,sBAChDH,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,WAAA;AAAA,QACX,OAAS,EAAA,UAAA;AAAA,QACT,QAAU,EAAA,YAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAK,sBAAA,EAAA;AAAA,UAAiB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAChC,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -46,6 +46,7 @@ require('../dialog/DialogActions.js');
|
|
|
46
46
|
require('../dialog/DialogContent.js');
|
|
47
47
|
require('../dialog/DialogContext.js');
|
|
48
48
|
require('../dialog/DialogCloseButton.js');
|
|
49
|
+
require('../divider/Divider.js');
|
|
49
50
|
require('../drawer/Drawer.js');
|
|
50
51
|
require('../drawer/DrawerCloseButton.js');
|
|
51
52
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GoToInput.js","sources":["../src/pagination/GoToInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n forwardRef,\n HTMLAttributes,\n KeyboardEventHandler,\n Ref,\n useState,\n} from \"react\";\nimport { FormField, FormFieldLabel } from \"../form-field\";\nimport { Input } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport goToInputCss from \"./GoToInput.css\";\n\nconst withBaseName = makePrefixer(\"saltGoToInput\");\nexport interface GoToInputProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * Input label.\n */\n label?: string;\n /**\n * Optional ref for the input component\n */\n inputRef?: Ref<HTMLInputElement>;\n /**\n * Change input variant.\n */\n inputVariant?: \"primary\" | \"secondary\";\n}\n\nexport const GoToInput = forwardRef<HTMLDivElement, GoToInputProps>(\n function GoToInput(\n {\n className,\n inputRef,\n inputVariant = \"primary\",\n label = \"Go to\",\n ...restProps\n },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-go-to-input\",\n css: goToInputCss,\n window: targetWindow,\n });\n\n const { count, onPageChange } = usePaginationContext();\n const [inputValue, setInputValue] = useState(\"\");\n\n const onChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n setInputValue(event.target.value);\n };\n\n const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n const pageValue = Number(inputValue);\n if (\n !inputValue.startsWith(\"0\") &&\n !isNaN(pageValue) &&\n pageValue > 0 &&\n pageValue <= count\n ) {\n onPageChange(event, pageValue);\n }\n setInputValue(\"\");\n }\n };\n\n const onBlur = () => {\n setInputValue(\"\");\n };\n\n const widthCh = `${`${count}`.length}ch`;\n\n return (\n <FormField\n labelPlacement=\"left\"\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...restProps}\n >\n <FormFieldLabel>{label}</FormFieldLabel>\n <Input\n className={clsx(withBaseName(\"input\"), {\n [withBaseName(\"inputDefaultSize\")]: count < 100,\n })}\n ref={inputRef}\n inputProps={{\n style: { width: widthCh },\n }}\n onBlur={onBlur}\n onChange={onChange}\n onKeyDown={onKeyDown}\n value={inputValue}\n textAlign={\"center\"}\n variant={inputVariant}\n />\n </FormField>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","GoToInput","useWindow","useComponentCssInjection","goToInputCss","usePaginationContext","useState","jsxs","FormField","clsx","jsx","FormFieldLabel","Input"],"mappings":"
|
|
1
|
+
{"version":3,"file":"GoToInput.js","sources":["../src/pagination/GoToInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n forwardRef,\n HTMLAttributes,\n KeyboardEventHandler,\n Ref,\n useState,\n} from \"react\";\nimport { FormField, FormFieldLabel } from \"../form-field\";\nimport { Input } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport goToInputCss from \"./GoToInput.css\";\n\nconst withBaseName = makePrefixer(\"saltGoToInput\");\nexport interface GoToInputProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * Input label.\n */\n label?: string;\n /**\n * Optional ref for the input component\n */\n inputRef?: Ref<HTMLInputElement>;\n /**\n * Change input variant.\n */\n inputVariant?: \"primary\" | \"secondary\";\n}\n\nexport const GoToInput = forwardRef<HTMLDivElement, GoToInputProps>(\n function GoToInput(\n {\n className,\n inputRef,\n inputVariant = \"primary\",\n label = \"Go to\",\n ...restProps\n },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-go-to-input\",\n css: goToInputCss,\n window: targetWindow,\n });\n\n const { count, onPageChange } = usePaginationContext();\n const [inputValue, setInputValue] = useState(\"\");\n\n const onChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n setInputValue(event.target.value);\n };\n\n const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n const pageValue = Number(inputValue);\n if (\n !inputValue.startsWith(\"0\") &&\n !isNaN(pageValue) &&\n pageValue > 0 &&\n pageValue <= count\n ) {\n onPageChange(event, pageValue);\n }\n setInputValue(\"\");\n }\n };\n\n const onBlur = () => {\n setInputValue(\"\");\n };\n\n const widthCh = `${`${count}`.length}ch`;\n\n return (\n <FormField\n labelPlacement=\"left\"\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...restProps}\n >\n <FormFieldLabel>{label}</FormFieldLabel>\n <Input\n className={clsx(withBaseName(\"input\"), {\n [withBaseName(\"inputDefaultSize\")]: count < 100,\n })}\n ref={inputRef}\n inputProps={{\n style: { width: widthCh },\n }}\n onBlur={onBlur}\n onChange={onChange}\n onKeyDown={onKeyDown}\n value={inputValue}\n textAlign={\"center\"}\n variant={inputVariant}\n />\n </FormField>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","GoToInput","useWindow","useComponentCssInjection","goToInputCss","usePaginationContext","useState","jsxs","FormField","clsx","jsx","FormFieldLabel","Input"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAgB1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAe,GAAA,SAAA;AAAA,IACf,KAAQ,GAAA,OAAA;AAAA,IACL,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AACrD,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIC,eAAS,EAAE,CAAA,CAAA;AAE/C,IAAM,MAAA,QAAA,GAAiD,CAAC,KAAU,KAAA;AAChE,MAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAAA,KAClC,CAAA;AAEA,IAAM,MAAA,SAAA,GAAoD,CAAC,KAAU,KAAA;AACnE,MAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,QAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA,CAAA;AACnC,QAAA,IACE,CAAC,UAAA,CAAW,UAAW,CAAA,GAAG,CAC1B,IAAA,CAAC,KAAM,CAAA,SAAS,CAChB,IAAA,SAAA,GAAY,CACZ,IAAA,SAAA,IAAa,KACb,EAAA;AACA,UAAA,YAAA,CAAa,OAAO,SAAS,CAAA,CAAA;AAAA,SAC/B;AACA,QAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,OAClB;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,SAAS,MAAM;AACnB,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,CAAG,EAAA,CAAA,EAAG,KAAQ,CAAA,CAAA,CAAA,MAAA,CAAA,EAAA,CAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACC,cAAe,EAAA,MAAA;AAAA,MACf,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,6BAAA,EAAA;AAAA,UAAgB,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,wBACtBD,cAAA,CAAAE,WAAA,EAAA;AAAA,UACC,SAAW,EAAAH,SAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,YACrC,CAAC,YAAA,CAAa,kBAAkB,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,WAC7C,CAAA;AAAA,UACD,GAAK,EAAA,QAAA;AAAA,UACL,UAAY,EAAA;AAAA,YACV,KAAA,EAAO,EAAE,KAAA,EAAO,OAAQ,EAAA;AAAA,WAC1B;AAAA,UACA,MAAA;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,KAAO,EAAA,UAAA;AAAA,UACP,SAAW,EAAA,QAAA;AAAA,UACX,OAAS,EAAA,YAAA;AAAA,SACX,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
|
|
|
101
103
|
require('../toast/ToastContent.js');
|
|
102
104
|
require('../split-layout/SplitLayout.js');
|
|
103
105
|
require('../switch/Switch.js');
|
|
106
|
+
require('../tag/Tag.js');
|
|
104
107
|
require('../toggle-button/ToggleButton.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
106
109
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageButton.js","sources":["../src/pagination/PageButton.tsx"],"sourcesContent":["import { MouseEventHandler, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageButtonCss from \"./PageButton.css\";\n\nconst withBaseName = makePrefixer(\"saltPageButton\");\n\nexport interface PageButtonProps {\n page: number;\n selected?: boolean;\n disabled?: boolean;\n}\nexport const PageButton = forwardRef<HTMLButtonElement, PageButtonProps>(\n function PageButton({ page, selected, disabled }: PageButtonProps, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-page-button\",\n css: pageButtonCss,\n window: targetWindow,\n });\n\n const { count, onPageChange } = usePaginationContext();\n\n const onClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, page);\n };\n\n return (\n <Button\n aria-label={`Page ${page} of ${count}`}\n aria-current={selected ? \"page\" : undefined}\n variant=\"secondary\"\n className={clsx(withBaseName(), {\n [withBaseName(\"selected\")]: selected,\n [withBaseName(\"fixed\")]: page < 100,\n })}\n onClick={onClick}\n disabled={disabled}\n ref={ref}\n >\n {page}\n </Button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","PageButton","useWindow","useComponentCssInjection","pageButtonCss","usePaginationContext","jsx","Button","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PageButton.js","sources":["../src/pagination/PageButton.tsx"],"sourcesContent":["import { MouseEventHandler, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageButtonCss from \"./PageButton.css\";\n\nconst withBaseName = makePrefixer(\"saltPageButton\");\n\nexport interface PageButtonProps {\n page: number;\n selected?: boolean;\n disabled?: boolean;\n}\nexport const PageButton = forwardRef<HTMLButtonElement, PageButtonProps>(\n function PageButton({ page, selected, disabled }: PageButtonProps, ref) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-page-button\",\n css: pageButtonCss,\n window: targetWindow,\n });\n\n const { count, onPageChange } = usePaginationContext();\n\n const onClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, page);\n };\n\n return (\n <Button\n aria-label={`Page ${page} of ${count}`}\n aria-current={selected ? \"page\" : undefined}\n variant=\"secondary\"\n className={clsx(withBaseName(), {\n [withBaseName(\"selected\")]: selected,\n [withBaseName(\"fixed\")]: page < 100,\n })}\n onClick={onClick}\n disabled={disabled}\n ref={ref}\n >\n {page}\n </Button>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","PageButton","useWindow","useComponentCssInjection","pageButtonCss","usePaginationContext","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAO3C,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WAAW,CAAA,EAAE,MAAM,QAAU,EAAA,QAAA,IAA6B,GAAK,EAAA;AACtE,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAErD,IAAM,MAAA,OAAA,GAAgD,CAAC,KAAU,KAAA;AAC/D,MAAA,YAAA,CAAa,OAAO,IAAI,CAAA,CAAA;AAAA,KAC1B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,MACC,YAAA,EAAY,QAAQ,IAAW,CAAA,IAAA,EAAA,KAAA,CAAA,CAAA;AAAA,MAC/B,cAAA,EAAc,WAAW,MAAS,GAAA,KAAA,CAAA;AAAA,MAClC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,QAC9B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,OAAO,CAAA,GAAI,IAAO,GAAA,GAAA;AAAA,OACjC,CAAA;AAAA,MACD,OAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MAEC,QAAA,EAAA,IAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -101,6 +103,7 @@ require('../toast/Toast.js');
|
|
|
101
103
|
require('../toast/ToastContent.js');
|
|
102
104
|
require('../split-layout/SplitLayout.js');
|
|
103
105
|
require('../switch/Switch.js');
|
|
106
|
+
require('../tag/Tag.js');
|
|
104
107
|
require('../toggle-button/ToggleButton.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
106
109
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageRanges.js","sources":["../src/pagination/PageRanges.tsx"],"sourcesContent":["import { ReactElement, useCallback } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { PageButton } from \"./PageButton\";\nimport { PageRange, usePagination } from \"./usePagination\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageRangesCss from \"./PageRanges.css\";\n\nconst withBaseName = makePrefixer(\"saltPageRanges\");\n\nexport interface PageRangesProps {\n boundaryCount?: number;\n siblingCount?: number;\n}\n\nconst Ellipsis = () => {\n return <div className={withBaseName(\"ellipsis\")}>{`\\u2026`}</div>;\n};\n\nconst mapRange = (range: PageRange, fn: (i: number) => ReactElement) => {\n const result: ReactElement[] = [];\n for (let i = range[0]; i <= range[1]; ++i) {\n result.push(fn(i));\n }\n return result;\n};\n\nexport function PageRanges({\n siblingCount = 2,\n boundaryCount = 1,\n}: PageRangesProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-page-ranges\",\n css: pageRangesCss,\n window: targetWindow,\n });\n\n const { count, page } = usePaginationContext();\n\n const renderPages = useCallback(\n (range: PageRange) =>\n mapRange(range, (i) => (\n <PageButton key={i} page={i} selected={page === i} />\n )),\n [page]\n );\n\n const [leftPages, middlePages, rightPages] = usePagination(\n page,\n count,\n Math.max(1, boundaryCount),\n siblingCount\n );\n\n return (\n <>\n {leftPages && (\n <>\n {renderPages(leftPages)}\n <Ellipsis />\n </>\n )}\n {middlePages && renderPages(middlePages)}\n {rightPages && (\n <>\n <Ellipsis />\n {renderPages(rightPages)}\n </>\n )}\n </>\n );\n}\n"],"names":["makePrefixer","jsx","useWindow","useComponentCssInjection","pageRangesCss","usePaginationContext","useCallback","PageButton","usePagination","jsxs","Fragment"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PageRanges.js","sources":["../src/pagination/PageRanges.tsx"],"sourcesContent":["import { ReactElement, useCallback } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { PageButton } from \"./PageButton\";\nimport { PageRange, usePagination } from \"./usePagination\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageRangesCss from \"./PageRanges.css\";\n\nconst withBaseName = makePrefixer(\"saltPageRanges\");\n\nexport interface PageRangesProps {\n boundaryCount?: number;\n siblingCount?: number;\n}\n\nconst Ellipsis = () => {\n return <div className={withBaseName(\"ellipsis\")}>{`\\u2026`}</div>;\n};\n\nconst mapRange = (range: PageRange, fn: (i: number) => ReactElement) => {\n const result: ReactElement[] = [];\n for (let i = range[0]; i <= range[1]; ++i) {\n result.push(fn(i));\n }\n return result;\n};\n\nexport function PageRanges({\n siblingCount = 2,\n boundaryCount = 1,\n}: PageRangesProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-page-ranges\",\n css: pageRangesCss,\n window: targetWindow,\n });\n\n const { count, page } = usePaginationContext();\n\n const renderPages = useCallback(\n (range: PageRange) =>\n mapRange(range, (i) => (\n <PageButton key={i} page={i} selected={page === i} />\n )),\n [page]\n );\n\n const [leftPages, middlePages, rightPages] = usePagination(\n page,\n count,\n Math.max(1, boundaryCount),\n siblingCount\n );\n\n return (\n <>\n {leftPages && (\n <>\n {renderPages(leftPages)}\n <Ellipsis />\n </>\n )}\n {middlePages && renderPages(middlePages)}\n {rightPages && (\n <>\n <Ellipsis />\n {renderPages(rightPages)}\n </>\n )}\n </>\n );\n}\n"],"names":["makePrefixer","jsx","useWindow","useComponentCssInjection","pageRangesCss","usePaginationContext","useCallback","PageButton","usePagination","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAOlD,MAAM,WAAW,MAAM;AACrB,EAAA,uBAAQC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,IAAI,QAAA,EAAA,CAAA,MAAA,CAAA;AAAA,GAAS,CAAA,CAAA;AAC7D,CAAA,CAAA;AAEA,MAAM,QAAA,GAAW,CAAC,KAAA,EAAkB,EAAoC,KAAA;AACtE,EAAA,MAAM,SAAyB,EAAC,CAAA;AAChC,EAAA,KAAA,IAAS,IAAI,KAAM,CAAA,CAAA,CAAA,EAAI,KAAK,KAAM,CAAA,CAAA,CAAA,EAAI,EAAE,CAAG,EAAA;AACzC,IAAO,MAAA,CAAA,IAAA,CAAK,EAAG,CAAA,CAAC,CAAC,CAAA,CAAA;AAAA,GACnB;AACA,EAAO,OAAA,MAAA,CAAA;AACT,CAAA,CAAA;AAEO,SAAS,UAAW,CAAA;AAAA,EACzB,YAAe,GAAA,CAAA;AAAA,EACf,aAAgB,GAAA,CAAA;AAClB,CAAoB,EAAA;AAClB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAK,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAE7C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,KACC,KAAA,QAAA,CAAS,KAAO,EAAA,CAAC,sBACdL,cAAA,CAAAM,qBAAA,EAAA;AAAA,MAAmB,IAAM,EAAA,CAAA;AAAA,MAAG,UAAU,IAAS,KAAA,CAAA;AAAA,KAAA,EAA/B,CAAkC,CACpD,CAAA;AAAA,IACH,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,WAAa,EAAA,UAAU,CAAI,GAAAC,2BAAA;AAAA,IAC3C,IAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA,CAAK,GAAI,CAAA,CAAA,EAAG,aAAa,CAAA;AAAA,IACzB,YAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,QAAA,EAAA;AAAA,MACC,SAAA,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,WAAA,CAAY,SAAS,CAAA;AAAA,yCACrB,QAAS,EAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OACZ,CAAA;AAAA,MAED,WAAA,IAAe,YAAY,WAAW,CAAA;AAAA,MACtC,UACC,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACE,QAAA,EAAA;AAAA,0BAAAT,cAAA,CAAC,QAAS,EAAA,EAAA,CAAA;AAAA,UACT,YAAY,UAAU,CAAA;AAAA,SAAA;AAAA,OACzB,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -39,6 +39,7 @@ require('../dialog/DialogActions.js');
|
|
|
39
39
|
require('../dialog/DialogContent.js');
|
|
40
40
|
require('../dialog/DialogContext.js');
|
|
41
41
|
require('../dialog/DialogCloseButton.js');
|
|
42
|
+
require('../divider/Divider.js');
|
|
42
43
|
require('../drawer/Drawer.js');
|
|
43
44
|
require('../drawer/DrawerCloseButton.js');
|
|
44
45
|
require('../dropdown/Dropdown.js');
|
|
@@ -66,6 +67,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
66
67
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
67
68
|
require('../link/Link.js');
|
|
68
69
|
require('../link-card/LinkCard.js');
|
|
70
|
+
require('../list-box/ListBox.js');
|
|
69
71
|
require('../list-control/ListControlContext.js');
|
|
70
72
|
require('../menu/MenuContext.js');
|
|
71
73
|
require('@floating-ui/react');
|
|
@@ -102,6 +104,7 @@ require('../toast/Toast.js');
|
|
|
102
104
|
require('../toast/ToastContent.js');
|
|
103
105
|
require('../split-layout/SplitLayout.js');
|
|
104
106
|
require('../switch/Switch.js');
|
|
107
|
+
require('../tag/Tag.js');
|
|
105
108
|
require('../toggle-button/ToggleButton.js');
|
|
106
109
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
107
110
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n SyntheticEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { PaginationContext, paginationContext } from \"./PaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginationCss from \"./Pagination.css\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n /**\n * Number of pages.\n */\n count: number;\n /**\n * Current/active page.\n */\n page?: number;\n /**\n * Default current/active page.\n */\n defaultPage?: number;\n /**\n * Callback function triggered when current page changed.\n */\n onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n function Pagination(\n {\n className,\n count,\n children,\n defaultPage = 1,\n page: pageProp,\n onPageChange: onPageChangeProp,\n ...restProps\n },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-pagination\",\n css: paginationCss,\n window: targetWindow,\n });\n\n const [pageState, setPageState] = useControlled({\n controlled: pageProp,\n default: defaultPage,\n name: \"Pagination\",\n state: \"page\",\n });\n\n const onPageChange = useCallback(\n (event: SyntheticEvent, page: number) => {\n setPageState(page);\n onPageChangeProp && onPageChangeProp(event, page);\n },\n [onPageChangeProp, setPageState]\n );\n\n const contextValue: PaginationContext = useMemo(\n () => ({\n page: pageState,\n count,\n onPageChange,\n }),\n [pageState, count, onPageChange]\n );\n\n const { announce } = useAriaAnnouncer();\n const mounted = useRef<boolean>(false);\n\n useEffect(() => {\n if (mounted.current) {\n announce(`Page ${pageState}`);\n } else {\n mounted.current = true;\n }\n }, [announce, pageState]);\n\n if (count < 2) {\n return null;\n }\n\n return (\n <Provider value={contextValue}>\n <nav\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...restProps}\n >\n {children}\n </nav>\n </Provider>\n );\n }\n);\n"],"names":["makePrefixer","paginationContext","forwardRef","Pagination","useWindow","useComponentCssInjection","paginationCss","useControlled","useCallback","useMemo","useAriaAnnouncer","useRef","useEffect","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n SyntheticEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { PaginationContext, paginationContext } from \"./PaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginationCss from \"./Pagination.css\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n /**\n * Number of pages.\n */\n count: number;\n /**\n * Current/active page.\n */\n page?: number;\n /**\n * Default current/active page.\n */\n defaultPage?: number;\n /**\n * Callback function triggered when current page changed.\n */\n onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n function Pagination(\n {\n className,\n count,\n children,\n defaultPage = 1,\n page: pageProp,\n onPageChange: onPageChangeProp,\n ...restProps\n },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-pagination\",\n css: paginationCss,\n window: targetWindow,\n });\n\n const [pageState, setPageState] = useControlled({\n controlled: pageProp,\n default: defaultPage,\n name: \"Pagination\",\n state: \"page\",\n });\n\n const onPageChange = useCallback(\n (event: SyntheticEvent, page: number) => {\n setPageState(page);\n onPageChangeProp && onPageChangeProp(event, page);\n },\n [onPageChangeProp, setPageState]\n );\n\n const contextValue: PaginationContext = useMemo(\n () => ({\n page: pageState,\n count,\n onPageChange,\n }),\n [pageState, count, onPageChange]\n );\n\n const { announce } = useAriaAnnouncer();\n const mounted = useRef<boolean>(false);\n\n useEffect(() => {\n if (mounted.current) {\n announce(`Page ${pageState}`);\n } else {\n mounted.current = true;\n }\n }, [announce, pageState]);\n\n if (count < 2) {\n return null;\n }\n\n return (\n <Provider value={contextValue}>\n <nav\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...restProps}\n >\n {children}\n </nav>\n </Provider>\n );\n }\n);\n"],"names":["makePrefixer","paginationContext","forwardRef","Pagination","useWindow","useComponentCssInjection","paginationCss","useControlled","useCallback","useMemo","useAriaAnnouncer","useRef","useEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAElD,MAAM,EAAE,UAAa,GAAAC,mCAAA,CAAA;AAqBd,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,CAAA;AAAA,IACd,IAAM,EAAA,QAAA;AAAA,IACN,YAAc,EAAA,gBAAA;AAAA,IACX,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,2BAAc,CAAA;AAAA,MAC9C,UAAY,EAAA,QAAA;AAAA,MACZ,OAAS,EAAA,WAAA;AAAA,MACT,IAAM,EAAA,YAAA;AAAA,MACN,KAAO,EAAA,MAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,MACnB,CAAC,OAAuB,IAAiB,KAAA;AACvC,QAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,QAAoB,gBAAA,IAAA,gBAAA,CAAiB,OAAO,IAAI,CAAA,CAAA;AAAA,OAClD;AAAA,MACA,CAAC,kBAAkB,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAA,MAAM,YAAkC,GAAAC,aAAA;AAAA,MACtC,OAAO;AAAA,QACL,IAAM,EAAA,SAAA;AAAA,QACN,KAAA;AAAA,QACA,YAAA;AAAA,OACF,CAAA;AAAA,MACA,CAAC,SAAW,EAAA,KAAA,EAAO,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIC,iCAAiB,EAAA,CAAA;AACtC,IAAM,MAAA,OAAA,GAAUC,aAAgB,KAAK,CAAA,CAAA;AAErC,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,QAAA,QAAA,CAAS,QAAQ,SAAW,CAAA,CAAA,CAAA,CAAA;AAAA,OACvB,MAAA;AACL,QAAA,OAAA,CAAQ,OAAU,GAAA,IAAA,CAAA;AAAA,OACpB;AAAA,KACC,EAAA,CAAC,QAAU,EAAA,SAAS,CAAC,CAAA,CAAA;AAExB,IAAA,IAAI,QAAQ,CAAG,EAAA;AACb,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MAAS,KAAO,EAAA,YAAA;AAAA,MACf,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEventHandler } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Number of pages next to the arrow buttons when page range is truncated.\n */\n boundaryCount?: number;\n /**\n * Number of pages on each side of the current page when page range is truncated.\n */\n siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n function Paginator(\n { className, boundaryCount, siblingCount, ...restProps },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-paginator\",\n css: paginatorCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.max(1, page - 1));\n };\n\n const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.min(page + 1, count));\n };\n\n const isOnFirstPage = page === 1;\n const isOnLastPage = page === count;\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n <Button\n variant=\"secondary\"\n aria-label=\"Previous Page\"\n onClick={onPreviousPage}\n disabled={isOnFirstPage}\n className={withBaseName(\"arrowButton-previous\")}\n >\n <ChevronLeftIcon aria-hidden />\n </Button>\n <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n <Button\n variant=\"secondary\"\n aria-label=\"Next Page\"\n onClick={onNextPage}\n disabled={isOnLastPage}\n className={withBaseName(\"arrowButton-next\")}\n >\n <ChevronRightIcon aria-hidden />\n </Button>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEventHandler } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Number of pages next to the arrow buttons when page range is truncated.\n */\n boundaryCount?: number;\n /**\n * Number of pages on each side of the current page when page range is truncated.\n */\n siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n function Paginator(\n { className, boundaryCount, siblingCount, ...restProps },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-paginator\",\n css: paginatorCss,\n window: targetWindow,\n });\n\n const { count, page, onPageChange } = usePaginationContext();\n\n const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.max(1, page - 1));\n };\n\n const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n onPageChange(event, Math.min(page + 1, count));\n };\n\n const isOnFirstPage = page === 1;\n const isOnLastPage = page === count;\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n <Button\n variant=\"secondary\"\n aria-label=\"Previous Page\"\n onClick={onPreviousPage}\n disabled={isOnFirstPage}\n className={withBaseName(\"arrowButton-previous\")}\n >\n <ChevronLeftIcon aria-hidden />\n </Button>\n <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n <Button\n variant=\"secondary\"\n aria-label=\"Next Page\"\n onClick={onNextPage}\n disabled={isOnLastPage}\n className={withBaseName(\"arrowButton-next\")}\n >\n <ChevronRightIcon aria-hidden />\n </Button>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAa1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,WACP,EAAE,SAAA,EAAW,eAAe,YAAiB,EAAA,GAAA,SAAA,IAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,IAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KAC3C,CAAA;AAEA,IAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KAC/C,CAAA;AAEA,IAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,IAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,eAAA;AAAA,UACX,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UACV,SAAA,EAAW,aAAa,sBAAsB,CAAA;AAAA,UAE9C,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,YAAgB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC/B,CAAA;AAAA,wBACCF,cAAA,CAAAG,qBAAA,EAAA;AAAA,UAAW,YAAA;AAAA,UAA4B,aAAA;AAAA,SAA8B,CAAA;AAAA,wBACrEH,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,WAAA;AAAA,UACX,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UACV,SAAA,EAAW,aAAa,kBAAkB,CAAA;AAAA,UAE1C,QAAC,kBAAAD,cAAA,CAAAI,sBAAA,EAAA;AAAA,YAAiB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAChC,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-cjs/panel/Panel.js
CHANGED
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport panelCss from \"./Panel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n * <Panel>\n * <p>This is a panel around some text.</p>\n * </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Styling variant; defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n { className, children, variant = \"primary\", ...restProps },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-panel\",\n css: panelCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(variant), className)}\n ref={ref}\n {...restProps}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport panelCss from \"./Panel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n * <Panel>\n * <p>This is a panel around some text.</p>\n * </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Styling variant; defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n { className, children, variant = \"primary\", ...restProps },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-panel\",\n css: panelCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(variant), className)}\n ref={ref}\n {...restProps}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEhC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA,EAAE,SAAW,EAAA,QAAA,EAAU,OAAU,GAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACzD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,IAChE,GAAA;AAAA,IACC,GAAG,SAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -37,6 +37,7 @@ require('../dialog/DialogActions.js');
|
|
|
37
37
|
require('../dialog/DialogContent.js');
|
|
38
38
|
require('../dialog/DialogContext.js');
|
|
39
39
|
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
40
41
|
require('../drawer/Drawer.js');
|
|
41
42
|
require('../drawer/DrawerCloseButton.js');
|
|
42
43
|
require('../dropdown/Dropdown.js');
|
|
@@ -64,6 +65,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
64
65
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
65
66
|
require('../link/Link.js');
|
|
66
67
|
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
67
69
|
require('../list-control/ListControlContext.js');
|
|
68
70
|
require('../menu/MenuContext.js');
|
|
69
71
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n ReactNode,\n useEffect,\n} from \"react\";\nimport { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Breakpoint at which the parent and child will stack.\n */\n collapseAtBreakpoint?: keyof Breakpoints;\n /**\n * View that is displayed when in a collapsed state.\n */\n visibleView?: \"child\" | \"parent\";\n /**\n * Controls the space between parent and child components, default is 0.\n */\n gap?: number;\n /**\n * Parent component to be rendered\n */\n parent: ReactNode;\n /**\n * Child component to be rendered\n */\n child: ReactNode;\n /**\n * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n */\n onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n HTMLDivElement,\n ParentChildLayoutProps\n>(function ParentChildLayout(\n {\n collapseAtBreakpoint = \"sm\",\n visibleView = \"child\",\n parent,\n child,\n className,\n gap = 0,\n onCollapseChange,\n style,\n ...rest\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-parent-child-layout\",\n css: parentChildLayoutCss,\n window: targetWindow,\n });\n\n const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n useEffect(() => {\n onCollapseChange?.(isCollapsed);\n }, [isCollapsed, onCollapseChange]);\n\n const parentChildLayoutStyles = {\n ...style,\n \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n };\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={parentChildLayoutStyles}\n {...rest}\n >\n {isCollapsed ? (\n <div\n key={visibleView}\n className={clsx({\n [withBaseName(\"collapsed\")]: isCollapsed,\n [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n })}\n >\n {isCollapsed && visibleView === \"child\" ? child : parent}\n </div>\n ) : (\n <>\n <div className={withBaseName(\"parent\")}>{parent}</div>\n <div className={withBaseName(\"child\")}>{child}</div>\n </>\n )}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n ReactNode,\n useEffect,\n} from \"react\";\nimport { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Breakpoint at which the parent and child will stack.\n */\n collapseAtBreakpoint?: keyof Breakpoints;\n /**\n * View that is displayed when in a collapsed state.\n */\n visibleView?: \"child\" | \"parent\";\n /**\n * Controls the space between parent and child components, default is 0.\n */\n gap?: number;\n /**\n * Parent component to be rendered\n */\n parent: ReactNode;\n /**\n * Child component to be rendered\n */\n child: ReactNode;\n /**\n * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n */\n onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n HTMLDivElement,\n ParentChildLayoutProps\n>(function ParentChildLayout(\n {\n collapseAtBreakpoint = \"sm\",\n visibleView = \"child\",\n parent,\n child,\n className,\n gap = 0,\n onCollapseChange,\n style,\n ...rest\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-parent-child-layout\",\n css: parentChildLayoutCss,\n window: targetWindow,\n });\n\n const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n useEffect(() => {\n onCollapseChange?.(isCollapsed);\n }, [isCollapsed, onCollapseChange]);\n\n const parentChildLayoutStyles = {\n ...style,\n \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n };\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={parentChildLayoutStyles}\n {...rest}\n >\n {isCollapsed ? (\n <div\n key={visibleView}\n className={clsx({\n [withBaseName(\"collapsed\")]: isCollapsed,\n [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n })}\n >\n {isCollapsed && visibleView === \"child\" ? child : parent}\n </div>\n ) : (\n <>\n <div className={withBaseName(\"parent\")}>{parent}</div>\n <div className={withBaseName(\"child\")}>{child}</div>\n </>\n )}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA,CAAA;AAE5C,MAAA,iBAAA,GAAoBC,gBAG/B,CAAA,SAASC,kBACT,CAAA;AAAA,EACE,oBAAuB,GAAA,IAAA;AAAA,EACvB,WAAc,GAAA,OAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAM,GAAA,CAAA;AAAA,EACN,gBAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,oEAAkC,oBAAoB,CAAA,CAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM;AACd,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,WAAA,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAElC,EAAA,MAAM,uBAA0B,GAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IACH,2BAA2B,CAAkC,+BAAA,EAAA,GAAA,CAAA,CAAA,CAAA;AAAA,GAC/D,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,KAAO,EAAA,uBAAA;AAAA,IACN,GAAG,IAAA;AAAA,IAEH,wCACED,cAAA,CAAA,KAAA,EAAA;AAAA,MAEC,WAAWC,SAAK,CAAA;AAAA,QACd,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,WAAA;AAAA,QAC7B,CAAC,YAAA,CAAa,gBAAgB,CAAA,GAAI,WAAgB,KAAA,OAAA;AAAA,QAClD,CAAC,YAAA,CAAa,iBAAiB,CAAA,GAAI,WAAgB,KAAA,QAAA;AAAA,OACpD,CAAA;AAAA,MAEA,QAAA,EAAA,WAAA,IAAe,WAAgB,KAAA,OAAA,GAAU,KAAQ,GAAA,MAAA;AAAA,KAAA,EAP7C,WAQP,CAEA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACH,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,UAAI,QAAA,EAAA,MAAA;AAAA,SAAO,CAAA;AAAA,wBAC/CA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,OAAA;AAAA,KAChD,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -36,6 +36,7 @@ require('../dialog/DialogActions.js');
|
|
|
36
36
|
require('../dialog/DialogContent.js');
|
|
37
37
|
require('../dialog/DialogContext.js');
|
|
38
38
|
require('../dialog/DialogCloseButton.js');
|
|
39
|
+
require('../divider/Divider.js');
|
|
39
40
|
require('../drawer/Drawer.js');
|
|
40
41
|
require('../drawer/DrawerCloseButton.js');
|
|
41
42
|
require('../dropdown/Dropdown.js');
|
|
@@ -63,6 +64,7 @@ require('../interactable-card/InteractableCardGroup.js');
|
|
|
63
64
|
require('../interactable-card/InteractableCardGroupContext.js');
|
|
64
65
|
require('../link/Link.js');
|
|
65
66
|
require('../link-card/LinkCard.js');
|
|
67
|
+
require('../list-box/ListBox.js');
|
|
66
68
|
require('../list-control/ListControlContext.js');
|
|
67
69
|
require('../menu/MenuContext.js');
|
|
68
70
|
require('@floating-ui/react');
|
|
@@ -100,6 +102,7 @@ require('../toast/Toast.js');
|
|
|
100
102
|
require('../toast/ToastContent.js');
|
|
101
103
|
require('../split-layout/SplitLayout.js');
|
|
102
104
|
require('../switch/Switch.js');
|
|
105
|
+
require('../tag/Tag.js');
|
|
103
106
|
require('../toggle-button/ToggleButton.js');
|
|
104
107
|
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
105
108
|
require('../toggle-button-group/ToggleButtonGroupContext.js');
|