@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
|
@@ -34,16 +34,10 @@ require('../checkbox/CheckboxGroup.js');
|
|
|
34
34
|
require('@salt-ds/icons');
|
|
35
35
|
require('../combo-box/ComboBox.js');
|
|
36
36
|
require('../dialog/Dialog.js');
|
|
37
|
-
require('../
|
|
38
|
-
require('../text/Text.js');
|
|
39
|
-
require('../text/Display.js');
|
|
40
|
-
require('../text/Headings.js');
|
|
41
|
-
require('../text/Label.js');
|
|
42
|
-
require('../text/TextNotation.js');
|
|
43
|
-
require('../text/TextAction.js');
|
|
44
|
-
require('../dialog/DialogContext.js');
|
|
37
|
+
require('../dialog/DialogHeader.js');
|
|
45
38
|
require('../dialog/DialogActions.js');
|
|
46
39
|
require('../dialog/DialogContent.js');
|
|
40
|
+
require('../dialog/DialogContext.js');
|
|
47
41
|
require('../dialog/DialogCloseButton.js');
|
|
48
42
|
require('../drawer/Drawer.js');
|
|
49
43
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -54,6 +48,14 @@ require('../file-drop-zone/FileDropZoneTrigger.js');
|
|
|
54
48
|
require('../flex-item/FlexItem.js');
|
|
55
49
|
require('../flex-layout/FlexLayout.js');
|
|
56
50
|
require('../flow-layout/FlowLayout.js');
|
|
51
|
+
require('../status-indicator/StatusIndicator.js');
|
|
52
|
+
require('../text/Text.js');
|
|
53
|
+
require('../text/Code.js');
|
|
54
|
+
require('../text/Display.js');
|
|
55
|
+
require('../text/Headings.js');
|
|
56
|
+
require('../text/Label.js');
|
|
57
|
+
require('../text/TextAction.js');
|
|
58
|
+
require('../text/TextNotation.js');
|
|
57
59
|
require('../grid-item/GridItem.js');
|
|
58
60
|
require('../grid-layout/GridLayout.js');
|
|
59
61
|
require('../input/Input.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /**\n * Disabled prop\n */\n disabled?: boolean;\n /**\n * Location of the label, values: 'top' (default) or 'left'\n */\n labelPlacement?: FormFieldLabelPlacement;\n /**\n * Readonly prop\n */\n readOnly?: boolean;\n /**\n * Optional id prop\n *\n * Used as suffix of FormFieldLabel id: `label-{id}`\n * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n */\n id?: string;\n /**\n * Displays necessity on label\n */\n necessity?: \"required\" | \"optional\" | \"asterisk\";\n /**\n * Validation status\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n (\n {\n children,\n className,\n disabled = false,\n id: idProp,\n labelPlacement = \"top\",\n necessity,\n onBlur,\n onFocus,\n readOnly = false,\n validationStatus,\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field\",\n css: formFieldCss,\n window: targetWindow,\n });\n\n const formId = useId(idProp);\n\n const labelId = formId ? `label-${formId}` : undefined;\n const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(`label${capitalize(labelPlacement)}`)]:\n labelPlacement,\n },\n className\n )}\n {...restProps}\n >\n <FormFieldContext.Provider\n value={{\n a11yProps: {\n \"aria-labelledby\": labelId,\n \"aria-describedby\": helperTextId,\n },\n disabled,\n necessity,\n readOnly,\n validationStatus,\n }}\n >\n {children}\n </FormFieldContext.Provider>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","formFieldCss","useId","jsx","clsx","capitalize","FormFieldContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /**\n * Disabled prop\n */\n disabled?: boolean;\n /**\n * Location of the label, values: 'top' (default) or 'left'\n */\n labelPlacement?: FormFieldLabelPlacement;\n /**\n * Readonly prop\n */\n readOnly?: boolean;\n /**\n * Optional id prop\n *\n * Used as suffix of FormFieldLabel id: `label-{id}`\n * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n */\n id?: string;\n /**\n * Displays necessity on label\n */\n necessity?: \"required\" | \"optional\" | \"asterisk\";\n /**\n * Validation status\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n (\n {\n children,\n className,\n disabled = false,\n id: idProp,\n labelPlacement = \"top\",\n necessity,\n onBlur,\n onFocus,\n readOnly = false,\n validationStatus,\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field\",\n css: formFieldCss,\n window: targetWindow,\n });\n\n const formId = useId(idProp);\n\n const labelId = formId ? `label-${formId}` : undefined;\n const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(`label${capitalize(labelPlacement)}`)]:\n labelPlacement,\n },\n className\n )}\n {...restProps}\n >\n <FormFieldContext.Provider\n value={{\n a11yProps: {\n \"aria-labelledby\": labelId,\n \"aria-describedby\": helperTextId,\n },\n disabled,\n necessity,\n readOnly,\n validationStatus,\n }}\n >\n {children}\n </FormFieldContext.Provider>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","formFieldCss","useId","jsx","clsx","capitalize","FormFieldContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,EAAI,EAAA,MAAA;AAAA,IACJ,cAAiB,GAAA,KAAA;AAAA,IACjB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,gBAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAASC,YAAM,MAAM,CAAA,CAAA;AAE3B,IAAM,MAAA,OAAA,GAAU,MAAS,GAAA,CAAA,MAAA,EAAS,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAC7C,IAAM,MAAA,YAAA,GAAe,MAAS,GAAA,CAAA,WAAA,EAAc,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEvD,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,CAAA,KAAA,EAAQC,qBAAW,CAAA,cAAc,GAAG,CAChD,GAAA,cAAA;AAAA,SACJ;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAAF,cAAA,CAACG,kCAAiB,QAAjB,EAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,SAAW,EAAA;AAAA,YACT,iBAAmB,EAAA,OAAA;AAAA,YACnB,kBAAoB,EAAA,YAAA;AAAA,WACtB;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,QAAA;AAAA,UACA,gBAAA;AAAA,SACF;AAAA,QAEC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -6,11 +6,12 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
6
6
|
var clsx = require('clsx');
|
|
7
7
|
var StatusIndicator = require('../status-indicator/StatusIndicator.js');
|
|
8
8
|
var Text = require('../text/Text.js');
|
|
9
|
+
require('../text/Code.js');
|
|
9
10
|
require('../text/Display.js');
|
|
10
11
|
require('../text/Headings.js');
|
|
11
12
|
require('../text/Label.js');
|
|
12
|
-
require('../text/TextNotation.js');
|
|
13
13
|
require('../text/TextAction.js');
|
|
14
|
+
require('../text/TextNotation.js');
|
|
14
15
|
require('react');
|
|
15
16
|
var makePrefixer = require('../utils/makePrefixer.js');
|
|
16
17
|
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
@@ -39,9 +40,10 @@ var window = require('@salt-ds/window');
|
|
|
39
40
|
require('@salt-ds/icons');
|
|
40
41
|
require('../combo-box/ComboBox.js');
|
|
41
42
|
require('../dialog/Dialog.js');
|
|
42
|
-
require('../dialog/
|
|
43
|
+
require('../dialog/DialogHeader.js');
|
|
43
44
|
require('../dialog/DialogActions.js');
|
|
44
45
|
require('../dialog/DialogContent.js');
|
|
46
|
+
require('../dialog/DialogContext.js');
|
|
45
47
|
require('../dialog/DialogCloseButton.js');
|
|
46
48
|
require('../drawer/Drawer.js');
|
|
47
49
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n className,\n children,\n ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-helper-text\",\n css: formFieldHelperTextCss,\n window: targetWindow,\n });\n\n const { a11yProps, disabled, readOnly, validationStatus } =\n useFormFieldProps();\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withValidation\")]: validationStatus },\n className\n )}\n >\n {!disabled && !readOnly && validationStatus && (\n <StatusIndicator status={validationStatus} />\n )}\n <Text\n disabled={disabled}\n id={a11yProps?.[\"aria-describedby\"]}\n variant=\"secondary\"\n styleAs=\"label\"\n {...restProps}\n >\n {children}\n </Text>\n </div>\n );\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","formFieldHelperTextCss","useFormFieldProps","jsxs","clsx","jsx","StatusIndicator","Text"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n className,\n children,\n ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-helper-text\",\n css: formFieldHelperTextCss,\n window: targetWindow,\n });\n\n const { a11yProps, disabled, readOnly, validationStatus } =\n useFormFieldProps();\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"withValidation\")]: validationStatus },\n className\n )}\n >\n {!disabled && !readOnly && validationStatus && (\n <StatusIndicator status={validationStatus} />\n )}\n <Text\n disabled={disabled}\n id={a11yProps?.[\"aria-describedby\"]}\n variant=\"secondary\"\n styleAs=\"label\"\n {...restProps}\n >\n {children}\n </Text>\n </div>\n );\n};\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","formFieldHelperTextCss","useFormFieldProps","jsxs","clsx","jsx","StatusIndicator","Text"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,yBAAyB,CAAA,CAAA;AAEpD,MAAM,sBAAsB,CAAC;AAAA,EAClC,SAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,SAAA;AACL,CAAuD,KAAA;AACrD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAC,qBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,QAAU,EAAA,gBAAA,KACrCC,mCAAkB,EAAA,CAAA;AAEpB,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,gBAAgB,IAAI,gBAAiB,EAAA;AAAA,MACrD,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxBC,cAAA,CAAAC,+BAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,sBAE5CD,cAAA,CAAAE,SAAA,EAAA;AAAA,QACC,QAAA;AAAA,QACA,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,QAChB,OAAQ,EAAA,WAAA;AAAA,QACR,OAAQ,EAAA,OAAA;AAAA,QACP,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -9,11 +9,12 @@ var window = require('@salt-ds/window');
|
|
|
9
9
|
require('../form-field-context/FormFieldContext.js');
|
|
10
10
|
var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');
|
|
11
11
|
require('../text/Text.js');
|
|
12
|
+
require('../text/Code.js');
|
|
12
13
|
require('../text/Display.js');
|
|
13
14
|
require('../text/Headings.js');
|
|
14
15
|
var Label = require('../text/Label.js');
|
|
15
|
-
require('../text/TextNotation.js');
|
|
16
16
|
require('../text/TextAction.js');
|
|
17
|
+
require('../text/TextNotation.js');
|
|
17
18
|
var capitalize = require('../utils/capitalize.js');
|
|
18
19
|
require('react');
|
|
19
20
|
var makePrefixer = require('../utils/makePrefixer.js');
|
|
@@ -41,10 +42,10 @@ require('../checkbox/CheckboxGroup.js');
|
|
|
41
42
|
require('@salt-ds/icons');
|
|
42
43
|
require('../combo-box/ComboBox.js');
|
|
43
44
|
require('../dialog/Dialog.js');
|
|
44
|
-
require('../
|
|
45
|
-
require('../dialog/DialogContext.js');
|
|
45
|
+
require('../dialog/DialogHeader.js');
|
|
46
46
|
require('../dialog/DialogActions.js');
|
|
47
47
|
require('../dialog/DialogContent.js');
|
|
48
|
+
require('../dialog/DialogContext.js');
|
|
48
49
|
require('../dialog/DialogCloseButton.js');
|
|
49
50
|
require('../drawer/Drawer.js');
|
|
50
51
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -56,6 +57,7 @@ require('../flex-item/FlexItem.js');
|
|
|
56
57
|
require('../flex-layout/FlexLayout.js');
|
|
57
58
|
require('../flow-layout/FlowLayout.js');
|
|
58
59
|
require('./FormField.js');
|
|
60
|
+
require('../status-indicator/StatusIndicator.js');
|
|
59
61
|
var FormFieldLabel$1 = require('./FormFieldLabel.css.js');
|
|
60
62
|
require('../grid-item/GridItem.js');
|
|
61
63
|
require('../grid-layout/GridLayout.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldLabel.js","sources":["../src/form-field/FormFieldLabel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { Label, TextProps } from \"../text\";\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport formFieldLabelCss from \"./FormFieldLabel.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldLabel\");\n\nexport interface FormFieldLabelProps\n extends Omit<TextProps<\"label\">, \"variant\" | \"styleAs\"> {\n /**\n * Intent for the label.\n *\n * Defaults to \"label\"\n * Using \"sentence\" gives more prominent styling\n */\n intent?: \"label\" | \"sentence\";\n}\n\nexport const FormFieldLabel = ({\n className,\n children,\n intent = \"label\",\n ...restProps\n}: FormFieldLabelProps) => {\n const { a11yProps, disabled, necessity } = useFormFieldProps();\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-label\",\n css: formFieldLabelCss,\n window: targetWindow,\n });\n\n const necessityLabel = necessity\n ? necessity === \"asterisk\"\n ? \" *\"\n : ` (${capitalize(necessity)})`\n : undefined;\n\n return (\n <Label\n as=\"label\"\n className={clsx(withBaseName(), withBaseName(intent), className)}\n id={a11yProps?.[\"aria-labelledby\"]}\n disabled={disabled}\n variant=\"secondary\"\n {...restProps}\n >\n {children}\n {necessityLabel && (\n <span className={withBaseName(\"necessityLabel\")}>{necessityLabel}</span>\n )}\n </Label>\n );\n};\n"],"names":["makePrefixer","useFormFieldProps","useWindow","useComponentCssInjection","formFieldLabelCss","capitalize","jsxs","Label","clsx","jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormFieldLabel.js","sources":["../src/form-field/FormFieldLabel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { Label, TextProps } from \"../text\";\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport formFieldLabelCss from \"./FormFieldLabel.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldLabel\");\n\nexport interface FormFieldLabelProps\n extends Omit<TextProps<\"label\">, \"variant\" | \"styleAs\"> {\n /**\n * Intent for the label.\n *\n * Defaults to \"label\"\n * Using \"sentence\" gives more prominent styling\n */\n intent?: \"label\" | \"sentence\";\n}\n\nexport const FormFieldLabel = ({\n className,\n children,\n intent = \"label\",\n ...restProps\n}: FormFieldLabelProps) => {\n const { a11yProps, disabled, necessity } = useFormFieldProps();\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-form-field-label\",\n css: formFieldLabelCss,\n window: targetWindow,\n });\n\n const necessityLabel = necessity\n ? necessity === \"asterisk\"\n ? \" *\"\n : ` (${capitalize(necessity)})`\n : undefined;\n\n return (\n <Label\n as=\"label\"\n className={clsx(withBaseName(), withBaseName(intent), className)}\n id={a11yProps?.[\"aria-labelledby\"]}\n disabled={disabled}\n variant=\"secondary\"\n {...restProps}\n >\n {children}\n {necessityLabel && (\n <span className={withBaseName(\"necessityLabel\")}>{necessityLabel}</span>\n )}\n </Label>\n );\n};\n"],"names":["makePrefixer","useFormFieldProps","useWindow","useComponentCssInjection","formFieldLabelCss","capitalize","jsxs","Label","clsx","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,oBAAoB,CAAA,CAAA;AAa/C,MAAM,iBAAiB,CAAC;AAAA,EAC7B,SAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,SAAA;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,EAAE,SAAA,EAAW,QAAU,EAAA,SAAA,KAAcC,mCAAkB,EAAA,CAAA;AAC7D,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,cAAA,GAAiB,YACnB,SAAc,KAAA,UAAA,GACZ,OACA,CAAK,EAAA,EAAAC,qBAAA,CAAW,SAAS,CAC3B,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,uBACGC,eAAA,CAAAC,WAAA,EAAA;AAAA,IACC,EAAG,EAAA,OAAA;AAAA,IACH,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,MAAM,GAAG,SAAS,CAAA;AAAA,IAC/D,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,iBAAA,CAAA;AAAA,IAChB,QAAA;AAAA,IACA,OAAQ,EAAA,WAAA;AAAA,IACP,GAAG,SAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,kCACEC,cAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,gBAAgB,CAAA;AAAA,QAAI,QAAA,EAAA,cAAA;AAAA,OAAe,CAAA;AAAA,KAAA;AAAA,GAErE,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -32,16 +32,10 @@ require('@salt-ds/window');
|
|
|
32
32
|
require('@salt-ds/icons');
|
|
33
33
|
require('../combo-box/ComboBox.js');
|
|
34
34
|
require('../dialog/Dialog.js');
|
|
35
|
-
require('../
|
|
36
|
-
require('../text/Text.js');
|
|
37
|
-
require('../text/Display.js');
|
|
38
|
-
require('../text/Headings.js');
|
|
39
|
-
require('../text/Label.js');
|
|
40
|
-
require('../text/TextNotation.js');
|
|
41
|
-
require('../text/TextAction.js');
|
|
42
|
-
require('../dialog/DialogContext.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
43
36
|
require('../dialog/DialogActions.js');
|
|
44
37
|
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
45
39
|
require('../dialog/DialogCloseButton.js');
|
|
46
40
|
require('../drawer/Drawer.js');
|
|
47
41
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -53,6 +47,14 @@ require('../flex-item/FlexItem.js');
|
|
|
53
47
|
require('../flex-layout/FlexLayout.js');
|
|
54
48
|
require('../flow-layout/FlowLayout.js');
|
|
55
49
|
require('../form-field/FormField.js');
|
|
50
|
+
require('../status-indicator/StatusIndicator.js');
|
|
51
|
+
require('../text/Text.js');
|
|
52
|
+
require('../text/Code.js');
|
|
53
|
+
require('../text/Display.js');
|
|
54
|
+
require('../text/Headings.js');
|
|
55
|
+
require('../text/Label.js');
|
|
56
|
+
require('../text/TextAction.js');
|
|
57
|
+
require('../text/TextNotation.js');
|
|
56
58
|
require('../grid-item/GridItem.js');
|
|
57
59
|
require('../grid-layout/GridLayout.js');
|
|
58
60
|
require('../input/Input.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldContext.js","sources":["../src/form-field-context/FormFieldContext.ts"],"sourcesContent":["import { createContext } from \"../utils\";\n\nexport interface A11yValueProps {\n /**\n * id for FormFieldHelperText\n */\n helperTextId?: string;\n /**\n * id for FormFieldLabel\n */\n labelId?: string;\n}\n\nexport type NecessityType = \"required\" | \"optional\" | \"asterisk\";\n\nexport interface a11yValueAriaProps {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n}\n\nexport interface FormFieldContextValue {\n a11yProps: a11yValueAriaProps;\n disabled: boolean;\n necessity: NecessityType | undefined;\n readOnly: boolean;\n validationStatus: \"error\" | \"warning\" | \"success\" | undefined;\n}\n\nexport const FormFieldContext = createContext(\n \"FormFieldContext\",\n {} as FormFieldContextValue\n);\n"],"names":["createContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormFieldContext.js","sources":["../src/form-field-context/FormFieldContext.ts"],"sourcesContent":["import { createContext } from \"../utils\";\n\nexport interface A11yValueProps {\n /**\n * id for FormFieldHelperText\n */\n helperTextId?: string;\n /**\n * id for FormFieldLabel\n */\n labelId?: string;\n}\n\nexport type NecessityType = \"required\" | \"optional\" | \"asterisk\";\n\nexport interface a11yValueAriaProps {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n}\n\nexport interface FormFieldContextValue {\n a11yProps: a11yValueAriaProps;\n disabled: boolean;\n necessity: NecessityType | undefined;\n readOnly: boolean;\n validationStatus: \"error\" | \"warning\" | \"success\" | undefined;\n}\n\nexport const FormFieldContext = createContext(\n \"FormFieldContext\",\n {} as FormFieldContextValue\n);\n"],"names":["createContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,gBAAmB,GAAAA,2BAAA;AAAA,EAC9B,kBAAA;AAAA,EACA,EAAC;AACH;;;;"}
|
|
@@ -32,16 +32,10 @@ require('../salt-provider/SaltProvider.js');
|
|
|
32
32
|
require('@salt-ds/icons');
|
|
33
33
|
require('../combo-box/ComboBox.js');
|
|
34
34
|
require('../dialog/Dialog.js');
|
|
35
|
-
require('../
|
|
36
|
-
require('../text/Text.js');
|
|
37
|
-
require('../text/Display.js');
|
|
38
|
-
require('../text/Headings.js');
|
|
39
|
-
require('../text/Label.js');
|
|
40
|
-
require('../text/TextNotation.js');
|
|
41
|
-
require('../text/TextAction.js');
|
|
42
|
-
require('../dialog/DialogContext.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
43
36
|
require('../dialog/DialogActions.js');
|
|
44
37
|
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
45
39
|
require('../dialog/DialogCloseButton.js');
|
|
46
40
|
require('../drawer/Drawer.js');
|
|
47
41
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -53,6 +47,14 @@ require('../flex-item/FlexItem.js');
|
|
|
53
47
|
require('../flex-layout/FlexLayout.js');
|
|
54
48
|
require('../flow-layout/FlowLayout.js');
|
|
55
49
|
require('../form-field/FormField.js');
|
|
50
|
+
require('../status-indicator/StatusIndicator.js');
|
|
51
|
+
require('../text/Text.js');
|
|
52
|
+
require('../text/Code.js');
|
|
53
|
+
require('../text/Display.js');
|
|
54
|
+
require('../text/Headings.js');
|
|
55
|
+
require('../text/Label.js');
|
|
56
|
+
require('../text/TextAction.js');
|
|
57
|
+
require('../text/TextNotation.js');
|
|
56
58
|
require('../form-field-context/FormFieldContext.js');
|
|
57
59
|
require('../grid-layout/GridLayout.js');
|
|
58
60
|
require('../input/Input.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","gridItemCss","useResponsiveProp","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"GridItem.js","sources":["../src/grid-item/GridItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicRef,\n PolymorphicComponentPropWithRef,\n} from \"../utils\";\nimport gridItemCss from \"./GridItem.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport const GRID_ALIGNMENT_BASE = [\n \"start\",\n \"end\",\n \"center\",\n \"stretch\",\n] as const;\n\ntype GridAlignment = (typeof GRID_ALIGNMENT_BASE)[number];\n\ntype GridProperty = number | \"auto\";\nexport type GridItemProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * The item will span across the provided number of grid columns. Defaults to \"auto\"\n */\n colSpan?: ResponsiveProp<GridProperty>;\n /**\n * The item will span across the provided number of grid rows. Defaults to \"auto\"\n */\n rowSpan?: ResponsiveProp<GridProperty>;\n /**\n * Aligns a grid item inside a cell along the inline (row) axis. Defaults to \"stretch\"\n */\n horizontalAlignment?: GridAlignment;\n /**\n * Aligns a grid item inside a cell along the block (column) axis. Defaults to \"stretch\"\n */\n verticalAlignment?: GridAlignment;\n }\n >;\n\nconst withBaseName = makePrefixer(\"saltGridItem\");\n\nconst colStart = \"auto\";\nconst colEnd = \"auto\";\nconst rowStart = \"auto\";\nconst rowEnd = \"auto\";\n\ntype GridItemComponent = <T extends ElementType = \"div\">(\n props: GridItemProps<T>\n) => ReactElement | null;\n\nexport const GridItem: GridItemComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n colSpan,\n rowSpan,\n horizontalAlignment = \"stretch\",\n verticalAlignment = \"stretch\",\n style,\n ...rest\n }: GridItemProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-item\",\n css: gridItemCss,\n window: targetWindow,\n });\n\n const Component = as || \"div\";\n const gridItemColSpan = useResponsiveProp(colSpan, \"auto\");\n\n const gridItemRowSpan = useResponsiveProp(rowSpan, \"auto\");\n\n const gridColumnStart = gridItemColSpan\n ? `span ${gridItemColSpan}`\n : colStart;\n\n const gridColumnEnd = gridItemColSpan ? `span ${gridItemColSpan}` : colEnd;\n\n const gridRowStart = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowStart;\n\n const gridRowEnd = gridItemRowSpan ? `span ${gridItemRowSpan}` : rowEnd;\n\n const gridStyles = {\n ...style,\n \"--gridItem-justifySelf\": horizontalAlignment,\n \"--gridItem-alignSelf\": verticalAlignment,\n \"--gridItem-gridRowStart\": gridRowStart,\n \"--gridItem-gridColumnStart\": gridColumnStart,\n \"--gridItem-gridRowEnd\": gridRowEnd,\n \"--gridItem-gridColumnEnd\": gridColumnEnd,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","gridItemCss","useResponsiveProp","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,mBAAsB,GAAA;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA4BA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA,CAAA;AAEhD,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AACf,MAAM,QAAW,GAAA,MAAA,CAAA;AACjB,MAAM,MAAS,GAAA,MAAA,CAAA;AAMR,MAAM,QAA8B,GAAAC,gBAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,mBAAsB,GAAA,SAAA;AAAA,IACtB,iBAAoB,GAAA,SAAA;AAAA,IACpB,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,eAAA,GAAkBC,mCAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkBA,mCAAkB,CAAA,OAAA,EAAS,MAAM,CAAA,CAAA;AAEzD,IAAM,MAAA,eAAA,GAAkB,eACpB,GAAA,CAAA,KAAA,EAAQ,eACR,CAAA,CAAA,GAAA,QAAA,CAAA;AAEJ,IAAM,MAAA,aAAA,GAAgB,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEpE,IAAM,MAAA,YAAA,GAAe,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,QAAA,CAAA;AAEnE,IAAM,MAAA,UAAA,GAAa,eAAkB,GAAA,CAAA,KAAA,EAAQ,eAAoB,CAAA,CAAA,GAAA,MAAA,CAAA;AAEjE,IAAA,MAAM,UAAa,GAAA;AAAA,MACjB,GAAG,KAAA;AAAA,MACH,wBAA0B,EAAA,mBAAA;AAAA,MAC1B,sBAAwB,EAAA,iBAAA;AAAA,MACxB,yBAA2B,EAAA,YAAA;AAAA,MAC3B,4BAA8B,EAAA,eAAA;AAAA,MAC9B,uBAAyB,EAAA,UAAA;AAAA,MACzB,0BAA4B,EAAA,aAAA;AAAA,KAC9B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,UAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;"}
|
|
@@ -32,16 +32,10 @@ require('../salt-provider/SaltProvider.js');
|
|
|
32
32
|
require('@salt-ds/icons');
|
|
33
33
|
require('../combo-box/ComboBox.js');
|
|
34
34
|
require('../dialog/Dialog.js');
|
|
35
|
-
require('../
|
|
36
|
-
require('../text/Text.js');
|
|
37
|
-
require('../text/Display.js');
|
|
38
|
-
require('../text/Headings.js');
|
|
39
|
-
require('../text/Label.js');
|
|
40
|
-
require('../text/TextNotation.js');
|
|
41
|
-
require('../text/TextAction.js');
|
|
42
|
-
require('../dialog/DialogContext.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
43
36
|
require('../dialog/DialogActions.js');
|
|
44
37
|
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
45
39
|
require('../dialog/DialogCloseButton.js');
|
|
46
40
|
require('../drawer/Drawer.js');
|
|
47
41
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -53,6 +47,14 @@ require('../flex-item/FlexItem.js');
|
|
|
53
47
|
require('../flex-layout/FlexLayout.js');
|
|
54
48
|
require('../flow-layout/FlowLayout.js');
|
|
55
49
|
require('../form-field/FormField.js');
|
|
50
|
+
require('../status-indicator/StatusIndicator.js');
|
|
51
|
+
require('../text/Text.js');
|
|
52
|
+
require('../text/Code.js');
|
|
53
|
+
require('../text/Display.js');
|
|
54
|
+
require('../text/Headings.js');
|
|
55
|
+
require('../text/Label.js');
|
|
56
|
+
require('../text/TextAction.js');
|
|
57
|
+
require('../text/TextNotation.js');
|
|
56
58
|
require('../form-field-context/FormFieldContext.js');
|
|
57
59
|
require('../grid-item/GridItem.js');
|
|
58
60
|
require('../input/Input.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GridLayout.js","sources":["../src/grid-layout/GridLayout.tsx"],"sourcesContent":["import { forwardRef, ReactElement, ElementType } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport gridLayoutCss from \"./GridLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type GridLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Number of columns to be displayed. Defaults to 12\n */\n columns?: ResponsiveProp<number>;\n /**\n * Number of rows to be displayed. Defaults to 1\n */\n rows?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 3\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 1\n */\n columnGap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 1\n */\n rowGap?: ResponsiveProp<number>;\n }\n >;\n\ntype GridLayoutComponent = <T extends ElementType = \"div\">(\n props: GridLayoutProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltGridLayout\");\n\nexport const GridLayout: GridLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n columns = 12,\n rows = 1,\n gap,\n columnGap,\n rowGap,\n style,\n ...rest\n }: GridLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-layout\",\n css: gridLayoutCss,\n window: targetWindow,\n });\n const Component = as || \"div\";\n\n const gridColumns = useResponsiveProp(columns, 12);\n\n const gridRows = useResponsiveProp(rows, 1);\n\n const gridGap = useResponsiveProp(gap, 3);\n\n const gridColumnGap = useResponsiveProp(columnGap, 3);\n\n const gridRowGap = useResponsiveProp(rowGap, 3);\n\n const gridLayoutStyles = {\n ...style,\n \"--gridLayout-columns\": gridColumns,\n \"--gridLayout-rows\": gridRows,\n \"--gridLayout-columnGap\": gridColumnGap ?? gridGap,\n \"--gridLayout-rowGap\": gridRowGap ?? gridGap,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","gridLayoutCss","useResponsiveProp","jsx","clsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"GridLayout.js","sources":["../src/grid-layout/GridLayout.tsx"],"sourcesContent":["import { forwardRef, ReactElement, ElementType } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n makePrefixer,\n ResponsiveProp,\n useResponsiveProp,\n PolymorphicComponentPropWithRef,\n PolymorphicRef,\n} from \"../utils\";\n\nimport gridLayoutCss from \"./GridLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nexport type GridLayoutProps<T extends ElementType> =\n PolymorphicComponentPropWithRef<\n T,\n {\n /**\n * Number of columns to be displayed. Defaults to 12\n */\n columns?: ResponsiveProp<number>;\n /**\n * Number of rows to be displayed. Defaults to 1\n */\n rows?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns and the rows by setting a density multiplier. Defaults to 3\n */\n gap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the columns by setting a density multiplier. Defaults to 1\n */\n columnGap?: ResponsiveProp<number>;\n /**\n * Defines the size of the gutter between the rows by setting a density multiplier. Defaults to 1\n */\n rowGap?: ResponsiveProp<number>;\n }\n >;\n\ntype GridLayoutComponent = <T extends ElementType = \"div\">(\n props: GridLayoutProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltGridLayout\");\n\nexport const GridLayout: GridLayoutComponent = forwardRef(\n <T extends ElementType = \"div\">(\n {\n as,\n children,\n className,\n columns = 12,\n rows = 1,\n gap,\n columnGap,\n rowGap,\n style,\n ...rest\n }: GridLayoutProps<T>,\n ref?: PolymorphicRef<T>\n ) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-grid-layout\",\n css: gridLayoutCss,\n window: targetWindow,\n });\n const Component = as || \"div\";\n\n const gridColumns = useResponsiveProp(columns, 12);\n\n const gridRows = useResponsiveProp(rows, 1);\n\n const gridGap = useResponsiveProp(gap, 3);\n\n const gridColumnGap = useResponsiveProp(columnGap, 3);\n\n const gridRowGap = useResponsiveProp(rowGap, 3);\n\n const gridLayoutStyles = {\n ...style,\n \"--gridLayout-columns\": gridColumns,\n \"--gridLayout-rows\": gridRows,\n \"--gridLayout-columnGap\": gridColumnGap ?? gridGap,\n \"--gridLayout-rowGap\": gridRowGap ?? gridGap,\n };\n\n return (\n <Component\n className={clsx(withBaseName(), className)}\n style={gridLayoutStyles}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","gridLayoutCss","useResponsiveProp","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAE3C,MAAM,UAAkC,GAAAC,gBAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAU,GAAA,EAAA;AAAA,IACV,IAAO,GAAA,CAAA;AAAA,IACP,GAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AACD,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AAExB,IAAM,MAAA,WAAA,GAAcC,mCAAkB,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AAEjD,IAAM,MAAA,QAAA,GAAWA,mCAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAE1C,IAAM,MAAA,OAAA,GAAUA,mCAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AAExC,IAAM,MAAA,aAAA,GAAgBA,mCAAkB,CAAA,SAAA,EAAW,CAAC,CAAA,CAAA;AAEpD,IAAM,MAAA,UAAA,GAAaA,mCAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAE9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,sBAAwB,EAAA,WAAA;AAAA,MACxB,mBAAqB,EAAA,QAAA;AAAA,MACrB,0BAA0B,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,OAAA;AAAA,MAC3C,uBAAuB,UAAc,IAAA,IAAA,GAAA,UAAA,GAAA,OAAA;AAAA,KACvC,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAO,EAAA,gBAAA;AAAA,MACP,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-cjs/index.js
CHANGED
|
@@ -76,11 +76,12 @@ var StatusAdornment = require('./status-adornment/StatusAdornment.js');
|
|
|
76
76
|
var StatusIndicator = require('./status-indicator/StatusIndicator.js');
|
|
77
77
|
var ValidationStatus = require('./status-indicator/ValidationStatus.js');
|
|
78
78
|
var Text = require('./text/Text.js');
|
|
79
|
+
var Code = require('./text/Code.js');
|
|
79
80
|
var Display = require('./text/Display.js');
|
|
80
81
|
var Headings = require('./text/Headings.js');
|
|
81
82
|
var Label = require('./text/Label.js');
|
|
82
|
-
var TextNotation = require('./text/TextNotation.js');
|
|
83
83
|
var TextAction = require('./text/TextAction.js');
|
|
84
|
+
var TextNotation = require('./text/TextNotation.js');
|
|
84
85
|
var Density = require('./theme/Density.js');
|
|
85
86
|
var Theme = require('./theme/Theme.js');
|
|
86
87
|
var Mode = require('./theme/Mode.js');
|
|
@@ -204,6 +205,7 @@ exports.StatusAdornment = StatusAdornment.StatusAdornment;
|
|
|
204
205
|
exports.StatusIndicator = StatusIndicator.StatusIndicator;
|
|
205
206
|
exports.VALIDATION_NAMED_STATUS = ValidationStatus.VALIDATION_NAMED_STATUS;
|
|
206
207
|
exports.Text = Text.Text;
|
|
208
|
+
exports.Code = Code.Code;
|
|
207
209
|
exports.Display1 = Display.Display1;
|
|
208
210
|
exports.Display2 = Display.Display2;
|
|
209
211
|
exports.Display3 = Display.Display3;
|
|
@@ -212,8 +214,8 @@ exports.H2 = Headings.H2;
|
|
|
212
214
|
exports.H3 = Headings.H3;
|
|
213
215
|
exports.H4 = Headings.H4;
|
|
214
216
|
exports.Label = Label.Label;
|
|
215
|
-
exports.TextNotation = TextNotation.TextNotation;
|
|
216
217
|
exports.TextAction = TextAction.TextAction;
|
|
218
|
+
exports.TextNotation = TextNotation.TextNotation;
|
|
217
219
|
exports.DensityValues = Density.DensityValues;
|
|
218
220
|
exports.getCharacteristicValue = Theme.getCharacteristicValue;
|
|
219
221
|
exports.ModeValues = Mode.ModeValues;
|
package/dist-cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist-cjs/input/Input.js
CHANGED
|
@@ -35,16 +35,10 @@ require('../checkbox/CheckboxGroup.js');
|
|
|
35
35
|
require('@salt-ds/icons');
|
|
36
36
|
require('../combo-box/ComboBox.js');
|
|
37
37
|
require('../dialog/Dialog.js');
|
|
38
|
-
require('../
|
|
39
|
-
require('../text/Text.js');
|
|
40
|
-
require('../text/Display.js');
|
|
41
|
-
require('../text/Headings.js');
|
|
42
|
-
require('../text/Label.js');
|
|
43
|
-
require('../text/TextNotation.js');
|
|
44
|
-
require('../text/TextAction.js');
|
|
45
|
-
require('../dialog/DialogContext.js');
|
|
38
|
+
require('../dialog/DialogHeader.js');
|
|
46
39
|
require('../dialog/DialogActions.js');
|
|
47
40
|
require('../dialog/DialogContent.js');
|
|
41
|
+
require('../dialog/DialogContext.js');
|
|
48
42
|
require('../dialog/DialogCloseButton.js');
|
|
49
43
|
require('../drawer/Drawer.js');
|
|
50
44
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -56,6 +50,14 @@ require('../flex-item/FlexItem.js');
|
|
|
56
50
|
require('../flex-layout/FlexLayout.js');
|
|
57
51
|
require('../flow-layout/FlowLayout.js');
|
|
58
52
|
require('../form-field/FormField.js');
|
|
53
|
+
require('../status-indicator/StatusIndicator.js');
|
|
54
|
+
require('../text/Text.js');
|
|
55
|
+
require('../text/Code.js');
|
|
56
|
+
require('../text/Display.js');
|
|
57
|
+
require('../text/Headings.js');
|
|
58
|
+
require('../text/Label.js');
|
|
59
|
+
require('../text/TextAction.js');
|
|
60
|
+
require('../text/TextNotation.js');
|
|
59
61
|
require('../grid-item/GridItem.js');
|
|
60
62
|
require('../grid-layout/GridLayout.js');
|
|
61
63
|
require('../link/Link.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../src/input/Input.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEvent,\n ComponentPropsWithoutRef,\n FocusEvent,\n forwardRef,\n InputHTMLAttributes,\n ReactNode,\n Ref,\n useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { StatusAdornment } from \"../status-adornment\";\n\nimport inputCss from \"./Input.css\";\n\nconst withBaseName = makePrefixer(\"saltInput\");\n\nexport interface InputProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"input\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * The marker to use in an empty read only Input.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * Optional ref for the input component\n */\n inputRef?: Ref<HTMLInputElement>;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * Start adornment component\n */\n startAdornment?: ReactNode;\n /**\n * Alignment of text within container. Defaults to \"left\"\n */\n textAlign?: \"left\" | \"center\" | \"right\";\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const Input = forwardRef<HTMLDivElement, InputProps>(function Input(\n {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n className: classNameProp,\n disabled,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n id,\n inputProps = {},\n inputRef,\n placeholder,\n readOnly: readOnlyProp,\n role,\n startAdornment,\n style,\n textAlign = \"left\",\n value: valueProp,\n defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n ...other\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-input\",\n css: inputCss,\n window: targetWindow,\n });\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const restA11yProps = {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n };\n\n const isDisabled = disabled || formFieldDisabled;\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const [focused, setFocused] = useState(false);\n\n const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n onBlur,\n onChange,\n onFocus,\n required: inputPropsRequired,\n ...restInputProps\n } = inputProps;\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : inputPropsRequired;\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"Input\",\n state: \"value\",\n });\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const value = event.target.value;\n setValue(value);\n onChange?.(event);\n };\n\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n onBlur?.(event);\n setFocused(false);\n };\n\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n\n const inputStyle = {\n \"--input-textAlign\": textAlign,\n ...style,\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus || \"\")]: validationStatus,\n },\n classNameProp\n )}\n ref={ref}\n style={inputStyle}\n {...other}\n >\n {startAdornment && (\n <div className={withBaseName(\"startAdornmentContainer\")}>\n {startAdornment}\n </div>\n )}\n <input\n aria-describedby={clsx(formFieldDescribedBy, inputDescribedBy)}\n aria-labelledby={clsx(formFieldLabelledBy, inputLabelledBy)}\n className={clsx(withBaseName(\"input\"), inputProps?.className)}\n disabled={isDisabled}\n id={id}\n readOnly={isReadOnly}\n ref={inputRef}\n role={role}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n value={value}\n {...restA11yProps}\n {...restInputProps}\n required={isRequired}\n />\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment && (\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {endAdornment}\n </div>\n )}\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Input","useWindow","useComponentCssInjection","inputCss","useFormFieldProps","useState","useControlled","value","jsxs","clsx","jsx","StatusAdornment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../src/input/Input.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEvent,\n ComponentPropsWithoutRef,\n FocusEvent,\n forwardRef,\n InputHTMLAttributes,\n ReactNode,\n Ref,\n useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { StatusAdornment } from \"../status-adornment\";\n\nimport inputCss from \"./Input.css\";\n\nconst withBaseName = makePrefixer(\"saltInput\");\n\nexport interface InputProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"input\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * The marker to use in an empty read only Input.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * Optional ref for the input component\n */\n inputRef?: Ref<HTMLInputElement>;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * Start adornment component\n */\n startAdornment?: ReactNode;\n /**\n * Alignment of text within container. Defaults to \"left\"\n */\n textAlign?: \"left\" | \"center\" | \"right\";\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const Input = forwardRef<HTMLDivElement, InputProps>(function Input(\n {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n className: classNameProp,\n disabled,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n id,\n inputProps = {},\n inputRef,\n placeholder,\n readOnly: readOnlyProp,\n role,\n startAdornment,\n style,\n textAlign = \"left\",\n value: valueProp,\n defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n ...other\n },\n ref\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-input\",\n css: inputCss,\n window: targetWindow,\n });\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const restA11yProps = {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n };\n\n const isDisabled = disabled || formFieldDisabled;\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const [focused, setFocused] = useState(false);\n\n const isEmptyReadOnly = isReadOnly && !defaultValueProp && !valueProp;\n const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultValueProp;\n\n const {\n \"aria-describedby\": inputDescribedBy,\n \"aria-labelledby\": inputLabelledBy,\n onBlur,\n onChange,\n onFocus,\n required: inputPropsRequired,\n ...restInputProps\n } = inputProps;\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : inputPropsRequired;\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"Input\",\n state: \"value\",\n });\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const value = event.target.value;\n setValue(value);\n onChange?.(event);\n };\n\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n onBlur?.(event);\n setFocused(false);\n };\n\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n\n const inputStyle = {\n \"--input-textAlign\": textAlign,\n ...style,\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus || \"\")]: validationStatus,\n },\n classNameProp\n )}\n ref={ref}\n style={inputStyle}\n {...other}\n >\n {startAdornment && (\n <div className={withBaseName(\"startAdornmentContainer\")}>\n {startAdornment}\n </div>\n )}\n <input\n aria-describedby={clsx(formFieldDescribedBy, inputDescribedBy)}\n aria-labelledby={clsx(formFieldLabelledBy, inputLabelledBy)}\n className={clsx(withBaseName(\"input\"), inputProps?.className)}\n disabled={isDisabled}\n id={id}\n readOnly={isReadOnly}\n ref={inputRef}\n role={role}\n tabIndex={isDisabled ? -1 : 0}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={!isDisabled ? handleFocus : undefined}\n placeholder={placeholder}\n value={value}\n {...restA11yProps}\n {...restInputProps}\n required={isRequired}\n />\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment && (\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {endAdornment}\n </div>\n )}\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Input","useWindow","useComponentCssInjection","inputCss","useFormFieldProps","useState","useControlled","value","jsxs","clsx","jsx","StatusAdornment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AA+ChC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA;AAAA,EACE,uBAAyB,EAAA,oBAAA;AAAA,EACzB,eAAiB,EAAA,YAAA;AAAA,EACjB,WAAa,EAAA,QAAA;AAAA,EACb,SAAW,EAAA,aAAA;AAAA,EACX,QAAA;AAAA,EACA,mBAAsB,GAAA,QAAA;AAAA,EACtB,YAAA;AAAA,EACA,EAAA;AAAA,EACA,aAAa,EAAC;AAAA,EACd,QAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,IAAA;AAAA,EACA,cAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAY,GAAA,MAAA;AAAA,EACZ,KAAO,EAAA,SAAA;AAAA,EACP,YAAc,EAAA,gBAAA,GAAmB,SAAc,KAAA,KAAA,CAAA,GAAY,EAAK,GAAA,KAAA,CAAA;AAAA,EAChE,gBAAkB,EAAA,oBAAA;AAAA,EAClB,OAAU,GAAA,SAAA;AAAA,EACP,GAAA,KAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,SAAW,EAAA;AAAA,MACT,kBAAoB,EAAA,oBAAA;AAAA,MACpB,iBAAmB,EAAA,mBAAA;AAAA,QACjB,EAAC;AAAA,IACL,QAAU,EAAA,iBAAA;AAAA,IACV,QAAU,EAAA,iBAAA;AAAA,IACV,SAAW,EAAA,iBAAA;AAAA,IACX,gBAAkB,EAAA,yBAAA;AAAA,MAChBC,mCAAkB,EAAA,CAAA;AAEtB,EAAA,MAAM,aAAgB,GAAA;AAAA,IACpB,uBAAyB,EAAA,oBAAA;AAAA,IACzB,eAAiB,EAAA,YAAA;AAAA,IACjB,WAAa,EAAA,QAAA;AAAA,GACf,CAAA;AAEA,EAAA,MAAM,aAAa,QAAY,IAAA,iBAAA,CAAA;AAC/B,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AACnC,EAAA,MAAM,mBAAmB,yBAA6B,IAAA,IAAA,GAAA,yBAAA,GAAA,oBAAA,CAAA;AAEtD,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AAE5C,EAAA,MAAM,eAAkB,GAAA,UAAA,IAAc,CAAC,gBAAA,IAAoB,CAAC,SAAA,CAAA;AAC5D,EAAM,MAAA,YAAA,GAAe,kBAAkB,mBAAsB,GAAA,gBAAA,CAAA;AAE7D,EAAM,MAAA;AAAA,IACJ,kBAAoB,EAAA,gBAAA;AAAA,IACpB,iBAAmB,EAAA,eAAA;AAAA,IACnB,MAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAU,EAAA,kBAAA;AAAA,IACP,GAAA,cAAA;AAAA,GACD,GAAA,UAAA,CAAA;AAEJ,EAAM,MAAA,UAAA,GAAa,oBACf,CAAC,UAAA,EAAY,UAAU,CAAE,CAAA,QAAA,CAAS,iBAAiB,CACnD,GAAA,kBAAA,CAAA;AAEJ,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,2BAAc,CAAA;AAAA,IACtC,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,IAAM,EAAA,OAAA;AAAA,IACN,KAAO,EAAA,OAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,YAAA,GAAe,CAAC,KAAyC,KAAA;AAC7D,IAAMC,MAAAA,MAAAA,GAAQ,MAAM,MAAO,CAAA,KAAA,CAAA;AAC3B,IAAA,QAAA,CAASA,MAAK,CAAA,CAAA;AACd,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,CAAC,KAAwC,KAAA;AAC1D,IAAS,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,KAAA,CAAA,CAAA;AACT,IAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAAA,GAClB,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AAC3D,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AACV,IAAA,UAAA,CAAW,IAAI,CAAA,CAAA;AAAA,GACjB,CAAA;AAEA,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,mBAAqB,EAAA,SAAA;AAAA,IACrB,GAAG,KAAA;AAAA,GACL,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,OAAO,CAAA;AAAA,MACpB;AAAA,QACE,CAAC,YAAA,CAAa,SAAS,CAAA,GAAI,CAAC,UAAc,IAAA,OAAA;AAAA,QAC1C,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,gBAAoB,IAAA,EAAE,CAAI,GAAA,gBAAA;AAAA,OAC1C;AAAA,MACA,aAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IACN,GAAG,KAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,cAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,yBAAyB,CAAA;AAAA,QACnD,QAAA,EAAA,cAAA;AAAA,OACH,CAAA;AAAA,sBAEDA,cAAA,CAAA,OAAA,EAAA;AAAA,QACC,kBAAA,EAAkBD,SAAK,CAAA,oBAAA,EAAsB,gBAAgB,CAAA;AAAA,QAC7D,iBAAA,EAAiBA,SAAK,CAAA,mBAAA,EAAqB,eAAe,CAAA;AAAA,QAC1D,WAAWA,SAAK,CAAA,YAAA,CAAa,OAAO,CAAA,EAAG,yCAAY,SAAS,CAAA;AAAA,QAC5D,QAAU,EAAA,UAAA;AAAA,QACV,EAAA;AAAA,QACA,QAAU,EAAA,UAAA;AAAA,QACV,GAAK,EAAA,QAAA;AAAA,QACL,IAAA;AAAA,QACA,QAAA,EAAU,aAAa,CAAK,CAAA,GAAA,CAAA;AAAA,QAC5B,MAAQ,EAAA,UAAA;AAAA,QACR,QAAU,EAAA,YAAA;AAAA,QACV,OAAA,EAAS,CAAC,UAAA,GAAa,WAAc,GAAA,KAAA,CAAA;AAAA,QACrC,WAAA;AAAA,QACA,KAAA;AAAA,QACC,GAAG,aAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAU,EAAA,UAAA;AAAA,OACZ,CAAA;AAAA,MACC,CAAC,UAAA,IAAc,CAAC,UAAA,IAAc,oCAC5BC,cAAA,CAAAC,+BAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,MAE5C,gCACED,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,uBAAuB,CAAA;AAAA,QACjD,QAAA,EAAA,YAAA;AAAA,OACH,CAAA;AAAA,sBAEDA,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,qBAAqB,CAAA;AAAA,OAAG,CAAA;AAAA,KAAA;AAAA,GACvD,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
package/dist-cjs/link/Link.js
CHANGED
|
@@ -32,16 +32,10 @@ var styles = require('@salt-ds/styles');
|
|
|
32
32
|
var window = require('@salt-ds/window');
|
|
33
33
|
require('../combo-box/ComboBox.js');
|
|
34
34
|
require('../dialog/Dialog.js');
|
|
35
|
-
require('../
|
|
36
|
-
var Text = require('../text/Text.js');
|
|
37
|
-
require('../text/Display.js');
|
|
38
|
-
require('../text/Headings.js');
|
|
39
|
-
require('../text/Label.js');
|
|
40
|
-
require('../text/TextNotation.js');
|
|
41
|
-
require('../text/TextAction.js');
|
|
42
|
-
require('../dialog/DialogContext.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
43
36
|
require('../dialog/DialogActions.js');
|
|
44
37
|
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
45
39
|
require('../dialog/DialogCloseButton.js');
|
|
46
40
|
require('../drawer/Drawer.js');
|
|
47
41
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -53,6 +47,14 @@ require('../flex-item/FlexItem.js');
|
|
|
53
47
|
require('../flex-layout/FlexLayout.js');
|
|
54
48
|
require('../flow-layout/FlowLayout.js');
|
|
55
49
|
require('../form-field/FormField.js');
|
|
50
|
+
require('../status-indicator/StatusIndicator.js');
|
|
51
|
+
var Text = require('../text/Text.js');
|
|
52
|
+
require('../text/Code.js');
|
|
53
|
+
require('../text/Display.js');
|
|
54
|
+
require('../text/Headings.js');
|
|
55
|
+
require('../text/Label.js');
|
|
56
|
+
require('../text/TextAction.js');
|
|
57
|
+
require('../text/TextNotation.js');
|
|
56
58
|
require('../form-field-context/FormFieldContext.js');
|
|
57
59
|
require('../grid-item/GridItem.js');
|
|
58
60
|
require('../grid-layout/GridLayout.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport linkCss from \"./Link.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n IconComponent?: ComponentType<IconProps> | null;\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n {\n IconComponent = TearOutIcon,\n href,\n className,\n children,\n variant = \"primary\",\n target = \"_self\",\n ...rest\n },\n ref\n): ReactElement<LinkProps> {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link\",\n css: linkCss,\n window: targetWindow,\n });\n\n return (\n <Text\n as=\"a\"\n className={clsx(withBaseName(), className)}\n href={href}\n ref={ref}\n target={target}\n variant={variant}\n {...rest}\n >\n {children}\n {target === \"_blank\" && (\n <>\n {IconComponent && (\n <IconComponent className={withBaseName(\"icon\")} aria-hidden />\n )}\n <span className={withBaseName(\"externalLinkADA\")}>External</span>\n </>\n )}\n </Text>\n );\n});\n"],"names":["makePrefixer","forwardRef","Link","TearOutIcon","useWindow","useComponentCssInjection","linkCss","jsxs","Text","clsx","Fragment","jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\nimport { IconProps, TearOutIcon } from \"@salt-ds/icons\";\nimport { makePrefixer } from \"../utils\";\nimport { Text, TextProps } from \"../text\";\n\nimport linkCss from \"./Link.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps extends Omit<TextProps<\"a\">, \"as\" | \"disabled\"> {\n IconComponent?: ComponentType<IconProps> | null;\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n {\n IconComponent = TearOutIcon,\n href,\n className,\n children,\n variant = \"primary\",\n target = \"_self\",\n ...rest\n },\n ref\n): ReactElement<LinkProps> {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link\",\n css: linkCss,\n window: targetWindow,\n });\n\n return (\n <Text\n as=\"a\"\n className={clsx(withBaseName(), className)}\n href={href}\n ref={ref}\n target={target}\n variant={variant}\n {...rest}\n >\n {children}\n {target === \"_blank\" && (\n <>\n {IconComponent && (\n <IconComponent className={withBaseName(\"icon\")} aria-hidden />\n )}\n <span className={withBaseName(\"externalLinkADA\")}>External</span>\n </>\n )}\n </Text>\n );\n});\n"],"names":["makePrefixer","forwardRef","Link","TearOutIcon","useWindow","useComponentCssInjection","linkCss","jsxs","Text","clsx","Fragment","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAY/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,aAAgB,GAAAC,iBAAA;AAAA,EAChB,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,MAAS,GAAA,OAAA;AAAA,EACN,GAAA,IAAA;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,EAAG,EAAA,GAAA;AAAA,IACH,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,IAAA;AAAA,IACA,GAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,WAAW,QACV,oBAAAF,eAAA,CAAAG,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,aAAA,oBACEC,cAAA,CAAA,aAAA,EAAA;AAAA,YAAc,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAAG,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,0BAE7DA,cAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YAAG,QAAA,EAAA,UAAA;AAAA,WAAQ,CAAA;AAAA,SAAA;AAAA,OAC5D,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -33,16 +33,10 @@ require('../checkbox/CheckboxGroup.js');
|
|
|
33
33
|
require('@salt-ds/icons');
|
|
34
34
|
require('../combo-box/ComboBox.js');
|
|
35
35
|
require('../dialog/Dialog.js');
|
|
36
|
-
require('../
|
|
37
|
-
require('../text/Text.js');
|
|
38
|
-
require('../text/Display.js');
|
|
39
|
-
require('../text/Headings.js');
|
|
40
|
-
require('../text/Label.js');
|
|
41
|
-
require('../text/TextNotation.js');
|
|
42
|
-
require('../text/TextAction.js');
|
|
43
|
-
require('../dialog/DialogContext.js');
|
|
36
|
+
require('../dialog/DialogHeader.js');
|
|
44
37
|
require('../dialog/DialogActions.js');
|
|
45
38
|
require('../dialog/DialogContent.js');
|
|
39
|
+
require('../dialog/DialogContext.js');
|
|
46
40
|
require('../dialog/DialogCloseButton.js');
|
|
47
41
|
require('../drawer/Drawer.js');
|
|
48
42
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -54,6 +48,14 @@ require('../flex-item/FlexItem.js');
|
|
|
54
48
|
require('../flex-layout/FlexLayout.js');
|
|
55
49
|
require('../flow-layout/FlowLayout.js');
|
|
56
50
|
require('../form-field/FormField.js');
|
|
51
|
+
require('../status-indicator/StatusIndicator.js');
|
|
52
|
+
require('../text/Text.js');
|
|
53
|
+
require('../text/Code.js');
|
|
54
|
+
require('../text/Display.js');
|
|
55
|
+
require('../text/Headings.js');
|
|
56
|
+
require('../text/Label.js');
|
|
57
|
+
require('../text/TextAction.js');
|
|
58
|
+
require('../text/TextNotation.js');
|
|
57
59
|
require('../form-field-context/FormFieldContext.js');
|
|
58
60
|
require('../grid-item/GridItem.js');
|
|
59
61
|
require('../grid-layout/GridLayout.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkCard.js","sources":["../src/link-card/LinkCard.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport linkCardCss from \"./LinkCard.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkCard\");\n\nexport interface LinkCardProps extends ComponentPropsWithoutRef<\"a\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * Styling variant; defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const LinkCard = forwardRef<HTMLAnchorElement, LinkCardProps>(\n function LinkCard(props, ref) {\n const {\n accent,\n children,\n className,\n href,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link-card\",\n css: linkCardCss,\n window: targetWindow,\n });\n\n return (\n <a\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent ?? \"\")}`)]: accent,\n },\n className\n )}\n href={href}\n {...rest}\n ref={ref}\n >\n {children}\n </a>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","LinkCard","useWindow","useComponentCssInjection","linkCardCss","jsx","clsx","capitalize"],"mappings":"
|
|
1
|
+
{"version":3,"file":"LinkCard.js","sources":["../src/link-card/LinkCard.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport linkCardCss from \"./LinkCard.css\";\n\nconst withBaseName = makePrefixer(\"saltLinkCard\");\n\nexport interface LinkCardProps extends ComponentPropsWithoutRef<\"a\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * Styling variant; defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nexport const LinkCard = forwardRef<HTMLAnchorElement, LinkCardProps>(\n function LinkCard(props, ref) {\n const {\n accent,\n children,\n className,\n href,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-link-card\",\n css: linkCardCss,\n window: targetWindow,\n });\n\n return (\n <a\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent ?? \"\")}`)]: accent,\n },\n className\n )}\n href={href}\n {...rest}\n ref={ref}\n >\n {children}\n </a>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","LinkCard","useWindow","useComponentCssInjection","linkCardCss","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA,CAAA;AAazC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAU,GAAA,SAAA;AAAA,MACP,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,GAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,OAAO,CAAA;AAAA,QACpB;AAAA,UACE,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,UAC1B,CAAC,YAAa,CAAA,CAAA,MAAA,EAASC,sBAAW,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,GAAG,CAAI,GAAA,MAAA;AAAA,SACvD;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -32,16 +32,10 @@ require('@salt-ds/window');
|
|
|
32
32
|
require('@salt-ds/icons');
|
|
33
33
|
require('../combo-box/ComboBox.js');
|
|
34
34
|
require('../dialog/Dialog.js');
|
|
35
|
-
require('../
|
|
36
|
-
require('../text/Text.js');
|
|
37
|
-
require('../text/Display.js');
|
|
38
|
-
require('../text/Headings.js');
|
|
39
|
-
require('../text/Label.js');
|
|
40
|
-
require('../text/TextNotation.js');
|
|
41
|
-
require('../text/TextAction.js');
|
|
42
|
-
require('../dialog/DialogContext.js');
|
|
35
|
+
require('../dialog/DialogHeader.js');
|
|
43
36
|
require('../dialog/DialogActions.js');
|
|
44
37
|
require('../dialog/DialogContent.js');
|
|
38
|
+
require('../dialog/DialogContext.js');
|
|
45
39
|
require('../dialog/DialogCloseButton.js');
|
|
46
40
|
require('../drawer/Drawer.js');
|
|
47
41
|
require('../drawer/DrawerCloseButton.js');
|
|
@@ -53,6 +47,14 @@ require('../flex-item/FlexItem.js');
|
|
|
53
47
|
require('../flex-layout/FlexLayout.js');
|
|
54
48
|
require('../flow-layout/FlowLayout.js');
|
|
55
49
|
require('../form-field/FormField.js');
|
|
50
|
+
require('../status-indicator/StatusIndicator.js');
|
|
51
|
+
require('../text/Text.js');
|
|
52
|
+
require('../text/Code.js');
|
|
53
|
+
require('../text/Display.js');
|
|
54
|
+
require('../text/Headings.js');
|
|
55
|
+
require('../text/Label.js');
|
|
56
|
+
require('../text/TextAction.js');
|
|
57
|
+
require('../text/TextNotation.js');
|
|
56
58
|
require('../form-field-context/FormFieldContext.js');
|
|
57
59
|
require('../grid-item/GridItem.js');
|
|
58
60
|
require('../grid-layout/GridLayout.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n id: string;\n disabled: boolean;\n value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n openState: boolean;\n setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n register: (\n optionValue: OptionValue<Item>,\n element: HTMLElement\n ) => () => void;\n selectedState: unknown[];\n select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n activeState?: OptionValue<Item>;\n setActive: (option: OptionValue<Item>) => void;\n multiselect: boolean;\n focusVisibleState: boolean;\n valueToString: (item: Item) => string;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n \"ListControlContext\",\n {\n openState: false,\n setOpen() {\n return undefined;\n },\n register() {\n return () => undefined;\n },\n selectedState: [],\n select() {\n return undefined;\n },\n activeState: undefined,\n setActive() {\n return undefined;\n },\n multiselect: false,\n focusVisibleState: false,\n valueToString: defaultValueToString,\n }\n);\n\nexport function useListControlContext<Item>() {\n return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n id: string;\n disabled: boolean;\n value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n openState: boolean;\n setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n register: (\n optionValue: OptionValue<Item>,\n element: HTMLElement\n ) => () => void;\n selectedState: unknown[];\n select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n activeState?: OptionValue<Item>;\n setActive: (option: OptionValue<Item>) => void;\n multiselect: boolean;\n focusVisibleState: boolean;\n valueToString: (item: Item) => string;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Need to use any here as a winder type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n \"ListControlContext\",\n {\n openState: false,\n setOpen() {\n return undefined;\n },\n register() {\n return () => undefined;\n },\n selectedState: [],\n select() {\n return undefined;\n },\n activeState: undefined,\n setActive() {\n return undefined;\n },\n multiselect: false,\n focusVisibleState: false,\n valueToString: defaultValueToString,\n }\n);\n\nexport function useListControlContext<Item>() {\n return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BO,MAAM,kBAAqB,GAAAA,2BAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,KAAA,CAAA,CAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA,CAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,GACjB;AACF,EAAA;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA,CAAA;AACtC;;;;;"}
|