@salt-ds/core 1.29.0 → 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 +250 -24
- 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 +8 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +3 -0
- 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.js +3 -0
- 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.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 +3 -0
- 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/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.js +3 -0
- 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 +4 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +3 -0
- 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.js +3 -0
- 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.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 +3 -0
- 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/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.js +3 -0
- 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/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/theme/ActionFont.d.ts +2 -0
- package/dist-types/theme/index.d.ts +1 -0
- package/package.json +2 -2
|
@@ -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":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\nimport { SpinnerSVGSize } from \"../Spinner\";\nimport { Density } from \"../../theme\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n size: SpinnerSVGSize;\n density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n small: {\n high: { width: 12, strokeWidth: 2 },\n medium: { width: 12, strokeWidth: 2 },\n low: { width: 14, strokeWidth: 2 },\n touch: { width: 16, strokeWidth: 2 },\n },\n medium: {\n high: { width: 20, strokeWidth: 2 },\n medium: { width: 28, strokeWidth: 4 },\n low: { width: 36, strokeWidth: 6 },\n touch: { width: 44, strokeWidth: 8 },\n },\n large: {\n high: { width: 40, strokeWidth: 2 },\n medium: { width: 56, strokeWidth: 4 },\n low: { width: 72, strokeWidth: 6 },\n touch: { width: 88, strokeWidth: 8 },\n },\n};\n\nexport const SpinnerSVG = ({\n id = \"svg-spinner\",\n rest,\n size,\n density,\n}: SpinnerProps) => {\n const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n const radius = (width - strokeWidth) / 2;\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox={`0 0 ${width} ${width}`}\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"15%\"\n stopOpacity=\"1\"\n />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\">\n {/* \n This first path draws the top half of the circle without a gradient. \n It starts from the right end, moves in a circular arc, and ends at the left end.\n */}\n <path\n d={`M${width - strokeWidth / 2},${\n width / 2\n } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n {/* \n This second path draws the left half of the circle with a gradient that transitions \n from opaque on the left to transparent on the right.\n It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n */}\n <path\n d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n width - strokeWidth\n }`}\n stroke={`url(#${id}-1)`}\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n </g>\n </svg>\n );\n};\n"],"names":["makePrefixer","jsxs","jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SpinnerSVG.js","sources":["../src/spinner/svgSpinners/SpinnerSVG.tsx"],"sourcesContent":["import { SVGAttributes } from \"react\";\nimport { makePrefixer } from \"../../utils\";\nimport { SpinnerSVGSize } from \"../Spinner\";\nimport { Density } from \"../../theme\";\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\ninterface SpinnerProps {\n id?: string;\n rest?: Omit<SVGAttributes<SVGSVGElement>, \"id\">;\n size: SpinnerSVGSize;\n density: Density;\n}\n\nconst sizeAndStrokeWidthMapping = {\n small: {\n high: { width: 12, strokeWidth: 2 },\n medium: { width: 12, strokeWidth: 2 },\n low: { width: 14, strokeWidth: 2 },\n touch: { width: 16, strokeWidth: 2 },\n },\n medium: {\n high: { width: 20, strokeWidth: 2 },\n medium: { width: 28, strokeWidth: 4 },\n low: { width: 36, strokeWidth: 6 },\n touch: { width: 44, strokeWidth: 8 },\n },\n large: {\n high: { width: 40, strokeWidth: 2 },\n medium: { width: 56, strokeWidth: 4 },\n low: { width: 72, strokeWidth: 6 },\n touch: { width: 88, strokeWidth: 8 },\n },\n};\n\nexport const SpinnerSVG = ({\n id = \"svg-spinner\",\n rest,\n size,\n density,\n}: SpinnerProps) => {\n const { width, strokeWidth } = sizeAndStrokeWidthMapping[size][density];\n const radius = (width - strokeWidth) / 2;\n\n return (\n <svg\n className={withBaseName(\"spinner\")}\n viewBox={`0 0 ${width} ${width}`}\n id={id}\n {...rest}\n >\n <defs>\n <linearGradient id={`${id}-1`} x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"0\">\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"15%\"\n stopOpacity=\"1\"\n />\n <stop\n className={withBaseName(\"gradientStop\")}\n offset=\"100%\"\n stopOpacity=\"0\"\n />\n </linearGradient>\n </defs>\n <g fill=\"none\">\n {/* \n This first path draws the top half of the circle without a gradient. \n It starts from the right end, moves in a circular arc, and ends at the left end.\n */}\n <path\n d={`M${width - strokeWidth / 2},${\n width / 2\n } a${radius},${radius} 0 1,0 -${width - strokeWidth},0`}\n stroke=\"var(--saltSpinner-gradient-color, var(--salt-accent-background)\"\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n {/* \n This second path draws the left half of the circle with a gradient that transitions \n from opaque on the left to transparent on the right.\n It starts from the top-center, moves in a circular arc, and ends at the bottom-center.\n */}\n <path\n d={`M${width / 2},${strokeWidth / 2} a${radius},${radius} 0 1,0 0,${\n width - strokeWidth\n }`}\n stroke={`url(#${id}-1)`}\n strokeWidth=\"var(--spinner-strokeWidth)\"\n fill=\"none\"\n />\n </g>\n </svg>\n );\n};\n"],"names":["makePrefixer","jsxs","jsx"],"mappings":"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"}
|
|
@@ -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('../status-adornment/StatusAdornment.js');
|
|
|
100
102
|
require('../toast/Toast.js');
|
|
101
103
|
require('../toast/ToastContent.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":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement, ReactNode } from \"react\";\nimport { FlexLayout, FlexLayoutProps } from \"../flex-layout\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: FlexLayoutProps<ElementType>[\"direction\"];\n /**\n * End component to be rendered.\n */\n endItem?: ReactNode;\n /**\n * Controls the space between left and right items.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Start component to be rendered.\n */\n startItem?: ReactNode;\n }\n >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n props: SplitLayoutProps<T>\n) => ReactElement | null;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n { endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-split-layout\",\n css: splitLayoutCss,\n window: targetWindow,\n });\n\n const justify = endItem && !startItem ? \"end\" : \"space-between\";\n return (\n <FlexLayout\n className={clsx(withBaseName(), className)}\n ref={ref}\n justify={justify}\n {...rest}\n >\n {startItem}\n {endItem}\n </FlexLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","splitLayoutCss","jsxs","FlexLayout","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SplitLayout.js","sources":["../src/split-layout/SplitLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement, ReactNode } from \"react\";\nimport { FlexLayout, FlexLayoutProps } from \"../flex-layout\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport splitLayoutCss from \"./SplitLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\n\nconst withBaseName = makePrefixer(\"saltSplitLayout\");\n\nexport type SplitLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line.\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n */\n direction?: FlexLayoutProps<ElementType>[\"direction\"];\n /**\n * End component to be rendered.\n */\n endItem?: ReactNode;\n /**\n * Controls the space between left and right items.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Start component to be rendered.\n */\n startItem?: ReactNode;\n }\n >;\n\ntype SplitLayoutComponent = <T extends ElementType = \"div\">(\n props: SplitLayoutProps<T>\n) => ReactElement | null;\n\nexport const SplitLayout: SplitLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n { endItem, startItem, className, ...rest }: SplitLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-split-layout\",\n css: splitLayoutCss,\n window: targetWindow,\n });\n\n const justify = endItem && !startItem ? \"end\" : \"space-between\";\n return (\n <FlexLayout\n className={clsx(withBaseName(), className)}\n ref={ref}\n justify={justify}\n {...rest}\n >\n {startItem}\n {endItem}\n </FlexLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","splitLayoutCss","jsxs","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA,CAAA;AAiC5C,MAAM,WAAoC,GAAAC,gBAAA;AAAA,EAC/C,CACE,EAAE,OAAA,EAAS,WAAW,SAAc,EAAA,GAAA,IAAA,IACpC,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAC,aAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,OAAU,GAAA,OAAA,IAAW,CAAC,SAAA,GAAY,KAAQ,GAAA,eAAA,CAAA;AAChD,IAAA,uBACGC,eAAA,CAAAC,qBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,OAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,SAAA;AAAA,QACA,OAAA;AAAA,OAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -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":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport {\n FlexLayout,\n FlexLayoutProps,\n LayoutDirection,\n LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n resolveResponsiveValue,\n ResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useBreakpoint } from \"../breakpoints\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Adds a separator between elements, default is false.\n */\n separators?: LayoutSeparator | boolean;\n }\n >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n props: StackLayoutProps<T>\n) => ReactElement | null;\n\nfunction parseSpacing(value: number | string | undefined) {\n if (value === undefined || typeof value === \"string\") {\n return value;\n }\n\n return `calc(var(--salt-spacing-100) * ${value})`;\n}\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n children,\n className,\n direction = \"column\",\n gap = 3,\n separators,\n style,\n ...rest\n }: StackLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-stack-layout\",\n css: stackLayoutCss,\n window: targetWindow,\n });\n\n const { matchedBreakpoints } = useBreakpoint();\n\n const flexGap = resolveResponsiveValue(gap, matchedBreakpoints);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = resolveResponsiveValue(direction, matchedBreakpoints);\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap\": parseSpacing(flexGap),\n };\n return (\n <FlexLayout\n className={clsx(\n withBaseName(),\n {\n [withBaseName(flexDirection ?? \"\")]: flexDirection,\n [withBaseName(\"separator\")]: !!separatorAlignment,\n [separatorAlignment\n ? withBaseName(`separator-${separatorAlignment}`)\n : \"\"]: separatorAlignment,\n },\n className\n )}\n ref={ref}\n direction={direction}\n style={stackLayoutStyles}\n wrap={false}\n gap={flexGap}\n {...rest}\n >\n {children}\n </FlexLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","stackLayoutCss","useBreakpoint","resolveResponsiveValue","jsx","FlexLayout","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"StackLayout.js","sources":["../src/stack-layout/StackLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport {\n FlexLayout,\n FlexLayoutProps,\n LayoutDirection,\n LayoutSeparator,\n} from \"../flex-layout\";\nimport {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n resolveResponsiveValue,\n ResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useBreakpoint } from \"../breakpoints\";\n\nconst withBaseName = makePrefixer(\"saltStackLayout\");\n\nexport type StackLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n */\n align?: FlexLayoutProps<ElementType>[\"align\"];\n /**\n * Establishes the main-axis, defining the direction children are placed. Default is \"column\".\n */\n direction?: ResponsiveProp<LayoutDirection>;\n /**\n * Controls the space between items, default is 3.\n */\n gap?: FlexLayoutProps<ElementType>[\"gap\"];\n /**\n * Adds a separator between elements, default is false.\n */\n separators?: LayoutSeparator | boolean;\n }\n >;\n\ntype StackLayoutComponent = <T extends ElementType = \"div\">(\n props: StackLayoutProps<T>\n) => ReactElement | null;\n\nfunction parseSpacing(value: number | string | undefined) {\n if (value === undefined || typeof value === \"string\") {\n return value;\n }\n\n return `calc(var(--salt-spacing-100) * ${value})`;\n}\n\nexport const StackLayout: StackLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n children,\n className,\n direction = \"column\",\n gap = 3,\n separators,\n style,\n ...rest\n }: StackLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-stack-layout\",\n css: stackLayoutCss,\n window: targetWindow,\n });\n\n const { matchedBreakpoints } = useBreakpoint();\n\n const flexGap = resolveResponsiveValue(gap, matchedBreakpoints);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = resolveResponsiveValue(direction, matchedBreakpoints);\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap\": parseSpacing(flexGap),\n };\n return (\n <FlexLayout\n className={clsx(\n withBaseName(),\n {\n [withBaseName(flexDirection ?? \"\")]: flexDirection,\n [withBaseName(\"separator\")]: !!separatorAlignment,\n [separatorAlignment\n ? withBaseName(`separator-${separatorAlignment}`)\n : \"\"]: separatorAlignment,\n },\n className\n )}\n ref={ref}\n direction={direction}\n style={stackLayoutStyles}\n wrap={false}\n gap={flexGap}\n {...rest}\n >\n {children}\n </FlexLayout>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","stackLayoutCss","useBreakpoint","resolveResponsiveValue","jsx","FlexLayout","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA,CAAA;AA6BnD,SAAS,aAAa,KAAoC,EAAA;AACxD,EAAA,IAAI,KAAU,KAAA,KAAA,CAAA,IAAa,OAAO,KAAA,KAAU,QAAU,EAAA;AACpD,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAA,OAAO,CAAkC,+BAAA,EAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAC3C,CAAA;AAEO,MAAM,WAAoC,GAAAC,gBAAA;AAAA,EAC/C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,IACZ,GAAM,GAAA,CAAA;AAAA,IACN,UAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAC,aAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,EAAE,kBAAmB,EAAA,GAAIC,gCAAc,EAAA,CAAA;AAE7C,IAAM,MAAA,OAAA,GAAUC,wCAAuB,CAAA,GAAA,EAAK,kBAAkB,CAAA,CAAA;AAC9D,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,aAAA,GAAgBA,wCAAuB,CAAA,SAAA,EAAW,kBAAkB,CAAA,CAAA;AAC1E,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,mBAAA,EAAqB,aAAa,OAAO,CAAA;AAAA,KAC3C,CAAA;AACA,IAAA,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,EAAE,CAAI,GAAA,aAAA;AAAA,UACrC,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,CAAC,CAAC,kBAAA;AAAA,UAC/B,CAAC,kBACG,GAAA,YAAA,CAAa,CAAa,UAAA,EAAA,kBAAA,CAAA,CAAoB,IAC9C,EAAK,GAAA,kBAAA;AAAA,SACX;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAO,EAAA,iBAAA;AAAA,MACP,IAAM,EAAA,KAAA;AAAA,MACN,GAAK,EAAA,OAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA;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');
|
|
@@ -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":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nimport statusAdornmentCss from \"./StatusAdornment.css\";\n\nconst icons = {\n error: ErrorAdornmentIcon,\n warning: WarningAdornmentIcon,\n success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n /**\n * Status adornment to be displayed.\n */\n status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n error: \"error\",\n warning: \"warning\",\n success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n function StatusAdornment({ className, status, ...restProps }, ref) {\n const AdornmentComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-adornment\",\n css: statusAdornmentCss,\n window: targetWindow,\n });\n\n return (\n <AdornmentComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n }\n);\n"],"names":["ErrorAdornmentIcon","WarningAdornmentIcon","SuccessAdornmentIcon","makePrefixer","forwardRef","StatusAdornment","useWindow","useComponentCssInjection","statusAdornmentCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"StatusAdornment.js","sources":["../src/status-adornment/StatusAdornment.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\nimport { ErrorAdornmentIcon } from \"./ErrorAdornment\";\nimport { SuccessAdornmentIcon } from \"./SuccessAdornment\";\nimport { WarningAdornmentIcon } from \"./WarningAdornment\";\n\nimport statusAdornmentCss from \"./StatusAdornment.css\";\n\nconst icons = {\n error: ErrorAdornmentIcon,\n warning: WarningAdornmentIcon,\n success: SuccessAdornmentIcon,\n};\n\nexport type AdornmentValidationStatus = Exclude<ValidationStatus, \"info\">;\n\nexport interface StatusAdornmentProps extends IconProps {\n /**\n * Status adornment to be displayed.\n */\n status: AdornmentValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<AdornmentValidationStatus, string> = {\n error: \"error\",\n warning: \"warning\",\n success: \"success\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusAdornment\");\n\nexport const StatusAdornment = forwardRef<SVGSVGElement, StatusAdornmentProps>(\n function StatusAdornment({ className, status, ...restProps }, ref) {\n const AdornmentComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-adornment\",\n css: statusAdornmentCss,\n window: targetWindow,\n });\n\n return (\n <AdornmentComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n }\n);\n"],"names":["ErrorAdornmentIcon","WarningAdornmentIcon","SuccessAdornmentIcon","makePrefixer","forwardRef","StatusAdornment","useWindow","useComponentCssInjection","statusAdornmentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAAA,iCAAA;AAAA,EACP,OAAS,EAAAC,qCAAA;AAAA,EACT,OAAS,EAAAC,qCAAA;AACX,CAAA,CAAA;AAWA,MAAM,oBAAkE,GAAA;AAAA,EACtE,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AACX,CAAA,CAAA;AAEA,MAAM,YAAA,GAAeC,0BAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,gBAAgB,CAAA,EAAE,WAAW,MAAW,EAAA,GAAA,SAAA,IAAa,GAAK,EAAA;AACjE,IAAA,MAAM,qBAAqB,KAAM,CAAA,MAAA,CAAA,CAAA;AACjC,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,iBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,kBAAA,EAAA;AAAA,MACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;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');
|
|
@@ -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');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import {\n DEFAULT_ICON_SIZE,\n ErrorSolidIcon,\n IconProps,\n InfoSolidIcon,\n SuccessTickIcon,\n WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ValidationStatus } from \"./ValidationStatus\";\n\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst icons = {\n error: ErrorSolidIcon,\n success: SuccessTickIcon,\n warning: WarningSolidIcon,\n info: InfoSolidIcon,\n};\n\nexport interface StatusIndicatorProps extends IconProps {\n /**\n * Status indicator to be displayed.\n */\n status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n error: \"error\",\n success: \"success\",\n warning: \"warning\",\n info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n function StatusIndicator(\n { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-indicator\",\n css: statusIndicatorCss,\n window: targetWindow,\n });\n\n const IconComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n return (\n <IconComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n size={size}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n }\n);\n"],"names":["ErrorSolidIcon","SuccessTickIcon","WarningSolidIcon","InfoSolidIcon","makePrefixer","forwardRef","StatusIndicator","DEFAULT_ICON_SIZE","useWindow","useComponentCssInjection","statusIndicatorCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"StatusIndicator.js","sources":["../src/status-indicator/StatusIndicator.tsx"],"sourcesContent":["import {\n DEFAULT_ICON_SIZE,\n ErrorSolidIcon,\n IconProps,\n InfoSolidIcon,\n SuccessTickIcon,\n WarningSolidIcon,\n} from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ValidationStatus } from \"./ValidationStatus\";\n\nimport statusIndicatorCss from \"./StatusIndicator.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst icons = {\n error: ErrorSolidIcon,\n success: SuccessTickIcon,\n warning: WarningSolidIcon,\n info: InfoSolidIcon,\n};\n\nexport interface StatusIndicatorProps extends IconProps {\n /**\n * Status indicator to be displayed.\n */\n status: ValidationStatus;\n}\n\nconst statusToAriaLabelMap: Record<ValidationStatus, string> = {\n error: \"error\",\n success: \"success\",\n warning: \"warning\",\n info: \"info\",\n};\n\nconst withBaseName = makePrefixer(\"saltStatusIndicator\");\n\nexport const StatusIndicator = forwardRef<SVGSVGElement, StatusIndicatorProps>(\n function StatusIndicator(\n { className, status, size = DEFAULT_ICON_SIZE, ...restProps },\n ref\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-status-indicator\",\n css: statusIndicatorCss,\n window: targetWindow,\n });\n\n const IconComponent = icons[status];\n const ariaLabel = statusToAriaLabelMap[status];\n\n return (\n <IconComponent\n className={clsx(withBaseName(), withBaseName(status), className)}\n size={size}\n aria-label={ariaLabel}\n {...restProps}\n ref={ref}\n />\n );\n }\n);\n"],"names":["ErrorSolidIcon","SuccessTickIcon","WarningSolidIcon","InfoSolidIcon","makePrefixer","forwardRef","StatusIndicator","DEFAULT_ICON_SIZE","useWindow","useComponentCssInjection","statusIndicatorCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAAA,sBAAA;AAAA,EACP,OAAS,EAAAC,uBAAA;AAAA,EACT,OAAS,EAAAC,wBAAA;AAAA,EACT,IAAM,EAAAC,qBAAA;AACR,CAAA,CAAA;AASA,MAAM,oBAAyD,GAAA;AAAA,EAC7D,KAAO,EAAA,OAAA;AAAA,EACP,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AACR,CAAA,CAAA;AAEA,MAAM,YAAA,GAAeC,0BAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,iBACP,EAAE,SAAA,EAAW,QAAQ,IAAO,GAAAC,yBAAA,EAAA,GAAsB,SAAU,EAAA,EAC5D,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,iBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,gBAAgB,KAAM,CAAA,MAAA,CAAA,CAAA;AAC5B,IAAA,MAAM,YAAY,oBAAqB,CAAA,MAAA,CAAA,CAAA;AAEvC,IAAA,uBACGC,cAAA,CAAA,aAAA,EAAA;AAAA,MACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,MAC/D,IAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACX,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -40,6 +40,7 @@ require('../dialog/DialogActions.js');
|
|
|
40
40
|
require('../dialog/DialogContent.js');
|
|
41
41
|
require('../dialog/DialogContext.js');
|
|
42
42
|
require('../dialog/DialogCloseButton.js');
|
|
43
|
+
require('../divider/Divider.js');
|
|
43
44
|
require('../drawer/Drawer.js');
|
|
44
45
|
require('../drawer/DrawerCloseButton.js');
|
|
45
46
|
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('../status-adornment/StatusAdornment.js');
|
|
|
102
104
|
require('../toast/Toast.js');
|
|
103
105
|
require('../toast/ToastContent.js');
|
|
104
106
|
require('../split-layout/SplitLayout.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":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n ComponentPropsWithoutRef,\n FocusEventHandler,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n IconProps,\n SuccessSmallSolidIcon,\n SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n extends Omit<\n ComponentPropsWithoutRef<\"label\">,\n \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n > {\n /**\n * If `true`, the checkbox will be checked.\n */\n checked?: boolean;\n /**\n * Whether the checkbox component is checked by default\n * This will be disregarded if checked is already set.\n */\n defaultChecked?: boolean;\n /**\n * If `true`, the checkbox will be disabled.\n */\n disabled?: boolean;\n /**\n * Properties applied to the input element.\n */\n inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n /**\n * The label to be shown next to the checkbox.\n */\n label?: ReactNode;\n /**\n * The name applied to the input.\n */\n name?: string;\n /**\n * Callback when checkbox loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback when checked state is changed.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Callback when checkbox gains focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * The value of the checkbox.\n */\n value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n const density = useDensity();\n return density === \"high\" ? (\n <SuccessSmallSolidIcon {...props} />\n ) : (\n <SuccessSolidIcon {...props} />\n );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n props,\n ref\n) {\n const {\n checked: checkedProp,\n className,\n defaultChecked,\n disabled: disabledProp,\n inputProps = {},\n label,\n name,\n onBlur,\n onChange,\n onFocus,\n value,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-switch\",\n css: switchCss,\n window: targetWindow,\n });\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n className: inputClassName,\n onChange: inputOnChange,\n ...restInputProps\n } = inputProps;\n\n const [checked, setChecked] = useControlled({\n controlled: checkedProp,\n default: Boolean(defaultChecked),\n name: \"Switch\",\n state: \"checked\",\n });\n\n const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n // Workaround for https://github.com/facebook/react/issues/9023\n if (event.nativeEvent.defaultPrevented) {\n return;\n }\n\n const value = event.target.checked;\n setChecked(value);\n onChange?.(event);\n inputOnChange?.(event);\n };\n\n return (\n <label\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"checked\")]: checked,\n },\n className\n )}\n ref={ref}\n {...rest}\n >\n <input\n aria-describedby={clsx(\n formFieldA11yProps?.[\"aria-describedby\"],\n inputDescribedBy\n )}\n aria-labelledby={clsx(\n formFieldA11yProps?.[\"aria-labelledby\"],\n inputLabelledBy\n )}\n name={name}\n value={value}\n checked={checked}\n className={clsx(withBaseName(\"input\"), inputClassName)}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onBlur={onBlur}\n onChange={handleChange}\n onFocus={onFocus}\n type=\"checkbox\"\n role=\"switch\"\n {...restInputProps}\n />\n <span className={withBaseName(\"track\")}>\n <span className={withBaseName(\"thumb\")}>\n {checked && (\n <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n )}\n </span>\n </span>\n {label && <span className={withBaseName(\"label\")}>{label}</span>}\n </label>\n );\n});\n"],"names":["makePrefixer","useDensity","jsx","SuccessSmallSolidIcon","SuccessSolidIcon","forwardRef","Switch","useWindow","useComponentCssInjection","switchCss","useControlled","useFormFieldProps","value","jsxs","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEventHandler,\n ComponentPropsWithoutRef,\n FocusEventHandler,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n IconProps,\n SuccessSmallSolidIcon,\n SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n extends Omit<\n ComponentPropsWithoutRef<\"label\">,\n \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n > {\n /**\n * If `true`, the checkbox will be checked.\n */\n checked?: boolean;\n /**\n * Whether the checkbox component is checked by default\n * This will be disregarded if checked is already set.\n */\n defaultChecked?: boolean;\n /**\n * If `true`, the checkbox will be disabled.\n */\n disabled?: boolean;\n /**\n * Properties applied to the input element.\n */\n inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n /**\n * The label to be shown next to the checkbox.\n */\n label?: ReactNode;\n /**\n * The name applied to the input.\n */\n name?: string;\n /**\n * Callback when checkbox loses focus.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Callback when checked state is changed.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Callback when checkbox gains focus.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * The value of the checkbox.\n */\n value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n const density = useDensity();\n return density === \"high\" ? (\n <SuccessSmallSolidIcon {...props} />\n ) : (\n <SuccessSolidIcon {...props} />\n );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n props,\n ref\n) {\n const {\n checked: checkedProp,\n className,\n defaultChecked,\n disabled: disabledProp,\n inputProps = {},\n label,\n name,\n onBlur,\n onChange,\n onFocus,\n value,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-switch\",\n css: switchCss,\n window: targetWindow,\n });\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n className: inputClassName,\n onChange: inputOnChange,\n ...restInputProps\n } = inputProps;\n\n const [checked, setChecked] = useControlled({\n controlled: checkedProp,\n default: Boolean(defaultChecked),\n name: \"Switch\",\n state: \"checked\",\n });\n\n const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n // Workaround for https://github.com/facebook/react/issues/9023\n if (event.nativeEvent.defaultPrevented) {\n return;\n }\n\n const value = event.target.checked;\n setChecked(value);\n onChange?.(event);\n inputOnChange?.(event);\n };\n\n return (\n <label\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"checked\")]: checked,\n },\n className\n )}\n ref={ref}\n {...rest}\n >\n <input\n aria-describedby={clsx(\n formFieldA11yProps?.[\"aria-describedby\"],\n inputDescribedBy\n )}\n aria-labelledby={clsx(\n formFieldA11yProps?.[\"aria-labelledby\"],\n inputLabelledBy\n )}\n name={name}\n value={value}\n checked={checked}\n className={clsx(withBaseName(\"input\"), inputClassName)}\n defaultChecked={defaultChecked}\n disabled={disabled}\n onBlur={onBlur}\n onChange={handleChange}\n onFocus={onFocus}\n type=\"checkbox\"\n role=\"switch\"\n {...restInputProps}\n />\n <span className={withBaseName(\"track\")}>\n <span className={withBaseName(\"thumb\")}>\n {checked && (\n <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n )}\n </span>\n </span>\n {label && <span className={withBaseName(\"label\")}>{label}</span>}\n </label>\n );\n});\n"],"names":["makePrefixer","useDensity","jsx","SuccessSmallSolidIcon","SuccessSolidIcon","forwardRef","Switch","useWindow","useComponentCssInjection","switchCss","useControlled","useFormFieldProps","value","jsxs","clsx"],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css_248z = ".saltTag {\n height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n min-height: var(--salt-text-minHeight);\n display: flex;\n column-gap: var(--salt-spacing-50);\n align-items: center;\n padding: var(--salt-spacing-25) var(--salt-spacing-100);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n overflow: hidden;\n border-radius: var(--saltTag-borderRadius, var(--salt-palette-corner-strongest, 9999px));\n width: fit-content;\n min-width: max-content;\n border-box: box-sizing;\n}\n.saltTag-primary {\n background: var(--tag-primary-background, var(--salt-category-1-subtle-background));\n color: var(--tag-primary-foreground, var(--salt-category-1-subtle-foreground));\n border: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n}\n.saltTag-bordered {\n border: var(--salt-size-border) var(--salt-container-borderStyle) var(--tag-primary-borderColor, var(--salt-category-1-subtle-borderColor));\n}\n.saltTag-secondary {\n background: var(--tag-secondary-background, var(--salt-category-1-bold-background));\n color: var(--tag-secondary-foreground, var(--salt-category-1-bold-foreground));\n border: var(--salt-size-border) var(--salt-container-borderStyle) transparent;\n}\n\n.saltTag-category-1 {\n --tag-primary-background: var(--salt-category-1-subtle-background);\n --tag-primary-foreground: var(--salt-category-1-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-1-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-1-bold-background);\n --tag-secondary-foreground: var(--salt-category-1-bold-foreground);\n}\n.saltTag-category-2 {\n --tag-primary-background: var(--salt-category-2-subtle-background);\n --tag-primary-foreground: var(--salt-category-2-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-2-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-2-bold-background);\n --tag-secondary-foreground: var(--salt-category-2-bold-foreground);\n}\n\n.saltTag-category-3 {\n --tag-primary-background: var(--salt-category-3-subtle-background);\n --tag-primary-foreground: var(--salt-category-3-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-3-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-3-bold-background);\n --tag-secondary-foreground: var(--salt-category-3-bold-foreground);\n}\n\n.saltTag-category-4 {\n --tag-primary-background: var(--salt-category-4-subtle-background);\n --tag-primary-foreground: var(--salt-category-4-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-4-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-4-bold-background);\n --tag-secondary-foreground: var(--salt-category-4-bold-foreground);\n}\n\n.saltTag-category-5 {\n --tag-primary-background: var(--salt-category-5-subtle-background);\n --tag-primary-foreground: var(--salt-category-5-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-5-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-5-bold-background);\n --tag-secondary-foreground: var(--salt-category-5-bold-foreground);\n}\n\n.saltTag-category-6 {\n --tag-primary-background: var(--salt-category-6-subtle-background);\n --tag-primary-foreground: var(--salt-category-6-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-6-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-6-bold-background);\n --tag-secondary-foreground: var(--salt-category-6-bold-foreground);\n}\n\n.saltTag-category-7 {\n --tag-primary-background: var(--salt-category-7-subtle-background);\n --tag-primary-foreground: var(--salt-category-7-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-7-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-7-bold-background);\n --tag-secondary-foreground: var(--salt-category-7-bold-foreground);\n}\n\n.saltTag-category-8 {\n --tag-primary-background: var(--salt-category-8-subtle-background);\n --tag-primary-foreground: var(--salt-category-8-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-8-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-8-bold-background);\n --tag-secondary-foreground: var(--salt-category-8-bold-foreground);\n}\n\n.saltTag-category-9 {\n --tag-primary-background: var(--salt-category-9-subtle-background);\n --tag-primary-foreground: var(--salt-category-9-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-9-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-9-bold-background);\n --tag-secondary-foreground: var(--salt-category-9-bold-foreground);\n}\n\n.saltTag-category-10 {\n --tag-primary-background: var(--salt-category-10-subtle-background);\n --tag-primary-foreground: var(--salt-category-10-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-10-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-10-bold-background);\n --tag-secondary-foreground: var(--salt-category-10-bold-foreground);\n}\n.saltTag-category-11 {\n --tag-primary-background: var(--salt-category-11-subtle-background);\n --tag-primary-foreground: var(--salt-category-11-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-11-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-11-bold-background);\n --tag-secondary-foreground: var(--salt-category-11-bold-foreground);\n}\n.saltTag-category-12 {\n --tag-primary-background: var(--salt-category-12-subtle-background);\n --tag-primary-foreground: var(--salt-category-12-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-12-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-12-bold-background);\n --tag-secondary-foreground: var(--salt-category-12-bold-foreground);\n}\n.saltTag-category-13 {\n --tag-primary-background: var(--salt-category-13-subtle-background);\n --tag-primary-foreground: var(--salt-category-13-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-13-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-13-bold-background);\n --tag-secondary-foreground: var(--salt-category-13-bold-foreground);\n}\n.saltTag-category-14 {\n --tag-primary-background: var(--salt-category-14-subtle-background);\n --tag-primary-foreground: var(--salt-category-14-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-14-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-14-bold-background);\n --tag-secondary-foreground: var(--salt-category-14-bold-foreground);\n}\n.saltTag-category-15 {\n --tag-primary-background: var(--salt-category-15-subtle-background);\n --tag-primary-foreground: var(--salt-category-15-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-15-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-15-bold-background);\n --tag-secondary-foreground: var(--salt-category-15-bold-foreground);\n}\n.saltTag-category-16 {\n --tag-primary-background: var(--salt-category-16-subtle-background);\n --tag-primary-foreground: var(--salt-category-16-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-16-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-16-bold-background);\n --tag-secondary-foreground: var(--salt-category-16-bold-foreground);\n}\n.saltTag-category-17 {\n --tag-primary-background: var(--salt-category-17-subtle-background);\n --tag-primary-foreground: var(--salt-category-17-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-17-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-17-bold-background);\n --tag-secondary-foreground: var(--salt-category-17-bold-foreground);\n}\n.saltTag-category-18 {\n --tag-primary-background: var(--salt-category-18-subtle-background);\n --tag-primary-foreground: var(--salt-category-18-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-18-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-18-bold-background);\n --tag-secondary-foreground: var(--salt-category-18-bold-foreground);\n}\n.saltTag-category-19 {\n --tag-primary-background: var(--salt-category-19-subtle-background);\n --tag-primary-foreground: var(--salt-category-19-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-19-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-19-bold-background);\n --tag-secondary-foreground: var(--salt-category-19-bold-foreground);\n}\n.saltTag-category-20 {\n --tag-primary-background: var(--salt-category-20-subtle-background);\n --tag-primary-foreground: var(--salt-category-20-subtle-foreground);\n --tag-primary-borderColor: var(--salt-category-20-subtle-borderColor);\n --tag-secondary-background: var(--salt-category-20-bold-background);\n --tag-secondary-foreground: var(--salt-category-20-bold-foreground);\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = css_248z;
|
|
6
|
+
//# sourceMappingURL=Tag.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tag.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
8
|
+
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
9
|
+
require('../utils/useId.js');
|
|
10
|
+
require('../salt-provider/SaltProvider.js');
|
|
11
|
+
require('../viewport/ViewportProvider.js');
|
|
12
|
+
var clsx = require('clsx');
|
|
13
|
+
require('../accordion/AccordionGroup.js');
|
|
14
|
+
require('../accordion/AccordionPanel.js');
|
|
15
|
+
require('../accordion/Accordion.js');
|
|
16
|
+
require('../accordion/AccordionHeader.js');
|
|
17
|
+
require('../aria-announcer/AriaAnnouncerContext.js');
|
|
18
|
+
require('../avatar/Avatar.js');
|
|
19
|
+
require('../badge/Badge.js');
|
|
20
|
+
require('../banner/Banner.js');
|
|
21
|
+
require('../banner/BannerActions.js');
|
|
22
|
+
require('../banner/BannerContent.js');
|
|
23
|
+
require('../border-item/BorderItem.js');
|
|
24
|
+
require('../border-layout/BorderLayout.js');
|
|
25
|
+
require('../breakpoints/BreakpointProvider.js');
|
|
26
|
+
require('../button/Button.js');
|
|
27
|
+
require('../card/Card.js');
|
|
28
|
+
require('../checkbox/Checkbox.js');
|
|
29
|
+
require('../checkbox/CheckboxGroup.js');
|
|
30
|
+
var styles = require('@salt-ds/styles');
|
|
31
|
+
var window = require('@salt-ds/window');
|
|
32
|
+
require('@salt-ds/icons');
|
|
33
|
+
require('../combo-box/ComboBox.js');
|
|
34
|
+
require('../dialog/Dialog.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
36
|
+
require('../dialog/DialogActions.js');
|
|
37
|
+
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
39
|
+
require('../dialog/DialogCloseButton.js');
|
|
40
|
+
require('../divider/Divider.js');
|
|
41
|
+
require('../drawer/Drawer.js');
|
|
42
|
+
require('../drawer/DrawerCloseButton.js');
|
|
43
|
+
require('../dropdown/Dropdown.js');
|
|
44
|
+
require('../file-drop-zone/FileDropZone.js');
|
|
45
|
+
require('../file-drop-zone/FileDropZoneIcon.js');
|
|
46
|
+
require('../file-drop-zone/FileDropZoneTrigger.js');
|
|
47
|
+
require('../flex-item/FlexItem.js');
|
|
48
|
+
require('../flex-layout/FlexLayout.js');
|
|
49
|
+
require('../flow-layout/FlowLayout.js');
|
|
50
|
+
require('../form-field/FormField.js');
|
|
51
|
+
require('../status-indicator/StatusIndicator.js');
|
|
52
|
+
require('../text/Text.js');
|
|
53
|
+
require('../text/Code.js');
|
|
54
|
+
require('../text/Display.js');
|
|
55
|
+
require('../text/Headings.js');
|
|
56
|
+
require('../text/Label.js');
|
|
57
|
+
require('../text/TextAction.js');
|
|
58
|
+
require('../text/TextNotation.js');
|
|
59
|
+
require('../form-field-context/FormFieldContext.js');
|
|
60
|
+
require('../grid-item/GridItem.js');
|
|
61
|
+
require('../grid-layout/GridLayout.js');
|
|
62
|
+
require('../input/Input.js');
|
|
63
|
+
require('../interactable-card/InteractableCard.js');
|
|
64
|
+
require('../interactable-card/InteractableCardGroup.js');
|
|
65
|
+
require('../interactable-card/InteractableCardGroupContext.js');
|
|
66
|
+
require('../link/Link.js');
|
|
67
|
+
require('../link-card/LinkCard.js');
|
|
68
|
+
require('../list-box/ListBox.js');
|
|
69
|
+
require('../list-control/ListControlContext.js');
|
|
70
|
+
require('../menu/MenuContext.js');
|
|
71
|
+
require('@floating-ui/react');
|
|
72
|
+
require('../menu/MenuItem.js');
|
|
73
|
+
require('../menu/MenuPanel.js');
|
|
74
|
+
require('../menu/MenuTriggerContext.js');
|
|
75
|
+
require('../menu/MenuPanelContext.js');
|
|
76
|
+
require('../menu/MenuGroup.js');
|
|
77
|
+
require('../multiline-input/MultilineInput.js');
|
|
78
|
+
require('../navigation-item/NavigationItem.js');
|
|
79
|
+
require('../option/Option.js');
|
|
80
|
+
require('../option/OptionGroup.js');
|
|
81
|
+
require('../overlay/OverlayContext.js');
|
|
82
|
+
require('../overlay/OverlayPanel.js');
|
|
83
|
+
require('../overlay/OverlayPanelCloseButton.js');
|
|
84
|
+
require('../overlay/OverlayPanelContent.js');
|
|
85
|
+
require('../pagination/Pagination.js');
|
|
86
|
+
require('../pagination/Paginator.js');
|
|
87
|
+
require('../pagination/CompactInput.js');
|
|
88
|
+
require('../pagination/CompactPaginator.js');
|
|
89
|
+
require('../pagination/GoToInput.js');
|
|
90
|
+
require('../panel/Panel.js');
|
|
91
|
+
require('../parent-child-layout/ParentChildLayout.js');
|
|
92
|
+
require('../pill/Pill.js');
|
|
93
|
+
require('../progress/CircularProgress/CircularProgress.js');
|
|
94
|
+
require('../progress/LinearProgress/LinearProgress.js');
|
|
95
|
+
require('../radio-button/RadioButton.js');
|
|
96
|
+
require('../radio-button/RadioButtonGroup.js');
|
|
97
|
+
require('../scrim/Scrim.js');
|
|
98
|
+
require('../segmented-button-group/SegmentedButtonGroup.js');
|
|
99
|
+
require('../spinner/Spinner.js');
|
|
100
|
+
require('../stack-layout/StackLayout.js');
|
|
101
|
+
require('../status-adornment/StatusAdornment.js');
|
|
102
|
+
require('../toast/Toast.js');
|
|
103
|
+
require('../toast/ToastContent.js');
|
|
104
|
+
require('../split-layout/SplitLayout.js');
|
|
105
|
+
require('../switch/Switch.js');
|
|
106
|
+
require('../toggle-button/ToggleButton.js');
|
|
107
|
+
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
108
|
+
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
109
|
+
require('../tooltip/Tooltip.js');
|
|
110
|
+
var Tag$1 = require('./Tag.css.js');
|
|
111
|
+
|
|
112
|
+
const withBaseName = makePrefixer.makePrefixer("saltTag");
|
|
113
|
+
const Tag = React.forwardRef(function Tag2({ children, className, variant = "primary", category = 1, bordered, ...rest }, ref) {
|
|
114
|
+
const targetWindow = window.useWindow();
|
|
115
|
+
styles.useComponentCssInjection({
|
|
116
|
+
testId: "salt-tag",
|
|
117
|
+
css: Tag$1,
|
|
118
|
+
window: targetWindow
|
|
119
|
+
});
|
|
120
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
121
|
+
ref,
|
|
122
|
+
className: clsx.clsx(
|
|
123
|
+
withBaseName(),
|
|
124
|
+
withBaseName(`category-${category}`),
|
|
125
|
+
withBaseName(variant),
|
|
126
|
+
{
|
|
127
|
+
[withBaseName("bordered")]: bordered
|
|
128
|
+
},
|
|
129
|
+
className
|
|
130
|
+
),
|
|
131
|
+
...rest,
|
|
132
|
+
children
|
|
133
|
+
});
|
|
134
|
+
});
|
|
135
|
+
|
|
136
|
+
exports.Tag = Tag;
|
|
137
|
+
//# sourceMappingURL=Tag.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tag.js","sources":["../src/tag/Tag.tsx"],"sourcesContent":["import { makePrefixer } from \"../utils\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport tagCss from \"./Tag.css\";\n\nimport { clsx } from \"clsx\";\n\nconst withBaseName = makePrefixer(\"saltTag\");\n\nexport interface TagProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Styling variant with full border. Defaults to false\n */\n bordered?: boolean;\n /**\n * Emphasize the styling by applying a background color. Defaults to primary\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * The tag category, needs to be within range of 1-20. Defaults to 1\n */\n category?: number;\n}\n\nexport const Tag = forwardRef<HTMLDivElement, TagProps>(function Tag(\n { children, className, variant = \"primary\", category = 1, bordered, ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tag\",\n css: tagCss,\n window: targetWindow,\n });\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n withBaseName(`category-${category}`),\n withBaseName(variant),\n {\n [withBaseName(\"bordered\")]: bordered,\n },\n className\n )}\n {...rest}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Tag","useWindow","useComponentCssInjection","tagCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,SAAS,CAAA,CAAA;AAiBpC,MAAM,GAAM,GAAAC,gBAAA,CAAqC,SAASC,IAAAA,CAC/D,EAAE,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,SAAA,EAAW,QAAW,GAAA,CAAA,EAAG,QAAa,EAAA,GAAA,IAAA,IACvE,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,UAAA;AAAA,IACR,GAAK,EAAAC,KAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,YAAA,CAAa,YAAY,QAAU,CAAA,CAAA,CAAA;AAAA,MACnC,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltText {\n --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n color: var(--saltText-color, var(--text-color));\n font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n}\n\n.saltText::selection {\n background: var(--saltText-highlight, var(--salt-content-foreground-highlight));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--text-max-rows, 0);\n overflow: hidden;\n word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Body emphasis small */\n.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n font-family: var(--salt-text-notation-fontFamily);\n font-size: var(--salt-text-notation-fontSize);\n line-height: var(--salt-text-notation-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Notation emphasis strong */\n.saltText-notation.saltText strong {\n font-weight: var(--salt-text-notation-fontWeight-strong);\n}\n\n/* Notation emphasis small */\n.saltText-notation.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-notation-fontWeight-small);\n}\n\n/* Action */\n.saltText-action.saltText {\n letter-spacing: var(--salt-text-action-letterSpacing);\n text-transform: var(--salt-text-action-textTransform);\n text-align: var(--salt-text-action-textAlign);\n font-weight: var(--salt-text-action-fontWeight);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n font-family: var(--salt-text-code-fontFamily);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n font-family: var(--salt-text-display1-fontFamily);\n font-size: var(--salt-text-display1-fontSize);\n font-weight: var(--salt-text-display1-fontWeight);\n line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 1 emphasis strong */\n.saltText-display1.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display1-fontWeight-strong);\n}\n\n/* Display 1 emphasis small */\n.saltText-display1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display1-fontWeight-small);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n font-family: var(--salt-text-display2-fontFamily);\n font-size: var(--salt-text-display2-fontSize);\n font-weight: var(--salt-text-display2-fontWeight);\n line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 2 emphasis strong */\n.saltText-display2.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display2-fontWeight-strong);\n}\n\n/* Display 2 emphasis small */\n.saltText-display2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display2-fontWeight-small);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n font-family: var(--salt-text-display3-fontFamily);\n font-size: var(--salt-text-display3-fontSize);\n font-weight: var(--salt-text-display3-fontWeight);\n line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Display 3 emphasis strong */\n.saltText-display3.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display3-fontWeight-strong);\n}\n\n/* Display 3 emphasis small */\n.saltText-display3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display3-fontWeight-small);\n}\n\n/* Display 4 */\n.saltText-display4.saltText {\n font-family: var(--salt-text-display4-fontFamily);\n font-size: var(--salt-text-display4-fontSize);\n font-weight: var(--salt-text-display4-fontWeight);\n line-height: var(--salt-text-display4-lineHeight);\n}\n\n/* Display 4 emphasis strong */\n.saltText-display4.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display4-fontWeight-strong);\n}\n\n/* Display 4 emphasis small */\n.saltText-display4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display4-fontWeight-small);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n font-family: var(--salt-text-h1-fontFamily);\n font-size: var(--salt-text-h1-fontSize);\n font-weight: var(--salt-text-h1-fontWeight);\n line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n font-family: var(--salt-text-h2-fontFamily);\n font-size: var(--salt-text-h2-fontSize);\n font-weight: var(--salt-text-h2-fontWeight);\n line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n font-family: var(--salt-text-h3-fontFamily);\n font-size: var(--salt-text-h3-fontSize);\n font-weight: var(--salt-text-h3-fontWeight);\n line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n font-family: var(--salt-text-h4-fontFamily);\n font-size: var(--salt-text-h4-fontSize);\n font-weight: var(--salt-text-h4-fontWeight);\n line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n font-family: var(--salt-text-label-fontFamily);\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n font-weight: var(--salt-text-label-fontWeight-strong);\n}\n\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n";
|
|
3
|
+
var css_248z = ".saltText {\n --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n color: var(--saltText-color, var(--text-color));\n font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n}\n\n.saltText::selection {\n background: var(--saltText-highlight, var(--salt-content-foreground-highlight));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--text-max-rows, 0);\n overflow: hidden;\n word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Body emphasis small */\n.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n font-family: var(--salt-text-notation-fontFamily);\n font-size: var(--salt-text-notation-fontSize);\n line-height: var(--salt-text-notation-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Notation emphasis strong */\n.saltText-notation.saltText strong {\n font-weight: var(--salt-text-notation-fontWeight-strong);\n}\n\n/* Notation emphasis small */\n.saltText-notation.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-notation-fontWeight-small);\n}\n\n/* Action */\n.saltText-action.saltText {\n font-family: var(--salt-text-action-fontFamily);\n letter-spacing: var(--salt-text-action-letterSpacing);\n text-transform: var(--salt-text-action-textTransform);\n text-align: var(--salt-text-action-textAlign);\n font-weight: var(--salt-text-action-fontWeight);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n font-family: var(--salt-text-code-fontFamily);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n font-family: var(--salt-text-display1-fontFamily);\n font-size: var(--salt-text-display1-fontSize);\n font-weight: var(--salt-text-display1-fontWeight);\n line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 1 emphasis strong */\n.saltText-display1.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display1-fontWeight-strong);\n}\n\n/* Display 1 emphasis small */\n.saltText-display1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display1-fontWeight-small);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n font-family: var(--salt-text-display2-fontFamily);\n font-size: var(--salt-text-display2-fontSize);\n font-weight: var(--salt-text-display2-fontWeight);\n line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 2 emphasis strong */\n.saltText-display2.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display2-fontWeight-strong);\n}\n\n/* Display 2 emphasis small */\n.saltText-display2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display2-fontWeight-small);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n font-family: var(--salt-text-display3-fontFamily);\n font-size: var(--salt-text-display3-fontSize);\n font-weight: var(--salt-text-display3-fontWeight);\n line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Display 3 emphasis strong */\n.saltText-display3.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display3-fontWeight-strong);\n}\n\n/* Display 3 emphasis small */\n.saltText-display3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display3-fontWeight-small);\n}\n\n/* Display 4 */\n.saltText-display4.saltText {\n font-family: var(--salt-text-display4-fontFamily);\n font-size: var(--salt-text-display4-fontSize);\n font-weight: var(--salt-text-display4-fontWeight);\n line-height: var(--salt-text-display4-lineHeight);\n}\n\n/* Display 4 emphasis strong */\n.saltText-display4.saltText strong {\n font-size: inherit;\n font-weight: var(--salt-text-display4-fontWeight-strong);\n}\n\n/* Display 4 emphasis small */\n.saltText-display4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-display4-fontWeight-small);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n font-family: var(--salt-text-h1-fontFamily);\n font-size: var(--salt-text-h1-fontSize);\n font-weight: var(--salt-text-h1-fontWeight);\n line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n font-family: var(--salt-text-h2-fontFamily);\n font-size: var(--salt-text-h2-fontSize);\n font-weight: var(--salt-text-h2-fontWeight);\n line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n font-family: var(--salt-text-h3-fontFamily);\n font-size: var(--salt-text-h3-fontSize);\n font-weight: var(--salt-text-h3-fontWeight);\n line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n font-family: var(--salt-text-h4-fontFamily);\n font-size: var(--salt-text-h4-fontSize);\n font-weight: var(--salt-text-h4-fontWeight);\n line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n font-family: var(--salt-text-label-fontFamily);\n font-size: var(--salt-text-label-fontSize);\n line-height: var(--salt-text-label-lineHeight);\n font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n font-weight: var(--salt-text-label-fontWeight-strong);\n}\n\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n font-size: inherit;\n font-weight: var(--salt-text-fontWeight-small);\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=Text.css.js.map
|
package/dist-cjs/text/Text.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');
|
|
@@ -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');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { ValidationStatus } from \"../status-indicator\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"display4\"\n | \"notation\"\n | \"action\"\n | \"code\";\n /**\n * Change text color palette\n * @deprecated Use `color` instead\n */\n variant?: \"primary\" | \"secondary\";\n /*\n * The color of the text. Defaults to \"primary\".\n */\n color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(function Text<\n T extends ElementType = \"div\"\n>(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant,\n color: colorProp,\n ...restProps\n }: TextProps<T>,\n ref?: PolymorphicRef<T>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-text\",\n css: textCss,\n window: targetWindow,\n });\n\n const Component = as ?? \"div\";\n\n const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n const color = variant ?? colorProp ?? \"primary\";\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"lineClamp\")]: maxRows,\n [withBaseName(styleAs as string)]: styleAs,\n [withBaseName(color)]: color !== \"inherit\",\n },\n className\n )}\n {...restProps}\n ref={ref}\n style={textStyles}\n >\n {children}\n </Component>\n );\n});\n"],"names":["makePrefixer","forwardRef","Text","useWindow","useComponentCssInjection","textCss","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { ValidationStatus } from \"../status-indicator\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"display4\"\n | \"notation\"\n | \"action\"\n | \"code\";\n /**\n * Change text color palette\n * @deprecated Use `color` instead\n */\n variant?: \"primary\" | \"secondary\";\n /*\n * The color of the text. Defaults to \"primary\".\n */\n color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(function Text<\n T extends ElementType = \"div\"\n>(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant,\n color: colorProp,\n ...restProps\n }: TextProps<T>,\n ref?: PolymorphicRef<T>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-text\",\n css: textCss,\n window: targetWindow,\n });\n\n const Component = as ?? \"div\";\n\n const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n const color = variant ?? colorProp ?? \"primary\";\n\n return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"lineClamp\")]: maxRows,\n [withBaseName(styleAs as string)]: styleAs,\n [withBaseName(color)]: color !== \"inherit\",\n },\n className\n )}\n {...restProps}\n ref={ref}\n style={textStyles}\n >\n {children}\n </Component>\n );\n});\n"],"names":["makePrefixer","forwardRef","Text","useWindow","useComponentCssInjection","textCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAE/B,MAAA,IAAA,GAAsBC,gBAAW,CAAA,SAASC,KAGrD,CAAA;AAAA,EACE,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX,OAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACJ,GAAA,SAAA;AACL,CAAA,EACA,GACA,EAAA;AA1EF,EAAA,IAAA,EAAA,CAAA;AA2EE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,YAAY,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA;AAExB,EAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,EAAM,MAAA,KAAA,GAAA,CAAQ,EAAW,GAAA,OAAA,IAAA,IAAA,GAAA,OAAA,GAAA,SAAA,KAAX,IAAwB,GAAA,EAAA,GAAA,SAAA,CAAA;AAEtC,EAAA,uBACGC,cAAA,CAAA,SAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,QAC7B,CAAC,YAAa,CAAA,OAAiB,CAAI,GAAA,OAAA;AAAA,QACnC,CAAC,YAAA,CAAa,KAAK,CAAA,GAAI,KAAU,KAAA,SAAA;AAAA,OACnC;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,SAAA;AAAA,IACJ,GAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IAEN,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionFont.js","sources":["../src/theme/ActionFont.ts"],"sourcesContent":["export const UNSTABLE_ActionFontValues = [\"Open Sans\", \"Amplitude\"] as const;\n\nexport type UNSTABLE_ActionFont = (typeof UNSTABLE_ActionFontValues)[number];\n"],"names":[],"mappings":";;;;AAAa,MAAA,yBAAA,GAA4B,CAAC,WAAA,EAAa,WAAW;;;;"}
|