@salt-ds/core 1.20.0 → 1.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/salt-core.css +470 -19
- package/dist-cjs/accordion/Accordion.js +75 -0
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js +79 -0
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js +76 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js +73 -0
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js +75 -0
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +78 -0
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js +74 -0
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +79 -0
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/badge/Badge.js +75 -0
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js +76 -2
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js +76 -1
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js +76 -1
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js +75 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js +76 -0
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/button/Button.js +76 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/card/Card.js +75 -0
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/card/InteractableCard.js +75 -0
- package/dist-cjs/card/InteractableCard.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.js +73 -0
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js +74 -0
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js +75 -0
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +79 -0
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.css.js +6 -0
- package/dist-cjs/combo-box/ComboBox.css.js.map +1 -0
- package/dist-cjs/combo-box/ComboBox.js +443 -0
- package/dist-cjs/combo-box/ComboBox.js.map +1 -0
- package/dist-cjs/combo-box/useComboBox.js +153 -0
- package/dist-cjs/combo-box/useComboBox.js.map +1 -0
- package/dist-cjs/dialog/Dialog.js +77 -3
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js +76 -1
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js +74 -1
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js +76 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.js +71 -3
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js +75 -2
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js +74 -1
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.css.js +6 -0
- package/dist-cjs/dropdown/Dropdown.css.js.map +1 -0
- package/dist-cjs/dropdown/Dropdown.js +412 -0
- package/dist-cjs/dropdown/Dropdown.js.map +1 -0
- package/dist-cjs/file-drop-zone/FileDropZone.js +75 -0
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +76 -0
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js +79 -2
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js +79 -2
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js +74 -0
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js +70 -2
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js +69 -0
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +78 -0
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js +79 -2
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js +79 -2
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/index.js +16 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/input/Input.js +73 -0
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/link/Link.js +70 -2
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js +75 -0
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js +121 -0
- package/dist-cjs/list-control/ListControlContext.js.map +1 -0
- package/dist-cjs/list-control/ListControlState.js +276 -0
- package/dist-cjs/list-control/ListControlState.js.map +1 -0
- package/dist-cjs/multiline-input/MultilineInput.js +73 -0
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +77 -2
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/option/Option.css.js +6 -0
- package/dist-cjs/option/Option.css.js.map +1 -0
- package/dist-cjs/option/Option.js +178 -0
- package/dist-cjs/option/Option.js.map +1 -0
- package/dist-cjs/option/OptionGroup.css.js +6 -0
- package/dist-cjs/option/OptionGroup.css.js.map +1 -0
- package/dist-cjs/option/OptionGroup.js +123 -0
- package/dist-cjs/option/OptionGroup.js.map +1 -0
- package/dist-cjs/option/OptionList.css.js +6 -0
- package/dist-cjs/option/OptionList.css.js.map +1 -0
- package/dist-cjs/option/OptionList.js +118 -0
- package/dist-cjs/option/OptionList.js.map +1 -0
- package/dist-cjs/option/OptionListBase.js +113 -0
- package/dist-cjs/option/OptionListBase.js.map +1 -0
- package/dist-cjs/pagination/CompactInput.js +76 -2
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js +69 -2
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js +68 -3
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js +77 -2
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js +78 -2
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js +76 -2
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js +75 -2
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/panel/Panel.js +77 -2
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/pill/Pill.js +74 -0
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.css.js +6 -0
- package/dist-cjs/pill-input/PillInput.css.js.map +1 -0
- package/dist-cjs/pill-input/PillInput.js +338 -0
- package/dist-cjs/pill-input/PillInput.js.map +1 -0
- package/dist-cjs/pill-input/useTruncatePills.js +83 -0
- package/dist-cjs/pill-input/useTruncatePills.js.map +1 -0
- package/dist-cjs/progress/CircularProgress/CircularProgress.css.js +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js +138 -14
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.css.js +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js +89 -8
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.js +78 -4
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js +77 -3
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js +76 -0
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +79 -0
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js +78 -3
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js +76 -1
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js +76 -2
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +78 -0
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js +76 -2
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js +78 -2
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js +75 -0
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js +76 -2
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/switch/Switch.js +75 -2
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/text/Text.js +77 -2
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/toast/Toast.js +74 -0
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js +75 -0
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js +73 -0
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js +74 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +78 -0
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js +75 -1
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +75 -2
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +77 -0
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js +78 -0
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/ownerWindow.js.map +1 -1
- package/dist-cjs/utils/useEventCallback.js +20 -0
- package/dist-cjs/utils/useEventCallback.js.map +1 -0
- package/dist-cjs/utils/useResizeObserver.js +29 -0
- package/dist-cjs/utils/useResizeObserver.js.map +1 -0
- package/dist-cjs/utils/useValueEffect.js +124 -0
- package/dist-cjs/utils/useValueEffect.js.map +1 -0
- package/dist-cjs/viewport/ViewportProvider.js +78 -0
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js +75 -0
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js +79 -0
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js +76 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js +73 -0
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js +75 -0
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js +78 -0
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js +74 -0
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +79 -0
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/badge/Badge.js +75 -0
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js +76 -2
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js +76 -1
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js +76 -1
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js +75 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js +76 -0
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/button/Button.js +76 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/card/Card.js +75 -0
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/card/InteractableCard.js +75 -0
- package/dist-es/card/InteractableCard.js.map +1 -1
- package/dist-es/checkbox/Checkbox.js +73 -0
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js +74 -0
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js +75 -0
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +79 -0
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/combo-box/ComboBox.css.js +4 -0
- package/dist-es/combo-box/ComboBox.css.js.map +1 -0
- package/dist-es/combo-box/ComboBox.js +439 -0
- package/dist-es/combo-box/ComboBox.js.map +1 -0
- package/dist-es/combo-box/useComboBox.js +149 -0
- package/dist-es/combo-box/useComboBox.js.map +1 -0
- package/dist-es/dialog/Dialog.js +77 -3
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js +76 -1
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js +74 -1
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.js +76 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogHeader.js +71 -3
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/drawer/Drawer.js +75 -2
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js +74 -1
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.css.js +4 -0
- package/dist-es/dropdown/Dropdown.css.js.map +1 -0
- package/dist-es/dropdown/Dropdown.js +408 -0
- package/dist-es/dropdown/Dropdown.js.map +1 -0
- package/dist-es/file-drop-zone/FileDropZone.js +75 -0
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +76 -0
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js +79 -2
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js +79 -2
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js +74 -0
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js +70 -2
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.js +69 -0
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +78 -0
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/grid-item/GridItem.js +79 -2
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js +79 -2
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/index.js +8 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/input/Input.js +73 -0
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/link/Link.js +70 -2
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link-card/LinkCard.js +75 -0
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js +116 -0
- package/dist-es/list-control/ListControlContext.js.map +1 -0
- package/dist-es/list-control/ListControlState.js +271 -0
- package/dist-es/list-control/ListControlState.js.map +1 -0
- package/dist-es/multiline-input/MultilineInput.js +73 -0
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +77 -2
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/option/Option.css.js +4 -0
- package/dist-es/option/Option.css.js.map +1 -0
- package/dist-es/option/Option.js +174 -0
- package/dist-es/option/Option.js.map +1 -0
- package/dist-es/option/OptionGroup.css.js +4 -0
- package/dist-es/option/OptionGroup.css.js.map +1 -0
- package/dist-es/option/OptionGroup.js +119 -0
- package/dist-es/option/OptionGroup.js.map +1 -0
- package/dist-es/option/OptionList.css.js +4 -0
- package/dist-es/option/OptionList.css.js.map +1 -0
- package/dist-es/option/OptionList.js +114 -0
- package/dist-es/option/OptionList.js.map +1 -0
- package/dist-es/option/OptionListBase.js +109 -0
- package/dist-es/option/OptionListBase.js.map +1 -0
- package/dist-es/pagination/CompactInput.js +76 -2
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js +69 -2
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js +68 -3
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js +77 -2
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js +78 -2
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js +76 -2
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/Paginator.js +75 -2
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/panel/Panel.js +77 -2
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/pill/Pill.js +74 -0
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.css.js +4 -0
- package/dist-es/pill-input/PillInput.css.js.map +1 -0
- package/dist-es/pill-input/PillInput.js +334 -0
- package/dist-es/pill-input/PillInput.js.map +1 -0
- package/dist-es/pill-input/useTruncatePills.js +79 -0
- package/dist-es/pill-input/useTruncatePills.js.map +1 -0
- package/dist-es/progress/CircularProgress/CircularProgress.css.js +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js +138 -14
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.css.js +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js +89 -8
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.js +78 -4
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js +77 -3
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js +76 -0
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +79 -0
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js +78 -3
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js +76 -1
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/spinner/Spinner.js +76 -2
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +78 -0
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js +76 -2
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js +78 -2
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js +75 -0
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js +76 -2
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/switch/Switch.js +75 -2
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/text/Text.js +77 -2
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/toast/Toast.js +74 -0
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js +75 -0
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js +73 -0
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js +74 -0
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +78 -0
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js +75 -1
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js +75 -2
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +77 -0
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js +78 -0
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/ownerWindow.js.map +1 -1
- package/dist-es/utils/useEventCallback.js +16 -0
- package/dist-es/utils/useEventCallback.js.map +1 -0
- package/dist-es/utils/useResizeObserver.js +25 -0
- package/dist-es/utils/useResizeObserver.js.map +1 -0
- package/dist-es/utils/useValueEffect.js +120 -0
- package/dist-es/utils/useValueEffect.js.map +1 -0
- package/dist-es/viewport/ViewportProvider.js +78 -0
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/combo-box/ComboBox.d.ts +17 -0
- package/dist-types/combo-box/index.d.ts +1 -0
- package/dist-types/combo-box/useComboBox.d.ts +30 -0
- package/dist-types/dialog/DialogHeader.d.ts +2 -4
- package/dist-types/dropdown/Dropdown.d.ts +99 -0
- package/dist-types/dropdown/index.d.ts +1 -0
- package/dist-types/index.d.ts +4 -0
- package/dist-types/list-control/ListControlContext.d.ts +21 -0
- package/dist-types/list-control/ListControlState.d.ts +70 -0
- package/dist-types/list-control/index.d.ts +1 -0
- package/dist-types/option/Option.d.ts +16 -0
- package/dist-types/option/OptionGroup.d.ts +12 -0
- package/dist-types/option/OptionList.d.ts +5 -0
- package/dist-types/option/OptionListBase.d.ts +4 -0
- package/dist-types/option/index.d.ts +2 -0
- package/dist-types/pill-input/PillInput.d.ts +48 -0
- package/dist-types/pill-input/index.d.ts +1 -0
- package/dist-types/pill-input/useTruncatePills.d.ts +8 -0
- package/dist-types/progress/CircularProgress/CircularProgress.d.ts +5 -0
- package/dist-types/progress/LinearProgress/LinearProgress.d.ts +5 -0
- package/dist-types/utils/index.d.ts +3 -0
- package/dist-types/utils/ownerWindow.d.ts +1 -1
- package/dist-types/utils/useEventCallback.d.ts +4 -0
- package/dist-types/utils/useResizeObserver.d.ts +6 -0
- package/dist-types/utils/useValueEffect.d.ts +4 -0
- package/package.json +1 -1
|
@@ -0,0 +1,276 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var useControlled = require('../utils/useControlled.js');
|
|
7
|
+
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
8
|
+
require('../utils/useId.js');
|
|
9
|
+
require('../salt-provider/SaltProvider.js');
|
|
10
|
+
require('../viewport/ViewportProvider.js');
|
|
11
|
+
require('clsx');
|
|
12
|
+
require('../accordion/AccordionGroup.js');
|
|
13
|
+
require('../accordion/AccordionPanel.js');
|
|
14
|
+
require('../accordion/Accordion.js');
|
|
15
|
+
require('../accordion/AccordionHeader.js');
|
|
16
|
+
require('../aria-announcer/AriaAnnouncerContext.js');
|
|
17
|
+
require('react/jsx-runtime');
|
|
18
|
+
require('../avatar/Avatar.js');
|
|
19
|
+
require('../badge/Badge.js');
|
|
20
|
+
require('../banner/Banner.js');
|
|
21
|
+
require('../banner/BannerActions.js');
|
|
22
|
+
require('../banner/BannerContent.js');
|
|
23
|
+
require('../border-item/BorderItem.js');
|
|
24
|
+
require('../border-layout/BorderLayout.js');
|
|
25
|
+
require('../button/Button.js');
|
|
26
|
+
require('../card/Card.js');
|
|
27
|
+
require('../card/InteractableCard.js');
|
|
28
|
+
require('../checkbox/Checkbox.js');
|
|
29
|
+
require('../checkbox/CheckboxGroup.js');
|
|
30
|
+
require('@salt-ds/styles');
|
|
31
|
+
require('@salt-ds/window');
|
|
32
|
+
require('@salt-ds/icons');
|
|
33
|
+
require('../combo-box/ComboBox.js');
|
|
34
|
+
require('../dialog/Dialog.js');
|
|
35
|
+
require('../status-indicator/StatusIndicator.js');
|
|
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');
|
|
43
|
+
require('../dialog/DialogActions.js');
|
|
44
|
+
require('../dialog/DialogContent.js');
|
|
45
|
+
require('../dialog/DialogCloseButton.js');
|
|
46
|
+
require('../drawer/Drawer.js');
|
|
47
|
+
require('../drawer/DrawerCloseButton.js');
|
|
48
|
+
require('../dropdown/Dropdown.js');
|
|
49
|
+
require('../file-drop-zone/FileDropZone.js');
|
|
50
|
+
require('../file-drop-zone/FileDropZoneIcon.js');
|
|
51
|
+
require('../file-drop-zone/FileDropZoneTrigger.js');
|
|
52
|
+
require('../flex-item/FlexItem.js');
|
|
53
|
+
require('../flex-layout/FlexLayout.js');
|
|
54
|
+
require('../flow-layout/FlowLayout.js');
|
|
55
|
+
require('../form-field/FormField.js');
|
|
56
|
+
require('../form-field-context/FormFieldContext.js');
|
|
57
|
+
require('../grid-item/GridItem.js');
|
|
58
|
+
require('../grid-layout/GridLayout.js');
|
|
59
|
+
require('../input/Input.js');
|
|
60
|
+
require('../link/Link.js');
|
|
61
|
+
require('../link-card/LinkCard.js');
|
|
62
|
+
require('./ListControlContext.js');
|
|
63
|
+
require('../multiline-input/MultilineInput.js');
|
|
64
|
+
require('../navigation-item/NavigationItem.js');
|
|
65
|
+
require('../option/Option.js');
|
|
66
|
+
require('../option/OptionGroup.js');
|
|
67
|
+
require('../pagination/Pagination.js');
|
|
68
|
+
require('../pagination/Paginator.js');
|
|
69
|
+
require('../pagination/CompactInput.js');
|
|
70
|
+
require('../pagination/CompactPaginator.js');
|
|
71
|
+
require('../pagination/GoToInput.js');
|
|
72
|
+
require('../panel/Panel.js');
|
|
73
|
+
require('../pill/Pill.js');
|
|
74
|
+
require('../progress/CircularProgress/CircularProgress.js');
|
|
75
|
+
require('../progress/LinearProgress/LinearProgress.js');
|
|
76
|
+
require('../radio-button/RadioButton.js');
|
|
77
|
+
require('../radio-button/RadioButtonGroup.js');
|
|
78
|
+
require('../scrim/Scrim.js');
|
|
79
|
+
require('../spinner/Spinner.js');
|
|
80
|
+
require('../stack-layout/StackLayout.js');
|
|
81
|
+
require('../status-adornment/StatusAdornment.js');
|
|
82
|
+
require('../toast/Toast.js');
|
|
83
|
+
require('../toast/ToastContent.js');
|
|
84
|
+
require('../split-layout/SplitLayout.js');
|
|
85
|
+
require('../switch/Switch.js');
|
|
86
|
+
require('../toggle-button/ToggleButton.js');
|
|
87
|
+
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
88
|
+
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
89
|
+
require('../tooltip/Tooltip.js');
|
|
90
|
+
require('@floating-ui/react');
|
|
91
|
+
|
|
92
|
+
function defaultValueToString(item) {
|
|
93
|
+
return typeof item === "string" ? item : "";
|
|
94
|
+
}
|
|
95
|
+
function useListControl(props) {
|
|
96
|
+
const {
|
|
97
|
+
open: openProp,
|
|
98
|
+
defaultOpen,
|
|
99
|
+
onOpenChange,
|
|
100
|
+
multiselect,
|
|
101
|
+
defaultSelected,
|
|
102
|
+
selected: selectedProp,
|
|
103
|
+
onSelectionChange,
|
|
104
|
+
disabled,
|
|
105
|
+
readOnly,
|
|
106
|
+
valueToString = defaultValueToString
|
|
107
|
+
} = props;
|
|
108
|
+
const [focusedState, setFocusedState] = React.useState(false);
|
|
109
|
+
const [focusVisibleState, setFocusVisibleState] = React.useState(false);
|
|
110
|
+
const [activeState, setActiveState] = React.useState(
|
|
111
|
+
void 0
|
|
112
|
+
);
|
|
113
|
+
const setActive = (option) => {
|
|
114
|
+
if (option) {
|
|
115
|
+
setActiveState(option);
|
|
116
|
+
} else {
|
|
117
|
+
setActiveState(void 0);
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
const [openState, setOpenState] = useControlled.useControlled({
|
|
121
|
+
controlled: openProp,
|
|
122
|
+
default: Boolean(defaultOpen),
|
|
123
|
+
name: "ListControl",
|
|
124
|
+
state: "open"
|
|
125
|
+
});
|
|
126
|
+
const openKey = React.useRef(void 0);
|
|
127
|
+
const setOpen = (newOpen, reason, key) => {
|
|
128
|
+
if (disabled || readOnly) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
setOpenState(newOpen);
|
|
132
|
+
openKey.current = key;
|
|
133
|
+
if (newOpen !== openState) {
|
|
134
|
+
onOpenChange == null ? void 0 : onOpenChange(newOpen, reason);
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
const [selectedState, setSelectedState] = useControlled.useControlled({
|
|
138
|
+
controlled: selectedProp,
|
|
139
|
+
default: defaultSelected != null ? defaultSelected : [],
|
|
140
|
+
name: "ListControl",
|
|
141
|
+
state: "selected"
|
|
142
|
+
});
|
|
143
|
+
const select = (event, option) => {
|
|
144
|
+
if (option.disabled || readOnly || disabled) {
|
|
145
|
+
return;
|
|
146
|
+
}
|
|
147
|
+
let newSelected = [option.value];
|
|
148
|
+
if (multiselect) {
|
|
149
|
+
if (selectedState.includes(option.value)) {
|
|
150
|
+
newSelected = selectedState.filter((item) => item !== option.value);
|
|
151
|
+
} else {
|
|
152
|
+
newSelected = selectedState.concat([option.value]);
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
setSelectedState(newSelected);
|
|
156
|
+
onSelectionChange == null ? void 0 : onSelectionChange(event, newSelected);
|
|
157
|
+
if (!multiselect) {
|
|
158
|
+
setOpen(false);
|
|
159
|
+
}
|
|
160
|
+
};
|
|
161
|
+
const clear = (event) => {
|
|
162
|
+
setSelectedState([]);
|
|
163
|
+
if (selectedState.length !== 0) {
|
|
164
|
+
onSelectionChange == null ? void 0 : onSelectionChange(event, []);
|
|
165
|
+
}
|
|
166
|
+
};
|
|
167
|
+
const optionsRef = React.useRef([]);
|
|
168
|
+
const register = React.useCallback(
|
|
169
|
+
(optionValue, element) => {
|
|
170
|
+
const { id } = optionValue;
|
|
171
|
+
const option = optionsRef.current.find((item) => item.value.id === id);
|
|
172
|
+
const index = optionsRef.current.findIndex((option2) => {
|
|
173
|
+
return option2.element.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_PRECEDING;
|
|
174
|
+
});
|
|
175
|
+
if (!option) {
|
|
176
|
+
if (index === -1) {
|
|
177
|
+
optionsRef.current.push({ value: optionValue, element });
|
|
178
|
+
} else {
|
|
179
|
+
optionsRef.current.splice(index, 0, { value: optionValue, element });
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
return () => {
|
|
183
|
+
optionsRef.current = optionsRef.current.filter(
|
|
184
|
+
(item) => item.value.id !== id
|
|
185
|
+
);
|
|
186
|
+
};
|
|
187
|
+
},
|
|
188
|
+
[]
|
|
189
|
+
);
|
|
190
|
+
const getOptionAtIndex = (index) => {
|
|
191
|
+
var _a;
|
|
192
|
+
return (_a = optionsRef.current[index]) == null ? void 0 : _a.value;
|
|
193
|
+
};
|
|
194
|
+
const getIndexOfOption = (option) => {
|
|
195
|
+
return optionsRef.current.findIndex((item) => item.value.id === option.id);
|
|
196
|
+
};
|
|
197
|
+
const getOptionsMatching = (predicate) => {
|
|
198
|
+
return optionsRef.current.filter((item) => predicate(item.value)).map((item) => item.value);
|
|
199
|
+
};
|
|
200
|
+
const getOptionFromSearch = (search, startFrom) => {
|
|
201
|
+
const collator = new Intl.Collator("en", {
|
|
202
|
+
usage: "search",
|
|
203
|
+
sensitivity: "base"
|
|
204
|
+
});
|
|
205
|
+
const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;
|
|
206
|
+
const searchList = optionsRef.current.map((item) => item.value);
|
|
207
|
+
let matches = searchList.filter(
|
|
208
|
+
(option) => collator.compare(
|
|
209
|
+
valueToString(option.value).substring(0, search.length),
|
|
210
|
+
search
|
|
211
|
+
) === 0
|
|
212
|
+
);
|
|
213
|
+
if (matches.length === 0) {
|
|
214
|
+
const letters = search.split("");
|
|
215
|
+
const allSameLetter = letters.length > 0 && letters.every((letter) => collator.compare(letter, letters[0]) === 0);
|
|
216
|
+
if (allSameLetter) {
|
|
217
|
+
matches = searchList.filter(
|
|
218
|
+
(option) => collator.compare(
|
|
219
|
+
valueToString(option.value)[0].toLowerCase(),
|
|
220
|
+
letters[0]
|
|
221
|
+
) === 0
|
|
222
|
+
);
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
return matches.find((option) => getIndexOfOption(option) >= startIndex);
|
|
226
|
+
};
|
|
227
|
+
const listRef = React.useRef(null);
|
|
228
|
+
React.useEffect(() => {
|
|
229
|
+
var _a;
|
|
230
|
+
if (listRef.current) {
|
|
231
|
+
const activeElement = (_a = optionsRef.current.find(
|
|
232
|
+
(option) => option.value === activeState
|
|
233
|
+
)) == null ? void 0 : _a.element;
|
|
234
|
+
if (!activeElement) {
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
const { scrollTop } = listRef.current;
|
|
238
|
+
const { offsetTop, offsetHeight } = activeElement;
|
|
239
|
+
const isVisible = offsetTop >= scrollTop && offsetTop + offsetHeight <= scrollTop + listRef.current.offsetHeight;
|
|
240
|
+
if (!isVisible) {
|
|
241
|
+
activeElement.scrollIntoView({
|
|
242
|
+
block: "end",
|
|
243
|
+
inline: "nearest"
|
|
244
|
+
});
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
}, [activeState]);
|
|
248
|
+
return {
|
|
249
|
+
multiselect: Boolean(multiselect),
|
|
250
|
+
openState,
|
|
251
|
+
setOpen,
|
|
252
|
+
openKey,
|
|
253
|
+
activeState,
|
|
254
|
+
setActive,
|
|
255
|
+
selectedState,
|
|
256
|
+
setSelectedState,
|
|
257
|
+
select,
|
|
258
|
+
clear,
|
|
259
|
+
focusVisibleState,
|
|
260
|
+
setFocusVisibleState,
|
|
261
|
+
focusedState,
|
|
262
|
+
setFocusedState,
|
|
263
|
+
listRef,
|
|
264
|
+
options: optionsRef.current.map((option) => option.element),
|
|
265
|
+
register,
|
|
266
|
+
getOptionAtIndex,
|
|
267
|
+
getIndexOfOption,
|
|
268
|
+
getOptionsMatching,
|
|
269
|
+
getOptionFromSearch,
|
|
270
|
+
valueToString
|
|
271
|
+
};
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
exports.defaultValueToString = defaultValueToString;
|
|
275
|
+
exports.useListControl = useListControl;
|
|
276
|
+
//# sourceMappingURL=ListControlState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ListControlState.js","sources":["../src/list-control/ListControlState.ts"],"sourcesContent":["import {\n SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useControlled } from \"../utils\";\nimport { OptionValue } from \"./ListControlContext\";\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport type ListControlProps<Item> = {\n /**\n * If true, the control will be disabled.\n */\n disabled?: boolean;\n /**\n * If true, the control will be read-only.\n */\n readOnly?: boolean;\n /**\n * If true, the list will be open by default.\n */\n defaultOpen?: boolean;\n /**\n * If true, the list will be open. Useful for controlling the component.\n */\n open?: boolean;\n /**\n * Callback fired when the open state changes.\n */\n onOpenChange?: (newOpen: boolean, reason?: OpenChangeReason) => void;\n /**\n * The default selected options. If this is provided `defaultValue` should be provided as well.\n */\n defaultSelected?: Item[];\n /**\n * The selected options. The component will be controlled if this prop is provided.\n */\n selected?: Item[];\n /**\n * Callback fired when the selected options change.\n */\n onSelectionChange?: (event: SyntheticEvent, newSelected: Item[]) => void;\n /**\n * If true, multiple options can be selected.\n */\n multiselect?: boolean;\n /**\n * Callback used to convert an option's `value` to a string. This is needed when the value is different to the display value or the value is not a string.\n */\n valueToString?: (item: Item) => string;\n};\n\nexport function defaultValueToString<Item>(item: Item): string {\n return typeof item === \"string\" ? item : \"\";\n}\n\nexport function useListControl<Item>(props: ListControlProps<Item>) {\n const {\n open: openProp,\n defaultOpen,\n onOpenChange,\n multiselect,\n defaultSelected,\n selected: selectedProp,\n onSelectionChange,\n disabled,\n readOnly,\n valueToString = defaultValueToString,\n } = props;\n\n const [focusedState, setFocusedState] = useState(false);\n const [focusVisibleState, setFocusVisibleState] = useState(false);\n\n const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(\n undefined\n );\n\n const setActive = (option?: OptionValue<Item>) => {\n if (option) {\n setActiveState(option);\n } else {\n setActiveState(undefined);\n }\n };\n\n const [openState, setOpenState] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"ListControl\",\n state: \"open\",\n });\n\n const openKey = useRef<string | undefined>(undefined);\n\n const setOpen = (\n newOpen: boolean,\n reason?: OpenChangeReason,\n key?: string\n ) => {\n if (disabled || readOnly) {\n return;\n }\n\n setOpenState(newOpen);\n openKey.current = key;\n\n if (newOpen !== openState) {\n onOpenChange?.(newOpen, reason);\n }\n };\n\n const [selectedState, setSelectedState] = useControlled({\n controlled: selectedProp,\n default: defaultSelected ?? [],\n name: \"ListControl\",\n state: \"selected\",\n });\n\n const select = (event: SyntheticEvent, option: OptionValue<Item>) => {\n if (option.disabled || readOnly || disabled) {\n return;\n }\n\n let newSelected = [option.value];\n\n if (multiselect) {\n if (selectedState.includes(option.value)) {\n newSelected = selectedState.filter((item) => item !== option.value);\n } else {\n newSelected = selectedState.concat([option.value]);\n }\n }\n\n setSelectedState(newSelected);\n onSelectionChange?.(event, newSelected);\n\n if (!multiselect) {\n setOpen(false);\n }\n };\n\n const clear = (event: SyntheticEvent) => {\n setSelectedState([]);\n if (selectedState.length !== 0) {\n onSelectionChange?.(event, []);\n }\n };\n\n const optionsRef = useRef<\n { value: OptionValue<Item>; element: HTMLElement }[]\n >([]);\n\n const register = useCallback(\n (optionValue: OptionValue<Item>, element: HTMLElement) => {\n const { id } = optionValue;\n const option = optionsRef.current.find((item) => item.value.id === id);\n const index = optionsRef.current.findIndex((option) => {\n return (\n option.element.compareDocumentPosition(element) &\n Node.DOCUMENT_POSITION_PRECEDING\n );\n });\n\n if (!option) {\n if (index === -1) {\n optionsRef.current.push({ value: optionValue, element });\n } else {\n optionsRef.current.splice(index, 0, { value: optionValue, element });\n }\n }\n\n return () => {\n optionsRef.current = optionsRef.current.filter(\n (item) => item.value.id !== id\n );\n };\n },\n []\n );\n\n const getOptionAtIndex = (index: number) => {\n return optionsRef.current[index]?.value;\n };\n\n const getIndexOfOption = (option: OptionValue<Item>) => {\n return optionsRef.current.findIndex((item) => item.value.id === option.id);\n };\n\n const getOptionsMatching = (\n predicate: (option: OptionValue<Item>) => boolean\n ) => {\n return optionsRef.current\n .filter((item) => predicate(item.value))\n .map((item) => item.value);\n };\n\n const getOptionFromSearch = (\n search: string,\n startFrom?: OptionValue<Item>\n ) => {\n const collator = new Intl.Collator(\"en\", {\n usage: \"search\",\n sensitivity: \"base\",\n });\n\n const startIndex = startFrom ? getIndexOfOption(startFrom) + 1 : 0;\n const searchList = optionsRef.current.map((item) => item.value);\n\n let matches = searchList.filter(\n (option) =>\n collator.compare(\n valueToString(option.value).substring(0, search.length),\n search\n ) === 0\n );\n\n if (matches.length === 0) {\n const letters = search.split(\"\");\n const allSameLetter =\n letters.length > 0 &&\n letters.every((letter) => collator.compare(letter, letters[0]) === 0);\n if (allSameLetter) {\n matches = searchList.filter(\n (option) =>\n collator.compare(\n valueToString(option.value)[0].toLowerCase(),\n letters[0]\n ) === 0\n );\n }\n }\n\n return matches.find((option) => getIndexOfOption(option) >= startIndex);\n };\n\n const listRef = useRef<HTMLDivElement>(null);\n useEffect(() => {\n if (listRef.current) {\n const activeElement = optionsRef.current.find(\n (option) => option.value === activeState\n )?.element;\n\n if (!activeElement) {\n return;\n }\n\n const { scrollTop } = listRef.current;\n const { offsetTop, offsetHeight } = activeElement;\n\n const isVisible =\n offsetTop >= scrollTop &&\n offsetTop + offsetHeight <= scrollTop + listRef.current.offsetHeight;\n\n if (!isVisible) {\n activeElement.scrollIntoView({\n block: \"end\",\n inline: \"nearest\",\n });\n }\n }\n }, [activeState]);\n\n return {\n multiselect: Boolean(multiselect),\n openState,\n setOpen,\n openKey,\n activeState,\n setActive,\n selectedState,\n setSelectedState,\n select,\n clear,\n focusVisibleState,\n setFocusVisibleState,\n focusedState,\n setFocusedState,\n listRef,\n options: optionsRef.current.map((option) => option.element),\n register,\n getOptionAtIndex,\n getIndexOfOption,\n getOptionsMatching,\n getOptionFromSearch,\n valueToString,\n };\n}\n"],"names":["useState","useControlled","useRef","useCallback","option","useEffect"],"mappings":"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"}
|
|
@@ -17,6 +17,79 @@ var useForkRef = require('../utils/useForkRef.js');
|
|
|
17
17
|
require('../utils/useId.js');
|
|
18
18
|
require('../salt-provider/SaltProvider.js');
|
|
19
19
|
require('../viewport/ViewportProvider.js');
|
|
20
|
+
require('../accordion/AccordionGroup.js');
|
|
21
|
+
require('../accordion/AccordionPanel.js');
|
|
22
|
+
require('../accordion/Accordion.js');
|
|
23
|
+
require('../accordion/AccordionHeader.js');
|
|
24
|
+
require('../aria-announcer/AriaAnnouncerContext.js');
|
|
25
|
+
require('../avatar/Avatar.js');
|
|
26
|
+
require('../badge/Badge.js');
|
|
27
|
+
require('../banner/Banner.js');
|
|
28
|
+
require('../banner/BannerActions.js');
|
|
29
|
+
require('../banner/BannerContent.js');
|
|
30
|
+
require('../border-item/BorderItem.js');
|
|
31
|
+
require('../border-layout/BorderLayout.js');
|
|
32
|
+
require('../button/Button.js');
|
|
33
|
+
require('../card/Card.js');
|
|
34
|
+
require('../card/InteractableCard.js');
|
|
35
|
+
require('../checkbox/Checkbox.js');
|
|
36
|
+
require('../checkbox/CheckboxGroup.js');
|
|
37
|
+
require('@salt-ds/icons');
|
|
38
|
+
require('../combo-box/ComboBox.js');
|
|
39
|
+
require('../dialog/Dialog.js');
|
|
40
|
+
require('../status-indicator/StatusIndicator.js');
|
|
41
|
+
require('../text/Text.js');
|
|
42
|
+
require('../text/Display.js');
|
|
43
|
+
require('../text/Headings.js');
|
|
44
|
+
require('../text/Label.js');
|
|
45
|
+
require('../text/TextNotation.js');
|
|
46
|
+
require('../text/TextAction.js');
|
|
47
|
+
require('../dialog/DialogContext.js');
|
|
48
|
+
require('../dialog/DialogActions.js');
|
|
49
|
+
require('../dialog/DialogContent.js');
|
|
50
|
+
require('../dialog/DialogCloseButton.js');
|
|
51
|
+
require('../drawer/Drawer.js');
|
|
52
|
+
require('../drawer/DrawerCloseButton.js');
|
|
53
|
+
require('../dropdown/Dropdown.js');
|
|
54
|
+
require('../file-drop-zone/FileDropZone.js');
|
|
55
|
+
require('../file-drop-zone/FileDropZoneIcon.js');
|
|
56
|
+
require('../file-drop-zone/FileDropZoneTrigger.js');
|
|
57
|
+
require('../flex-item/FlexItem.js');
|
|
58
|
+
require('../flex-layout/FlexLayout.js');
|
|
59
|
+
require('../flow-layout/FlowLayout.js');
|
|
60
|
+
require('../form-field/FormField.js');
|
|
61
|
+
require('../grid-item/GridItem.js');
|
|
62
|
+
require('../grid-layout/GridLayout.js');
|
|
63
|
+
require('../input/Input.js');
|
|
64
|
+
require('../link/Link.js');
|
|
65
|
+
require('../link-card/LinkCard.js');
|
|
66
|
+
require('../list-control/ListControlContext.js');
|
|
67
|
+
require('../navigation-item/NavigationItem.js');
|
|
68
|
+
require('../option/Option.js');
|
|
69
|
+
require('../option/OptionGroup.js');
|
|
70
|
+
require('../pagination/Pagination.js');
|
|
71
|
+
require('../pagination/Paginator.js');
|
|
72
|
+
require('../pagination/CompactInput.js');
|
|
73
|
+
require('../pagination/CompactPaginator.js');
|
|
74
|
+
require('../pagination/GoToInput.js');
|
|
75
|
+
require('../panel/Panel.js');
|
|
76
|
+
require('../pill/Pill.js');
|
|
77
|
+
require('../progress/CircularProgress/CircularProgress.js');
|
|
78
|
+
require('../progress/LinearProgress/LinearProgress.js');
|
|
79
|
+
require('../radio-button/RadioButton.js');
|
|
80
|
+
require('../radio-button/RadioButtonGroup.js');
|
|
81
|
+
require('../scrim/Scrim.js');
|
|
82
|
+
require('../spinner/Spinner.js');
|
|
83
|
+
require('../stack-layout/StackLayout.js');
|
|
84
|
+
require('../toast/Toast.js');
|
|
85
|
+
require('../toast/ToastContent.js');
|
|
86
|
+
require('../split-layout/SplitLayout.js');
|
|
87
|
+
require('../switch/Switch.js');
|
|
88
|
+
require('../toggle-button/ToggleButton.js');
|
|
89
|
+
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
90
|
+
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
91
|
+
require('../tooltip/Tooltip.js');
|
|
92
|
+
require('@floating-ui/react');
|
|
20
93
|
var MultilineInput$1 = require('./MultilineInput.css.js');
|
|
21
94
|
|
|
22
95
|
const withBaseName = makePrefixer.makePrefixer("saltMultilineInput");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEvent,\n ComponentPropsWithoutRef,\n FocusEvent,\n forwardRef,\n ReactNode,\n Ref,\n TextareaHTMLAttributes,\n useCallback,\n useLayoutEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"textarea\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * Styling variant with full border. Defaults to false\n */\n bordered?: boolean;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * The default minimum number of rows. Defaults to 3\n */\n rows?: number;\n /**\n * Start adornment component\n */\n startAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\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 MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n function MultilineInput(\n {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n bordered = false,\n className: classNameProp,\n disabled,\n endAdornment,\n id,\n placeholder,\n readOnly,\n role,\n rows = 3,\n startAdornment,\n style,\n textAreaProps = {},\n textAreaRef,\n value: valueProp,\n defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n ...other\n },\n ref\n ) {\n const inputRef = useRef<HTMLTextAreaElement>(null);\n const handleRef = useForkRef(inputRef, textAreaRef);\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-multiline-input\",\n css: multilineInputCss,\n window: targetWindow,\n });\n\n const restA11yProps = {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n };\n\n const [focused, setFocused] = useState(false);\n\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n onBlur,\n onChange,\n onFocus,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\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 isDisabled = disabled || formFieldDisabled;\n const isReadOnly = readOnly || formFieldReadOnly;\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : textAreaRequired;\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValueProp,\n name: \"MultilineInput\",\n state: \"value\",\n });\n\n const previousHeight = useRef<string | undefined>(undefined);\n const input = inputRef.current;\n\n const changeHeight = useCallback(() => {\n if (!input) return;\n const hasBeenManuallyResized =\n previousHeight.current !== undefined &&\n input.style.height !== previousHeight.current;\n if (!hasBeenManuallyResized) {\n const previousOverflow = input.style.overflow;\n input.style.overflow = \"hidden\";\n input.style.height = \"auto\";\n input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n const newHeight = `${\n input.scrollHeight + (input.offsetHeight - input.clientHeight)\n }px`;\n input.style.height = newHeight;\n previousHeight.current = newHeight;\n input.style.overflow = previousOverflow;\n }\n }, [input]);\n\n const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n const value = event.target.value;\n setValue(value);\n onChange?.(event);\n changeHeight();\n };\n\n useLayoutEffect(() => {\n changeHeight();\n }, [value, changeHeight]);\n\n const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n onBlur?.(event);\n setFocused(false);\n };\n\n const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n\n const multilineInputStyles = {\n \"--saltMultilineInput-rows\": rows,\n ...style,\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"withAdornmentRow\")]: endAdornment,\n [withBaseName(\"bordered\")]: bordered,\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={multilineInputStyles}\n {...other}\n >\n {startAdornment && (\n <div className={withBaseName(\"startAdornmentContainer\")}>\n {startAdornment}\n </div>\n )}\n <textarea\n aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n disabled={isDisabled}\n id={id}\n readOnly={isReadOnly}\n ref={handleRef}\n required={isRequired}\n role={role}\n rows={rows}\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 {...restTextAreaProps}\n />\n <div className={withBaseName(\"suffixAdornments\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <div className={withBaseName(\"statusAdornmentContainer\")}>\n <StatusAdornment status={validationStatus} />\n </div>\n )}\n {endAdornment && (\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {endAdornment}\n </div>\n )}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","MultilineInput","useRef","useForkRef","useWindow","useComponentCssInjection","multilineInputCss","useState","useFormFieldProps","useControlled","useCallback","value","useLayoutEffect","jsxs","clsx","jsx","StatusAdornment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n ChangeEvent,\n ComponentPropsWithoutRef,\n FocusEvent,\n forwardRef,\n ReactNode,\n Ref,\n TextareaHTMLAttributes,\n useCallback,\n useLayoutEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"textarea\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * Styling variant with full border. Defaults to false\n */\n bordered?: boolean;\n /**\n * End adornment component\n */\n endAdornment?: ReactNode;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * The default minimum number of rows. Defaults to 3\n */\n rows?: number;\n /**\n * Start adornment component\n */\n startAdornment?: ReactNode;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\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 MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n function MultilineInput(\n {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n bordered = false,\n className: classNameProp,\n disabled,\n endAdornment,\n id,\n placeholder,\n readOnly,\n role,\n rows = 3,\n startAdornment,\n style,\n textAreaProps = {},\n textAreaRef,\n value: valueProp,\n defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n ...other\n },\n ref\n ) {\n const inputRef = useRef<HTMLTextAreaElement>(null);\n const handleRef = useForkRef(inputRef, textAreaRef);\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-multiline-input\",\n css: multilineInputCss,\n window: targetWindow,\n });\n\n const restA11yProps = {\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": ariaOwns,\n };\n\n const [focused, setFocused] = useState(false);\n\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n onBlur,\n onChange,\n onFocus,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\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 isDisabled = disabled || formFieldDisabled;\n const isReadOnly = readOnly || formFieldReadOnly;\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : textAreaRequired;\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValueProp,\n name: \"MultilineInput\",\n state: \"value\",\n });\n\n const previousHeight = useRef<string | undefined>(undefined);\n const input = inputRef.current;\n\n const changeHeight = useCallback(() => {\n if (!input) return;\n const hasBeenManuallyResized =\n previousHeight.current !== undefined &&\n input.style.height !== previousHeight.current;\n if (!hasBeenManuallyResized) {\n const previousOverflow = input.style.overflow;\n input.style.overflow = \"hidden\";\n input.style.height = \"auto\";\n input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n const newHeight = `${\n input.scrollHeight + (input.offsetHeight - input.clientHeight)\n }px`;\n input.style.height = newHeight;\n previousHeight.current = newHeight;\n input.style.overflow = previousOverflow;\n }\n }, [input]);\n\n const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n const value = event.target.value;\n setValue(value);\n onChange?.(event);\n changeHeight();\n };\n\n useLayoutEffect(() => {\n changeHeight();\n }, [value, changeHeight]);\n\n const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n onBlur?.(event);\n setFocused(false);\n };\n\n const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n onFocus?.(event);\n setFocused(true);\n };\n\n const multilineInputStyles = {\n \"--saltMultilineInput-rows\": rows,\n ...style,\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"withAdornmentRow\")]: endAdornment,\n [withBaseName(\"bordered\")]: bordered,\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={multilineInputStyles}\n {...other}\n >\n {startAdornment && (\n <div className={withBaseName(\"startAdornmentContainer\")}>\n {startAdornment}\n </div>\n )}\n <textarea\n aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n disabled={isDisabled}\n id={id}\n readOnly={isReadOnly}\n ref={handleRef}\n required={isRequired}\n role={role}\n rows={rows}\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 {...restTextAreaProps}\n />\n <div className={withBaseName(\"suffixAdornments\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <div className={withBaseName(\"statusAdornmentContainer\")}>\n <StatusAdornment status={validationStatus} />\n </div>\n )}\n {endAdornment && (\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {endAdornment}\n </div>\n )}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","MultilineInput","useRef","useForkRef","useWindow","useComponentCssInjection","multilineInputCss","useState","useFormFieldProps","useControlled","useCallback","value","useLayoutEffect","jsxs","clsx","jsx","StatusAdornment"],"mappings":"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"}
|
|
@@ -10,10 +10,85 @@ require('../utils/useId.js');
|
|
|
10
10
|
require('../salt-provider/SaltProvider.js');
|
|
11
11
|
require('../viewport/ViewportProvider.js');
|
|
12
12
|
var clsx = require('clsx');
|
|
13
|
+
require('../accordion/AccordionGroup.js');
|
|
14
|
+
require('../accordion/AccordionPanel.js');
|
|
15
|
+
require('../accordion/Accordion.js');
|
|
16
|
+
require('../accordion/AccordionHeader.js');
|
|
17
|
+
require('../aria-announcer/AriaAnnouncerContext.js');
|
|
18
|
+
require('../avatar/Avatar.js');
|
|
19
|
+
require('../badge/Badge.js');
|
|
20
|
+
require('../banner/Banner.js');
|
|
21
|
+
require('../banner/BannerActions.js');
|
|
22
|
+
require('../banner/BannerContent.js');
|
|
23
|
+
require('../border-item/BorderItem.js');
|
|
24
|
+
require('../border-layout/BorderLayout.js');
|
|
25
|
+
require('../button/Button.js');
|
|
26
|
+
require('../card/Card.js');
|
|
27
|
+
require('../card/InteractableCard.js');
|
|
28
|
+
require('../checkbox/Checkbox.js');
|
|
29
|
+
require('../checkbox/CheckboxGroup.js');
|
|
30
|
+
var styles = require('@salt-ds/styles');
|
|
31
|
+
var window = require('@salt-ds/window');
|
|
32
|
+
require('@salt-ds/icons');
|
|
33
|
+
require('../combo-box/ComboBox.js');
|
|
34
|
+
require('../dialog/Dialog.js');
|
|
35
|
+
require('../status-indicator/StatusIndicator.js');
|
|
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');
|
|
43
|
+
require('../dialog/DialogActions.js');
|
|
44
|
+
require('../dialog/DialogContent.js');
|
|
45
|
+
require('../dialog/DialogCloseButton.js');
|
|
46
|
+
require('../drawer/Drawer.js');
|
|
47
|
+
require('../drawer/DrawerCloseButton.js');
|
|
48
|
+
require('../dropdown/Dropdown.js');
|
|
49
|
+
require('../file-drop-zone/FileDropZone.js');
|
|
50
|
+
require('../file-drop-zone/FileDropZoneIcon.js');
|
|
51
|
+
require('../file-drop-zone/FileDropZoneTrigger.js');
|
|
52
|
+
require('../flex-item/FlexItem.js');
|
|
53
|
+
require('../flex-layout/FlexLayout.js');
|
|
54
|
+
require('../flow-layout/FlowLayout.js');
|
|
55
|
+
require('../form-field/FormField.js');
|
|
56
|
+
require('../form-field-context/FormFieldContext.js');
|
|
57
|
+
require('../grid-item/GridItem.js');
|
|
58
|
+
require('../grid-layout/GridLayout.js');
|
|
59
|
+
require('../input/Input.js');
|
|
60
|
+
require('../link/Link.js');
|
|
61
|
+
require('../link-card/LinkCard.js');
|
|
62
|
+
require('../list-control/ListControlContext.js');
|
|
63
|
+
require('../multiline-input/MultilineInput.js');
|
|
64
|
+
require('../option/Option.js');
|
|
65
|
+
require('../option/OptionGroup.js');
|
|
66
|
+
require('../pagination/Pagination.js');
|
|
67
|
+
require('../pagination/Paginator.js');
|
|
68
|
+
require('../pagination/CompactInput.js');
|
|
69
|
+
require('../pagination/CompactPaginator.js');
|
|
70
|
+
require('../pagination/GoToInput.js');
|
|
71
|
+
require('../panel/Panel.js');
|
|
72
|
+
require('../pill/Pill.js');
|
|
73
|
+
require('../progress/CircularProgress/CircularProgress.js');
|
|
74
|
+
require('../progress/LinearProgress/LinearProgress.js');
|
|
75
|
+
require('../radio-button/RadioButton.js');
|
|
76
|
+
require('../radio-button/RadioButtonGroup.js');
|
|
77
|
+
require('../scrim/Scrim.js');
|
|
78
|
+
require('../spinner/Spinner.js');
|
|
79
|
+
require('../stack-layout/StackLayout.js');
|
|
80
|
+
require('../status-adornment/StatusAdornment.js');
|
|
81
|
+
require('../toast/Toast.js');
|
|
82
|
+
require('../toast/ToastContent.js');
|
|
83
|
+
require('../split-layout/SplitLayout.js');
|
|
84
|
+
require('../switch/Switch.js');
|
|
85
|
+
require('../toggle-button/ToggleButton.js');
|
|
86
|
+
require('../toggle-button-group/ToggleButtonGroup.js');
|
|
87
|
+
require('../toggle-button-group/ToggleButtonGroupContext.js');
|
|
88
|
+
require('../tooltip/Tooltip.js');
|
|
89
|
+
require('@floating-ui/react');
|
|
13
90
|
var ExpansionIcon = require('./ExpansionIcon.js');
|
|
14
91
|
var ConditionalWrapper = require('./ConditionalWrapper.js');
|
|
15
|
-
var window = require('@salt-ds/window');
|
|
16
|
-
var styles = require('@salt-ds/styles');
|
|
17
92
|
var NavigationItem$1 = require('./NavigationItem.css.js');
|
|
18
93
|
|
|
19
94
|
const withBaseName = makePrefixer.makePrefixer("saltNavigationItem");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\nimport { ConditionalWrapper } from \"./ConditionalWrapper\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport navigationItemCss from \"./NavigationItem.css\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Whether the navigation item is active.\n */\n active?: boolean;\n /**\n * Whether the nested group is collapsed and there is an active nested item within it.\n */\n blurActive?: boolean;\n /**\n * Whether the navigation item is expanded.\n */\n expanded?: boolean;\n /**\n * Level of nesting.\n */\n level?: number;\n /**\n * The orientation of the navigation item.\n */\n orientation?: \"horizontal\" | \"vertical\";\n /**\n * Whether the navigation item is a parent with nested items.\n */\n parent?: boolean;\n /**\n * Action to be triggered when the navigation item is expanded.\n */\n onExpand?: MouseEventHandler<HTMLButtonElement>;\n /**\n * Href to be passed to the Link element.\n */\n href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n function NavigationItem(props, ref) {\n const {\n active,\n blurActive,\n children,\n className,\n expanded = false,\n orientation = \"horizontal\",\n parent,\n level = 0,\n onExpand,\n href,\n style: styleProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-navigation-item\",\n css: navigationItemCss,\n window: targetWindow,\n });\n\n const style = {\n ...styleProp,\n \"--saltNavigationItem-level\": `${level}`,\n };\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={style}\n {...rest}\n >\n <ConditionalWrapper\n className={clsx(\n withBaseName(\"wrapper\"),\n {\n [withBaseName(\"active\")]: active || blurActive,\n [withBaseName(\"blurActive\")]: blurActive,\n [withBaseName(\"rootItem\")]: level === 0,\n },\n withBaseName(orientation)\n )}\n parent={parent}\n expanded={expanded}\n onExpand={onExpand}\n active={active}\n href={href}\n >\n <span className={withBaseName(\"label\")}>{children}</span>\n {parent && (\n <ExpansionIcon expanded={expanded} orientation={orientation} />\n )}\n </ConditionalWrapper>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","NavigationItem","useWindow","useComponentCssInjection","navigationItemCss","jsx","clsx","jsxs","ConditionalWrapper","ExpansionIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\nimport { ConditionalWrapper } from \"./ConditionalWrapper\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport navigationItemCss from \"./NavigationItem.css\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Whether the navigation item is active.\n */\n active?: boolean;\n /**\n * Whether the nested group is collapsed and there is an active nested item within it.\n */\n blurActive?: boolean;\n /**\n * Whether the navigation item is expanded.\n */\n expanded?: boolean;\n /**\n * Level of nesting.\n */\n level?: number;\n /**\n * The orientation of the navigation item.\n */\n orientation?: \"horizontal\" | \"vertical\";\n /**\n * Whether the navigation item is a parent with nested items.\n */\n parent?: boolean;\n /**\n * Action to be triggered when the navigation item is expanded.\n */\n onExpand?: MouseEventHandler<HTMLButtonElement>;\n /**\n * Href to be passed to the Link element.\n */\n href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n function NavigationItem(props, ref) {\n const {\n active,\n blurActive,\n children,\n className,\n expanded = false,\n orientation = \"horizontal\",\n parent,\n level = 0,\n onExpand,\n href,\n style: styleProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-navigation-item\",\n css: navigationItemCss,\n window: targetWindow,\n });\n\n const style = {\n ...styleProp,\n \"--saltNavigationItem-level\": `${level}`,\n };\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={style}\n {...rest}\n >\n <ConditionalWrapper\n className={clsx(\n withBaseName(\"wrapper\"),\n {\n [withBaseName(\"active\")]: active || blurActive,\n [withBaseName(\"blurActive\")]: blurActive,\n [withBaseName(\"rootItem\")]: level === 0,\n },\n withBaseName(orientation)\n )}\n parent={parent}\n expanded={expanded}\n onExpand={onExpand}\n active={active}\n href={href}\n >\n <span className={withBaseName(\"label\")}>{children}</span>\n {parent && (\n <ExpansionIcon expanded={expanded} orientation={orientation} />\n )}\n </ConditionalWrapper>\n </div>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","NavigationItem","useWindow","useComponentCssInjection","navigationItemCss","jsx","clsx","jsxs","ConditionalWrapper","ExpansionIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,YAAA,GAAeA,0BAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAW,GAAA,KAAA;AAAA,MACX,WAAc,GAAA,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAQ,GAAA,CAAA;AAAA,MACR,QAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACJ,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,KAAQ,GAAA;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,8BAA8B,CAAG,EAAA,KAAA,CAAA,CAAA;AAAA,KACnC,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAC,eAAA,CAAAC,qCAAA,EAAA;AAAA,QACC,SAAW,EAAAF,SAAA;AAAA,UACT,aAAa,SAAS,CAAA;AAAA,UACtB;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,MAAU,IAAA,UAAA;AAAA,YACpC,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,YAC9B,CAAC,YAAA,CAAa,UAAU,CAAA,GAAI,KAAU,KAAA,CAAA;AAAA,WACxC;AAAA,UACA,aAAa,WAAW,CAAA;AAAA,SAC1B;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA;AAAA,QACA,MAAA;AAAA,QACA,IAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAACD,cAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAAI,QAAA;AAAA,WAAS,CAAA;AAAA,UACjD,0BACEA,cAAA,CAAAI,2BAAA,EAAA;AAAA,YAAc,QAAA;AAAA,YAAoB,WAAA;AAAA,WAA0B,CAAA;AAAA,SAAA;AAAA,OAEjE,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css_248z = ".saltOption {\n color: var(--salt-content-primary-foreground);\n background: var(--salt-selectable-background);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n padding-left: var(--salt-spacing-100);\n padding-right: var(--salt-spacing-100);\n display: flex;\n gap: var(--salt-spacing-100);\n position: relative;\n align-items: center;\n cursor: var(--salt-selectable-cursor-hover);\n box-sizing: border-box;\n}\n\n.saltOption-active {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltOption-focusVisible {\n outline: var(--salt-focused-outline);\n outline-offset: calc(var(--salt-size-border) * -2);\n}\n\n.saltOption:hover {\n background: var(--salt-selectable-background-hover);\n}\n\n.saltOption[aria-selected=\"true\"] {\n background: var(--salt-selectable-background-selected);\n}\n\n.saltOption[aria-selected=\"true\"]::before {\n content: \"\";\n display: block;\n position: absolute;\n top: -1px;\n bottom: -1px;\n left: 0;\n width: 100%;\n}\n\n.saltOption[aria-selected=\"true\"]::before {\n border-top: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n border-bottom: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n}\n\n.saltOption[aria-selected=\"true\"]:first-of-type::before {\n border-top: unset;\n top: 0;\n}\n.saltOption[aria-selected=\"true\"]:last-of-type::before {\n border-bottom: unset;\n bottom: 0;\n}\n\n.saltOption[aria-disabled=\"true\"] {\n color: var(--salt-content-primary-foreground-disabled);\n cursor: var(--salt-selectable-cursor-disabled);\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = css_248z;
|
|
6
|
+
//# sourceMappingURL=Option.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Option.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|