@salt-ds/core 1.21.0 → 1.22.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 +5 -1
- package/dist-cjs/accordion/Accordion.js +10 -8
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +10 -8
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +10 -8
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +9 -7
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +10 -8
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +10 -8
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +10 -8
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +10 -8
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +10 -8
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +10 -8
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +10 -8
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +10 -8
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +10 -8
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +10 -8
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/button/Button.js +10 -8
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +10 -8
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/card/InteractableCard.js +10 -8
- package/dist-cjs/card/InteractableCard.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.js +10 -8
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +10 -8
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +10 -8
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +10 -8
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.js +10 -8
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +10 -8
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dialog/Dialog.js +10 -8
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +10 -8
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +10 -8
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +10 -8
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.css.js +1 -1
- package/dist-cjs/dialog/DialogHeader.js +56 -51
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js +12 -10
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +10 -8
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js +10 -8
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js +10 -8
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +10 -8
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +10 -8
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +10 -8
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +10 -8
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +4 -2
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +5 -3
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +10 -8
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +10 -8
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +10 -8
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +4 -2
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +10 -8
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/link/Link.js +10 -8
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js +10 -8
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js +10 -8
- package/dist-cjs/list-control/ListControlContext.js.map +1 -1
- package/dist-cjs/list-control/ListControlState.js +10 -8
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/multiline-input/MultilineInput.js +10 -8
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +10 -8
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/option/Option.js +10 -8
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.js +10 -8
- package/dist-cjs/option/OptionGroup.js.map +1 -1
- package/dist-cjs/option/OptionList.js +10 -8
- package/dist-cjs/option/OptionList.js.map +1 -1
- package/dist-cjs/option/OptionListBase.js +10 -8
- package/dist-cjs/option/OptionListBase.js.map +1 -1
- package/dist-cjs/pagination/CompactInput.js +10 -8
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +5 -3
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +4 -2
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +10 -8
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +10 -8
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +10 -8
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +10 -8
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +10 -8
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/pill/Pill.js +10 -8
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.js +10 -8
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +10 -8
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +10 -8
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.js +10 -8
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +10 -8
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +10 -8
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +10 -8
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +10 -8
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +10 -8
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +10 -8
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +10 -8
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +10 -8
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +10 -8
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +10 -8
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +9 -7
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.js +10 -8
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/text/Code.js +21 -0
- package/dist-cjs/text/Code.js.map +1 -0
- package/dist-cjs/text/Text.css.js +1 -1
- package/dist-cjs/text/Text.js +9 -7
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/toast/Toast.js +9 -7
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +10 -8
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +10 -8
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +10 -8
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +10 -8
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js +9 -7
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +9 -7
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +10 -8
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +10 -8
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/useValueEffect.js +10 -8
- package/dist-cjs/utils/useValueEffect.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +10 -8
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +10 -8
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +10 -8
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +10 -8
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +9 -7
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +10 -8
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +10 -8
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +10 -8
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +10 -8
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +10 -8
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +10 -8
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +10 -8
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +10 -8
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +10 -8
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +10 -8
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/button/Button.js +10 -8
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +10 -8
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/card/InteractableCard.js +10 -8
- package/dist-es/card/InteractableCard.js.map +1 -1
- package/dist-es/checkbox/Checkbox.js +10 -8
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +10 -8
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +10 -8
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +10 -8
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.js +10 -8
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +10 -8
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dialog/Dialog.js +10 -8
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +10 -8
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +10 -8
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +10 -8
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.css.js +1 -1
- package/dist-es/dialog/DialogHeader.js +56 -51
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/drawer/Drawer.js +12 -10
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +10 -8
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js +10 -8
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.js +10 -8
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +10 -8
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +10 -8
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +10 -8
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +10 -8
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +4 -2
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +5 -3
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +10 -8
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +10 -8
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +10 -8
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +2 -1
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +10 -8
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/link/Link.js +10 -8
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.js +10 -8
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js +10 -8
- package/dist-es/list-control/ListControlContext.js.map +1 -1
- package/dist-es/list-control/ListControlState.js +10 -8
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/multiline-input/MultilineInput.js +10 -8
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +10 -8
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/option/Option.js +10 -8
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.js +10 -8
- package/dist-es/option/OptionGroup.js.map +1 -1
- package/dist-es/option/OptionList.js +10 -8
- package/dist-es/option/OptionList.js.map +1 -1
- package/dist-es/option/OptionListBase.js +10 -8
- package/dist-es/option/OptionListBase.js.map +1 -1
- package/dist-es/pagination/CompactInput.js +10 -8
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +5 -3
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +4 -2
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +10 -8
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +10 -8
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +10 -8
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +10 -8
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +10 -8
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/pill/Pill.js +10 -8
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.js +10 -8
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +10 -8
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +10 -8
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.js +10 -8
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +10 -8
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +10 -8
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +10 -8
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +10 -8
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +10 -8
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/spinner/Spinner.js +10 -8
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +10 -8
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +10 -8
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js +10 -8
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +10 -8
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +9 -7
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.js +10 -8
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/text/Code.js +17 -0
- package/dist-es/text/Code.js.map +1 -0
- package/dist-es/text/Text.css.js +1 -1
- package/dist-es/text/Text.js +9 -7
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/toast/Toast.js +9 -7
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +10 -8
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +10 -8
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +10 -8
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +10 -8
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js +9 -7
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +9 -7
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +10 -8
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +10 -8
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/useValueEffect.js +10 -8
- package/dist-es/utils/useValueEffect.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js +10 -8
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/dialog/DialogHeader.d.ts +1 -1
- package/dist-types/text/Code.d.ts +2 -0
- package/dist-types/text/Text.d.ts +1 -1
- package/dist-types/text/index.d.ts +2 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioButtonIcon.js","sources":["../src/radio-button/RadioButtonIcon.tsx"],"sourcesContent":["import { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport radioButtonIconCss from \"./RadioButtonIcon.css\";\nimport { ComponentPropsWithoutRef } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonIcon\");\n\nexport interface RadioButtonIconProps extends ComponentPropsWithoutRef<\"div\"> {\n checked?: boolean;\n disabled?: boolean;\n /**\n * @deprecated Use validationStatus instead\n */\n error?: boolean;\n readOnly?: boolean;\n validationStatus?: AdornmentValidationStatus;\n}\n\n/**\n * Default radio icon\n */\nexport const RadioButtonIcon = ({\n checked,\n className,\n error,\n disabled,\n validationStatus,\n readOnly,\n ...rest\n}: RadioButtonIconProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-radio-button-icon\",\n css: radioButtonIconCss,\n window: targetWindow,\n });\n return (\n <div\n aria-hidden=\"true\"\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"checked\")]: checked,\n [withBaseName(\"error\")]: error,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(validationStatus || \"\")]: validationStatus,\n [withBaseName(\"readOnly\")]: readOnly,\n },\n className\n )}\n {...rest}\n >\n {checked && !readOnly && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 12 12\"\n fill=\"currentColor\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M0 6a6 6 0 1 1 12 0A6 6 0 0 1 0 6Zm6 3a3 3 0 1 1 0-6 3 3 0 0 1 0 6Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n )}\n {checked && readOnly && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n viewBox=\"0 0 12 12\"\n >\n <path\n fill=\"#161616\"\n d=\"M9.5 6a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Z\"\n />\n </svg>\n )}\n </div>\n );\n};\n"],"names":["radioButtonIconCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"RadioButtonIcon.js","sources":["../src/radio-button/RadioButtonIcon.tsx"],"sourcesContent":["import { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { AdornmentValidationStatus } from \"../status-adornment\";\nimport radioButtonIconCss from \"./RadioButtonIcon.css\";\nimport { ComponentPropsWithoutRef } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonIcon\");\n\nexport interface RadioButtonIconProps extends ComponentPropsWithoutRef<\"div\"> {\n checked?: boolean;\n disabled?: boolean;\n /**\n * @deprecated Use validationStatus instead\n */\n error?: boolean;\n readOnly?: boolean;\n validationStatus?: AdornmentValidationStatus;\n}\n\n/**\n * Default radio icon\n */\nexport const RadioButtonIcon = ({\n checked,\n className,\n error,\n disabled,\n validationStatus,\n readOnly,\n ...rest\n}: RadioButtonIconProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-radio-button-icon\",\n css: radioButtonIconCss,\n window: targetWindow,\n });\n return (\n <div\n aria-hidden=\"true\"\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"checked\")]: checked,\n [withBaseName(\"error\")]: error,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(validationStatus || \"\")]: validationStatus,\n [withBaseName(\"readOnly\")]: readOnly,\n },\n className\n )}\n {...rest}\n >\n {checked && !readOnly && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 12 12\"\n fill=\"currentColor\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M0 6a6 6 0 1 1 12 0A6 6 0 0 1 0 6Zm6 3a3 3 0 1 1 0-6 3 3 0 0 1 0 6Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n )}\n {checked && readOnly && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n viewBox=\"0 0 12 12\"\n >\n <path\n fill=\"#161616\"\n d=\"M9.5 6a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Z\"\n />\n </svg>\n )}\n </div>\n );\n};\n"],"names":["radioButtonIconCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAgBhD,MAAM,kBAAkB,CAAC;AAAA,EAC9B,OAAA;AAAA,EACA,SAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,gBAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,IAAA;AACL,CAA4B,KAAA;AAC1B,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,QAC3B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,QACzB,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,gBAAoB,IAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,QACxC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,OAC9B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAW,OAAA,IAAA,CAAC,4BACV,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,KAAM,EAAA,4BAAA;AAAA,QACN,OAAQ,EAAA,WAAA;AAAA,QACR,IAAK,EAAA,cAAA;AAAA,QAEL,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,UACC,QAAS,EAAA,SAAA;AAAA,UACT,CAAE,EAAA,qEAAA;AAAA,UACF,QAAS,EAAA,SAAA;AAAA,SACX,CAAA;AAAA,OACF,CAAA;AAAA,MAED,OAAA,IAAW,4BACT,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,KAAM,EAAA,4BAAA;AAAA,QACN,IAAK,EAAA,cAAA;AAAA,QACL,OAAQ,EAAA,WAAA;AAAA,QAER,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,UACC,IAAK,EAAA,SAAA;AAAA,UACL,CAAE,EAAA,6CAAA;AAAA,SACJ,CAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -28,16 +28,10 @@ import '@salt-ds/window';
|
|
|
28
28
|
import '@salt-ds/icons';
|
|
29
29
|
import '../../combo-box/ComboBox.js';
|
|
30
30
|
import '../../dialog/Dialog.js';
|
|
31
|
-
import '../../
|
|
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';
|
|
31
|
+
import '../../dialog/DialogHeader.js';
|
|
39
32
|
import '../../dialog/DialogActions.js';
|
|
40
33
|
import '../../dialog/DialogContent.js';
|
|
34
|
+
import '../../dialog/DialogContext.js';
|
|
41
35
|
import '../../dialog/DialogCloseButton.js';
|
|
42
36
|
import '../../drawer/Drawer.js';
|
|
43
37
|
import '../../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../../flex-item/FlexItem.js';
|
|
|
49
43
|
import '../../flex-layout/FlexLayout.js';
|
|
50
44
|
import '../../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../../form-field/FormField.js';
|
|
46
|
+
import '../../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../../text/Text.js';
|
|
48
|
+
import '../../text/Code.js';
|
|
49
|
+
import '../../text/Display.js';
|
|
50
|
+
import '../../text/Headings.js';
|
|
51
|
+
import '../../text/Label.js';
|
|
52
|
+
import '../../text/TextAction.js';
|
|
53
|
+
import '../../text/TextNotation.js';
|
|
52
54
|
import '../../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../../grid-item/GridItem.js';
|
|
54
56
|
import '../../grid-layout/GridLayout.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroupContext.js","sources":["../src/radio-button/internal/RadioGroupContext.tsx"],"sourcesContent":["import { ChangeEventHandler } from \"react\";\nimport { AdornmentValidationStatus } from \"../../status-adornment\";\nimport { createContext } from \"../../utils\";\n\nexport interface RadioGroupContextValue {\n disabled?: boolean;\n name?: string;\n value?: string;\n onChange?: ChangeEventHandler<HTMLElement>;\n readOnly?: boolean;\n validationStatus?: AdornmentValidationStatus;\n}\n\nexport const RadioGroupContext = createContext<\n RadioGroupContextValue | undefined\n>(\"RadioGroupContext\", undefined);\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"RadioGroupContext.js","sources":["../src/radio-button/internal/RadioGroupContext.tsx"],"sourcesContent":["import { ChangeEventHandler } from \"react\";\nimport { AdornmentValidationStatus } from \"../../status-adornment\";\nimport { createContext } from \"../../utils\";\n\nexport interface RadioGroupContextValue {\n disabled?: boolean;\n name?: string;\n value?: string;\n onChange?: ChangeEventHandler<HTMLElement>;\n readOnly?: boolean;\n validationStatus?: AdornmentValidationStatus;\n}\n\nexport const RadioGroupContext = createContext<\n RadioGroupContextValue | undefined\n>(\"RadioGroupContext\", undefined);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaa,MAAA,iBAAA,GAAoB,aAE/B,CAAA,mBAAA,EAAqB,KAAS,CAAA;;;;"}
|
|
@@ -28,16 +28,10 @@ import { useWindow } from '@salt-ds/window';
|
|
|
28
28
|
import '@salt-ds/icons';
|
|
29
29
|
import '../combo-box/ComboBox.js';
|
|
30
30
|
import '../dialog/Dialog.js';
|
|
31
|
-
import '../
|
|
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';
|
|
31
|
+
import '../dialog/DialogHeader.js';
|
|
39
32
|
import '../dialog/DialogActions.js';
|
|
40
33
|
import '../dialog/DialogContent.js';
|
|
34
|
+
import '../dialog/DialogContext.js';
|
|
41
35
|
import '../dialog/DialogCloseButton.js';
|
|
42
36
|
import '../drawer/Drawer.js';
|
|
43
37
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../flex-item/FlexItem.js';
|
|
|
49
43
|
import '../flex-layout/FlexLayout.js';
|
|
50
44
|
import '../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../text/Text.js';
|
|
48
|
+
import '../text/Code.js';
|
|
49
|
+
import '../text/Display.js';
|
|
50
|
+
import '../text/Headings.js';
|
|
51
|
+
import '../text/Label.js';
|
|
52
|
+
import '../text/TextAction.js';
|
|
53
|
+
import '../text/TextNotation.js';
|
|
52
54
|
import '../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../grid-item/GridItem.js';
|
|
54
56
|
import '../grid-layout/GridLayout.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport React, {\n createContext,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n useContext,\n useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport { Breakpoints, DEFAULT_BREAKPOINTS } from \"../breakpoints\";\nimport { Density, Mode, ThemeName } from \"../theme\";\nimport { ViewportProvider } from \"../viewport\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nimport saltProviderCss from \"./SaltProvider.css\";\nimport { useWindow, WindowContextType } from \"@salt-ds/window\";\nimport {\n useComponentCssInjection,\n StyleInjectionProvider,\n} from \"@salt-ds/styles\";\nimport { UNSTABLE_Corner } from \"../theme/Corner\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst UNSTABLE_ADDITIONAL_THEME_NAME = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: UNSTABLE_Corner = \"sharp\";\nexport interface ThemeContextProps {\n theme: ThemeName;\n mode: Mode;\n window?: WindowContextType;\n /** Only available when using SaltProviderNext. */\n themeNext: boolean;\n UNSTABLE_corner: UNSTABLE_Corner;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n theme: \"\",\n mode: DEFAULT_MODE,\n themeNext: false,\n UNSTABLE_corner: DEFAULT_CORNER,\n});\n\nexport const BreakpointContext =\n createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\n/**\n * We're relying `DEFAULT_THEME_NAME` to determine whether the provider is a root.\n */\nconst getThemeNames = (themeName: ThemeName, themeNext?: boolean) => {\n if (themeNext) {\n return themeName === DEFAULT_THEME_NAME\n ? [DEFAULT_THEME_NAME, UNSTABLE_ADDITIONAL_THEME_NAME]\n : [DEFAULT_THEME_NAME, UNSTABLE_ADDITIONAL_THEME_NAME, themeName];\n } else {\n {\n return themeName === DEFAULT_THEME_NAME\n ? [DEFAULT_THEME_NAME]\n : [DEFAULT_THEME_NAME, themeName];\n }\n }\n};\n\ninterface ThemeNextProps {\n themeNext?: boolean;\n}\n\nconst createThemedChildren = ({\n children,\n themeName,\n density,\n mode,\n applyClassesTo,\n themeNext,\n corner,\n}: {\n children: ReactNode;\n themeName: ThemeName;\n density: Density;\n mode: Mode;\n applyClassesTo?: TargetElement;\n} & ThemeNextProps &\n UNSTABLE_SaltProviderNextAdditionalProps) => {\n const themeNames = getThemeNames(themeName, themeNext);\n const themeNextProps = {\n \"data-corner\": corner,\n };\n if (applyClassesTo === \"root\") {\n return children;\n } else if (applyClassesTo === \"child\") {\n if (React.isValidElement<HTMLAttributes<HTMLElement>>(children)) {\n return React.cloneElement(children, {\n className: clsx(\n children.props?.className,\n ...themeNames,\n `salt-density-${density}`\n ),\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n \"data-mode\": mode,\n ...(themeNext ? themeNextProps : {}),\n });\n } else {\n console.warn(\n `\\nSaltProvider can only apply CSS classes for theming to a single nested child element of the SaltProvider.\n Either wrap elements with a single container or consider removing the applyClassesToChild prop, in which case a\n div element will wrap your child elements`\n );\n return children;\n }\n } else {\n return (\n <div\n className={clsx(\n `salt-provider`,\n ...themeNames,\n `salt-density-${density}`\n )}\n data-mode={mode}\n {...(themeNext ? themeNextProps : {})}\n >\n {children}\n </div>\n );\n }\n};\n\ntype TargetElement = \"root\" | \"scope\" | \"child\";\n\ninterface SaltProviderBaseProps {\n applyClassesTo?: TargetElement;\n density?: Density;\n theme?: ThemeName;\n mode?: Mode;\n breakpoints?: Breakpoints;\n enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n children: ReactElement;\n applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n extends SaltProviderThatInjectsThemeElement {\n applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n | SaltProviderThatAppliesClassesToChild\n | SaltProviderThatInjectsThemeElement\n | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n applyClassesTo: applyClassesToProp,\n children,\n density: densityProp,\n theme: themeProp,\n mode: modeProp,\n breakpoints: breakpointsProp,\n themeNext,\n corner: cornerProp,\n}: Omit<\n SaltProviderProps & ThemeNextProps & UNSTABLE_SaltProviderNextProps,\n \"enableStyleInjection\"\n>) {\n const inheritedDensity = useContext(DensityContext);\n const {\n theme: inheritedTheme,\n mode: inheritedMode,\n window: inheritedWindow,\n UNSTABLE_corner: inheritedCorner,\n } = useContext(ThemeContext);\n\n const isRootProvider = inheritedTheme === undefined || inheritedTheme === \"\";\n const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n const themeName =\n themeProp ?? (inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme);\n const mode = modeProp ?? inheritedMode;\n const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n\n const applyClassesTo =\n applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\");\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-provider\",\n css: saltProviderCss,\n window: targetWindow,\n });\n\n const themeContextValue = useMemo(\n () => ({\n theme: themeName,\n mode,\n window: targetWindow,\n themeNext: Boolean(themeNext),\n UNSTABLE_corner: corner,\n }),\n [themeName, mode, targetWindow, themeNext, corner]\n );\n\n const themedChildren = createThemedChildren({\n children,\n themeName,\n density,\n mode,\n applyClassesTo,\n themeNext,\n corner: corner,\n });\n\n useIsomorphicLayoutEffect(() => {\n const themeNames = getThemeNames(themeName, themeNext);\n\n if (applyClassesTo === \"root\" && targetWindow) {\n if (inheritedWindow != targetWindow) {\n // add the styles we want to apply\n targetWindow.document.documentElement.classList.add(\n ...themeNames,\n `salt-density-${density}`\n );\n targetWindow.document.documentElement.dataset.mode = mode;\n if (themeNext) {\n targetWindow.document.documentElement.dataset.corner = corner;\n }\n } else {\n console.warn(\n \"SaltProvider can only apply CSS classes to the root if it is the root level SaltProvider.\"\n );\n }\n }\n return () => {\n if (applyClassesTo === \"root\" && targetWindow) {\n // When unmounting/remounting, remove the applied styles from the root\n targetWindow.document.documentElement.classList.remove(\n ...themeNames,\n `salt-density-${density}`\n );\n targetWindow.document.documentElement.dataset.mode = undefined;\n if (themeNext) {\n delete targetWindow.document.documentElement.dataset.corner;\n }\n }\n };\n }, [\n applyClassesTo,\n density,\n mode,\n themeName,\n targetWindow,\n inheritedWindow,\n themeNext,\n corner,\n ]);\n\n const saltProvider = (\n <DensityContext.Provider value={density}>\n <ThemeContext.Provider value={themeContextValue}>\n <BreakpointContext.Provider value={breakpoints}>\n <ViewportProvider>{themedChildren}</ViewportProvider>\n </BreakpointContext.Provider>\n </ThemeContext.Provider>\n </DensityContext.Provider>\n );\n\n if (isRootProvider) {\n return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n } else {\n return saltProvider;\n }\n}\n\nexport function SaltProvider({\n enableStyleInjection,\n ...restProps\n}: SaltProviderProps) {\n return (\n <StyleInjectionProvider value={enableStyleInjection}>\n <InternalSaltProvider {...restProps} />\n </StyleInjectionProvider>\n );\n}\n\ninterface UNSTABLE_SaltProviderNextAdditionalProps {\n corner?: UNSTABLE_Corner;\n}\n\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderProps &\n UNSTABLE_SaltProviderNextAdditionalProps;\n\nexport function UNSTABLE_SaltProviderNext({\n enableStyleInjection,\n ...restProps\n}: UNSTABLE_SaltProviderNextProps) {\n return (\n <StyleInjectionProvider value={enableStyleInjection}>\n {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n <InternalSaltProvider {...restProps} themeNext={true} />\n </StyleInjectionProvider>\n );\n}\n\nexport const useTheme = (): ThemeContextProps => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n const densityFromContext = useContext(DensityContext);\n return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n return useContext(BreakpointContext);\n};\n"],"names":["React","saltProviderCss"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SaltProvider.js","sources":["../src/salt-provider/SaltProvider.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport React, {\n createContext,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n useContext,\n useMemo,\n} from \"react\";\nimport { AriaAnnouncerProvider } from \"../aria-announcer\";\nimport { Breakpoints, DEFAULT_BREAKPOINTS } from \"../breakpoints\";\nimport { Density, Mode, ThemeName } from \"../theme\";\nimport { ViewportProvider } from \"../viewport\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nimport saltProviderCss from \"./SaltProvider.css\";\nimport { useWindow, WindowContextType } from \"@salt-ds/window\";\nimport {\n useComponentCssInjection,\n StyleInjectionProvider,\n} from \"@salt-ds/styles\";\nimport { UNSTABLE_Corner } from \"../theme/Corner\";\n\nexport const DEFAULT_DENSITY = \"medium\";\n\nconst DEFAULT_THEME_NAME = \"salt-theme\";\nconst UNSTABLE_ADDITIONAL_THEME_NAME = \"salt-theme-next\";\n\nconst DEFAULT_MODE = \"light\";\nconst DEFAULT_CORNER: UNSTABLE_Corner = \"sharp\";\nexport interface ThemeContextProps {\n theme: ThemeName;\n mode: Mode;\n window?: WindowContextType;\n /** Only available when using SaltProviderNext. */\n themeNext: boolean;\n UNSTABLE_corner: UNSTABLE_Corner;\n}\n\nexport const DensityContext = createContext<Density>(DEFAULT_DENSITY);\n\nexport const ThemeContext = createContext<ThemeContextProps>({\n theme: \"\",\n mode: DEFAULT_MODE,\n themeNext: false,\n UNSTABLE_corner: DEFAULT_CORNER,\n});\n\nexport const BreakpointContext =\n createContext<Breakpoints>(DEFAULT_BREAKPOINTS);\n\n/**\n * We're relying `DEFAULT_THEME_NAME` to determine whether the provider is a root.\n */\nconst getThemeNames = (themeName: ThemeName, themeNext?: boolean) => {\n if (themeNext) {\n return themeName === DEFAULT_THEME_NAME\n ? [DEFAULT_THEME_NAME, UNSTABLE_ADDITIONAL_THEME_NAME]\n : [DEFAULT_THEME_NAME, UNSTABLE_ADDITIONAL_THEME_NAME, themeName];\n } else {\n {\n return themeName === DEFAULT_THEME_NAME\n ? [DEFAULT_THEME_NAME]\n : [DEFAULT_THEME_NAME, themeName];\n }\n }\n};\n\ninterface ThemeNextProps {\n themeNext?: boolean;\n}\n\nconst createThemedChildren = ({\n children,\n themeName,\n density,\n mode,\n applyClassesTo,\n themeNext,\n corner,\n}: {\n children: ReactNode;\n themeName: ThemeName;\n density: Density;\n mode: Mode;\n applyClassesTo?: TargetElement;\n} & ThemeNextProps &\n UNSTABLE_SaltProviderNextAdditionalProps) => {\n const themeNames = getThemeNames(themeName, themeNext);\n const themeNextProps = {\n \"data-corner\": corner,\n };\n if (applyClassesTo === \"root\") {\n return children;\n } else if (applyClassesTo === \"child\") {\n if (React.isValidElement<HTMLAttributes<HTMLElement>>(children)) {\n return React.cloneElement(children, {\n className: clsx(\n children.props?.className,\n ...themeNames,\n `salt-density-${density}`\n ),\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n \"data-mode\": mode,\n ...(themeNext ? themeNextProps : {}),\n });\n } else {\n console.warn(\n `\\nSaltProvider can only apply CSS classes for theming to a single nested child element of the SaltProvider.\n Either wrap elements with a single container or consider removing the applyClassesToChild prop, in which case a\n div element will wrap your child elements`\n );\n return children;\n }\n } else {\n return (\n <div\n className={clsx(\n `salt-provider`,\n ...themeNames,\n `salt-density-${density}`\n )}\n data-mode={mode}\n {...(themeNext ? themeNextProps : {})}\n >\n {children}\n </div>\n );\n }\n};\n\ntype TargetElement = \"root\" | \"scope\" | \"child\";\n\ninterface SaltProviderBaseProps {\n applyClassesTo?: TargetElement;\n density?: Density;\n theme?: ThemeName;\n mode?: Mode;\n breakpoints?: Breakpoints;\n enableStyleInjection?: boolean;\n}\n\ninterface SaltProviderThatAppliesClassesToChild extends SaltProviderBaseProps {\n children: ReactElement;\n applyClassesTo: \"child\";\n}\n\ninterface SaltProviderThatInjectsThemeElement extends SaltProviderBaseProps {\n children: ReactNode;\n}\n\ninterface SaltProviderThatClassesToRoot\n extends SaltProviderThatInjectsThemeElement {\n applyClassesTo: \"root\";\n}\n\ntype SaltProviderProps =\n | SaltProviderThatAppliesClassesToChild\n | SaltProviderThatInjectsThemeElement\n | SaltProviderThatClassesToRoot;\n\nfunction InternalSaltProvider({\n applyClassesTo: applyClassesToProp,\n children,\n density: densityProp,\n theme: themeProp,\n mode: modeProp,\n breakpoints: breakpointsProp,\n themeNext,\n corner: cornerProp,\n}: Omit<\n SaltProviderProps & ThemeNextProps & UNSTABLE_SaltProviderNextProps,\n \"enableStyleInjection\"\n>) {\n const inheritedDensity = useContext(DensityContext);\n const {\n theme: inheritedTheme,\n mode: inheritedMode,\n window: inheritedWindow,\n UNSTABLE_corner: inheritedCorner,\n } = useContext(ThemeContext);\n\n const isRootProvider = inheritedTheme === undefined || inheritedTheme === \"\";\n const density = densityProp ?? inheritedDensity ?? DEFAULT_DENSITY;\n const themeName =\n themeProp ?? (inheritedTheme === \"\" ? DEFAULT_THEME_NAME : inheritedTheme);\n const mode = modeProp ?? inheritedMode;\n const breakpoints = breakpointsProp ?? DEFAULT_BREAKPOINTS;\n const corner = cornerProp ?? inheritedCorner ?? DEFAULT_CORNER;\n\n const applyClassesTo =\n applyClassesToProp ?? (isRootProvider ? \"root\" : \"scope\");\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-provider\",\n css: saltProviderCss,\n window: targetWindow,\n });\n\n const themeContextValue = useMemo(\n () => ({\n theme: themeName,\n mode,\n window: targetWindow,\n themeNext: Boolean(themeNext),\n UNSTABLE_corner: corner,\n }),\n [themeName, mode, targetWindow, themeNext, corner]\n );\n\n const themedChildren = createThemedChildren({\n children,\n themeName,\n density,\n mode,\n applyClassesTo,\n themeNext,\n corner: corner,\n });\n\n useIsomorphicLayoutEffect(() => {\n const themeNames = getThemeNames(themeName, themeNext);\n\n if (applyClassesTo === \"root\" && targetWindow) {\n if (inheritedWindow != targetWindow) {\n // add the styles we want to apply\n targetWindow.document.documentElement.classList.add(\n ...themeNames,\n `salt-density-${density}`\n );\n targetWindow.document.documentElement.dataset.mode = mode;\n if (themeNext) {\n targetWindow.document.documentElement.dataset.corner = corner;\n }\n } else {\n console.warn(\n \"SaltProvider can only apply CSS classes to the root if it is the root level SaltProvider.\"\n );\n }\n }\n return () => {\n if (applyClassesTo === \"root\" && targetWindow) {\n // When unmounting/remounting, remove the applied styles from the root\n targetWindow.document.documentElement.classList.remove(\n ...themeNames,\n `salt-density-${density}`\n );\n targetWindow.document.documentElement.dataset.mode = undefined;\n if (themeNext) {\n delete targetWindow.document.documentElement.dataset.corner;\n }\n }\n };\n }, [\n applyClassesTo,\n density,\n mode,\n themeName,\n targetWindow,\n inheritedWindow,\n themeNext,\n corner,\n ]);\n\n const saltProvider = (\n <DensityContext.Provider value={density}>\n <ThemeContext.Provider value={themeContextValue}>\n <BreakpointContext.Provider value={breakpoints}>\n <ViewportProvider>{themedChildren}</ViewportProvider>\n </BreakpointContext.Provider>\n </ThemeContext.Provider>\n </DensityContext.Provider>\n );\n\n if (isRootProvider) {\n return <AriaAnnouncerProvider>{saltProvider}</AriaAnnouncerProvider>;\n } else {\n return saltProvider;\n }\n}\n\nexport function SaltProvider({\n enableStyleInjection,\n ...restProps\n}: SaltProviderProps) {\n return (\n <StyleInjectionProvider value={enableStyleInjection}>\n <InternalSaltProvider {...restProps} />\n </StyleInjectionProvider>\n );\n}\n\ninterface UNSTABLE_SaltProviderNextAdditionalProps {\n corner?: UNSTABLE_Corner;\n}\n\nexport type UNSTABLE_SaltProviderNextProps = SaltProviderProps &\n UNSTABLE_SaltProviderNextAdditionalProps;\n\nexport function UNSTABLE_SaltProviderNext({\n enableStyleInjection,\n ...restProps\n}: UNSTABLE_SaltProviderNextProps) {\n return (\n <StyleInjectionProvider value={enableStyleInjection}>\n {/* Leveraging InternalSaltProvider being not exported, so we can pass more props than previously supported */}\n <InternalSaltProvider {...restProps} themeNext={true} />\n </StyleInjectionProvider>\n );\n}\n\nexport const useTheme = (): ThemeContextProps => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { window, ...contextWithoutWindow } = useContext(ThemeContext);\n\n return contextWithoutWindow;\n};\n\n/**\n * `useDensity` merges density value from `DensityContext` with the one from component's props.\n */\nexport function useDensity(density?: Density): Density {\n const densityFromContext = useContext(DensityContext);\n return density ?? densityFromContext ?? DEFAULT_DENSITY;\n}\n\nexport const useBreakpoints = (): Breakpoints => {\n return useContext(BreakpointContext);\n};\n"],"names":["React","saltProviderCss"],"mappings":"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"}
|
package/dist-es/scrim/Scrim.js
CHANGED
|
@@ -28,16 +28,10 @@ import { useWindow } from '@salt-ds/window';
|
|
|
28
28
|
import '@salt-ds/icons';
|
|
29
29
|
import '../combo-box/ComboBox.js';
|
|
30
30
|
import '../dialog/Dialog.js';
|
|
31
|
-
import '../
|
|
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';
|
|
31
|
+
import '../dialog/DialogHeader.js';
|
|
39
32
|
import '../dialog/DialogActions.js';
|
|
40
33
|
import '../dialog/DialogContent.js';
|
|
34
|
+
import '../dialog/DialogContext.js';
|
|
41
35
|
import '../dialog/DialogCloseButton.js';
|
|
42
36
|
import '../drawer/Drawer.js';
|
|
43
37
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../flex-item/FlexItem.js';
|
|
|
49
43
|
import '../flex-layout/FlexLayout.js';
|
|
50
44
|
import '../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../text/Text.js';
|
|
48
|
+
import '../text/Code.js';
|
|
49
|
+
import '../text/Display.js';
|
|
50
|
+
import '../text/Headings.js';
|
|
51
|
+
import '../text/Label.js';
|
|
52
|
+
import '../text/TextAction.js';
|
|
53
|
+
import '../text/TextNotation.js';
|
|
52
54
|
import '../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../grid-item/GridItem.js';
|
|
54
56
|
import '../grid-layout/GridLayout.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scrim.js","sources":["../src/scrim/Scrim.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport scrimCss from \"./Scrim.css\";\n\nconst withBaseName = makePrefixer(\"saltScrim\");\n\nexport interface ScrimProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If `true` the scrim is bound to the document viewport.\n * The default value of this prop is false, and the default behavior is for Scrim to be bound to its parent container (nearest positioned ancestor).\n */\n fixed?: boolean;\n /**\n * If `true` the scrim is shown.\n */\n open?: boolean;\n}\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n { className, children, fixed = false, open = true, ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-scrim\",\n css: scrimCss,\n window: targetWindow,\n });\n\n if (!open) {\n return null;\n }\n\n return (\n <div\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"fixed\")]: fixed,\n },\n className\n )}\n data-testid=\"scrim\"\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n});\n"],"names":["Scrim","scrimCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Scrim.js","sources":["../src/scrim/Scrim.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport scrimCss from \"./Scrim.css\";\n\nconst withBaseName = makePrefixer(\"saltScrim\");\n\nexport interface ScrimProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If `true` the scrim is bound to the document viewport.\n * The default value of this prop is false, and the default behavior is for Scrim to be bound to its parent container (nearest positioned ancestor).\n */\n fixed?: boolean;\n /**\n * If `true` the scrim is shown.\n */\n open?: boolean;\n}\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n { className, children, fixed = false, open = true, ...rest },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-scrim\",\n css: scrimCss,\n window: targetWindow,\n });\n\n if (!open) {\n return null;\n }\n\n return (\n <div\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"fixed\")]: fixed,\n },\n className\n )}\n data-testid=\"scrim\"\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n});\n"],"names":["Scrim","scrimCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AActC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,EAAE,SAAA,EAAW,QAAU,EAAA,KAAA,GAAQ,KAAO,EAAA,IAAA,GAAO,IAAS,EAAA,GAAA,IAAA,IACtD,GACA,EAAA;AACA,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,IAAI,CAAC,IAAM,EAAA;AACT,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,OAC3B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,aAAY,EAAA,OAAA;AAAA,IACZ,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -29,16 +29,10 @@ import { useWindow } from '@salt-ds/window';
|
|
|
29
29
|
import '@salt-ds/icons';
|
|
30
30
|
import '../combo-box/ComboBox.js';
|
|
31
31
|
import '../dialog/Dialog.js';
|
|
32
|
-
import '../
|
|
33
|
-
import '../text/Text.js';
|
|
34
|
-
import '../text/Display.js';
|
|
35
|
-
import '../text/Headings.js';
|
|
36
|
-
import '../text/Label.js';
|
|
37
|
-
import '../text/TextNotation.js';
|
|
38
|
-
import '../text/TextAction.js';
|
|
39
|
-
import '../dialog/DialogContext.js';
|
|
32
|
+
import '../dialog/DialogHeader.js';
|
|
40
33
|
import '../dialog/DialogActions.js';
|
|
41
34
|
import '../dialog/DialogContent.js';
|
|
35
|
+
import '../dialog/DialogContext.js';
|
|
42
36
|
import '../dialog/DialogCloseButton.js';
|
|
43
37
|
import '../drawer/Drawer.js';
|
|
44
38
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -50,6 +44,14 @@ import '../flex-item/FlexItem.js';
|
|
|
50
44
|
import '../flex-layout/FlexLayout.js';
|
|
51
45
|
import '../flow-layout/FlowLayout.js';
|
|
52
46
|
import '../form-field/FormField.js';
|
|
47
|
+
import '../status-indicator/StatusIndicator.js';
|
|
48
|
+
import '../text/Text.js';
|
|
49
|
+
import '../text/Code.js';
|
|
50
|
+
import '../text/Display.js';
|
|
51
|
+
import '../text/Headings.js';
|
|
52
|
+
import '../text/Label.js';
|
|
53
|
+
import '../text/TextAction.js';
|
|
54
|
+
import '../text/TextNotation.js';
|
|
53
55
|
import '../form-field-context/FormFieldContext.js';
|
|
54
56
|
import '../grid-item/GridItem.js';
|
|
55
57
|
import '../grid-layout/GridLayout.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useDensity } from \"../salt-provider\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n \"default\",\n \"large\",\n \"small\",\n \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n role = \"img\",\n className,\n size = \"medium\",\n id: idProp,\n ...rest\n },\n ref\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n const density = useDensity();\n size = handleSize(size);\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = new Date().getTime();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (new Date().getTime() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role={role}\n {...rest}\n >\n <SpinnerSVG size={size} density={density} id={id} />\n </div>\n );\n }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Spinner.js","sources":["../src/spinner/Spinner.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useEffect } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useId } from \"../utils\";\nimport { SpinnerSVG } from \"./svgSpinners/SpinnerSVG\";\n\nimport spinnerCss from \"./Spinner.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useDensity } from \"../salt-provider\";\n\n/**\n * Spinner component, provides an indeterminate loading indicator\n *\n * @example\n * <Spinner size=\"small\" | \"medium\" | \"large\" />\n */\n\nexport const SpinnerSizeValues = [\n \"default\",\n \"large\",\n \"small\",\n \"medium\",\n] as const;\n\ntype SpinnerSize = (typeof SpinnerSizeValues)[number];\n\nexport type SpinnerSVGSize = Exclude<SpinnerSize, \"default\">;\n\nconst handleSize = (size: SpinnerSize): SpinnerSVGSize =>\n size === \"default\" ? \"medium\" : size;\n\nconst withBaseName = makePrefixer(\"saltSpinner\");\n\nexport interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Determines the interval on which the component will continue to announce the aria-label. Defaults to 5000ms (5s)\n */\n announcerInterval?: number;\n /**\n * * Determines the interval after which the component will stop announcing the aria-label. Defaults to 20000ms (20s)\n */\n announcerTimeout?: number;\n /**\n * The className(s) of the component\n */\n className?: string;\n /**\n * Determines the message to be announced by the component when it unmounts. Set to null if not needed.\n */\n completionAnnouncement?: string | null;\n /**\n * If true, built in aria announcer will be inactive\n */\n disableAnnouncer?: boolean;\n /**\n * The prop for the role attribute of the component\n */\n role?: string;\n /**\n * Determines the size of the spinner. Must be one of: 'default', 'large', 'small', 'medium'.\n */\n size?: SpinnerSize;\n /**\n * The ids of the SvgSpinner components\n */\n id?: string;\n}\n\nexport const Spinner = forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(\n {\n \"aria-label\": ariaLabel = \"loading\",\n announcerInterval = 5000,\n announcerTimeout = 20000,\n completionAnnouncement = `finished ${ariaLabel}`,\n disableAnnouncer,\n role = \"img\",\n className,\n size = \"medium\",\n id: idProp,\n ...rest\n },\n ref\n ) {\n const id = useId(idProp);\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-spinner\",\n css: spinnerCss,\n window: targetWindow,\n });\n\n const { announce } = useAriaAnnouncer();\n\n const density = useDensity();\n size = handleSize(size);\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n announce(ariaLabel);\n\n const startTime = new Date().getTime();\n\n const interval =\n announcerInterval > 0 &&\n setInterval(() => {\n if (new Date().getTime() - startTime > announcerTimeout) {\n // The announcer will stop after `announcerTimeout` time\n announce(\n `${ariaLabel} is still in progress, but will no longer announce.`\n );\n interval && clearInterval(interval);\n return;\n }\n announce(ariaLabel);\n }, announcerInterval);\n\n return () => {\n if (disableAnnouncer) return;\n\n interval && clearInterval(interval);\n if (completionAnnouncement) {\n announce(completionAnnouncement);\n }\n };\n }, [\n announce,\n announcerInterval,\n announcerTimeout,\n ariaLabel,\n completionAnnouncement,\n disableAnnouncer,\n ]);\n\n return (\n <div\n aria-label={ariaLabel}\n className={clsx(withBaseName(), withBaseName(size), className)}\n ref={ref}\n role={role}\n {...rest}\n >\n <SpinnerSVG size={size} density={density} id={id} />\n </div>\n );\n }\n);\n"],"names":["Spinner","spinnerCss"],"mappings":"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"}
|
|
@@ -28,16 +28,10 @@ import '@salt-ds/window';
|
|
|
28
28
|
import '@salt-ds/icons';
|
|
29
29
|
import '../../combo-box/ComboBox.js';
|
|
30
30
|
import '../../dialog/Dialog.js';
|
|
31
|
-
import '../../
|
|
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';
|
|
31
|
+
import '../../dialog/DialogHeader.js';
|
|
39
32
|
import '../../dialog/DialogActions.js';
|
|
40
33
|
import '../../dialog/DialogContent.js';
|
|
34
|
+
import '../../dialog/DialogContext.js';
|
|
41
35
|
import '../../dialog/DialogCloseButton.js';
|
|
42
36
|
import '../../drawer/Drawer.js';
|
|
43
37
|
import '../../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../../flex-item/FlexItem.js';
|
|
|
49
43
|
import '../../flex-layout/FlexLayout.js';
|
|
50
44
|
import '../../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../../form-field/FormField.js';
|
|
46
|
+
import '../../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../../text/Text.js';
|
|
48
|
+
import '../../text/Code.js';
|
|
49
|
+
import '../../text/Display.js';
|
|
50
|
+
import '../../text/Headings.js';
|
|
51
|
+
import '../../text/Label.js';
|
|
52
|
+
import '../../text/TextAction.js';
|
|
53
|
+
import '../../text/TextNotation.js';
|
|
52
54
|
import '../../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../../grid-item/GridItem.js';
|
|
54
56
|
import '../../grid-layout/GridLayout.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":[],"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":[],"mappings":"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"}
|
|
@@ -29,16 +29,10 @@ import { useWindow } from '@salt-ds/window';
|
|
|
29
29
|
import '@salt-ds/icons';
|
|
30
30
|
import '../combo-box/ComboBox.js';
|
|
31
31
|
import '../dialog/Dialog.js';
|
|
32
|
-
import '../
|
|
33
|
-
import '../text/Text.js';
|
|
34
|
-
import '../text/Display.js';
|
|
35
|
-
import '../text/Headings.js';
|
|
36
|
-
import '../text/Label.js';
|
|
37
|
-
import '../text/TextNotation.js';
|
|
38
|
-
import '../text/TextAction.js';
|
|
39
|
-
import '../dialog/DialogContext.js';
|
|
32
|
+
import '../dialog/DialogHeader.js';
|
|
40
33
|
import '../dialog/DialogActions.js';
|
|
41
34
|
import '../dialog/DialogContent.js';
|
|
35
|
+
import '../dialog/DialogContext.js';
|
|
42
36
|
import '../dialog/DialogCloseButton.js';
|
|
43
37
|
import '../drawer/Drawer.js';
|
|
44
38
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
|
49
43
|
import '../flex-item/FlexItem.js';
|
|
50
44
|
import '../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../text/Text.js';
|
|
48
|
+
import '../text/Code.js';
|
|
49
|
+
import '../text/Display.js';
|
|
50
|
+
import '../text/Headings.js';
|
|
51
|
+
import '../text/Label.js';
|
|
52
|
+
import '../text/TextAction.js';
|
|
53
|
+
import '../text/TextNotation.js';
|
|
52
54
|
import '../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../grid-item/GridItem.js';
|
|
54
56
|
import '../grid-layout/GridLayout.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":["splitLayoutCss"],"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":["splitLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAiC5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE,EAAE,OAAA,EAAS,WAAW,SAAc,EAAA,GAAA,IAAA,IACpC,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;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,uBACG,IAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,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;;;;"}
|
|
@@ -29,16 +29,10 @@ import '../salt-provider/SaltProvider.js';
|
|
|
29
29
|
import '@salt-ds/icons';
|
|
30
30
|
import '../combo-box/ComboBox.js';
|
|
31
31
|
import '../dialog/Dialog.js';
|
|
32
|
-
import '../
|
|
33
|
-
import '../text/Text.js';
|
|
34
|
-
import '../text/Display.js';
|
|
35
|
-
import '../text/Headings.js';
|
|
36
|
-
import '../text/Label.js';
|
|
37
|
-
import '../text/TextNotation.js';
|
|
38
|
-
import '../text/TextAction.js';
|
|
39
|
-
import '../dialog/DialogContext.js';
|
|
32
|
+
import '../dialog/DialogHeader.js';
|
|
40
33
|
import '../dialog/DialogActions.js';
|
|
41
34
|
import '../dialog/DialogContent.js';
|
|
35
|
+
import '../dialog/DialogContext.js';
|
|
42
36
|
import '../dialog/DialogCloseButton.js';
|
|
43
37
|
import '../drawer/Drawer.js';
|
|
44
38
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
|
49
43
|
import '../flex-item/FlexItem.js';
|
|
50
44
|
import '../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../text/Text.js';
|
|
48
|
+
import '../text/Code.js';
|
|
49
|
+
import '../text/Display.js';
|
|
50
|
+
import '../text/Headings.js';
|
|
51
|
+
import '../text/Label.js';
|
|
52
|
+
import '../text/TextAction.js';
|
|
53
|
+
import '../text/TextNotation.js';
|
|
52
54
|
import '../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../grid-item/GridItem.js';
|
|
54
56
|
import '../grid-layout/GridLayout.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 ResponsiveProp,\n useResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\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\nexport const StackLayout: StackLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n children,\n className,\n direction = \"column\",\n gap,\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 flexGap = useResponsiveProp(gap, 3);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = useResponsiveProp(direction, \"column\");\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap-multiplier\": flexGap,\n };\n return (\n <FlexLayout\n className={clsx(\n withBaseName(),\n withBaseName(flexDirection),\n {\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":["stackLayoutCss"],"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 ResponsiveProp,\n useResponsiveProp,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport stackLayoutCss from \"./StackLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\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\nexport const StackLayout: StackLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n children,\n className,\n direction = \"column\",\n gap,\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 flexGap = useResponsiveProp(gap, 3);\n const separatorAlignment = separators === true ? \"center\" : separators;\n const flexDirection = useResponsiveProp(direction, \"column\");\n const stackLayoutStyles = {\n ...style,\n \"--stackLayout-gap-multiplier\": flexGap,\n };\n return (\n <FlexLayout\n className={clsx(\n withBaseName(),\n withBaseName(flexDirection),\n {\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":["stackLayoutCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AA6B5C,MAAM,WAAoC,GAAA,UAAA;AAAA,EAC/C,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAY,GAAA,QAAA;AAAA,IACZ,GAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,mBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,QAAQ,CAAA,CAAA;AAC3D,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,GAAG,KAAA;AAAA,MACH,8BAAgC,EAAA,OAAA;AAAA,KAClC,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,aAAa,CAAA;AAAA,QAC1B;AAAA,UACE,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;;;;"}
|
|
@@ -28,16 +28,10 @@ import '../checkbox/CheckboxGroup.js';
|
|
|
28
28
|
import '@salt-ds/icons';
|
|
29
29
|
import '../combo-box/ComboBox.js';
|
|
30
30
|
import '../dialog/Dialog.js';
|
|
31
|
-
import '../
|
|
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';
|
|
31
|
+
import '../dialog/DialogHeader.js';
|
|
39
32
|
import '../dialog/DialogActions.js';
|
|
40
33
|
import '../dialog/DialogContent.js';
|
|
34
|
+
import '../dialog/DialogContext.js';
|
|
41
35
|
import '../dialog/DialogCloseButton.js';
|
|
42
36
|
import '../drawer/Drawer.js';
|
|
43
37
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -49,6 +43,14 @@ import '../flex-item/FlexItem.js';
|
|
|
49
43
|
import '../flex-layout/FlexLayout.js';
|
|
50
44
|
import '../flow-layout/FlowLayout.js';
|
|
51
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../status-indicator/StatusIndicator.js';
|
|
47
|
+
import '../text/Text.js';
|
|
48
|
+
import '../text/Code.js';
|
|
49
|
+
import '../text/Display.js';
|
|
50
|
+
import '../text/Headings.js';
|
|
51
|
+
import '../text/Label.js';
|
|
52
|
+
import '../text/TextAction.js';
|
|
53
|
+
import '../text/TextNotation.js';
|
|
52
54
|
import '../form-field-context/FormFieldContext.js';
|
|
53
55
|
import '../grid-item/GridItem.js';
|
|
54
56
|
import '../grid-layout/GridLayout.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":["StatusAdornment","statusAdornmentCss"],"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":["StatusAdornment","statusAdornmentCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,KAAQ,GAAA;AAAA,EACZ,KAAO,EAAA,kBAAA;AAAA,EACP,OAAS,EAAA,oBAAA;AAAA,EACT,OAAS,EAAA,oBAAA;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,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,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,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,uBACG,GAAA,CAAA,kBAAA,EAAA;AAAA,MACC,WAAW,IAAK,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;;;;"}
|
|
@@ -28,15 +28,10 @@ import { useComponentCssInjection } from '@salt-ds/styles';
|
|
|
28
28
|
import { useWindow } from '@salt-ds/window';
|
|
29
29
|
import '../combo-box/ComboBox.js';
|
|
30
30
|
import '../dialog/Dialog.js';
|
|
31
|
-
import '../
|
|
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';
|
|
31
|
+
import '../dialog/DialogHeader.js';
|
|
38
32
|
import '../dialog/DialogActions.js';
|
|
39
33
|
import '../dialog/DialogContent.js';
|
|
34
|
+
import '../dialog/DialogContext.js';
|
|
40
35
|
import '../dialog/DialogCloseButton.js';
|
|
41
36
|
import '../drawer/Drawer.js';
|
|
42
37
|
import '../drawer/DrawerCloseButton.js';
|
|
@@ -48,6 +43,13 @@ import '../flex-item/FlexItem.js';
|
|
|
48
43
|
import '../flex-layout/FlexLayout.js';
|
|
49
44
|
import '../flow-layout/FlowLayout.js';
|
|
50
45
|
import '../form-field/FormField.js';
|
|
46
|
+
import '../text/Text.js';
|
|
47
|
+
import '../text/Code.js';
|
|
48
|
+
import '../text/Display.js';
|
|
49
|
+
import '../text/Headings.js';
|
|
50
|
+
import '../text/Label.js';
|
|
51
|
+
import '../text/TextAction.js';
|
|
52
|
+
import '../text/TextNotation.js';
|
|
51
53
|
import '../form-field-context/FormFieldContext.js';
|
|
52
54
|
import '../grid-item/GridItem.js';
|
|
53
55
|
import '../grid-layout/GridLayout.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":["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;;;;"}
|