@salt-ds/core 1.20.0 → 1.21.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 +470 -19
- package/dist-cjs/accordion/Accordion.js +75 -0
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +79 -0
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +76 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +73 -0
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +75 -0
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +78 -0
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +74 -0
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +79 -0
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +75 -0
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +76 -2
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +76 -1
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +76 -1
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +75 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +76 -0
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/button/Button.js +76 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +75 -0
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/card/InteractableCard.js +75 -0
- package/dist-cjs/card/InteractableCard.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.js +73 -0
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +74 -0
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +75 -0
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +79 -0
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.css.js +6 -0
- package/dist-cjs/combo-box/ComboBox.css.js.map +1 -0
- package/dist-cjs/combo-box/ComboBox.js +443 -0
- package/dist-cjs/combo-box/ComboBox.js.map +1 -0
- package/dist-cjs/combo-box/useComboBox.js +153 -0
- package/dist-cjs/combo-box/useComboBox.js.map +1 -0
- package/dist-cjs/dialog/Dialog.js +77 -3
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +76 -1
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +74 -1
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +76 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.js +71 -3
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js +75 -2
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +74 -1
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.css.js +6 -0
- package/dist-cjs/dropdown/Dropdown.css.js.map +1 -0
- package/dist-cjs/dropdown/Dropdown.js +412 -0
- package/dist-cjs/dropdown/Dropdown.js.map +1 -0
- package/dist-cjs/file-drop-zone/FileDropZone.js +75 -0
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +76 -0
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +79 -2
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +79 -2
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +74 -0
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +70 -2
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +69 -0
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +78 -0
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +79 -2
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +79 -2
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +16 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +73 -0
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/link/Link.js +70 -2
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js +75 -0
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js +121 -0
- package/dist-cjs/list-control/ListControlContext.js.map +1 -0
- package/dist-cjs/list-control/ListControlState.js +276 -0
- package/dist-cjs/list-control/ListControlState.js.map +1 -0
- package/dist-cjs/multiline-input/MultilineInput.js +73 -0
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +77 -2
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/option/Option.css.js +6 -0
- package/dist-cjs/option/Option.css.js.map +1 -0
- package/dist-cjs/option/Option.js +178 -0
- package/dist-cjs/option/Option.js.map +1 -0
- package/dist-cjs/option/OptionGroup.css.js +6 -0
- package/dist-cjs/option/OptionGroup.css.js.map +1 -0
- package/dist-cjs/option/OptionGroup.js +123 -0
- package/dist-cjs/option/OptionGroup.js.map +1 -0
- package/dist-cjs/option/OptionList.css.js +6 -0
- package/dist-cjs/option/OptionList.css.js.map +1 -0
- package/dist-cjs/option/OptionList.js +118 -0
- package/dist-cjs/option/OptionList.js.map +1 -0
- package/dist-cjs/option/OptionListBase.js +113 -0
- package/dist-cjs/option/OptionListBase.js.map +1 -0
- package/dist-cjs/pagination/CompactInput.js +76 -2
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +69 -2
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +68 -3
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +77 -2
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +78 -2
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +76 -2
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +75 -2
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +77 -2
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/pill/Pill.js +74 -0
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.css.js +6 -0
- package/dist-cjs/pill-input/PillInput.css.js.map +1 -0
- package/dist-cjs/pill-input/PillInput.js +338 -0
- package/dist-cjs/pill-input/PillInput.js.map +1 -0
- package/dist-cjs/pill-input/useTruncatePills.js +83 -0
- package/dist-cjs/pill-input/useTruncatePills.js.map +1 -0
- package/dist-cjs/progress/CircularProgress/CircularProgress.css.js +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +138 -14
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.css.js +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +89 -8
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.js +78 -4
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +77 -3
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +76 -0
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +79 -0
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +78 -3
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +76 -1
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +76 -2
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +78 -0
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +76 -2
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +78 -2
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +75 -0
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +76 -2
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.js +75 -2
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/text/Text.js +77 -2
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/toast/Toast.js +74 -0
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +75 -0
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +73 -0
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +74 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +78 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js +75 -1
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +75 -2
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +77 -0
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +78 -0
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/ownerWindow.js.map +1 -1
- package/dist-cjs/utils/useEventCallback.js +20 -0
- package/dist-cjs/utils/useEventCallback.js.map +1 -0
- package/dist-cjs/utils/useResizeObserver.js +29 -0
- package/dist-cjs/utils/useResizeObserver.js.map +1 -0
- package/dist-cjs/utils/useValueEffect.js +124 -0
- package/dist-cjs/utils/useValueEffect.js.map +1 -0
- package/dist-cjs/viewport/ViewportProvider.js +78 -0
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +75 -0
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +79 -0
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +76 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +73 -0
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +75 -0
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +78 -0
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +74 -0
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +79 -0
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +75 -0
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +76 -2
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +76 -1
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +76 -1
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +75 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +76 -0
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/button/Button.js +76 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +75 -0
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/card/InteractableCard.js +75 -0
- package/dist-es/card/InteractableCard.js.map +1 -1
- package/dist-es/checkbox/Checkbox.js +73 -0
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +74 -0
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +75 -0
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +79 -0
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.css.js +4 -0
- package/dist-es/combo-box/ComboBox.css.js.map +1 -0
- package/dist-es/combo-box/ComboBox.js +439 -0
- package/dist-es/combo-box/ComboBox.js.map +1 -0
- package/dist-es/combo-box/useComboBox.js +149 -0
- package/dist-es/combo-box/useComboBox.js.map +1 -0
- package/dist-es/dialog/Dialog.js +77 -3
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +76 -1
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +74 -1
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +76 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.js +71 -3
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/drawer/Drawer.js +75 -2
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +74 -1
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.css.js +4 -0
- package/dist-es/dropdown/Dropdown.css.js.map +1 -0
- package/dist-es/dropdown/Dropdown.js +408 -0
- package/dist-es/dropdown/Dropdown.js.map +1 -0
- package/dist-es/file-drop-zone/FileDropZone.js +75 -0
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +76 -0
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +79 -2
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +79 -2
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +74 -0
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +70 -2
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +69 -0
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +78 -0
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +79 -2
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +79 -2
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +8 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +73 -0
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/link/Link.js +70 -2
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.js +75 -0
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js +116 -0
- package/dist-es/list-control/ListControlContext.js.map +1 -0
- package/dist-es/list-control/ListControlState.js +271 -0
- package/dist-es/list-control/ListControlState.js.map +1 -0
- package/dist-es/multiline-input/MultilineInput.js +73 -0
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +77 -2
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/option/Option.css.js +4 -0
- package/dist-es/option/Option.css.js.map +1 -0
- package/dist-es/option/Option.js +174 -0
- package/dist-es/option/Option.js.map +1 -0
- package/dist-es/option/OptionGroup.css.js +4 -0
- package/dist-es/option/OptionGroup.css.js.map +1 -0
- package/dist-es/option/OptionGroup.js +119 -0
- package/dist-es/option/OptionGroup.js.map +1 -0
- package/dist-es/option/OptionList.css.js +4 -0
- package/dist-es/option/OptionList.css.js.map +1 -0
- package/dist-es/option/OptionList.js +114 -0
- package/dist-es/option/OptionList.js.map +1 -0
- package/dist-es/option/OptionListBase.js +109 -0
- package/dist-es/option/OptionListBase.js.map +1 -0
- package/dist-es/pagination/CompactInput.js +76 -2
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +69 -2
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +68 -3
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +77 -2
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +78 -2
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +76 -2
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +75 -2
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +77 -2
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/pill/Pill.js +74 -0
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.css.js +4 -0
- package/dist-es/pill-input/PillInput.css.js.map +1 -0
- package/dist-es/pill-input/PillInput.js +334 -0
- package/dist-es/pill-input/PillInput.js.map +1 -0
- package/dist-es/pill-input/useTruncatePills.js +79 -0
- package/dist-es/pill-input/useTruncatePills.js.map +1 -0
- package/dist-es/progress/CircularProgress/CircularProgress.css.js +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +138 -14
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.css.js +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +89 -8
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.js +78 -4
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +77 -3
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +76 -0
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +79 -0
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +78 -3
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +76 -1
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/spinner/Spinner.js +76 -2
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +78 -0
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +76 -2
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js +78 -2
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +75 -0
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +76 -2
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.js +75 -2
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/text/Text.js +77 -2
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/toast/Toast.js +74 -0
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +75 -0
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +73 -0
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +74 -0
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +78 -0
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js +75 -1
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +75 -2
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +77 -0
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +78 -0
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/ownerWindow.js.map +1 -1
- package/dist-es/utils/useEventCallback.js +16 -0
- package/dist-es/utils/useEventCallback.js.map +1 -0
- package/dist-es/utils/useResizeObserver.js +25 -0
- package/dist-es/utils/useResizeObserver.js.map +1 -0
- package/dist-es/utils/useValueEffect.js +120 -0
- package/dist-es/utils/useValueEffect.js.map +1 -0
- package/dist-es/viewport/ViewportProvider.js +78 -0
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/combo-box/ComboBox.d.ts +17 -0
- package/dist-types/combo-box/index.d.ts +1 -0
- package/dist-types/combo-box/useComboBox.d.ts +30 -0
- package/dist-types/dialog/DialogHeader.d.ts +2 -4
- package/dist-types/dropdown/Dropdown.d.ts +99 -0
- package/dist-types/dropdown/index.d.ts +1 -0
- package/dist-types/index.d.ts +4 -0
- package/dist-types/list-control/ListControlContext.d.ts +21 -0
- package/dist-types/list-control/ListControlState.d.ts +70 -0
- package/dist-types/list-control/index.d.ts +1 -0
- package/dist-types/option/Option.d.ts +16 -0
- package/dist-types/option/OptionGroup.d.ts +12 -0
- package/dist-types/option/OptionList.d.ts +5 -0
- package/dist-types/option/OptionListBase.d.ts +4 -0
- package/dist-types/option/index.d.ts +2 -0
- package/dist-types/pill-input/PillInput.d.ts +48 -0
- package/dist-types/pill-input/index.d.ts +1 -0
- package/dist-types/pill-input/useTruncatePills.d.ts +8 -0
- package/dist-types/progress/CircularProgress/CircularProgress.d.ts +5 -0
- package/dist-types/progress/LinearProgress/LinearProgress.d.ts +5 -0
- package/dist-types/utils/index.d.ts +3 -0
- package/dist-types/utils/ownerWindow.d.ts +1 -1
- package/dist-types/utils/useEventCallback.d.ts +4 -0
- package/dist-types/utils/useResizeObserver.d.ts +6 -0
- package/dist-types/utils/useValueEffect.d.ts +4 -0
- package/package.json +1 -1
|
@@ -7,9 +7,83 @@ import '../utils/useFloatingUI/useFloatingUI.js';
|
|
|
7
7
|
import '../utils/useId.js';
|
|
8
8
|
import '../salt-provider/SaltProvider.js';
|
|
9
9
|
import '../viewport/ViewportProvider.js';
|
|
10
|
-
import
|
|
11
|
-
import
|
|
10
|
+
import '../accordion/AccordionGroup.js';
|
|
11
|
+
import '../accordion/AccordionPanel.js';
|
|
12
|
+
import '../accordion/Accordion.js';
|
|
13
|
+
import '../accordion/AccordionHeader.js';
|
|
14
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
15
|
+
import '../avatar/Avatar.js';
|
|
16
|
+
import '../badge/Badge.js';
|
|
17
|
+
import '../banner/Banner.js';
|
|
18
|
+
import '../banner/BannerActions.js';
|
|
19
|
+
import '../banner/BannerContent.js';
|
|
20
|
+
import '../border-item/BorderItem.js';
|
|
21
|
+
import '../border-layout/BorderLayout.js';
|
|
22
|
+
import '../button/Button.js';
|
|
23
|
+
import '../card/Card.js';
|
|
24
|
+
import '../card/InteractableCard.js';
|
|
25
|
+
import '../checkbox/Checkbox.js';
|
|
26
|
+
import '../checkbox/CheckboxGroup.js';
|
|
12
27
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
28
|
+
import { useWindow } from '@salt-ds/window';
|
|
29
|
+
import '../combo-box/ComboBox.js';
|
|
30
|
+
import '../dialog/Dialog.js';
|
|
31
|
+
import '../text/Text.js';
|
|
32
|
+
import '../text/Display.js';
|
|
33
|
+
import '../text/Headings.js';
|
|
34
|
+
import '../text/Label.js';
|
|
35
|
+
import '../text/TextNotation.js';
|
|
36
|
+
import '../text/TextAction.js';
|
|
37
|
+
import '../dialog/DialogContext.js';
|
|
38
|
+
import '../dialog/DialogActions.js';
|
|
39
|
+
import '../dialog/DialogContent.js';
|
|
40
|
+
import '../dialog/DialogCloseButton.js';
|
|
41
|
+
import '../drawer/Drawer.js';
|
|
42
|
+
import '../drawer/DrawerCloseButton.js';
|
|
43
|
+
import '../dropdown/Dropdown.js';
|
|
44
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
45
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
46
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
47
|
+
import '../flex-item/FlexItem.js';
|
|
48
|
+
import '../flex-layout/FlexLayout.js';
|
|
49
|
+
import '../flow-layout/FlowLayout.js';
|
|
50
|
+
import '../form-field/FormField.js';
|
|
51
|
+
import '../form-field-context/FormFieldContext.js';
|
|
52
|
+
import '../grid-item/GridItem.js';
|
|
53
|
+
import '../grid-layout/GridLayout.js';
|
|
54
|
+
import '../input/Input.js';
|
|
55
|
+
import '../link/Link.js';
|
|
56
|
+
import '../link-card/LinkCard.js';
|
|
57
|
+
import '../list-control/ListControlContext.js';
|
|
58
|
+
import '../multiline-input/MultilineInput.js';
|
|
59
|
+
import '../navigation-item/NavigationItem.js';
|
|
60
|
+
import '../option/Option.js';
|
|
61
|
+
import '../option/OptionGroup.js';
|
|
62
|
+
import '../pagination/Pagination.js';
|
|
63
|
+
import '../pagination/Paginator.js';
|
|
64
|
+
import '../pagination/CompactInput.js';
|
|
65
|
+
import '../pagination/CompactPaginator.js';
|
|
66
|
+
import '../pagination/GoToInput.js';
|
|
67
|
+
import '../panel/Panel.js';
|
|
68
|
+
import '../pill/Pill.js';
|
|
69
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
70
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
71
|
+
import '../radio-button/RadioButton.js';
|
|
72
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
73
|
+
import '../scrim/Scrim.js';
|
|
74
|
+
import '../spinner/Spinner.js';
|
|
75
|
+
import '../stack-layout/StackLayout.js';
|
|
76
|
+
import '../status-adornment/StatusAdornment.js';
|
|
77
|
+
import '../toast/Toast.js';
|
|
78
|
+
import '../toast/ToastContent.js';
|
|
79
|
+
import '../split-layout/SplitLayout.js';
|
|
80
|
+
import '../switch/Switch.js';
|
|
81
|
+
import '../toggle-button/ToggleButton.js';
|
|
82
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
83
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
84
|
+
import '../tooltip/Tooltip.js';
|
|
85
|
+
import '@floating-ui/react';
|
|
86
|
+
import css_248z from './StatusIndicator.css.js';
|
|
13
87
|
|
|
14
88
|
const icons = {
|
|
15
89
|
error: ErrorSolidIcon,
|
|
@@ -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":["StatusIndicator","statusIndicatorCss"],"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":["StatusIndicator","statusIndicatorCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,cAAA;AAAA,EACP,OAAS,EAAA,eAAA;AAAA,EACT,OAAS,EAAA,gBAAA;AAAA,EACT,IAAM,EAAA,aAAA;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,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,iBACP,EAAE,SAAA,EAAW,QAAQ,IAAO,GAAA,iBAAA,EAAA,GAAsB,SAAU,EAAA,EAC5D,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,uBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;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,uBACG,GAAA,CAAA,aAAA,EAAA;AAAA,MACC,WAAW,IAAK,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;;;;"}
|
package/dist-es/switch/Switch.js
CHANGED
|
@@ -9,10 +9,83 @@ import '../utils/useFloatingUI/useFloatingUI.js';
|
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import { useDensity } from '../salt-provider/SaltProvider.js';
|
|
11
11
|
import '../viewport/ViewportProvider.js';
|
|
12
|
-
import
|
|
12
|
+
import '../accordion/AccordionGroup.js';
|
|
13
|
+
import '../accordion/AccordionPanel.js';
|
|
14
|
+
import '../accordion/Accordion.js';
|
|
15
|
+
import '../accordion/AccordionHeader.js';
|
|
16
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
17
|
+
import '../avatar/Avatar.js';
|
|
18
|
+
import '../badge/Badge.js';
|
|
19
|
+
import '../banner/Banner.js';
|
|
20
|
+
import '../banner/BannerActions.js';
|
|
21
|
+
import '../banner/BannerContent.js';
|
|
22
|
+
import '../border-item/BorderItem.js';
|
|
23
|
+
import '../border-layout/BorderLayout.js';
|
|
24
|
+
import '../button/Button.js';
|
|
25
|
+
import '../card/Card.js';
|
|
26
|
+
import '../card/InteractableCard.js';
|
|
27
|
+
import '../checkbox/Checkbox.js';
|
|
28
|
+
import '../checkbox/CheckboxGroup.js';
|
|
13
29
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
14
|
-
import
|
|
30
|
+
import { useWindow } from '@salt-ds/window';
|
|
15
31
|
import { SuccessSmallSolidIcon, SuccessSolidIcon } from '@salt-ds/icons';
|
|
32
|
+
import '../combo-box/ComboBox.js';
|
|
33
|
+
import '../dialog/Dialog.js';
|
|
34
|
+
import '../status-indicator/StatusIndicator.js';
|
|
35
|
+
import '../text/Text.js';
|
|
36
|
+
import '../text/Display.js';
|
|
37
|
+
import '../text/Headings.js';
|
|
38
|
+
import '../text/Label.js';
|
|
39
|
+
import '../text/TextNotation.js';
|
|
40
|
+
import '../text/TextAction.js';
|
|
41
|
+
import '../dialog/DialogContext.js';
|
|
42
|
+
import '../dialog/DialogActions.js';
|
|
43
|
+
import '../dialog/DialogContent.js';
|
|
44
|
+
import '../dialog/DialogCloseButton.js';
|
|
45
|
+
import '../drawer/Drawer.js';
|
|
46
|
+
import '../drawer/DrawerCloseButton.js';
|
|
47
|
+
import '../dropdown/Dropdown.js';
|
|
48
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
49
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
50
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
51
|
+
import '../flex-item/FlexItem.js';
|
|
52
|
+
import '../flex-layout/FlexLayout.js';
|
|
53
|
+
import '../flow-layout/FlowLayout.js';
|
|
54
|
+
import '../form-field/FormField.js';
|
|
55
|
+
import '../grid-item/GridItem.js';
|
|
56
|
+
import '../grid-layout/GridLayout.js';
|
|
57
|
+
import '../input/Input.js';
|
|
58
|
+
import '../link/Link.js';
|
|
59
|
+
import '../link-card/LinkCard.js';
|
|
60
|
+
import '../list-control/ListControlContext.js';
|
|
61
|
+
import '../multiline-input/MultilineInput.js';
|
|
62
|
+
import '../navigation-item/NavigationItem.js';
|
|
63
|
+
import '../option/Option.js';
|
|
64
|
+
import '../option/OptionGroup.js';
|
|
65
|
+
import '../pagination/Pagination.js';
|
|
66
|
+
import '../pagination/Paginator.js';
|
|
67
|
+
import '../pagination/CompactInput.js';
|
|
68
|
+
import '../pagination/CompactPaginator.js';
|
|
69
|
+
import '../pagination/GoToInput.js';
|
|
70
|
+
import '../panel/Panel.js';
|
|
71
|
+
import '../pill/Pill.js';
|
|
72
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
73
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
74
|
+
import '../radio-button/RadioButton.js';
|
|
75
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
76
|
+
import '../scrim/Scrim.js';
|
|
77
|
+
import '../spinner/Spinner.js';
|
|
78
|
+
import '../stack-layout/StackLayout.js';
|
|
79
|
+
import '../status-adornment/StatusAdornment.js';
|
|
80
|
+
import '../toast/Toast.js';
|
|
81
|
+
import '../toast/ToastContent.js';
|
|
82
|
+
import '../split-layout/SplitLayout.js';
|
|
83
|
+
import '../toggle-button/ToggleButton.js';
|
|
84
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
85
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
86
|
+
import '../tooltip/Tooltip.js';
|
|
87
|
+
import '@floating-ui/react';
|
|
88
|
+
import css_248z from './Switch.css.js';
|
|
16
89
|
|
|
17
90
|
const withBaseName = makePrefixer("saltSwitch");
|
|
18
91
|
function CheckedIcon(props) {
|
|
@@ -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 {...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 <span className={withBaseName(\"label\")}>{label}</span>\n </label>\n );\n});\n"],"names":["Switch","switchCss","value"],"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 {...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 <span className={withBaseName(\"label\")}>{label}</span>\n </label>\n );\n});\n"],"names":["Switch","switchCss","value"],"mappings":"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"}
|
package/dist-es/text/Text.js
CHANGED
|
@@ -6,9 +6,84 @@ import '../utils/useId.js';
|
|
|
6
6
|
import '../salt-provider/SaltProvider.js';
|
|
7
7
|
import '../viewport/ViewportProvider.js';
|
|
8
8
|
import { clsx } from 'clsx';
|
|
9
|
-
import
|
|
10
|
-
import
|
|
9
|
+
import '../accordion/AccordionGroup.js';
|
|
10
|
+
import '../accordion/AccordionPanel.js';
|
|
11
|
+
import '../accordion/Accordion.js';
|
|
12
|
+
import '../accordion/AccordionHeader.js';
|
|
13
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
14
|
+
import '../avatar/Avatar.js';
|
|
15
|
+
import '../badge/Badge.js';
|
|
16
|
+
import '../banner/Banner.js';
|
|
17
|
+
import '../banner/BannerActions.js';
|
|
18
|
+
import '../banner/BannerContent.js';
|
|
19
|
+
import '../border-item/BorderItem.js';
|
|
20
|
+
import '../border-layout/BorderLayout.js';
|
|
21
|
+
import '../button/Button.js';
|
|
22
|
+
import '../card/Card.js';
|
|
23
|
+
import '../card/InteractableCard.js';
|
|
24
|
+
import '../checkbox/Checkbox.js';
|
|
25
|
+
import '../checkbox/CheckboxGroup.js';
|
|
11
26
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
27
|
+
import { useWindow } from '@salt-ds/window';
|
|
28
|
+
import '@salt-ds/icons';
|
|
29
|
+
import '../combo-box/ComboBox.js';
|
|
30
|
+
import '../dialog/Dialog.js';
|
|
31
|
+
import '../status-indicator/StatusIndicator.js';
|
|
32
|
+
import './Display.js';
|
|
33
|
+
import './Headings.js';
|
|
34
|
+
import './Label.js';
|
|
35
|
+
import './TextNotation.js';
|
|
36
|
+
import './TextAction.js';
|
|
37
|
+
import '../dialog/DialogContext.js';
|
|
38
|
+
import '../dialog/DialogActions.js';
|
|
39
|
+
import '../dialog/DialogContent.js';
|
|
40
|
+
import '../dialog/DialogCloseButton.js';
|
|
41
|
+
import '../drawer/Drawer.js';
|
|
42
|
+
import '../drawer/DrawerCloseButton.js';
|
|
43
|
+
import '../dropdown/Dropdown.js';
|
|
44
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
45
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
46
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
47
|
+
import '../flex-item/FlexItem.js';
|
|
48
|
+
import '../flex-layout/FlexLayout.js';
|
|
49
|
+
import '../flow-layout/FlowLayout.js';
|
|
50
|
+
import '../form-field/FormField.js';
|
|
51
|
+
import '../form-field-context/FormFieldContext.js';
|
|
52
|
+
import '../grid-item/GridItem.js';
|
|
53
|
+
import '../grid-layout/GridLayout.js';
|
|
54
|
+
import '../input/Input.js';
|
|
55
|
+
import '../link/Link.js';
|
|
56
|
+
import '../link-card/LinkCard.js';
|
|
57
|
+
import '../list-control/ListControlContext.js';
|
|
58
|
+
import '../multiline-input/MultilineInput.js';
|
|
59
|
+
import '../navigation-item/NavigationItem.js';
|
|
60
|
+
import '../option/Option.js';
|
|
61
|
+
import '../option/OptionGroup.js';
|
|
62
|
+
import '../pagination/Pagination.js';
|
|
63
|
+
import '../pagination/Paginator.js';
|
|
64
|
+
import '../pagination/CompactInput.js';
|
|
65
|
+
import '../pagination/CompactPaginator.js';
|
|
66
|
+
import '../pagination/GoToInput.js';
|
|
67
|
+
import '../panel/Panel.js';
|
|
68
|
+
import '../pill/Pill.js';
|
|
69
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
70
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
71
|
+
import '../radio-button/RadioButton.js';
|
|
72
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
73
|
+
import '../scrim/Scrim.js';
|
|
74
|
+
import '../spinner/Spinner.js';
|
|
75
|
+
import '../stack-layout/StackLayout.js';
|
|
76
|
+
import '../status-adornment/StatusAdornment.js';
|
|
77
|
+
import '../toast/Toast.js';
|
|
78
|
+
import '../toast/ToastContent.js';
|
|
79
|
+
import '../split-layout/SplitLayout.js';
|
|
80
|
+
import '../switch/Switch.js';
|
|
81
|
+
import '../toggle-button/ToggleButton.js';
|
|
82
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
83
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
84
|
+
import '../tooltip/Tooltip.js';
|
|
85
|
+
import '@floating-ui/react';
|
|
86
|
+
import css_248z from './Text.css.js';
|
|
12
87
|
|
|
13
88
|
const withBaseName = makePrefixer("saltText");
|
|
14
89
|
const Text = forwardRef(
|
package/dist-es/text/Text.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n makePrefixer,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"notation\"\n | \"action\";\n /**\n * Change text color palette\n */\n variant?: \"primary\" | \"secondary\";\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant = \"primary\",\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 return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"lineClamp\")]: maxRows,\n [withBaseName(styleAs || \"\")]: styleAs,\n [withBaseName(variant)]: variant,\n },\n className\n )}\n {...restProps}\n ref={ref}\n style={textStyles}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["textCss"],"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\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Applies disabled styling when true\n */\n disabled?: boolean;\n /**\n * Apply text truncation by mentioning number of rows to be displayed\n */\n maxRows?: number;\n /**\n * Match styling to another text component's style\n */\n styleAs?:\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"label\"\n | \"display1\"\n | \"display2\"\n | \"display3\"\n | \"notation\"\n | \"action\";\n /**\n * Change text color palette\n */\n variant?: \"primary\" | \"secondary\";\n }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n disabled = false,\n maxRows,\n style,\n styleAs,\n variant = \"primary\",\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 return (\n <Component\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"lineClamp\")]: maxRows,\n [withBaseName(styleAs || \"\")]: styleAs,\n [withBaseName(variant)]: variant,\n },\n className\n )}\n {...restProps}\n ref={ref}\n style={textStyles}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["textCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAsB,GAAA,UAAA;AAAA,EACjC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAU,GAAA,SAAA;AAAA,IACP,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,OAAW,IAAA,EAAE,CAAI,GAAA,OAAA;AAAA,UAC/B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,OAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAO,EAAA,UAAA;AAAA,MAEN,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-es/toast/Toast.js
CHANGED
|
@@ -9,6 +9,80 @@ import '../utils/useFloatingUI/useFloatingUI.js';
|
|
|
9
9
|
import '../utils/useId.js';
|
|
10
10
|
import '../salt-provider/SaltProvider.js';
|
|
11
11
|
import '../viewport/ViewportProvider.js';
|
|
12
|
+
import '../accordion/AccordionGroup.js';
|
|
13
|
+
import '../accordion/AccordionPanel.js';
|
|
14
|
+
import '../accordion/Accordion.js';
|
|
15
|
+
import '../accordion/AccordionHeader.js';
|
|
16
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
17
|
+
import '../avatar/Avatar.js';
|
|
18
|
+
import '../badge/Badge.js';
|
|
19
|
+
import '../banner/Banner.js';
|
|
20
|
+
import '../banner/BannerActions.js';
|
|
21
|
+
import '../banner/BannerContent.js';
|
|
22
|
+
import '../border-item/BorderItem.js';
|
|
23
|
+
import '../border-layout/BorderLayout.js';
|
|
24
|
+
import '../button/Button.js';
|
|
25
|
+
import '../card/Card.js';
|
|
26
|
+
import '../card/InteractableCard.js';
|
|
27
|
+
import '../checkbox/Checkbox.js';
|
|
28
|
+
import '../checkbox/CheckboxGroup.js';
|
|
29
|
+
import '@salt-ds/icons';
|
|
30
|
+
import '../combo-box/ComboBox.js';
|
|
31
|
+
import '../dialog/Dialog.js';
|
|
32
|
+
import '../text/Text.js';
|
|
33
|
+
import '../text/Display.js';
|
|
34
|
+
import '../text/Headings.js';
|
|
35
|
+
import '../text/Label.js';
|
|
36
|
+
import '../text/TextNotation.js';
|
|
37
|
+
import '../text/TextAction.js';
|
|
38
|
+
import '../dialog/DialogContext.js';
|
|
39
|
+
import '../dialog/DialogActions.js';
|
|
40
|
+
import '../dialog/DialogContent.js';
|
|
41
|
+
import '../dialog/DialogCloseButton.js';
|
|
42
|
+
import '../drawer/Drawer.js';
|
|
43
|
+
import '../drawer/DrawerCloseButton.js';
|
|
44
|
+
import '../dropdown/Dropdown.js';
|
|
45
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
46
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
47
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
48
|
+
import '../flex-item/FlexItem.js';
|
|
49
|
+
import '../flex-layout/FlexLayout.js';
|
|
50
|
+
import '../flow-layout/FlowLayout.js';
|
|
51
|
+
import '../form-field/FormField.js';
|
|
52
|
+
import '../form-field-context/FormFieldContext.js';
|
|
53
|
+
import '../grid-item/GridItem.js';
|
|
54
|
+
import '../grid-layout/GridLayout.js';
|
|
55
|
+
import '../input/Input.js';
|
|
56
|
+
import '../link/Link.js';
|
|
57
|
+
import '../link-card/LinkCard.js';
|
|
58
|
+
import '../list-control/ListControlContext.js';
|
|
59
|
+
import '../multiline-input/MultilineInput.js';
|
|
60
|
+
import '../navigation-item/NavigationItem.js';
|
|
61
|
+
import '../option/Option.js';
|
|
62
|
+
import '../option/OptionGroup.js';
|
|
63
|
+
import '../pagination/Pagination.js';
|
|
64
|
+
import '../pagination/Paginator.js';
|
|
65
|
+
import '../pagination/CompactInput.js';
|
|
66
|
+
import '../pagination/CompactPaginator.js';
|
|
67
|
+
import '../pagination/GoToInput.js';
|
|
68
|
+
import '../panel/Panel.js';
|
|
69
|
+
import '../pill/Pill.js';
|
|
70
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
71
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
72
|
+
import '../radio-button/RadioButton.js';
|
|
73
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
74
|
+
import '../scrim/Scrim.js';
|
|
75
|
+
import '../spinner/Spinner.js';
|
|
76
|
+
import '../stack-layout/StackLayout.js';
|
|
77
|
+
import '../status-adornment/StatusAdornment.js';
|
|
78
|
+
import './ToastContent.js';
|
|
79
|
+
import '../split-layout/SplitLayout.js';
|
|
80
|
+
import '../switch/Switch.js';
|
|
81
|
+
import '../toggle-button/ToggleButton.js';
|
|
82
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
83
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
84
|
+
import '../tooltip/Tooltip.js';
|
|
85
|
+
import '@floating-ui/react';
|
|
12
86
|
import css_248z from './Toast.css.js';
|
|
13
87
|
|
|
14
88
|
const withBaseName = makePrefixer("saltToast");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * A string to determine the current state of the Toast.\n */\n status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n props,\n ref\n) {\n const { children, className, status = \"info\", ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast\",\n css: toastCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(status), className)}\n role=\"alert\"\n {...rest}\n ref={ref}\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["Toast","toastCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * A string to determine the current state of the Toast.\n */\n status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n props,\n ref\n) {\n const { children, className, status = \"info\", ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast\",\n css: toastCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), withBaseName(status), className)}\n role=\"alert\"\n {...rest}\n ref={ref}\n >\n <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n {children}\n </div>\n );\n});\n"],"names":["Toast","toastCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AAStC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,MAAS,GAAA,MAAA,EAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AAC1D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAW,IAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACjE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -8,6 +8,81 @@ import '../utils/useFloatingUI/useFloatingUI.js';
|
|
|
8
8
|
import '../utils/useId.js';
|
|
9
9
|
import '../salt-provider/SaltProvider.js';
|
|
10
10
|
import '../viewport/ViewportProvider.js';
|
|
11
|
+
import '../accordion/AccordionGroup.js';
|
|
12
|
+
import '../accordion/AccordionPanel.js';
|
|
13
|
+
import '../accordion/Accordion.js';
|
|
14
|
+
import '../accordion/AccordionHeader.js';
|
|
15
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
16
|
+
import '../avatar/Avatar.js';
|
|
17
|
+
import '../badge/Badge.js';
|
|
18
|
+
import '../banner/Banner.js';
|
|
19
|
+
import '../banner/BannerActions.js';
|
|
20
|
+
import '../banner/BannerContent.js';
|
|
21
|
+
import '../border-item/BorderItem.js';
|
|
22
|
+
import '../border-layout/BorderLayout.js';
|
|
23
|
+
import '../button/Button.js';
|
|
24
|
+
import '../card/Card.js';
|
|
25
|
+
import '../card/InteractableCard.js';
|
|
26
|
+
import '../checkbox/Checkbox.js';
|
|
27
|
+
import '../checkbox/CheckboxGroup.js';
|
|
28
|
+
import '@salt-ds/icons';
|
|
29
|
+
import '../combo-box/ComboBox.js';
|
|
30
|
+
import '../dialog/Dialog.js';
|
|
31
|
+
import '../status-indicator/StatusIndicator.js';
|
|
32
|
+
import '../text/Text.js';
|
|
33
|
+
import '../text/Display.js';
|
|
34
|
+
import '../text/Headings.js';
|
|
35
|
+
import '../text/Label.js';
|
|
36
|
+
import '../text/TextNotation.js';
|
|
37
|
+
import '../text/TextAction.js';
|
|
38
|
+
import '../dialog/DialogContext.js';
|
|
39
|
+
import '../dialog/DialogActions.js';
|
|
40
|
+
import '../dialog/DialogContent.js';
|
|
41
|
+
import '../dialog/DialogCloseButton.js';
|
|
42
|
+
import '../drawer/Drawer.js';
|
|
43
|
+
import '../drawer/DrawerCloseButton.js';
|
|
44
|
+
import '../dropdown/Dropdown.js';
|
|
45
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
46
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
47
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
48
|
+
import '../flex-item/FlexItem.js';
|
|
49
|
+
import '../flex-layout/FlexLayout.js';
|
|
50
|
+
import '../flow-layout/FlowLayout.js';
|
|
51
|
+
import '../form-field/FormField.js';
|
|
52
|
+
import '../form-field-context/FormFieldContext.js';
|
|
53
|
+
import '../grid-item/GridItem.js';
|
|
54
|
+
import '../grid-layout/GridLayout.js';
|
|
55
|
+
import '../input/Input.js';
|
|
56
|
+
import '../link/Link.js';
|
|
57
|
+
import '../link-card/LinkCard.js';
|
|
58
|
+
import '../list-control/ListControlContext.js';
|
|
59
|
+
import '../multiline-input/MultilineInput.js';
|
|
60
|
+
import '../navigation-item/NavigationItem.js';
|
|
61
|
+
import '../option/Option.js';
|
|
62
|
+
import '../option/OptionGroup.js';
|
|
63
|
+
import '../pagination/Pagination.js';
|
|
64
|
+
import '../pagination/Paginator.js';
|
|
65
|
+
import '../pagination/CompactInput.js';
|
|
66
|
+
import '../pagination/CompactPaginator.js';
|
|
67
|
+
import '../pagination/GoToInput.js';
|
|
68
|
+
import '../panel/Panel.js';
|
|
69
|
+
import '../pill/Pill.js';
|
|
70
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
71
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
72
|
+
import '../radio-button/RadioButton.js';
|
|
73
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
74
|
+
import '../scrim/Scrim.js';
|
|
75
|
+
import '../spinner/Spinner.js';
|
|
76
|
+
import '../stack-layout/StackLayout.js';
|
|
77
|
+
import '../status-adornment/StatusAdornment.js';
|
|
78
|
+
import './Toast.js';
|
|
79
|
+
import '../split-layout/SplitLayout.js';
|
|
80
|
+
import '../switch/Switch.js';
|
|
81
|
+
import '../toggle-button/ToggleButton.js';
|
|
82
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
83
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
84
|
+
import '../tooltip/Tooltip.js';
|
|
85
|
+
import '@floating-ui/react';
|
|
11
86
|
import css_248z from './ToastContent.css.js';
|
|
12
87
|
|
|
13
88
|
const withBaseName = makePrefixer("saltToastContent");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n ForwardedRef,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastContentCss from \"./ToastContent.css\";\n\nconst withBaseName = makePrefixer(\"saltToastContent\");\n\nexport interface ToastContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Toast Content\n */\n children?: ReactNode;\n}\n\nexport const ToastContent = forwardRef(function ToastContent(\n { children, className, ...restProps }: ToastContentProps,\n ref: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast-content\",\n css: toastContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["ToastContent","toastContentCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToastContent.js","sources":["../src/toast/ToastContent.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ComponentPropsWithoutRef,\n ForwardedRef,\n forwardRef,\n ReactNode,\n} from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastContentCss from \"./ToastContent.css\";\n\nconst withBaseName = makePrefixer(\"saltToastContent\");\n\nexport interface ToastContentProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of Toast Content\n */\n children?: ReactNode;\n}\n\nexport const ToastContent = forwardRef(function ToastContent(\n { children, className, ...restProps }: ToastContentProps,\n ref: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toast-content\",\n css: toastContentCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n {children}\n </div>\n );\n});\n"],"names":["ToastContent","toastContentCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA,CAAA;AASvC,MAAA,YAAA,GAAe,WAAW,SAASA,aAAAA,CAC9C,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACpC,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC7D,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -12,6 +12,79 @@ import { useForkRef } from '../utils/useForkRef.js';
|
|
|
12
12
|
import '../utils/useId.js';
|
|
13
13
|
import '../salt-provider/SaltProvider.js';
|
|
14
14
|
import '../viewport/ViewportProvider.js';
|
|
15
|
+
import '../accordion/AccordionGroup.js';
|
|
16
|
+
import '../accordion/AccordionPanel.js';
|
|
17
|
+
import '../accordion/Accordion.js';
|
|
18
|
+
import '../accordion/AccordionHeader.js';
|
|
19
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
20
|
+
import '../avatar/Avatar.js';
|
|
21
|
+
import '../badge/Badge.js';
|
|
22
|
+
import '../banner/Banner.js';
|
|
23
|
+
import '../banner/BannerActions.js';
|
|
24
|
+
import '../banner/BannerContent.js';
|
|
25
|
+
import '../border-item/BorderItem.js';
|
|
26
|
+
import '../border-layout/BorderLayout.js';
|
|
27
|
+
import '../button/Button.js';
|
|
28
|
+
import '../card/Card.js';
|
|
29
|
+
import '../card/InteractableCard.js';
|
|
30
|
+
import '../checkbox/Checkbox.js';
|
|
31
|
+
import '../checkbox/CheckboxGroup.js';
|
|
32
|
+
import '@salt-ds/icons';
|
|
33
|
+
import '../combo-box/ComboBox.js';
|
|
34
|
+
import '../dialog/Dialog.js';
|
|
35
|
+
import '../status-indicator/StatusIndicator.js';
|
|
36
|
+
import '../text/Text.js';
|
|
37
|
+
import '../text/Display.js';
|
|
38
|
+
import '../text/Headings.js';
|
|
39
|
+
import '../text/Label.js';
|
|
40
|
+
import '../text/TextNotation.js';
|
|
41
|
+
import '../text/TextAction.js';
|
|
42
|
+
import '../dialog/DialogContext.js';
|
|
43
|
+
import '../dialog/DialogActions.js';
|
|
44
|
+
import '../dialog/DialogContent.js';
|
|
45
|
+
import '../dialog/DialogCloseButton.js';
|
|
46
|
+
import '../drawer/Drawer.js';
|
|
47
|
+
import '../drawer/DrawerCloseButton.js';
|
|
48
|
+
import '../dropdown/Dropdown.js';
|
|
49
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
50
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
51
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
52
|
+
import '../flex-item/FlexItem.js';
|
|
53
|
+
import '../flex-layout/FlexLayout.js';
|
|
54
|
+
import '../flow-layout/FlowLayout.js';
|
|
55
|
+
import '../form-field/FormField.js';
|
|
56
|
+
import '../form-field-context/FormFieldContext.js';
|
|
57
|
+
import '../grid-item/GridItem.js';
|
|
58
|
+
import '../grid-layout/GridLayout.js';
|
|
59
|
+
import '../input/Input.js';
|
|
60
|
+
import '../link/Link.js';
|
|
61
|
+
import '../link-card/LinkCard.js';
|
|
62
|
+
import '../list-control/ListControlContext.js';
|
|
63
|
+
import '../multiline-input/MultilineInput.js';
|
|
64
|
+
import '../navigation-item/NavigationItem.js';
|
|
65
|
+
import '../option/Option.js';
|
|
66
|
+
import '../option/OptionGroup.js';
|
|
67
|
+
import '../pagination/Pagination.js';
|
|
68
|
+
import '../pagination/Paginator.js';
|
|
69
|
+
import '../pagination/CompactInput.js';
|
|
70
|
+
import '../pagination/CompactPaginator.js';
|
|
71
|
+
import '../pagination/GoToInput.js';
|
|
72
|
+
import '../panel/Panel.js';
|
|
73
|
+
import '../pill/Pill.js';
|
|
74
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
75
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
76
|
+
import '../radio-button/RadioButton.js';
|
|
77
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
78
|
+
import '../scrim/Scrim.js';
|
|
79
|
+
import '../spinner/Spinner.js';
|
|
80
|
+
import '../stack-layout/StackLayout.js';
|
|
81
|
+
import '../status-adornment/StatusAdornment.js';
|
|
82
|
+
import '../toast/Toast.js';
|
|
83
|
+
import '../toast/ToastContent.js';
|
|
84
|
+
import '../split-layout/SplitLayout.js';
|
|
85
|
+
import '../switch/Switch.js';
|
|
86
|
+
import '../tooltip/Tooltip.js';
|
|
87
|
+
import '@floating-ui/react';
|
|
15
88
|
import css_248z from './ToggleButton.css.js';
|
|
16
89
|
|
|
17
90
|
const withBaseName = makePrefixer("saltToggleButton");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n forwardRef,\n useRef,\n MouseEvent,\n FocusEvent,\n ComponentPropsWithoutRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n selected?: boolean;\n onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n function ToggleButton(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp,\n value,\n onClick,\n onFocus,\n onChange,\n selected: selectedProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button\",\n css: toggleButtonCss,\n window: targetWindow,\n });\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleRef = useForkRef(ref, buttonRef);\n\n const toggleButtonGroup = useToggleButtonGroup();\n\n const toggleButtonGroupSelected = toggleButtonGroup\n ? toggleButtonGroup.isSelected(value)\n : selectedProp;\n const focusable = toggleButtonGroup\n ? toggleButtonGroup?.isFocused(value)\n : true;\n const disabled = toggleButtonGroup?.disabled || disabledProp;\n\n const [selected, setSelected] = useControlled({\n controlled: toggleButtonGroupSelected,\n default: Boolean(selectedProp),\n name: \"ToggleButton\",\n state: \"selected\",\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.select(event);\n setSelected(!selected);\n onChange?.(event);\n onClick?.(event);\n };\n\n const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.focus(value);\n onFocus?.(event);\n };\n\n const ariaChecked = selected && !disabled;\n\n return (\n <button\n aria-pressed={!toggleButtonGroup ? ariaChecked : undefined}\n aria-checked={toggleButtonGroup ? ariaChecked : undefined}\n role={toggleButtonGroup ? \"radio\" : undefined}\n className={clsx(withBaseName(), className)}\n disabled={disabled}\n ref={handleRef}\n onClick={handleClick}\n onFocus={handleFocus}\n tabIndex={focusable && !disabled ? 0 : -1}\n value={value}\n {...rest}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["ToggleButton","toggleButtonCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleButton.js","sources":["../src/toggle-button/ToggleButton.tsx"],"sourcesContent":["import {\n forwardRef,\n useRef,\n MouseEvent,\n FocusEvent,\n ComponentPropsWithoutRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useToggleButtonGroup } from \"../toggle-button-group\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport toggleButtonCss from \"./ToggleButton.css\";\n\nexport interface ToggleButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n selected?: boolean;\n onChange?: (event: MouseEvent<HTMLButtonElement>) => void;\n value: string | ReadonlyArray<string> | number | undefined;\n}\n\nconst withBaseName = makePrefixer(\"saltToggleButton\");\n\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n function ToggleButton(props, ref) {\n const {\n children,\n className,\n disabled: disabledProp,\n value,\n onClick,\n onFocus,\n onChange,\n selected: selectedProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-toggle-button\",\n css: toggleButtonCss,\n window: targetWindow,\n });\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleRef = useForkRef(ref, buttonRef);\n\n const toggleButtonGroup = useToggleButtonGroup();\n\n const toggleButtonGroupSelected = toggleButtonGroup\n ? toggleButtonGroup.isSelected(value)\n : selectedProp;\n const focusable = toggleButtonGroup\n ? toggleButtonGroup?.isFocused(value)\n : true;\n const disabled = toggleButtonGroup?.disabled || disabledProp;\n\n const [selected, setSelected] = useControlled({\n controlled: toggleButtonGroupSelected,\n default: Boolean(selectedProp),\n name: \"ToggleButton\",\n state: \"selected\",\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.select(event);\n setSelected(!selected);\n onChange?.(event);\n onClick?.(event);\n };\n\n const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n toggleButtonGroup?.focus(value);\n onFocus?.(event);\n };\n\n const ariaChecked = selected && !disabled;\n\n return (\n <button\n aria-pressed={!toggleButtonGroup ? ariaChecked : undefined}\n aria-checked={toggleButtonGroup ? ariaChecked : undefined}\n role={toggleButtonGroup ? \"radio\" : undefined}\n className={clsx(withBaseName(), className)}\n disabled={disabled}\n ref={handleRef}\n onClick={handleClick}\n onFocus={handleFocus}\n tabIndex={focusable && !disabled ? 0 : -1}\n value={value}\n {...rest}\n >\n {children}\n </button>\n );\n }\n);\n"],"names":["ToggleButton","toggleButtonCss"],"mappings":"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"}
|