@salt-ds/core 1.48.0 → 1.49.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/CHANGELOG.md +20 -0
- package/css/salt-core.css +8 -4
- package/dist-cjs/accordion/Accordion.js.map +1 -1
- package/dist-cjs/accordion/AccordionContext.js.map +1 -1
- package/dist-cjs/accordion/AccordionGroup.js.map +1 -1
- package/dist-cjs/accordion/AccordionHeader.js.map +1 -1
- package/dist-cjs/accordion/AccordionPanel.js.map +1 -1
- package/dist-cjs/aria-announcer/AriaAnnounce.js.map +1 -1
- package/dist-cjs/aria-announcer/AriaAnnouncerContext.js.map +1 -1
- package/dist-cjs/aria-announcer/AriaAnnouncerProvider.js.map +1 -1
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/avatar/useAvatarImage.js +46 -18
- package/dist-cjs/avatar/useAvatarImage.js.map +1 -1
- package/dist-cjs/avatar/useIsHydrated.js +18 -0
- package/dist-cjs/avatar/useIsHydrated.js.map +1 -0
- package/dist-cjs/badge/Badge.js.map +1 -1
- package/dist-cjs/banner/Banner.js.map +1 -1
- package/dist-cjs/banner/BannerActions.js.map +1 -1
- package/dist-cjs/banner/BannerContent.js.map +1 -1
- package/dist-cjs/border-item/BorderItem.js.map +1 -1
- package/dist-cjs/border-layout/BorderLayout.js.map +1 -1
- package/dist-cjs/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-cjs/breakpoints/Breakpoints.js.map +1 -1
- package/dist-cjs/button/Button.js.map +1 -1
- package/dist-cjs/button/useButton.js.map +1 -1
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/checkbox/Checkbox.css.js +1 -1
- package/dist-cjs/checkbox/Checkbox.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-cjs/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-cjs/checkbox/internal/useCheckboxGroup.js.map +1 -1
- package/dist-cjs/collapsible/Collapsible.js.map +1 -1
- package/dist-cjs/collapsible/CollapsibleContext.js.map +1 -1
- package/dist-cjs/collapsible/CollapsiblePanel.js +3 -2
- package/dist-cjs/collapsible/CollapsiblePanel.js.map +1 -1
- package/dist-cjs/collapsible/CollapsibleTrigger.js.map +1 -1
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js.map +1 -1
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogActions.js.map +1 -1
- package/dist-cjs/dialog/DialogCloseButton.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.css.js +1 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dialog/DialogContext.js.map +1 -1
- package/dist-cjs/dialog/DialogHeader.js.map +1 -1
- package/dist-cjs/divider/Divider.js.map +1 -1
- package/dist-cjs/drawer/Drawer.js.map +1 -1
- package/dist-cjs/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-cjs/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneIcon.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-cjs/file-drop-zone/internal/utils.js.map +1 -1
- package/dist-cjs/flex-item/FlexItem.js.map +1 -1
- package/dist-cjs/flex-layout/FlexLayout.js.map +1 -1
- package/dist-cjs/flex-layout/parseSpacing.js.map +1 -1
- package/dist-cjs/flow-layout/FlowLayout.js.map +1 -1
- package/dist-cjs/form-field/FormField.js.map +1 -1
- package/dist-cjs/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-cjs/form-field/FormFieldLabel.css.js +1 -1
- package/dist-cjs/form-field/FormFieldLabel.js.map +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-cjs/form-field-context/useFormFieldProps.js.map +1 -1
- package/dist-cjs/grid-item/GridItem.js.map +1 -1
- package/dist-cjs/grid-layout/GridLayout.js.map +1 -1
- package/dist-cjs/input/Input.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-cjs/interactable-card/useInteractableCard.js.map +1 -1
- package/dist-cjs/link/Link.js.map +1 -1
- package/dist-cjs/link/LinkAction.js.map +1 -1
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-box/ListBox.js.map +1 -1
- package/dist-cjs/list-control/ListControlContext.js.map +1 -1
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/menu/Menu.js.map +1 -1
- package/dist-cjs/menu/MenuBase.js.map +1 -1
- package/dist-cjs/menu/MenuContext.js.map +1 -1
- package/dist-cjs/menu/MenuGroup.js.map +1 -1
- package/dist-cjs/menu/MenuItem.js.map +1 -1
- package/dist-cjs/menu/MenuPanel.js.map +1 -1
- package/dist-cjs/menu/MenuPanelBase.js.map +1 -1
- package/dist-cjs/menu/MenuPanelContext.js.map +1 -1
- package/dist-cjs/menu/MenuTrigger.js.map +1 -1
- package/dist-cjs/menu/MenuTriggerContext.js.map +1 -1
- package/dist-cjs/multiline-input/MultilineInput.js.map +1 -1
- package/dist-cjs/navigation-item/ExpansionIcon.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItemAction.js.map +1 -1
- package/dist-cjs/option/Option.js.map +1 -1
- package/dist-cjs/option/OptionGroup.js.map +1 -1
- package/dist-cjs/option/OptionList.js.map +1 -1
- package/dist-cjs/option/OptionListBase.js.map +1 -1
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayHeader.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-cjs/overlay/OverlayTrigger.js.map +1 -1
- package/dist-cjs/pagination/CompactInput.js.map +1 -1
- package/dist-cjs/pagination/CompactPaginator.js.map +1 -1
- package/dist-cjs/pagination/GoToInput.js.map +1 -1
- package/dist-cjs/pagination/PageButton.js.map +1 -1
- package/dist-cjs/pagination/PageRanges.js.map +1 -1
- package/dist-cjs/pagination/Pagination.js.map +1 -1
- package/dist-cjs/pagination/PaginationContext.js.map +1 -1
- package/dist-cjs/pagination/Paginator.js.map +1 -1
- package/dist-cjs/pagination/usePagination.js.map +1 -1
- package/dist-cjs/pagination/usePaginationContext.js.map +1 -1
- package/dist-cjs/panel/Panel.js.map +1 -1
- package/dist-cjs/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-cjs/pill/Pill.js.map +1 -1
- package/dist-cjs/pill-input/PillInput.js.map +1 -1
- package/dist-cjs/pill-input/useTruncatePills.js.map +1 -1
- package/dist-cjs/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-cjs/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-cjs/radio-button/RadioButton.css.js +1 -1
- package/dist-cjs/radio-button/RadioButton.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-cjs/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-cjs/radio-button/internal/useRadioGroup.js.map +1 -1
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/scrim/Scrim.js.map +1 -1
- package/dist-cjs/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
- package/dist-cjs/skip-link/SkipLink.js.map +1 -1
- package/dist-cjs/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
- package/dist-cjs/slider/RangeSlider.js.map +1 -1
- package/dist-cjs/slider/Slider.js.map +1 -1
- package/dist-cjs/slider/internal/SliderThumb.js.map +1 -1
- package/dist-cjs/slider/internal/SliderTooltip.js.map +1 -1
- package/dist-cjs/slider/internal/SliderTrack.js.map +1 -1
- package/dist-cjs/slider/internal/useRangeSliderThumb.js.map +1 -1
- package/dist-cjs/slider/internal/useSliderThumb.js.map +1 -1
- package/dist-cjs/slider/internal/utils.js.map +1 -1
- package/dist-cjs/spinner/Spinner.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-cjs/split-layout/SplitLayout.js.map +1 -1
- package/dist-cjs/stack-layout/StackLayout.js.map +1 -1
- package/dist-cjs/status-adornment/ErrorAdornment.js.map +1 -1
- package/dist-cjs/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-cjs/status-adornment/SuccessAdornment.js.map +1 -1
- package/dist-cjs/status-adornment/WarningAdornment.js.map +1 -1
- package/dist-cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-cjs/status-indicator/ValidationStatus.js.map +1 -1
- package/dist-cjs/stepper/Step.js.map +1 -1
- package/dist-cjs/stepper/Stepper.js.map +1 -1
- package/dist-cjs/stepper/internal/StepConnector.js.map +1 -1
- package/dist-cjs/stepper/internal/StepExpandTrigger.js.map +1 -1
- package/dist-cjs/stepper/internal/StepIcon.js.map +1 -1
- package/dist-cjs/stepper/internal/StepScreenReaderOnly.js.map +1 -1
- package/dist-cjs/stepper/internal/StepText.js.map +1 -1
- package/dist-cjs/stepper/internal/StepperProvider.js.map +1 -1
- package/dist-cjs/switch/Switch.css.js +1 -1
- package/dist-cjs/switch/Switch.js.map +1 -1
- package/dist-cjs/tag/Tag.js.map +1 -1
- package/dist-cjs/text/Code.js.map +1 -1
- package/dist-cjs/text/Display.js.map +1 -1
- package/dist-cjs/text/Headings.js.map +1 -1
- package/dist-cjs/text/Label.js.map +1 -1
- package/dist-cjs/text/Text.js.map +1 -1
- package/dist-cjs/text/TextAction.js.map +1 -1
- package/dist-cjs/text/TextNotation.js.map +1 -1
- package/dist-cjs/theme/Accent.js.map +1 -1
- package/dist-cjs/theme/ActionFont.js.map +1 -1
- package/dist-cjs/theme/Corner.js.map +1 -1
- package/dist-cjs/theme/Density.js.map +1 -1
- package/dist-cjs/theme/HeadingFont.js.map +1 -1
- package/dist-cjs/theme/Mode.js.map +1 -1
- package/dist-cjs/theme/Theme.js.map +1 -1
- package/dist-cjs/toast/Toast.js.map +1 -1
- package/dist-cjs/toast/ToastContent.js.map +1 -1
- package/dist-cjs/toggle-button/ToggleButton.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-cjs/tooltip/Tooltip.js.map +1 -1
- package/dist-cjs/tooltip/TooltipBase.js.map +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-cjs/tooltip/useTooltip.js.map +1 -1
- package/dist-cjs/utils/capitalize.js.map +1 -1
- package/dist-cjs/utils/createChainedFunction.js.map +1 -1
- package/dist-cjs/utils/createContext.js.map +1 -1
- package/dist-cjs/utils/debounce.js.map +1 -1
- package/dist-cjs/utils/getRefFromChildren.js.map +1 -1
- package/dist-cjs/utils/makePrefixer.js.map +1 -1
- package/dist-cjs/utils/marginMiddleware.js.map +1 -1
- package/dist-cjs/utils/mergeProps.js.map +1 -1
- package/dist-cjs/utils/ownerDocument.js.map +1 -1
- package/dist-cjs/utils/ownerWindow.js.map +1 -1
- package/dist-cjs/utils/renderProps.js.map +1 -1
- package/dist-cjs/utils/setRef.js.map +1 -1
- package/dist-cjs/utils/useControlled.js.map +1 -1
- package/dist-cjs/utils/useEventCallback.js.map +1 -1
- package/dist-cjs/utils/useFloatingUI/useFloatingUI.js.map +1 -1
- package/dist-cjs/utils/useForkRef.js.map +1 -1
- package/dist-cjs/utils/useId.js.map +1 -1
- package/dist-cjs/utils/useIsFocusVisible.js.map +1 -1
- package/dist-cjs/utils/useIsomorphicLayoutEffect.js.map +1 -1
- package/dist-cjs/utils/usePreventScroll.js.map +1 -1
- package/dist-cjs/utils/usePrevious.js.map +1 -1
- package/dist-cjs/utils/useResizeObserver.js.map +1 -1
- package/dist-cjs/utils/useResponsiveProp.js.map +1 -1
- package/dist-cjs/utils/useValueEffect.js.map +1 -1
- package/dist-cjs/vertical-navigation/SubMenuContext.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigation.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItem.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItemContent.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItemExpansionIcon.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItemLabel.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationItemTrigger.js.map +1 -1
- package/dist-cjs/vertical-navigation/VerticalNavigationSubMenu.js.map +1 -1
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/accordion/Accordion.js.map +1 -1
- package/dist-es/accordion/AccordionContext.js.map +1 -1
- package/dist-es/accordion/AccordionGroup.js.map +1 -1
- package/dist-es/accordion/AccordionHeader.js.map +1 -1
- package/dist-es/accordion/AccordionPanel.js.map +1 -1
- package/dist-es/aria-announcer/AriaAnnounce.js.map +1 -1
- package/dist-es/aria-announcer/AriaAnnouncerContext.js.map +1 -1
- package/dist-es/aria-announcer/AriaAnnouncerProvider.js.map +1 -1
- package/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -1
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/avatar/useAvatarImage.js +47 -19
- package/dist-es/avatar/useAvatarImage.js.map +1 -1
- package/dist-es/avatar/useIsHydrated.js +16 -0
- package/dist-es/avatar/useIsHydrated.js.map +1 -0
- package/dist-es/badge/Badge.js.map +1 -1
- package/dist-es/banner/Banner.js.map +1 -1
- package/dist-es/banner/BannerActions.js.map +1 -1
- package/dist-es/banner/BannerContent.js.map +1 -1
- package/dist-es/border-item/BorderItem.js.map +1 -1
- package/dist-es/border-layout/BorderLayout.js.map +1 -1
- package/dist-es/breakpoints/BreakpointProvider.js.map +1 -1
- package/dist-es/breakpoints/Breakpoints.js.map +1 -1
- package/dist-es/button/Button.js.map +1 -1
- package/dist-es/button/useButton.js.map +1 -1
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/checkbox/Checkbox.css.js +1 -1
- package/dist-es/checkbox/Checkbox.js.map +1 -1
- package/dist-es/checkbox/CheckboxGroup.js.map +1 -1
- package/dist-es/checkbox/CheckboxIcon.js.map +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js.map +1 -1
- package/dist-es/checkbox/internal/useCheckboxGroup.js.map +1 -1
- package/dist-es/collapsible/Collapsible.js.map +1 -1
- package/dist-es/collapsible/CollapsibleContext.js.map +1 -1
- package/dist-es/collapsible/CollapsiblePanel.js +4 -3
- package/dist-es/collapsible/CollapsiblePanel.js.map +1 -1
- package/dist-es/collapsible/CollapsibleTrigger.js.map +1 -1
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js.map +1 -1
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogActions.js.map +1 -1
- package/dist-es/dialog/DialogCloseButton.js.map +1 -1
- package/dist-es/dialog/DialogContent.css.js +1 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dialog/DialogContext.js.map +1 -1
- package/dist-es/dialog/DialogHeader.js.map +1 -1
- package/dist-es/divider/Divider.js.map +1 -1
- package/dist-es/drawer/Drawer.js.map +1 -1
- package/dist-es/drawer/DrawerCloseButton.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-es/file-drop-zone/FileDropZone.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneIcon.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map +1 -1
- package/dist-es/file-drop-zone/internal/utils.js.map +1 -1
- package/dist-es/flex-item/FlexItem.js.map +1 -1
- package/dist-es/flex-layout/FlexLayout.js.map +1 -1
- package/dist-es/flex-layout/parseSpacing.js.map +1 -1
- package/dist-es/flow-layout/FlowLayout.js.map +1 -1
- package/dist-es/form-field/FormField.js.map +1 -1
- package/dist-es/form-field/FormFieldHelperText.js.map +1 -1
- package/dist-es/form-field/FormFieldLabel.css.js +1 -1
- package/dist-es/form-field/FormFieldLabel.js.map +1 -1
- package/dist-es/form-field-context/FormFieldContext.js.map +1 -1
- package/dist-es/form-field-context/useFormFieldProps.js.map +1 -1
- package/dist-es/grid-item/GridItem.js.map +1 -1
- package/dist-es/grid-layout/GridLayout.js.map +1 -1
- package/dist-es/input/Input.js.map +1 -1
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroup.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js.map +1 -1
- package/dist-es/interactable-card/useInteractableCard.js.map +1 -1
- package/dist-es/link/Link.js.map +1 -1
- package/dist-es/link/LinkAction.js.map +1 -1
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-box/ListBox.js.map +1 -1
- package/dist-es/list-control/ListControlContext.js.map +1 -1
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/menu/Menu.js.map +1 -1
- package/dist-es/menu/MenuBase.js.map +1 -1
- package/dist-es/menu/MenuContext.js.map +1 -1
- package/dist-es/menu/MenuGroup.js.map +1 -1
- package/dist-es/menu/MenuItem.js.map +1 -1
- package/dist-es/menu/MenuPanel.js.map +1 -1
- package/dist-es/menu/MenuPanelBase.js.map +1 -1
- package/dist-es/menu/MenuPanelContext.js.map +1 -1
- package/dist-es/menu/MenuTrigger.js.map +1 -1
- package/dist-es/menu/MenuTriggerContext.js.map +1 -1
- package/dist-es/multiline-input/MultilineInput.js.map +1 -1
- package/dist-es/navigation-item/ExpansionIcon.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/navigation-item/NavigationItemAction.js.map +1 -1
- package/dist-es/option/Option.js.map +1 -1
- package/dist-es/option/OptionGroup.js.map +1 -1
- package/dist-es/option/OptionList.js.map +1 -1
- package/dist-es/option/OptionListBase.js.map +1 -1
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayHeader.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/overlay/OverlayPanelCloseButton.js.map +1 -1
- package/dist-es/overlay/OverlayPanelContent.js.map +1 -1
- package/dist-es/overlay/OverlayTrigger.js.map +1 -1
- package/dist-es/pagination/CompactInput.js.map +1 -1
- package/dist-es/pagination/CompactPaginator.js.map +1 -1
- package/dist-es/pagination/GoToInput.js.map +1 -1
- package/dist-es/pagination/PageButton.js.map +1 -1
- package/dist-es/pagination/PageRanges.js.map +1 -1
- package/dist-es/pagination/Pagination.js.map +1 -1
- package/dist-es/pagination/PaginationContext.js.map +1 -1
- package/dist-es/pagination/Paginator.js.map +1 -1
- package/dist-es/pagination/usePagination.js.map +1 -1
- package/dist-es/pagination/usePaginationContext.js.map +1 -1
- package/dist-es/panel/Panel.js.map +1 -1
- package/dist-es/parent-child-layout/ParentChildLayout.js.map +1 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map +1 -1
- package/dist-es/pill/Pill.js.map +1 -1
- package/dist-es/pill-input/PillInput.js.map +1 -1
- package/dist-es/pill-input/useTruncatePills.js.map +1 -1
- package/dist-es/progress/CircularProgress/CircularProgress.js.map +1 -1
- package/dist-es/progress/LinearProgress/LinearProgress.js.map +1 -1
- package/dist-es/radio-button/RadioButton.css.js +1 -1
- package/dist-es/radio-button/RadioButton.js.map +1 -1
- package/dist-es/radio-button/RadioButtonGroup.js.map +1 -1
- package/dist-es/radio-button/RadioButtonIcon.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js.map +1 -1
- package/dist-es/radio-button/internal/useRadioGroup.js.map +1 -1
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/scrim/Scrim.js.map +1 -1
- package/dist-es/segmented-button-group/SegmentedButtonGroup.js.map +1 -1
- package/dist-es/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
- package/dist-es/skip-link/SkipLink.js.map +1 -1
- package/dist-es/skip-link/internal/useManageFocusOnTarget.js.map +1 -1
- package/dist-es/slider/RangeSlider.js.map +1 -1
- package/dist-es/slider/Slider.js.map +1 -1
- package/dist-es/slider/internal/SliderThumb.js.map +1 -1
- package/dist-es/slider/internal/SliderTooltip.js.map +1 -1
- package/dist-es/slider/internal/SliderTrack.js.map +1 -1
- package/dist-es/slider/internal/useRangeSliderThumb.js.map +1 -1
- package/dist-es/slider/internal/useSliderThumb.js.map +1 -1
- package/dist-es/slider/internal/utils.js.map +1 -1
- package/dist-es/spinner/Spinner.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -1
- package/dist-es/split-layout/SplitLayout.js.map +1 -1
- package/dist-es/stack-layout/StackLayout.js.map +1 -1
- package/dist-es/status-adornment/ErrorAdornment.js.map +1 -1
- package/dist-es/status-adornment/StatusAdornment.js.map +1 -1
- package/dist-es/status-adornment/SuccessAdornment.js.map +1 -1
- package/dist-es/status-adornment/WarningAdornment.js.map +1 -1
- package/dist-es/status-indicator/StatusIndicator.js.map +1 -1
- package/dist-es/status-indicator/ValidationStatus.js.map +1 -1
- package/dist-es/stepper/Step.js.map +1 -1
- package/dist-es/stepper/Stepper.js.map +1 -1
- package/dist-es/stepper/internal/StepConnector.js.map +1 -1
- package/dist-es/stepper/internal/StepExpandTrigger.js.map +1 -1
- package/dist-es/stepper/internal/StepIcon.js.map +1 -1
- package/dist-es/stepper/internal/StepScreenReaderOnly.js.map +1 -1
- package/dist-es/stepper/internal/StepText.js.map +1 -1
- package/dist-es/stepper/internal/StepperProvider.js.map +1 -1
- package/dist-es/switch/Switch.css.js +1 -1
- package/dist-es/switch/Switch.js.map +1 -1
- package/dist-es/tag/Tag.js.map +1 -1
- package/dist-es/text/Code.js.map +1 -1
- package/dist-es/text/Display.js.map +1 -1
- package/dist-es/text/Headings.js.map +1 -1
- package/dist-es/text/Label.js.map +1 -1
- package/dist-es/text/Text.js.map +1 -1
- package/dist-es/text/TextAction.js.map +1 -1
- package/dist-es/text/TextNotation.js.map +1 -1
- package/dist-es/theme/Accent.js.map +1 -1
- package/dist-es/theme/ActionFont.js.map +1 -1
- package/dist-es/theme/Corner.js.map +1 -1
- package/dist-es/theme/Density.js.map +1 -1
- package/dist-es/theme/HeadingFont.js.map +1 -1
- package/dist-es/theme/Mode.js.map +1 -1
- package/dist-es/theme/Theme.js.map +1 -1
- package/dist-es/toast/Toast.js.map +1 -1
- package/dist-es/toast/ToastContent.js.map +1 -1
- package/dist-es/toggle-button/ToggleButton.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.js.map +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js.map +1 -1
- package/dist-es/tooltip/Tooltip.js.map +1 -1
- package/dist-es/tooltip/TooltipBase.js.map +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js.map +1 -1
- package/dist-es/tooltip/useTooltip.js.map +1 -1
- package/dist-es/utils/capitalize.js.map +1 -1
- package/dist-es/utils/createChainedFunction.js.map +1 -1
- package/dist-es/utils/createContext.js.map +1 -1
- package/dist-es/utils/debounce.js.map +1 -1
- package/dist-es/utils/getRefFromChildren.js.map +1 -1
- package/dist-es/utils/makePrefixer.js.map +1 -1
- package/dist-es/utils/marginMiddleware.js.map +1 -1
- package/dist-es/utils/mergeProps.js.map +1 -1
- package/dist-es/utils/ownerDocument.js.map +1 -1
- package/dist-es/utils/ownerWindow.js.map +1 -1
- package/dist-es/utils/renderProps.js.map +1 -1
- package/dist-es/utils/setRef.js.map +1 -1
- package/dist-es/utils/useControlled.js.map +1 -1
- package/dist-es/utils/useEventCallback.js.map +1 -1
- package/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -1
- package/dist-es/utils/useForkRef.js.map +1 -1
- package/dist-es/utils/useId.js.map +1 -1
- package/dist-es/utils/useIsFocusVisible.js.map +1 -1
- package/dist-es/utils/useIsomorphicLayoutEffect.js.map +1 -1
- package/dist-es/utils/usePreventScroll.js.map +1 -1
- package/dist-es/utils/usePrevious.js.map +1 -1
- package/dist-es/utils/useResizeObserver.js.map +1 -1
- package/dist-es/utils/useResponsiveProp.js.map +1 -1
- package/dist-es/utils/useValueEffect.js.map +1 -1
- package/dist-es/vertical-navigation/SubMenuContext.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigation.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItem.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItemContent.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItemExpansionIcon.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItemLabel.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationItemTrigger.js.map +1 -1
- package/dist-es/vertical-navigation/VerticalNavigationSubMenu.js.map +1 -1
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/avatar/useAvatarImage.d.ts +3 -1
- package/dist-types/avatar/useIsHydrated.d.ts +1 -0
- package/dist-types/collapsible/CollapsiblePanel.d.ts +1 -1
- package/dist-types/file-drop-zone/FileDropZone.d.ts +1 -1
- package/dist-types/flex-layout/FlexLayout.d.ts +1 -1
- package/package.json +3 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePrevious.js","sources":["../src/utils/usePrevious.ts"],"sourcesContent":["import { type DependencyList, useEffect, useRef } from \"react\";\n\nexport function usePrevious<T>(\n value: T,\n deps: DependencyList = [],\n initialValue?: T,\n): T | undefined {\n const ref = useRef<T | undefined>(initialValue);\n\n useEffect(() => {\n ref.current = value;\n // biome-ignore lint/correctness/useExhaustiveDependencies: usePrevious is takes a dependency list to control when it updates, so we don't need to include value in the deps array.\n }, deps);\n return ref.current;\n}\n"],"names":["useRef","useEffect"],"mappings":";;;;AAEO,SAAS,
|
|
1
|
+
{"version":3,"file":"usePrevious.js","sources":["../src/utils/usePrevious.ts"],"sourcesContent":["import { type DependencyList, useEffect, useRef } from \"react\";\n\nexport function usePrevious<T>(\n value: T,\n deps: DependencyList = [],\n initialValue?: T,\n): T | undefined {\n const ref = useRef<T | undefined>(initialValue);\n\n useEffect(() => {\n ref.current = value;\n // biome-ignore lint/correctness/useExhaustiveDependencies: usePrevious is takes a dependency list to control when it updates, so we don't need to include value in the deps array.\n }, deps);\n return ref.current;\n}\n"],"names":["useRef","useEffect"],"mappings":";;;;AAEO,SAAS,WAAA,CACd,KAAA,EACA,IAAA,GAAuB,IACvB,YAAA,EACe;AACf,EAAA,MAAM,GAAA,GAAMA,aAAsB,YAAY,CAAA;AAE9C,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,GAAA,CAAI,OAAA,GAAU,KAAA;AAAA,EAEhB,GAAG,IAAI,CAAA;AACP,EAAA,OAAO,GAAA,CAAI,OAAA;AACb;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResizeObserver.js","sources":["../src/utils/useResizeObserver.ts"],"sourcesContent":["import { type RefObject, useEffect } from \"react\";\nimport { ownerWindow } from \"./ownerWindow\";\n\nexport interface UseResizeObserverProps {\n ref: RefObject<HTMLElement>;\n onResize: () => void;\n}\n\nexport function useResizeObserver({ ref, onResize }: UseResizeObserverProps) {\n useEffect(() => {\n const element = ref?.current;\n if (!element) return;\n\n const win = ownerWindow(element);\n\n const resizeObserver = new win.ResizeObserver((entries) => {\n requestAnimationFrame(() => {\n if (entries.length === 0) return;\n\n onResize();\n });\n });\n resizeObserver.observe(element);\n\n return () => {\n if (element) {\n resizeObserver.unobserve(element);\n }\n };\n }, [ref, onResize]);\n}\n"],"names":["useEffect","ownerWindow"],"mappings":";;;;;AAQO,SAAS,
|
|
1
|
+
{"version":3,"file":"useResizeObserver.js","sources":["../src/utils/useResizeObserver.ts"],"sourcesContent":["import { type RefObject, useEffect } from \"react\";\nimport { ownerWindow } from \"./ownerWindow\";\n\nexport interface UseResizeObserverProps {\n ref: RefObject<HTMLElement>;\n onResize: () => void;\n}\n\nexport function useResizeObserver({ ref, onResize }: UseResizeObserverProps) {\n useEffect(() => {\n const element = ref?.current;\n if (!element) return;\n\n const win = ownerWindow(element);\n\n const resizeObserver = new win.ResizeObserver((entries) => {\n requestAnimationFrame(() => {\n if (entries.length === 0) return;\n\n onResize();\n });\n });\n resizeObserver.observe(element);\n\n return () => {\n if (element) {\n resizeObserver.unobserve(element);\n }\n };\n }, [ref, onResize]);\n}\n"],"names":["useEffect","ownerWindow"],"mappings":";;;;;AAQO,SAAS,iBAAA,CAAkB,EAAE,GAAA,EAAK,QAAA,EAAS,EAA2B;AAC3E,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,UAAU,GAAA,IAAA,IAAA,GAAA,MAAA,GAAA,GAAA,CAAK,OAAA;AACrB,IAAA,IAAI,CAAC,OAAA,EAAS;AAEd,IAAA,MAAM,GAAA,GAAMC,wBAAY,OAAO,CAAA;AAE/B,IAAA,MAAM,cAAA,GAAiB,IAAI,GAAA,CAAI,cAAA,CAAe,CAAC,OAAA,KAAY;AACzD,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,OAAA,CAAQ,WAAW,CAAA,EAAG;AAE1B,QAAA,QAAA,EAAS;AAAA,MACX,CAAC,CAAA;AAAA,IACH,CAAC,CAAA;AACD,IAAA,cAAA,CAAe,QAAQ,OAAO,CAAA;AAE9B,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,cAAA,CAAe,UAAU,OAAO,CAAA;AAAA,MAClC;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,GAAA,EAAK,QAAQ,CAAC,CAAA;AACpB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResponsiveProp.js","sources":["../src/utils/useResponsiveProp.ts"],"sourcesContent":["import type { Breakpoints } from \"../breakpoints\";\nimport { useBreakpoints } from \"../salt-provider\";\nimport { useViewport } from \"../viewport\";\n\ntype BreakpointProp<T> = {\n [K in keyof Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | BreakpointProp<T>;\n\nexport const getCurrentBreakpoint = (\n breakpoints: Breakpoints,\n width: number,\n) => {\n const breakpointList = Object.entries(breakpoints).sort(\n ([, a], [, b]) => a - b,\n );\n const [currentBreakpoint] = (\n breakpointList as [keyof Breakpoints, number][]\n ).reduce(\n (acc, val) => {\n const [, accWidth] = acc;\n const [breakpoint, breakpointWidth] = val;\n if (breakpointWidth <= width && breakpointWidth > accWidth) {\n return [breakpoint, breakpointWidth];\n }\n return acc;\n },\n breakpointList[0] as [keyof Breakpoints, number],\n );\n\n return currentBreakpoint;\n};\n\nexport const useCurrentBreakpoint = () => {\n const viewport = useViewport();\n\n const breakpoints = useBreakpoints();\n\n return getCurrentBreakpoint(breakpoints, viewport);\n};\n\nexport const useOrderedBreakpoints = () => {\n const breakpoints = useBreakpoints();\n\n return Object.entries(breakpoints)\n .sort(([, a], [, b]) => a - b)\n .map(([key]) => key);\n};\n\nconst isObject = <T>(\n value: T,\n): value is Record<string | number | symbol, any> => {\n const type = typeof value;\n return value !== null && (type === \"object\" || type === \"function\");\n};\n\nconst hasBreakpointValues = <T>(\n value: ResponsiveProp<T>,\n breakpoints: Breakpoints,\n): value is BreakpointProp<T> => {\n return (\n isObject(value) && Object.keys(value).every((key) => key in breakpoints)\n );\n};\n\nconst getResponsiveValue = <T>(\n breakpointValues: BreakpointProp<T>,\n breakpoints: Breakpoints,\n viewport: keyof Breakpoints,\n defaultValue: T,\n) => {\n return Object.entries(breakpointValues).reduce<[number, T]>(\n (acc, val) => {\n const [accWidth] = acc;\n const [breakpoint, breakpointValue] = val;\n\n const breakpointWidth =\n breakpoints[breakpoint as keyof typeof breakpoints];\n\n if (\n breakpointWidth >= accWidth &&\n breakpointWidth <= breakpoints[viewport]\n ) {\n return [breakpointWidth, breakpointValue];\n }\n\n return acc;\n },\n [0, defaultValue],\n )[1];\n};\n\nexport const useResponsiveProp = <T>(\n value: ResponsiveProp<T>,\n defaultValue: T,\n) => {\n const breakpoints = useBreakpoints();\n const viewport = useViewport();\n // return early if the values are the same\n if (value === defaultValue) return defaultValue;\n\n const currentViewport = getCurrentBreakpoint(breakpoints, viewport);\n if (hasBreakpointValues(value, breakpoints)) {\n return getResponsiveValue(\n value,\n breakpoints,\n currentViewport,\n defaultValue,\n );\n }\n return value;\n};\n\nfunction isBreakpointProp<T>(\n value: ResponsiveProp<T>,\n): value is BreakpointProp<T> {\n return typeof value === \"object\" && !Array.isArray(value);\n}\n\nexport function resolveResponsiveValue<Value>(\n value: ResponsiveProp<Value>,\n matchedBreakpoints: (keyof Breakpoints)[],\n) {\n if (value && isBreakpointProp(value)) {\n for (const breakpoint of matchedBreakpoints) {\n if (value[breakpoint] != null) {\n return value[breakpoint];\n }\n }\n return undefined;\n }\n return value;\n}\n"],"names":["useViewport","useBreakpoints"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"useResponsiveProp.js","sources":["../src/utils/useResponsiveProp.ts"],"sourcesContent":["import type { Breakpoints } from \"../breakpoints\";\nimport { useBreakpoints } from \"../salt-provider\";\nimport { useViewport } from \"../viewport\";\n\ntype BreakpointProp<T> = {\n [K in keyof Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | BreakpointProp<T>;\n\nexport const getCurrentBreakpoint = (\n breakpoints: Breakpoints,\n width: number,\n) => {\n const breakpointList = Object.entries(breakpoints).sort(\n ([, a], [, b]) => a - b,\n );\n const [currentBreakpoint] = (\n breakpointList as [keyof Breakpoints, number][]\n ).reduce(\n (acc, val) => {\n const [, accWidth] = acc;\n const [breakpoint, breakpointWidth] = val;\n if (breakpointWidth <= width && breakpointWidth > accWidth) {\n return [breakpoint, breakpointWidth];\n }\n return acc;\n },\n breakpointList[0] as [keyof Breakpoints, number],\n );\n\n return currentBreakpoint;\n};\n\nexport const useCurrentBreakpoint = () => {\n const viewport = useViewport();\n\n const breakpoints = useBreakpoints();\n\n return getCurrentBreakpoint(breakpoints, viewport);\n};\n\nexport const useOrderedBreakpoints = () => {\n const breakpoints = useBreakpoints();\n\n return Object.entries(breakpoints)\n .sort(([, a], [, b]) => a - b)\n .map(([key]) => key);\n};\n\nconst isObject = <T>(\n value: T,\n): value is Record<string | number | symbol, any> => {\n const type = typeof value;\n return value !== null && (type === \"object\" || type === \"function\");\n};\n\nconst hasBreakpointValues = <T>(\n value: ResponsiveProp<T>,\n breakpoints: Breakpoints,\n): value is BreakpointProp<T> => {\n return (\n isObject(value) && Object.keys(value).every((key) => key in breakpoints)\n );\n};\n\nconst getResponsiveValue = <T>(\n breakpointValues: BreakpointProp<T>,\n breakpoints: Breakpoints,\n viewport: keyof Breakpoints,\n defaultValue: T,\n) => {\n return Object.entries(breakpointValues).reduce<[number, T]>(\n (acc, val) => {\n const [accWidth] = acc;\n const [breakpoint, breakpointValue] = val;\n\n const breakpointWidth =\n breakpoints[breakpoint as keyof typeof breakpoints];\n\n if (\n breakpointWidth >= accWidth &&\n breakpointWidth <= breakpoints[viewport]\n ) {\n return [breakpointWidth, breakpointValue];\n }\n\n return acc;\n },\n [0, defaultValue],\n )[1];\n};\n\nexport const useResponsiveProp = <T>(\n value: ResponsiveProp<T>,\n defaultValue: T,\n) => {\n const breakpoints = useBreakpoints();\n const viewport = useViewport();\n // return early if the values are the same\n if (value === defaultValue) return defaultValue;\n\n const currentViewport = getCurrentBreakpoint(breakpoints, viewport);\n if (hasBreakpointValues(value, breakpoints)) {\n return getResponsiveValue(\n value,\n breakpoints,\n currentViewport,\n defaultValue,\n );\n }\n return value;\n};\n\nfunction isBreakpointProp<T>(\n value: ResponsiveProp<T>,\n): value is BreakpointProp<T> {\n return typeof value === \"object\" && !Array.isArray(value);\n}\n\nexport function resolveResponsiveValue<Value>(\n value: ResponsiveProp<Value>,\n matchedBreakpoints: (keyof Breakpoints)[],\n) {\n if (value && isBreakpointProp(value)) {\n for (const breakpoint of matchedBreakpoints) {\n if (value[breakpoint] != null) {\n return value[breakpoint];\n }\n }\n return undefined;\n }\n return value;\n}\n"],"names":["useViewport","useBreakpoints"],"mappings":";;;;;AAUO,MAAM,oBAAA,GAAuB,CAClC,WAAA,EACA,KAAA,KACG;AACH,EAAA,MAAM,cAAA,GAAiB,MAAA,CAAO,OAAA,CAAQ,WAAW,CAAA,CAAE,IAAA;AAAA,IACjD,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA,KAAM,CAAA,GAAI;AAAA,GACxB;AACA,EAAA,MAAM,CAAC,iBAAiB,CAAA,GACtB,cAAA,CACA,MAAA;AAAA,IACA,CAAC,KAAK,GAAA,KAAQ;AACZ,MAAA,MAAM,GAAG,QAAQ,CAAA,GAAI,GAAA;AACrB,MAAA,MAAM,CAAC,UAAA,EAAY,eAAe,CAAA,GAAI,GAAA;AACtC,MAAA,IAAI,eAAA,IAAmB,KAAA,IAAS,eAAA,GAAkB,QAAA,EAAU;AAC1D,QAAA,OAAO,CAAC,YAAY,eAAe,CAAA;AAAA,MACrC;AACA,MAAA,OAAO,GAAA;AAAA,IACT,CAAA;AAAA,IACA,eAAe,CAAC;AAAA,GAClB;AAEA,EAAA,OAAO,iBAAA;AACT;AAEO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,WAAWA,4BAAA,EAAY;AAE7B,EAAA,MAAM,cAAcC,2BAAA,EAAe;AAEnC,EAAA,OAAO,oBAAA,CAAqB,aAAa,QAAQ,CAAA;AACnD;AAEO,MAAM,wBAAwB,MAAM;AACzC,EAAA,MAAM,cAAcA,2BAAA,EAAe;AAEnC,EAAA,OAAO,MAAA,CAAO,QAAQ,WAAW,CAAA,CAC9B,KAAK,CAAC,GAAG,CAAC,CAAA,EAAG,GAAG,CAAC,CAAA,KAAM,IAAI,CAAC,CAAA,CAC5B,IAAI,CAAC,CAAC,GAAG,CAAA,KAAM,GAAG,CAAA;AACvB;AAEA,MAAM,QAAA,GAAW,CACf,KAAA,KACmD;AACnD,EAAA,MAAM,OAAO,OAAO,KAAA;AACpB,EAAA,OAAO,KAAA,KAAU,IAAA,KAAS,IAAA,KAAS,QAAA,IAAY,IAAA,KAAS,UAAA,CAAA;AAC1D,CAAA;AAEA,MAAM,mBAAA,GAAsB,CAC1B,KAAA,EACA,WAAA,KAC+B;AAC/B,EAAA,OACE,QAAA,CAAS,KAAK,CAAA,IAAK,MAAA,CAAO,IAAA,CAAK,KAAK,CAAA,CAAE,KAAA,CAAM,CAAC,GAAA,KAAQ,GAAA,IAAO,WAAW,CAAA;AAE3E,CAAA;AAEA,MAAM,kBAAA,GAAqB,CACzB,gBAAA,EACA,WAAA,EACA,UACA,YAAA,KACG;AACH,EAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,gBAAgB,CAAA,CAAE,MAAA;AAAA,IACtC,CAAC,KAAK,GAAA,KAAQ;AACZ,MAAA,MAAM,CAAC,QAAQ,CAAA,GAAI,GAAA;AACnB,MAAA,MAAM,CAAC,UAAA,EAAY,eAAe,CAAA,GAAI,GAAA;AAEtC,MAAA,MAAM,eAAA,GACJ,YAAY,UAAsC,CAAA;AAEpD,MAAA,IACE,eAAA,IAAmB,QAAA,IACnB,eAAA,IAAmB,WAAA,CAAY,QAAQ,CAAA,EACvC;AACA,QAAA,OAAO,CAAC,iBAAiB,eAAe,CAAA;AAAA,MAC1C;AAEA,MAAA,OAAO,GAAA;AAAA,IACT,CAAA;AAAA,IACA,CAAC,GAAG,YAAY;AAAA,IAChB,CAAC,CAAA;AACL,CAAA;AAEO,MAAM,iBAAA,GAAoB,CAC/B,KAAA,EACA,YAAA,KACG;AACH,EAAA,MAAM,cAAcA,2BAAA,EAAe;AACnC,EAAA,MAAM,WAAWD,4BAAA,EAAY;AAE7B,EAAA,IAAI,KAAA,KAAU,cAAc,OAAO,YAAA;AAEnC,EAAA,MAAM,eAAA,GAAkB,oBAAA,CAAqB,WAAA,EAAa,QAAQ,CAAA;AAClE,EAAA,IAAI,mBAAA,CAAoB,KAAA,EAAO,WAAW,CAAA,EAAG;AAC3C,IAAA,OAAO,kBAAA;AAAA,MACL,KAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAA;AAAA,MACA;AAAA,KACF;AAAA,EACF;AACA,EAAA,OAAO,KAAA;AACT;AAEA,SAAS,iBACP,KAAA,EAC4B;AAC5B,EAAA,OAAO,OAAO,KAAA,KAAU,QAAA,IAAY,CAAC,KAAA,CAAM,QAAQ,KAAK,CAAA;AAC1D;AAEO,SAAS,sBAAA,CACd,OACA,kBAAA,EACA;AACA,EAAA,IAAI,KAAA,IAAS,gBAAA,CAAiB,KAAK,CAAA,EAAG;AACpC,IAAA,KAAA,MAAW,cAAc,kBAAA,EAAoB;AAC3C,MAAA,IAAI,KAAA,CAAM,UAAU,CAAA,IAAK,IAAA,EAAM;AAC7B,QAAA,OAAO,MAAM,UAAU,CAAA;AAAA,MACzB;AAAA,IACF;AACA,IAAA,OAAO,MAAA;AAAA,EACT;AACA,EAAA,OAAO,KAAA;AACT;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useValueEffect.js","sources":["../src/utils/useValueEffect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { type Dispatch, type MutableRefObject, useRef, useState } from \"react\";\nimport { useEventCallback } from \"./useEventCallback\";\nimport { useIsomorphicLayoutEffect } from \"./useIsomorphicLayoutEffect\";\n\ntype SetValueAction<S> = (prev: S) => Generator<any, void, unknown>;\n\n// This hook works like `useState`, but when setting the value, you pass a generator function\n// that can yield multiple values. Each yielded value updates the state and waits for the next\n// layout effect, then continues the generator. This allows sequential updates to state to be\n// written linearly.\nexport function useValueEffect<S>(\n defaultValue: S | (() => S),\n): [S, Dispatch<SetValueAction<S>>] {\n const [value, setValue] = useState(defaultValue);\n const effect: MutableRefObject<Generator<S> | null> =\n useRef<Generator<S> | null>(null);\n\n // Store the function in a ref so we can always access the current version\n // which has the proper `value` in scope.\n const nextRef = useEventCallback(() => {\n if (!effect.current) {\n return;\n }\n // Run the generator to the next yield.\n const newValue = effect.current.next();\n\n // If the generator is done, reset the effect.\n if (newValue.done) {\n effect.current = null;\n return;\n }\n\n // If the value is the same as the current value,\n // then continue to the next yield. Otherwise,\n // set the value in state and wait for the next layout effect.\n if (value === newValue.value) {\n nextRef();\n } else {\n setValue(newValue.value);\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // If there is an effect currently running, continue to the next yield.\n if (effect.current) {\n nextRef();\n }\n });\n\n const queue: Dispatch<SetValueAction<S>> = useEventCallback((fn) => {\n effect.current = fn(value);\n nextRef();\n });\n\n return [value, queue];\n}\n"],"names":["useState","useRef","useEventCallback","useIsomorphicLayoutEffect"],"mappings":";;;;;;AAsBO,SAAS,eACd,
|
|
1
|
+
{"version":3,"file":"useValueEffect.js","sources":["../src/utils/useValueEffect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { type Dispatch, type MutableRefObject, useRef, useState } from \"react\";\nimport { useEventCallback } from \"./useEventCallback\";\nimport { useIsomorphicLayoutEffect } from \"./useIsomorphicLayoutEffect\";\n\ntype SetValueAction<S> = (prev: S) => Generator<any, void, unknown>;\n\n// This hook works like `useState`, but when setting the value, you pass a generator function\n// that can yield multiple values. Each yielded value updates the state and waits for the next\n// layout effect, then continues the generator. This allows sequential updates to state to be\n// written linearly.\nexport function useValueEffect<S>(\n defaultValue: S | (() => S),\n): [S, Dispatch<SetValueAction<S>>] {\n const [value, setValue] = useState(defaultValue);\n const effect: MutableRefObject<Generator<S> | null> =\n useRef<Generator<S> | null>(null);\n\n // Store the function in a ref so we can always access the current version\n // which has the proper `value` in scope.\n const nextRef = useEventCallback(() => {\n if (!effect.current) {\n return;\n }\n // Run the generator to the next yield.\n const newValue = effect.current.next();\n\n // If the generator is done, reset the effect.\n if (newValue.done) {\n effect.current = null;\n return;\n }\n\n // If the value is the same as the current value,\n // then continue to the next yield. Otherwise,\n // set the value in state and wait for the next layout effect.\n if (value === newValue.value) {\n nextRef();\n } else {\n setValue(newValue.value);\n }\n });\n\n useIsomorphicLayoutEffect(() => {\n // If there is an effect currently running, continue to the next yield.\n if (effect.current) {\n nextRef();\n }\n });\n\n const queue: Dispatch<SetValueAction<S>> = useEventCallback((fn) => {\n effect.current = fn(value);\n nextRef();\n });\n\n return [value, queue];\n}\n"],"names":["useState","useRef","useEventCallback","useIsomorphicLayoutEffect"],"mappings":";;;;;;AAsBO,SAAS,eACd,YAAA,EACkC;AAClC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,eAAS,YAAY,CAAA;AAC/C,EAAA,MAAM,MAAA,GACJC,aAA4B,IAAI,CAAA;AAIlC,EAAA,MAAM,OAAA,GAAUC,kCAAiB,MAAM;AACrC,IAAA,IAAI,CAAC,OAAO,OAAA,EAAS;AACnB,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,QAAA,GAAW,MAAA,CAAO,OAAA,CAAQ,IAAA,EAAK;AAGrC,IAAA,IAAI,SAAS,IAAA,EAAM;AACjB,MAAA,MAAA,CAAO,OAAA,GAAU,IAAA;AACjB,MAAA;AAAA,IACF;AAKA,IAAA,IAAI,KAAA,KAAU,SAAS,KAAA,EAAO;AAC5B,MAAA,OAAA,EAAQ;AAAA,IACV,CAAA,MAAO;AACL,MAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAAA,IACzB;AAAA,EACF,CAAC,CAAA;AAED,EAAAC,mDAAA,CAA0B,MAAM;AAE9B,IAAA,IAAI,OAAO,OAAA,EAAS;AAClB,MAAA,OAAA,EAAQ;AAAA,IACV;AAAA,EACF,CAAC,CAAA;AAED,EAAA,MAAM,KAAA,GAAqCD,iCAAA,CAAiB,CAAC,EAAA,KAAO;AAClE,IAAA,MAAA,CAAO,OAAA,GAAU,GAAG,KAAK,CAAA;AACzB,IAAA,OAAA,EAAQ;AAAA,EACV,CAAC,CAAA;AAED,EAAA,OAAO,CAAC,OAAO,KAAK,CAAA;AACtB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubMenuContext.js","sources":["../src/vertical-navigation/SubMenuContext.tsx"],"sourcesContent":["import {\n type Dispatch,\n type ReactNode,\n type SetStateAction,\n useContext,\n useMemo,\n} from \"react\";\nimport { createContext } from \"../utils\";\n\ntype SubMenuContextValue = {\n depth: number;\n iconPaddingCount: number;\n setDirectIcons?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport const SubMenuContext = createContext<SubMenuContextValue>(\n \"SubMenuContext\",\n { depth: -1, iconPaddingCount: 0 },\n);\n\nexport const useSubMenuContext = () => {\n return useContext(SubMenuContext);\n};\n\nexport function SubMenuProvider({\n children,\n directIcons,\n setDirectIcons,\n}: {\n children: ReactNode;\n directIcons: string[];\n setDirectIcons?: Dispatch<SetStateAction<string[]>>;\n}) {\n const { depth, iconPaddingCount } = useSubMenuContext();\n\n const context = useMemo(\n () => ({\n depth: depth + 1,\n iconPaddingCount: iconPaddingCount + (directIcons.length > 0 ? 1 : 0),\n setDirectIcons,\n }),\n [depth, iconPaddingCount, directIcons, setDirectIcons],\n );\n\n return (\n <SubMenuContext.Provider value={context}>\n {children}\n </SubMenuContext.Provider>\n );\n}\n"],"names":["createContext","useContext","useMemo"],"mappings":";;;;;;;;;;;AAeO,MAAM,
|
|
1
|
+
{"version":3,"file":"SubMenuContext.js","sources":["../src/vertical-navigation/SubMenuContext.tsx"],"sourcesContent":["import {\n type Dispatch,\n type ReactNode,\n type SetStateAction,\n useContext,\n useMemo,\n} from \"react\";\nimport { createContext } from \"../utils\";\n\ntype SubMenuContextValue = {\n depth: number;\n iconPaddingCount: number;\n setDirectIcons?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport const SubMenuContext = createContext<SubMenuContextValue>(\n \"SubMenuContext\",\n { depth: -1, iconPaddingCount: 0 },\n);\n\nexport const useSubMenuContext = () => {\n return useContext(SubMenuContext);\n};\n\nexport function SubMenuProvider({\n children,\n directIcons,\n setDirectIcons,\n}: {\n children: ReactNode;\n directIcons: string[];\n setDirectIcons?: Dispatch<SetStateAction<string[]>>;\n}) {\n const { depth, iconPaddingCount } = useSubMenuContext();\n\n const context = useMemo(\n () => ({\n depth: depth + 1,\n iconPaddingCount: iconPaddingCount + (directIcons.length > 0 ? 1 : 0),\n setDirectIcons,\n }),\n [depth, iconPaddingCount, directIcons, setDirectIcons],\n );\n\n return (\n <SubMenuContext.Provider value={context}>\n {children}\n </SubMenuContext.Provider>\n );\n}\n"],"names":["createContext","useContext","useMemo"],"mappings":";;;;;;;;;;;AAeO,MAAM,cAAA,GAAiBA,2BAAA;AAAA,EAC5B,gBAAA;AAAA,EACA,EAAE,KAAA,EAAO,EAAA,EAAI,gBAAA,EAAkB,CAAA;AACjC;AAEO,MAAM,oBAAoB,MAAM;AACrC,EAAA,OAAOC,iBAAW,cAAc,CAAA;AAClC;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,QAAA;AAAA,EACA,WAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,MAAM,EAAE,KAAA,EAAO,gBAAA,EAAiB,GAAI,iBAAA,EAAkB;AAEtD,EAAA,MAAM,OAAA,GAAUC,aAAA;AAAA,IACd,OAAO;AAAA,MACL,OAAO,KAAA,GAAQ,CAAA;AAAA,MACf,gBAAA,EAAkB,gBAAA,IAAoB,WAAA,CAAY,MAAA,GAAS,IAAI,CAAA,GAAI,CAAA,CAAA;AAAA,MACnE;AAAA,KACF,CAAA;AAAA,IACA,CAAC,KAAA,EAAO,gBAAA,EAAkB,WAAA,EAAa,cAAc;AAAA,GACvD;AAEA,EAAA,sCACG,cAAA,CAAe,QAAA,EAAf,EAAwB,KAAA,EAAO,SAC7B,QAAA,EACH,CAAA;AAEJ;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigation.js","sources":["../src/vertical-navigation/VerticalNavigation.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useState } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { SubMenuProvider } from \"./SubMenuContext\";\nimport verticalNavigationCss from \"./VerticalNavigation.css\";\n\nexport interface VerticalNavigationProps\n extends ComponentPropsWithoutRef<\"nav\"> {\n /**\n * The appearance of the tabs. Defaults to \"bordered\".\n */\n appearance?: \"indicator\" | \"bordered\";\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigation\");\n\nexport const VerticalNavigation = forwardRef<\n HTMLElement,\n VerticalNavigationProps\n>(function VerticalNavigation(props, ref) {\n const { appearance = \"bordered\", children, className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation\",\n css: verticalNavigationCss,\n window: targetWindow,\n });\n\n const [directIcons, setDirectIcons] = useState<string[]>([]);\n\n return (\n <SubMenuProvider directIcons={directIcons} setDirectIcons={setDirectIcons}>\n <nav\n ref={ref}\n className={clsx(withBaseName(), withBaseName(appearance), className)}\n {...rest}\n >\n <ol data-has-direct-icons={directIcons.length > 0}>{children}</ol>\n </nav>\n </SubMenuProvider>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigation","useWindow","useComponentCssInjection","verticalNavigationCss","useState","jsx","SubMenuProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,wBAAwB,CAAA;AAEnD,MAAM,
|
|
1
|
+
{"version":3,"file":"VerticalNavigation.js","sources":["../src/vertical-navigation/VerticalNavigation.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useState } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { SubMenuProvider } from \"./SubMenuContext\";\nimport verticalNavigationCss from \"./VerticalNavigation.css\";\n\nexport interface VerticalNavigationProps\n extends ComponentPropsWithoutRef<\"nav\"> {\n /**\n * The appearance of the tabs. Defaults to \"bordered\".\n */\n appearance?: \"indicator\" | \"bordered\";\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigation\");\n\nexport const VerticalNavigation = forwardRef<\n HTMLElement,\n VerticalNavigationProps\n>(function VerticalNavigation(props, ref) {\n const { appearance = \"bordered\", children, className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation\",\n css: verticalNavigationCss,\n window: targetWindow,\n });\n\n const [directIcons, setDirectIcons] = useState<string[]>([]);\n\n return (\n <SubMenuProvider directIcons={directIcons} setDirectIcons={setDirectIcons}>\n <nav\n ref={ref}\n className={clsx(withBaseName(), withBaseName(appearance), className)}\n {...rest}\n >\n <ol data-has-direct-icons={directIcons.length > 0}>{children}</ol>\n </nav>\n </SubMenuProvider>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigation","useWindow","useComponentCssInjection","verticalNavigationCss","useState","jsx","SubMenuProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAA,GAAqBC,gBAAA,CAGhC,SAASC,mBAAAA,CAAmB,OAAO,GAAA,EAAK;AACxC,EAAA,MAAM,EAAE,UAAA,GAAa,UAAA,EAAY,UAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAElE,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,0BAAA;AAAA,IACR,GAAA,EAAKC,oBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIC,cAAA,CAAmB,EAAE,CAAA;AAE3D,EAAA,uBACEC,cAAA,CAACC,8BAAA,EAAA,EAAgB,WAAA,EAA0B,cAAA,EACzC,QAAA,kBAAAD,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAWE,SAAA,CAAK,YAAA,IAAgB,YAAA,CAAa,UAAU,GAAG,SAAS,CAAA;AAAA,MAClE,GAAG,IAAA;AAAA,MAEJ,yCAAC,IAAA,EAAA,EAAG,uBAAA,EAAuB,WAAA,CAAY,MAAA,GAAS,GAAI,QAAA,EAAS;AAAA;AAAA,GAC/D,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationItem.js","sources":["../src/vertical-navigation/VerticalNavigationItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type Dispatch,\n forwardRef,\n type SetStateAction,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport { createContext, makePrefixer } from \"../utils\";\nimport { useSubMenuContext } from \"./SubMenuContext\";\n\nexport interface VerticalNavigationItemProps\n extends ComponentPropsWithoutRef<\"li\"> {\n active?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItem\");\n\ntype VerticalNavigationItemContextType = {\n active: boolean;\n focusVisible: boolean;\n setFocusVisible: Dispatch<SetStateAction<boolean>>;\n};\n\nconst VerticalNavigationItemContext =\n createContext<VerticalNavigationItemContextType>(\n \"saltVerticalNavigationItemContext\",\n {\n active: false,\n focusVisible: false,\n setFocusVisible: () => {},\n },\n );\n\nexport function useVerticalNavigationItem() {\n return useContext(VerticalNavigationItemContext);\n}\n\nexport const VerticalNavigationItem = forwardRef<\n HTMLLIElement,\n VerticalNavigationItemProps\n>(function VerticalNavigationItem(props, ref) {\n const { children, className, active = false, style, ...rest } = props;\n\n const { depth } = useSubMenuContext();\n const [focusVisible, setFocusVisible] = useState(false);\n\n const context = useMemo(\n () => ({\n active,\n focusVisible,\n setFocusVisible,\n }),\n [active, focusVisible],\n );\n\n return (\n <VerticalNavigationItemContext.Provider value={context}>\n <li\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={\n { \"--verticalNavigationItem-depth\": depth, ...style } as CSSProperties\n }\n {...rest}\n >\n {children}\n </li>\n </VerticalNavigationItemContext.Provider>\n );\n});\n"],"names":["makePrefixer","createContext","useContext","forwardRef","VerticalNavigationItem","useSubMenuContext","useState","useMemo","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,4BAA4B,CAAA;AAQ9D,MAAM,
|
|
1
|
+
{"version":3,"file":"VerticalNavigationItem.js","sources":["../src/vertical-navigation/VerticalNavigationItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type Dispatch,\n forwardRef,\n type SetStateAction,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport { createContext, makePrefixer } from \"../utils\";\nimport { useSubMenuContext } from \"./SubMenuContext\";\n\nexport interface VerticalNavigationItemProps\n extends ComponentPropsWithoutRef<\"li\"> {\n active?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItem\");\n\ntype VerticalNavigationItemContextType = {\n active: boolean;\n focusVisible: boolean;\n setFocusVisible: Dispatch<SetStateAction<boolean>>;\n};\n\nconst VerticalNavigationItemContext =\n createContext<VerticalNavigationItemContextType>(\n \"saltVerticalNavigationItemContext\",\n {\n active: false,\n focusVisible: false,\n setFocusVisible: () => {},\n },\n );\n\nexport function useVerticalNavigationItem() {\n return useContext(VerticalNavigationItemContext);\n}\n\nexport const VerticalNavigationItem = forwardRef<\n HTMLLIElement,\n VerticalNavigationItemProps\n>(function VerticalNavigationItem(props, ref) {\n const { children, className, active = false, style, ...rest } = props;\n\n const { depth } = useSubMenuContext();\n const [focusVisible, setFocusVisible] = useState(false);\n\n const context = useMemo(\n () => ({\n active,\n focusVisible,\n setFocusVisible,\n }),\n [active, focusVisible],\n );\n\n return (\n <VerticalNavigationItemContext.Provider value={context}>\n <li\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={\n { \"--verticalNavigationItem-depth\": depth, ...style } as CSSProperties\n }\n {...rest}\n >\n {children}\n </li>\n </VerticalNavigationItemContext.Provider>\n );\n});\n"],"names":["makePrefixer","createContext","useContext","forwardRef","VerticalNavigationItem","useSubMenuContext","useState","useMemo","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,4BAA4B,CAAA;AAQ9D,MAAM,6BAAA,GACJC,2BAAA;AAAA,EACE,mCAAA;AAAA,EACA;AAAA,IACE,MAAA,EAAQ,KAAA;AAAA,IACR,YAAA,EAAc,KAAA;AAAA,IACd,iBAAiB,MAAM;AAAA,IAAC;AAAA;AAE5B,CAAA;AAEK,SAAS,yBAAA,GAA4B;AAC1C,EAAA,OAAOC,iBAAW,6BAA6B,CAAA;AACjD;AAEO,MAAM,sBAAA,GAAyBC,gBAAA,CAGpC,SAASC,uBAAAA,CAAuB,OAAO,GAAA,EAAK;AAC5C,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,MAAA,GAAS,OAAO,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEhE,EAAA,MAAM,EAAE,KAAA,EAAM,GAAIC,gCAAA,EAAkB;AACpC,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIC,eAAS,KAAK,CAAA;AAEtD,EAAA,MAAM,OAAA,GAAUC,aAAA;AAAA,IACd,OAAO;AAAA,MACL,MAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA,CAAC,QAAQ,YAAY;AAAA,GACvB;AAEA,EAAA,uBACEC,cAAA,CAAC,6BAAA,CAA8B,QAAA,EAA9B,EAAuC,OAAO,OAAA,EAC7C,QAAA,kBAAAA,cAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,KAAA,EACE,EAAE,gCAAA,EAAkC,KAAA,EAAO,GAAG,KAAA,EAAM;AAAA,MAErD,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH,EACF,CAAA;AAEJ,CAAC;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationItemContent.js","sources":["../src/vertical-navigation/VerticalNavigationItemContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { makePrefixer, useForkRef, useId } from \"../utils\";\nimport { useSubMenuContext } from \"./SubMenuContext\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemContentCss from \"./VerticalNavigationItemContent.css\";\n\nexport interface VerticalNavigationItemContentProps\n extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemContent\");\n\nexport const VerticalNavigationItemContent = forwardRef<\n HTMLSpanElement,\n VerticalNavigationItemContentProps\n>(function VerticalNavigationItemContent(props, ref) {\n const { children, className, style, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-content\",\n css: verticalNavigationItemContentCss,\n window: targetWindow,\n });\n\n const containerRef = useRef<HTMLSpanElement>(null);\n const handleRef = useForkRef(ref, containerRef);\n\n const { active, focusVisible } = useVerticalNavigationItem();\n const { setDirectIcons, iconPaddingCount } = useSubMenuContext();\n const [hasIcon, setHasIcon] = useState(false);\n\n const iconId = useId();\n\n useEffect(() => {\n const checkForIcons = () => {\n const iconElement = containerRef.current?.querySelector<HTMLElement>(\n \".saltIcon ~ .saltVerticalNavigationItemLabel\",\n );\n\n setHasIcon(Boolean(iconElement));\n if (iconElement && iconId && setDirectIcons) {\n setDirectIcons((icons) => {\n if (!icons.includes(iconId)) {\n return icons.concat(iconId);\n }\n return icons;\n });\n } else if (!iconElement && iconId && setDirectIcons) {\n setDirectIcons((icons) => icons.filter((id) => id !== iconId));\n }\n };\n\n const mutationObserver = new MutationObserver(() => {\n checkForIcons();\n });\n checkForIcons();\n\n if (containerRef.current) {\n mutationObserver.observe(containerRef.current, {\n childList: true,\n subtree: true,\n });\n }\n\n return () => {\n mutationObserver.disconnect();\n };\n }, [iconId, setDirectIcons]);\n\n return (\n <span\n ref={handleRef}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"active\")]: active,\n [withBaseName(\"focused\")]: focusVisible,\n },\n className,\n )}\n style={\n {\n \"--saltVerticalNavigationItem-iconPaddingMultiplier\": hasIcon\n ? iconPaddingCount - 1\n : iconPaddingCount,\n ...style,\n } as CSSProperties\n }\n {...rest}\n >\n {children}\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationItemContent","useWindow","useComponentCssInjection","verticalNavigationItemContentCss","useRef","useForkRef","useVerticalNavigationItem","useSubMenuContext","useState","useId","useEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,mCAAmC,CAAA;AAE9D,MAAM,
|
|
1
|
+
{"version":3,"file":"VerticalNavigationItemContent.js","sources":["../src/vertical-navigation/VerticalNavigationItemContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { makePrefixer, useForkRef, useId } from \"../utils\";\nimport { useSubMenuContext } from \"./SubMenuContext\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemContentCss from \"./VerticalNavigationItemContent.css\";\n\nexport interface VerticalNavigationItemContentProps\n extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemContent\");\n\nexport const VerticalNavigationItemContent = forwardRef<\n HTMLSpanElement,\n VerticalNavigationItemContentProps\n>(function VerticalNavigationItemContent(props, ref) {\n const { children, className, style, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-content\",\n css: verticalNavigationItemContentCss,\n window: targetWindow,\n });\n\n const containerRef = useRef<HTMLSpanElement>(null);\n const handleRef = useForkRef(ref, containerRef);\n\n const { active, focusVisible } = useVerticalNavigationItem();\n const { setDirectIcons, iconPaddingCount } = useSubMenuContext();\n const [hasIcon, setHasIcon] = useState(false);\n\n const iconId = useId();\n\n useEffect(() => {\n const checkForIcons = () => {\n const iconElement = containerRef.current?.querySelector<HTMLElement>(\n \".saltIcon ~ .saltVerticalNavigationItemLabel\",\n );\n\n setHasIcon(Boolean(iconElement));\n if (iconElement && iconId && setDirectIcons) {\n setDirectIcons((icons) => {\n if (!icons.includes(iconId)) {\n return icons.concat(iconId);\n }\n return icons;\n });\n } else if (!iconElement && iconId && setDirectIcons) {\n setDirectIcons((icons) => icons.filter((id) => id !== iconId));\n }\n };\n\n const mutationObserver = new MutationObserver(() => {\n checkForIcons();\n });\n checkForIcons();\n\n if (containerRef.current) {\n mutationObserver.observe(containerRef.current, {\n childList: true,\n subtree: true,\n });\n }\n\n return () => {\n mutationObserver.disconnect();\n };\n }, [iconId, setDirectIcons]);\n\n return (\n <span\n ref={handleRef}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"active\")]: active,\n [withBaseName(\"focused\")]: focusVisible,\n },\n className,\n )}\n style={\n {\n \"--saltVerticalNavigationItem-iconPaddingMultiplier\": hasIcon\n ? iconPaddingCount - 1\n : iconPaddingCount,\n ...style,\n } as CSSProperties\n }\n {...rest}\n >\n {children}\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationItemContent","useWindow","useComponentCssInjection","verticalNavigationItemContentCss","useRef","useForkRef","useVerticalNavigationItem","useSubMenuContext","useState","useId","useEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,mCAAmC,CAAA;AAE9D,MAAM,6BAAA,GAAgCC,gBAAA,CAG3C,SAASC,8BAAAA,CAA8B,OAAO,GAAA,EAAK;AACnD,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEhD,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uCAAA;AAAA,IACR,GAAA,EAAKC,+BAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,YAAA,GAAeC,aAAwB,IAAI,CAAA;AACjD,EAAA,MAAM,SAAA,GAAYC,qBAAA,CAAW,GAAA,EAAK,YAAY,CAAA;AAE9C,EAAA,MAAM,EAAE,MAAA,EAAQ,YAAA,EAAa,GAAIC,gDAAA,EAA0B;AAC3D,EAAA,MAAM,EAAE,cAAA,EAAgB,gBAAA,EAAiB,GAAIC,gCAAA,EAAkB;AAC/D,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIC,eAAS,KAAK,CAAA;AAE5C,EAAA,MAAM,SAASC,WAAA,EAAM;AAErB,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,gBAAgB,MAAM;AA5ChC,MAAA,IAAA,EAAA;AA6CM,MAAA,MAAM,WAAA,GAAA,CAAc,EAAA,GAAA,YAAA,CAAa,OAAA,KAAb,IAAA,GAAA,MAAA,GAAA,EAAA,CAAsB,aAAA;AAAA,QACxC;AAAA,OAAA;AAGF,MAAA,UAAA,CAAW,OAAA,CAAQ,WAAW,CAAC,CAAA;AAC/B,MAAA,IAAI,WAAA,IAAe,UAAU,cAAA,EAAgB;AAC3C,QAAA,cAAA,CAAe,CAAC,KAAA,KAAU;AACxB,UAAA,IAAI,CAAC,KAAA,CAAM,QAAA,CAAS,MAAM,CAAA,EAAG;AAC3B,YAAA,OAAO,KAAA,CAAM,OAAO,MAAM,CAAA;AAAA,UAC5B;AACA,UAAA,OAAO,KAAA;AAAA,QACT,CAAC,CAAA;AAAA,MACH,CAAA,MAAA,IAAW,CAAC,WAAA,IAAe,MAAA,IAAU,cAAA,EAAgB;AACnD,QAAA,cAAA,CAAe,CAAC,UAAU,KAAA,CAAM,MAAA,CAAO,CAAC,EAAA,KAAO,EAAA,KAAO,MAAM,CAAC,CAAA;AAAA,MAC/D;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,gBAAA,GAAmB,IAAI,gBAAA,CAAiB,MAAM;AAClD,MAAA,aAAA,EAAc;AAAA,IAChB,CAAC,CAAA;AACD,IAAA,aAAA,EAAc;AAEd,IAAA,IAAI,aAAa,OAAA,EAAS;AACxB,MAAA,gBAAA,CAAiB,OAAA,CAAQ,aAAa,OAAA,EAAS;AAAA,QAC7C,SAAA,EAAW,IAAA;AAAA,QACX,OAAA,EAAS;AAAA,OACV,CAAA;AAAA,IACH;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,gBAAA,CAAiB,UAAA,EAAW;AAAA,IAC9B,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,MAAA,EAAQ,cAAc,CAAC,CAAA;AAE3B,EAAA,uBACEC,cAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAWC,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA;AAAA,UAC1B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG;AAAA,SAC7B;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EACE;AAAA,QACE,oDAAA,EAAsD,OAAA,GAClD,gBAAA,GAAmB,CAAA,GACnB,gBAAA;AAAA,QACJ,GAAG;AAAA,OACL;AAAA,MAED,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationItemExpansionIcon.js","sources":["../src/vertical-navigation/VerticalNavigationItemExpansionIcon.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { useCollapsibleContext } from \"../collapsible/CollapsibleContext\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemExpansionIcon\");\n\nexport const VerticalNavigationItemExpansionIcon = (props: IconProps) => {\n const { className, ...rest } = props;\n const { CollapseIcon, ExpandIcon } = useIcon();\n const iconExpansionMap = {\n expanded: CollapseIcon,\n collapsed: ExpandIcon,\n };\n\n const { open } = useCollapsibleContext();\n\n const Icon = iconExpansionMap[open ? \"expanded\" : \"collapsed\"];\n return (\n <Icon\n className={clsx(withBaseName(), className)}\n aria-hidden=\"true\"\n {...rest}\n />\n );\n};\n"],"names":["makePrefixer","useIcon","useCollapsibleContext","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,0BAAa,yCAAyC,CAAA;
|
|
1
|
+
{"version":3,"file":"VerticalNavigationItemExpansionIcon.js","sources":["../src/vertical-navigation/VerticalNavigationItemExpansionIcon.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { useCollapsibleContext } from \"../collapsible/CollapsibleContext\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemExpansionIcon\");\n\nexport const VerticalNavigationItemExpansionIcon = (props: IconProps) => {\n const { className, ...rest } = props;\n const { CollapseIcon, ExpandIcon } = useIcon();\n const iconExpansionMap = {\n expanded: CollapseIcon,\n collapsed: ExpandIcon,\n };\n\n const { open } = useCollapsibleContext();\n\n const Icon = iconExpansionMap[open ? \"expanded\" : \"collapsed\"];\n return (\n <Icon\n className={clsx(withBaseName(), className)}\n aria-hidden=\"true\"\n {...rest}\n />\n );\n};\n"],"names":["makePrefixer","useIcon","useCollapsibleContext","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,0BAAa,yCAAyC,CAAA;AAEpE,MAAM,mCAAA,GAAsC,CAAC,KAAA,KAAqB;AACvE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAC/B,EAAA,MAAM,EAAE,YAAA,EAAc,UAAA,EAAW,GAAIC,4BAAA,EAAQ;AAC7C,EAAA,MAAM,gBAAA,GAAmB;AAAA,IACvB,QAAA,EAAU,YAAA;AAAA,IACV,SAAA,EAAW;AAAA,GACb;AAEA,EAAA,MAAM,EAAE,IAAA,EAAK,GAAIC,wCAAA,EAAsB;AAEvC,EAAA,MAAM,IAAA,GAAO,gBAAA,CAAiB,IAAA,GAAO,UAAA,GAAa,WAAW,CAAA;AAC7D,EAAA,uBACEC,cAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,aAAA,EAAY,MAAA;AAAA,MACX,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationItemLabel.js","sources":["../src/vertical-navigation/VerticalNavigationItemLabel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport verticalNavigationItemLabelCss from \"./VerticalNavigationItemLabel.css\";\n\nexport interface VerticalNavigationItemLabelProps\n extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemLabel\");\n\nexport const VerticalNavigationItemLabel = forwardRef<\n HTMLSpanElement,\n VerticalNavigationItemLabelProps\n>(function VerticalNavigationItemLabel(props, ref) {\n const { children, className, ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-label\",\n css: verticalNavigationItemLabelCss,\n window: targetWindow,\n });\n\n return (\n <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n {children}\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationItemLabel","useWindow","useComponentCssInjection","verticalNavigationItemLabelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,iCAAiC,CAAA;AAE5D,MAAM,
|
|
1
|
+
{"version":3,"file":"VerticalNavigationItemLabel.js","sources":["../src/vertical-navigation/VerticalNavigationItemLabel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport verticalNavigationItemLabelCss from \"./VerticalNavigationItemLabel.css\";\n\nexport interface VerticalNavigationItemLabelProps\n extends ComponentPropsWithoutRef<\"span\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemLabel\");\n\nexport const VerticalNavigationItemLabel = forwardRef<\n HTMLSpanElement,\n VerticalNavigationItemLabelProps\n>(function VerticalNavigationItemLabel(props, ref) {\n const { children, className, ...rest } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-label\",\n css: verticalNavigationItemLabelCss,\n window: targetWindow,\n });\n\n return (\n <span className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n {children}\n </span>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationItemLabel","useWindow","useComponentCssInjection","verticalNavigationItemLabelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,iCAAiC,CAAA;AAE5D,MAAM,2BAAA,GAA8BC,gBAAA,CAGzC,SAASC,4BAAAA,CAA4B,OAAO,GAAA,EAAK;AACjD,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AACzC,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,qCAAA;AAAA,IACR,GAAA,EAAKC,6BAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACEC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC7D,QAAA,EACH,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationItemTrigger.js","sources":["../src/vertical-navigation/VerticalNavigationItemTrigger.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEvent,\n forwardRef,\n type MouseEvent,\n useRef,\n} from \"react\";\nimport { makePrefixer, type RenderPropsType, renderProps } from \"../utils\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemTriggerCss from \"./VerticalNavigationItemTrigger.css\";\n\n// biome-ignore lint/suspicious/noExplicitAny: We don't know the exact type here\nfunction ItemAction(props: ComponentPropsWithoutRef<any>) {\n return renderProps(\"a\", props);\n}\n\nexport interface VerticalNavigationItemTriggerProps\n extends ComponentPropsWithoutRef<\"a\"> {\n render?: RenderPropsType[\"render\"];\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemTrigger\");\n\nexport const VerticalNavigationItemTrigger = forwardRef<\n HTMLAnchorElement,\n VerticalNavigationItemTriggerProps\n>(function VerticalNavigationItemTrigger(props, ref) {\n const {\n className,\n children,\n render,\n href,\n onFocus,\n onBlur,\n onMouseDown,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-trigger\",\n css: verticalNavigationItemTriggerCss,\n window: targetWindow,\n });\n\n const isLink = href != null;\n const { active, setFocusVisible } = useVerticalNavigationItem();\n\n const wasMouseDownRef = useRef(false);\n\n const handleFocus = (event: FocusEvent<never>) => {\n if (!wasMouseDownRef.current) {\n setFocusVisible(true);\n }\n wasMouseDownRef.current = false;\n onFocus?.(event);\n };\n\n const handleBlur = (event: FocusEvent<never>) => {\n setFocusVisible(false);\n onBlur?.(event);\n };\n\n const handleMouseDown = (event: MouseEvent<never>) => {\n wasMouseDownRef.current = true;\n onMouseDown?.(event);\n };\n\n return (\n <ItemAction\n className={clsx(withBaseName(), className)}\n href={href}\n aria-current={active ? \"page\" : undefined}\n render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n ref={ref}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onMouseDown={handleMouseDown}\n {...rest}\n >\n {children}\n </ItemAction>\n );\n});\n"],"names":["renderProps","makePrefixer","forwardRef","VerticalNavigationItemTrigger","useWindow","useComponentCssInjection","verticalNavigationItemTriggerCss","useVerticalNavigationItem","useRef","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;AAeA,SAAS,WAAW,
|
|
1
|
+
{"version":3,"file":"VerticalNavigationItemTrigger.js","sources":["../src/vertical-navigation/VerticalNavigationItemTrigger.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEvent,\n forwardRef,\n type MouseEvent,\n useRef,\n} from \"react\";\nimport { makePrefixer, type RenderPropsType, renderProps } from \"../utils\";\nimport { useVerticalNavigationItem } from \"./VerticalNavigationItem\";\nimport verticalNavigationItemTriggerCss from \"./VerticalNavigationItemTrigger.css\";\n\n// biome-ignore lint/suspicious/noExplicitAny: We don't know the exact type here\nfunction ItemAction(props: ComponentPropsWithoutRef<any>) {\n return renderProps(\"a\", props);\n}\n\nexport interface VerticalNavigationItemTriggerProps\n extends ComponentPropsWithoutRef<\"a\"> {\n render?: RenderPropsType[\"render\"];\n}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationItemTrigger\");\n\nexport const VerticalNavigationItemTrigger = forwardRef<\n HTMLAnchorElement,\n VerticalNavigationItemTriggerProps\n>(function VerticalNavigationItemTrigger(props, ref) {\n const {\n className,\n children,\n render,\n href,\n onFocus,\n onBlur,\n onMouseDown,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-item-trigger\",\n css: verticalNavigationItemTriggerCss,\n window: targetWindow,\n });\n\n const isLink = href != null;\n const { active, setFocusVisible } = useVerticalNavigationItem();\n\n const wasMouseDownRef = useRef(false);\n\n const handleFocus = (event: FocusEvent<never>) => {\n if (!wasMouseDownRef.current) {\n setFocusVisible(true);\n }\n wasMouseDownRef.current = false;\n onFocus?.(event);\n };\n\n const handleBlur = (event: FocusEvent<never>) => {\n setFocusVisible(false);\n onBlur?.(event);\n };\n\n const handleMouseDown = (event: MouseEvent<never>) => {\n wasMouseDownRef.current = true;\n onMouseDown?.(event);\n };\n\n return (\n <ItemAction\n className={clsx(withBaseName(), className)}\n href={href}\n aria-current={active ? \"page\" : undefined}\n render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n ref={ref}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onMouseDown={handleMouseDown}\n {...rest}\n >\n {children}\n </ItemAction>\n );\n});\n"],"names":["renderProps","makePrefixer","forwardRef","VerticalNavigationItemTrigger","useWindow","useComponentCssInjection","verticalNavigationItemTriggerCss","useVerticalNavigationItem","useRef","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;AAeA,SAAS,WAAW,KAAA,EAAsC;AACxD,EAAA,OAAOA,uBAAA,CAAY,KAAK,KAAK,CAAA;AAC/B;AAOA,MAAM,YAAA,GAAeC,0BAAa,mCAAmC,CAAA;AAE9D,MAAM,6BAAA,GAAgCC,gBAAA,CAG3C,SAASC,8BAAAA,CAA8B,OAAO,GAAA,EAAK;AACnD,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uCAAA;AAAA,IACR,GAAA,EAAKC,+BAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAS,IAAA,IAAQ,IAAA;AACvB,EAAA,MAAM,EAAE,MAAA,EAAQ,eAAA,EAAgB,GAAIC,gDAAA,EAA0B;AAE9D,EAAA,MAAM,eAAA,GAAkBC,aAAO,KAAK,CAAA;AAEpC,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6B;AAChD,IAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,MAAA,eAAA,CAAgB,IAAI,CAAA;AAAA,IACtB;AACA,IAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAC1B,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAA6B;AAC/C,IAAA,eAAA,CAAgB,KAAK,CAAA;AACrB,IAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,EACX,CAAA;AAEA,EAAA,MAAM,eAAA,GAAkB,CAAC,KAAA,KAA6B;AACpD,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,KAAA,CAAA;AAAA,EAChB,CAAA;AAEA,EAAA,uBACEC,cAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,cAAA,EAAc,SAAS,MAAA,GAAS,MAAA;AAAA,MAChC,QAAQ,MAAA,KAAW,MAAA,GAAS,yBAAYD,cAAA,CAAC,QAAA,EAAA,EAAO,MAAK,QAAA,EAAS,CAAA,CAAA;AAAA,MAC9D,GAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MACT,MAAA,EAAQ,UAAA;AAAA,MACR,WAAA,EAAa,eAAA;AAAA,MACZ,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerticalNavigationSubMenu.js","sources":["../src/vertical-navigation/VerticalNavigationSubMenu.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useState } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { SubMenuProvider } from \"./SubMenuContext\";\nimport verticalNavigationSubMenuCss from \"./VerticalNavigationSubMenu.css\";\n\nexport interface VerticalNavigationSubMenuProps\n extends ComponentPropsWithoutRef<\"ul\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationSubMenu\");\n\nexport const VerticalNavigationSubMenu = forwardRef<\n HTMLUListElement,\n VerticalNavigationSubMenuProps\n>(function VerticalNavigationSubMenu(props, ref) {\n const { children, className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-sub-menu\",\n css: verticalNavigationSubMenuCss,\n window: targetWindow,\n });\n\n const [directIcons, setDirectIcons] = useState<string[]>([]);\n\n return (\n <SubMenuProvider directIcons={directIcons} setDirectIcons={setDirectIcons}>\n <ul\n ref={ref}\n className={clsx(withBaseName(), className)}\n data-has-direct-icons={directIcons.length > 0}\n {...rest}\n >\n {children}\n </ul>\n </SubMenuProvider>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationSubMenu","useWindow","useComponentCssInjection","verticalNavigationSubMenuCss","useState","jsx","SubMenuProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,+BAA+B,CAAA;AAE1D,MAAM,
|
|
1
|
+
{"version":3,"file":"VerticalNavigationSubMenu.js","sources":["../src/vertical-navigation/VerticalNavigationSubMenu.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef, useState } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { SubMenuProvider } from \"./SubMenuContext\";\nimport verticalNavigationSubMenuCss from \"./VerticalNavigationSubMenu.css\";\n\nexport interface VerticalNavigationSubMenuProps\n extends ComponentPropsWithoutRef<\"ul\"> {}\n\nconst withBaseName = makePrefixer(\"saltVerticalNavigationSubMenu\");\n\nexport const VerticalNavigationSubMenu = forwardRef<\n HTMLUListElement,\n VerticalNavigationSubMenuProps\n>(function VerticalNavigationSubMenu(props, ref) {\n const { children, className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-vertical-navigation-sub-menu\",\n css: verticalNavigationSubMenuCss,\n window: targetWindow,\n });\n\n const [directIcons, setDirectIcons] = useState<string[]>([]);\n\n return (\n <SubMenuProvider directIcons={directIcons} setDirectIcons={setDirectIcons}>\n <ul\n ref={ref}\n className={clsx(withBaseName(), className)}\n data-has-direct-icons={directIcons.length > 0}\n {...rest}\n >\n {children}\n </ul>\n </SubMenuProvider>\n );\n});\n"],"names":["makePrefixer","forwardRef","VerticalNavigationSubMenu","useWindow","useComponentCssInjection","verticalNavigationSubMenuCss","useState","jsx","SubMenuProvider","clsx"],"mappings":";;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,+BAA+B,CAAA;AAE1D,MAAM,yBAAA,GAA4BC,gBAAA,CAGvC,SAASC,0BAAAA,CAA0B,OAAO,GAAA,EAAK;AAC/C,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,mCAAA;AAAA,IACR,GAAA,EAAKC,2BAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIC,cAAA,CAAmB,EAAE,CAAA;AAE3D,EAAA,uBACEC,cAAA,CAACC,8BAAA,EAAA,EAAgB,WAAA,EAA0B,cAAA,EACzC,QAAA,kBAAAD,cAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAWE,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,uBAAA,EAAuB,YAAY,MAAA,GAAS,CAAA;AAAA,MAC3C,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n const existingViewport = useContext(ViewportContext);\n const [viewport, setViewport] = useState(existingViewport);\n\n const noExistingViewport = existingViewport === null;\n const viewportValue = existingViewport || viewport || 0;\n\n useIsomorphicLayoutEffect(() => {\n let observer: ResizeObserver | null = null;\n\n if (noExistingViewport) {\n observer = new ResizeObserver(\n (observerEntries: ResizeObserverEntry[]) => {\n setViewport(observerEntries[0].contentRect.width);\n },\n );\n\n observer.observe(document.body);\n setViewport(document.body.getBoundingClientRect().width);\n }\n\n return () => {\n if (observer) {\n observer.disconnect();\n }\n };\n }, [noExistingViewport]);\n\n return (\n <ViewportContext.Provider value={viewportValue}>\n {children}\n </ViewportContext.Provider>\n );\n};\n\nconst useViewport = (): number => {\n const value = useContext(ViewportContext);\n return value === null ? 0 : value;\n};\n\nexport { ViewportProvider, ViewportContext, useViewport };\n"],"names":["createContext","useContext","useState","useIsomorphicLayoutEffect"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"ViewportProvider.js","sources":["../src/viewport/ViewportProvider.tsx"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\n\nconst ViewportContext = createContext<number | null>(null);\n\ntype ViewportProviderProps = {\n children?: ReactNode;\n};\n\nconst ViewportProvider = ({ children }: ViewportProviderProps) => {\n // Get value directly from the ViewportContext so we can detect if the value is null (no inherited ViewportProvider)\n const existingViewport = useContext(ViewportContext);\n const [viewport, setViewport] = useState(existingViewport);\n\n const noExistingViewport = existingViewport === null;\n const viewportValue = existingViewport || viewport || 0;\n\n useIsomorphicLayoutEffect(() => {\n let observer: ResizeObserver | null = null;\n\n if (noExistingViewport) {\n observer = new ResizeObserver(\n (observerEntries: ResizeObserverEntry[]) => {\n setViewport(observerEntries[0].contentRect.width);\n },\n );\n\n observer.observe(document.body);\n setViewport(document.body.getBoundingClientRect().width);\n }\n\n return () => {\n if (observer) {\n observer.disconnect();\n }\n };\n }, [noExistingViewport]);\n\n return (\n <ViewportContext.Provider value={viewportValue}>\n {children}\n </ViewportContext.Provider>\n );\n};\n\nconst useViewport = (): number => {\n const value = useContext(ViewportContext);\n return value === null ? 0 : value;\n};\n\nexport { ViewportProvider, ViewportContext, useViewport };\n"],"names":["createContext","useContext","useState","useIsomorphicLayoutEffect"],"mappings":";;;;;;AAGA,MAAM,eAAA,GAAkBA,oBAA6B,IAAI;AAMzD,MAAM,gBAAA,GAAmB,CAAC,EAAE,QAAA,EAAS,KAA6B;AAEhE,EAAA,MAAM,gBAAA,GAAmBC,iBAAW,eAAe,CAAA;AACnD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIC,eAAS,gBAAgB,CAAA;AAEzD,EAAA,MAAM,qBAAqB,gBAAA,KAAqB,IAAA;AAChD,EAAA,MAAM,aAAA,GAAgB,oBAAoB,QAAA,IAAY,CAAA;AAEtD,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,QAAA,GAAkC,IAAA;AAEtC,IAAA,IAAI,kBAAA,EAAoB;AACtB,MAAA,QAAA,GAAW,IAAI,cAAA;AAAA,QACb,CAAC,eAAA,KAA2C;AAC1C,UAAA,WAAA,CAAY,eAAA,CAAgB,CAAC,CAAA,CAAE,WAAA,CAAY,KAAK,CAAA;AAAA,QAClD;AAAA,OACF;AAEA,MAAA,QAAA,CAAS,OAAA,CAAQ,SAAS,IAAI,CAAA;AAC9B,MAAA,WAAA,CAAY,QAAA,CAAS,IAAA,CAAK,qBAAA,EAAsB,CAAE,KAAK,CAAA;AAAA,IACzD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,QAAA,EAAU;AACZ,QAAA,QAAA,CAAS,UAAA,EAAW;AAAA,MACtB;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,kBAAkB,CAAC,CAAA;AAEvB,EAAA,sCACG,eAAA,CAAgB,QAAA,EAAhB,EAAyB,KAAA,EAAO,eAC9B,QAAA,EACH,CAAA;AAEJ;AAEA,MAAM,cAAc,MAAc;AAChC,EAAA,MAAM,KAAA,GAAQF,iBAAW,eAAe,CAAA;AACxC,EAAA,OAAO,KAAA,KAAU,OAAO,CAAA,GAAI,KAAA;AAC9B;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type SyntheticEvent,\n useState,\n} from \"react\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport accordionCss from \"./Accordion.css\";\nimport { AccordionContext } from \"./AccordionContext\";\nexport interface AccordionProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onToggle\"> {\n /**\n * AccordionGroup value.\n */\n value: string;\n /**\n * Whether the accordion is expanded.\n */\n expanded?: boolean;\n /**\n * Whether the accordion is expanded by default.\n */\n defaultExpanded?: boolean;\n /**\n * Side to align the Accordion's indicator. Defaults to `left`.\n */\n indicatorSide?: \"left\" | \"right\";\n /**\n * Callback fired when the accordion is toggled.\n */\n onToggle?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * Whether the accordion is disabled.\n */\n disabled?: boolean;\n /**\n * The status of the accordion.\n */\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion(props, ref) {\n const {\n className,\n defaultExpanded,\n expanded: expandedProp,\n disabled,\n indicatorSide = \"left\",\n id: idProp,\n onToggle,\n status,\n value,\n ...rest\n } = props;\n\n const id = useId(idProp);\n const [headerId, setHeaderId] = useState(`${id}-header`);\n const [panelId, setPanelId] = useState(`${id}-panel`);\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion\",\n css: accordionCss,\n window: targetWindow,\n });\n\n const [expanded, setExpanded] = useControlled({\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n name: \"Accordion\",\n state: \"expanded\",\n });\n\n const toggle = (event: SyntheticEvent<HTMLButtonElement>) => {\n setExpanded((prev) => !prev);\n onToggle?.(event);\n };\n\n return (\n <AccordionContext.Provider\n value={{\n value,\n toggle,\n expanded,\n indicatorSide,\n disabled: Boolean(disabled),\n headerId,\n setHeaderId,\n panelId,\n setPanelId,\n status,\n }}\n >\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(status ?? \"\")]: status,\n [withBaseName(\"disabled\")]: disabled,\n },\n className,\n )}\n {...rest}\n />\n </AccordionContext.Provider>\n );\n },\n);\n"],"names":["Accordion","accordionCss"],"mappings":";;;;;;;;;;;;;;AA4CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA;AAE1C,MAAM,
|
|
1
|
+
{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type SyntheticEvent,\n useState,\n} from \"react\";\nimport { makePrefixer, useControlled, useId } from \"../utils\";\nimport accordionCss from \"./Accordion.css\";\nimport { AccordionContext } from \"./AccordionContext\";\nexport interface AccordionProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onToggle\"> {\n /**\n * AccordionGroup value.\n */\n value: string;\n /**\n * Whether the accordion is expanded.\n */\n expanded?: boolean;\n /**\n * Whether the accordion is expanded by default.\n */\n defaultExpanded?: boolean;\n /**\n * Side to align the Accordion's indicator. Defaults to `left`.\n */\n indicatorSide?: \"left\" | \"right\";\n /**\n * Callback fired when the accordion is toggled.\n */\n onToggle?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n /**\n * Whether the accordion is disabled.\n */\n disabled?: boolean;\n /**\n * The status of the accordion.\n */\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion(props, ref) {\n const {\n className,\n defaultExpanded,\n expanded: expandedProp,\n disabled,\n indicatorSide = \"left\",\n id: idProp,\n onToggle,\n status,\n value,\n ...rest\n } = props;\n\n const id = useId(idProp);\n const [headerId, setHeaderId] = useState(`${id}-header`);\n const [panelId, setPanelId] = useState(`${id}-panel`);\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion\",\n css: accordionCss,\n window: targetWindow,\n });\n\n const [expanded, setExpanded] = useControlled({\n controlled: expandedProp,\n default: Boolean(defaultExpanded),\n name: \"Accordion\",\n state: \"expanded\",\n });\n\n const toggle = (event: SyntheticEvent<HTMLButtonElement>) => {\n setExpanded((prev) => !prev);\n onToggle?.(event);\n };\n\n return (\n <AccordionContext.Provider\n value={{\n value,\n toggle,\n expanded,\n indicatorSide,\n disabled: Boolean(disabled),\n headerId,\n setHeaderId,\n panelId,\n setPanelId,\n status,\n }}\n >\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(status ?? \"\")]: status,\n [withBaseName(\"disabled\")]: disabled,\n },\n className,\n )}\n {...rest}\n />\n </AccordionContext.Provider>\n );\n },\n);\n"],"names":["Accordion","accordionCss"],"mappings":";;;;;;;;;;;;;;AA4CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA;AAE1C,MAAM,SAAA,GAAY,UAAA;AAAA,EACvB,SAASA,UAAAA,CAAU,KAAA,EAAO,GAAA,EAAK;AAC7B,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,QAAA;AAAA,MACA,aAAA,GAAgB,MAAA;AAAA,MAChB,EAAA,EAAI,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAA,GAAK,MAAM,MAAM,CAAA;AACvB,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,IAAI,QAAA,CAAS,CAAA,EAAG,EAAE,CAAA,OAAA,CAAS,CAAA;AACvD,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,IAAI,QAAA,CAAS,CAAA,EAAG,EAAE,CAAA,MAAA,CAAQ,CAAA;AAEpD,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,gBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,aAAA,CAAc;AAAA,MAC5C,UAAA,EAAY,YAAA;AAAA,MACZ,OAAA,EAAS,QAAQ,eAAe,CAAA;AAAA,MAChC,IAAA,EAAM,WAAA;AAAA,MACN,KAAA,EAAO;AAAA,KACR,CAAA;AAED,IAAA,MAAM,MAAA,GAAS,CAAC,KAAA,KAA6C;AAC3D,MAAA,WAAA,CAAY,CAAC,IAAA,KAAS,CAAC,IAAI,CAAA;AAC3B,MAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,CAAA;AAAA,IACb,CAAA;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,gBAAA,CAAiB,QAAA;AAAA,MAAjB;AAAA,QACC,KAAA,EAAO;AAAA,UACL,KAAA;AAAA,UACA,MAAA;AAAA,UACA,QAAA;AAAA,UACA,aAAA;AAAA,UACA,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,UAC1B,QAAA;AAAA,UACA,WAAA;AAAA,UACA,OAAA;AAAA,UACA,UAAA;AAAA,UACA;AAAA,SACF;AAAA,QAEA,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,GAAA;AAAA,YACA,SAAA,EAAW,IAAA;AAAA,cACT,YAAA,EAAa;AAAA,cACb;AAAA,gBACE,CAAC,YAAA,CAAa,MAAA,IAAU,EAAE,CAAC,GAAG,MAAA;AAAA,gBAC9B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,eAC9B;AAAA,cACA;AAAA,aACF;AAAA,YACC,GAAG;AAAA;AAAA;AACN;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n value: string;\n expanded: boolean;\n toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n disabled: boolean;\n indicatorSide: \"left\" | \"right\";\n headerId: string;\n setHeaderId: (id: string) => void;\n panelId: string;\n setPanelId: (id: string) => void;\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n \"AccordionContext\",\n {\n value: \"\",\n expanded: false,\n toggle: () => undefined,\n disabled: false,\n indicatorSide: \"left\",\n headerId: \"\",\n setHeaderId: () => undefined,\n panelId: \"\",\n setPanelId: () => undefined,\n },\n);\n\nexport function useAccordion() {\n return useContext(AccordionContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,
|
|
1
|
+
{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface AccordionContextValue {\n value: string;\n expanded: boolean;\n toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n disabled: boolean;\n indicatorSide: \"left\" | \"right\";\n headerId: string;\n setHeaderId: (id: string) => void;\n panelId: string;\n setPanelId: (id: string) => void;\n status?: \"error\" | \"warning\" | \"success\";\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n \"AccordionContext\",\n {\n value: \"\",\n expanded: false,\n toggle: () => undefined,\n disabled: false,\n indicatorSide: \"left\",\n headerId: \"\",\n setHeaderId: () => undefined,\n panelId: \"\",\n setPanelId: () => undefined,\n },\n);\n\nexport function useAccordion() {\n return useContext(AccordionContext);\n}\n"],"names":[],"mappings":";;;;;;;;;AAgBO,MAAM,gBAAA,GAAmB,aAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,KAAA,EAAO,EAAA;AAAA,IACP,QAAA,EAAU,KAAA;AAAA,IACV,QAAQ,MAAM,MAAA;AAAA,IACd,QAAA,EAAU,KAAA;AAAA,IACV,aAAA,EAAe,MAAA;AAAA,IACf,QAAA,EAAU,EAAA;AAAA,IACV,aAAa,MAAM,MAAA;AAAA,IACnB,OAAA,EAAS,EAAA;AAAA,IACT,YAAY,MAAM;AAAA;AAEtB;AAEO,SAAS,YAAA,GAAe;AAC7B,EAAA,OAAO,WAAW,gBAAgB,CAAA;AACpC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The child Accordions to be rendered\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n function AccordionGroup(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-group\",\n css: accordionGroupCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n );\n },\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,
|
|
1
|
+
{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport accordionGroupCss from \"./AccordionGroup.css\";\n\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The child Accordions to be rendered\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n function AccordionGroup(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-group\",\n css: accordionGroupCss,\n window: targetWindow,\n });\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n );\n },\n);\n"],"names":["AccordionGroup","accordionGroupCss"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,IAAA,CAAK,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAAM,CAAA;AAAA,EAEzE;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionHeader.js","sources":["../src/accordion/AccordionHeader.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n type ReactNode,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionHeaderCss from \"./AccordionHeader.css\";\n\nexport interface AccordionHeaderProps\n extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * The content of the Accordion Header\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionHeader\");\n\nfunction ExpansionIcon({ expanded }: { expanded: boolean }) {\n const { CollapseIcon, ExpandIcon } = useIcon();\n if (expanded) {\n return <CollapseIcon aria-hidden className={withBaseName(\"icon\")} />;\n }\n\n return <ExpandIcon aria-hidden className={withBaseName(\"icon\")} />;\n}\n\nexport const AccordionHeader = forwardRef<\n HTMLButtonElement,\n AccordionHeaderProps\n>(function AccordionHeader(props, ref) {\n const { children, className, onClick, id, ...rest } = props;\n const {\n value,\n expanded,\n toggle,\n indicatorSide,\n disabled,\n headerId,\n panelId,\n setHeaderId,\n status,\n } = useAccordion();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-header\",\n css: accordionHeaderCss,\n window: targetWindow,\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggle(event);\n onClick?.(event);\n };\n\n useIsomorphicLayoutEffect(() => {\n if (id) {\n setHeaderId(id);\n }\n }, [id, setHeaderId]);\n\n return (\n <button\n ref={ref}\n className={clsx(\n withBaseName(),\n { [withBaseName(status ?? \"\")]: status },\n className,\n )}\n disabled={disabled}\n onClick={handleClick}\n aria-expanded={expanded}\n id={headerId}\n aria-controls={panelId}\n value={value}\n type=\"button\"\n {...rest}\n >\n {indicatorSide === \"left\" && <ExpansionIcon expanded={expanded} />}\n <span className={withBaseName(\"content\")}>{children}</span>\n {status && !disabled && (\n <StatusIndicator\n className={withBaseName(\"statusIndicator\")}\n status={status}\n />\n )}\n {indicatorSide === \"right\" && <ExpansionIcon expanded={expanded} />}\n </button>\n );\n});\n"],"names":["AccordionHeader","accordionHeaderCss"],"mappings":";;;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA;AAEvD,SAAS,aAAA,CAAc,EAAE,QAAA,
|
|
1
|
+
{"version":3,"file":"AccordionHeader.js","sources":["../src/accordion/AccordionHeader.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n type ReactNode,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionHeaderCss from \"./AccordionHeader.css\";\n\nexport interface AccordionHeaderProps\n extends ComponentPropsWithoutRef<\"button\"> {\n /**\n * The content of the Accordion Header\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionHeader\");\n\nfunction ExpansionIcon({ expanded }: { expanded: boolean }) {\n const { CollapseIcon, ExpandIcon } = useIcon();\n if (expanded) {\n return <CollapseIcon aria-hidden className={withBaseName(\"icon\")} />;\n }\n\n return <ExpandIcon aria-hidden className={withBaseName(\"icon\")} />;\n}\n\nexport const AccordionHeader = forwardRef<\n HTMLButtonElement,\n AccordionHeaderProps\n>(function AccordionHeader(props, ref) {\n const { children, className, onClick, id, ...rest } = props;\n const {\n value,\n expanded,\n toggle,\n indicatorSide,\n disabled,\n headerId,\n panelId,\n setHeaderId,\n status,\n } = useAccordion();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-header\",\n css: accordionHeaderCss,\n window: targetWindow,\n });\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n toggle(event);\n onClick?.(event);\n };\n\n useIsomorphicLayoutEffect(() => {\n if (id) {\n setHeaderId(id);\n }\n }, [id, setHeaderId]);\n\n return (\n <button\n ref={ref}\n className={clsx(\n withBaseName(),\n { [withBaseName(status ?? \"\")]: status },\n className,\n )}\n disabled={disabled}\n onClick={handleClick}\n aria-expanded={expanded}\n id={headerId}\n aria-controls={panelId}\n value={value}\n type=\"button\"\n {...rest}\n >\n {indicatorSide === \"left\" && <ExpansionIcon expanded={expanded} />}\n <span className={withBaseName(\"content\")}>{children}</span>\n {status && !disabled && (\n <StatusIndicator\n className={withBaseName(\"statusIndicator\")}\n status={status}\n />\n )}\n {indicatorSide === \"right\" && <ExpansionIcon expanded={expanded} />}\n </button>\n );\n});\n"],"names":["AccordionHeader","accordionHeaderCss"],"mappings":";;;;;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA;AAEvD,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA0B;AAC1D,EAAA,MAAM,EAAE,YAAA,EAAc,UAAA,EAAW,GAAI,OAAA,EAAQ;AAC7C,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,2BAAQ,YAAA,EAAA,EAAa,aAAA,EAAW,MAAC,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,CAAA;AAAA,EACpE;AAEA,EAAA,2BAAQ,UAAA,EAAA,EAAW,aAAA,EAAW,MAAC,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,CAAA;AAClE;AAEO,MAAM,eAAA,GAAkB,UAAA,CAG7B,SAASA,gBAAAA,CAAgB,OAAO,GAAA,EAAK;AACrC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAS,EAAA,EAAI,GAAG,MAAK,GAAI,KAAA;AACtD,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,aAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,MACE,YAAA,EAAa;AAEjB,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,uBAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,IAAA,MAAA,CAAO,KAAK,CAAA;AACZ,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AAAA,EACZ,CAAA;AAEA,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,EAAA,EAAI;AACN,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,IAChB;AAAA,EACF,CAAA,EAAG,CAAC,EAAA,EAAI,WAAW,CAAC,CAAA;AAEpB,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,EAAE,CAAC,YAAA,CAAa,UAAU,EAAE,CAAC,GAAG,MAAA,EAAO;AAAA,QACvC;AAAA,OACF;AAAA,MACA,QAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MACT,eAAA,EAAe,QAAA;AAAA,MACf,EAAA,EAAI,QAAA;AAAA,MACJ,eAAA,EAAe,OAAA;AAAA,MACf,KAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,aAAA,KAAkB,MAAA,oBAAU,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB,CAAA;AAAA,4BAC/D,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,SAAS,GAAI,QAAA,EAAS,CAAA;AAAA,QACnD,MAAA,IAAU,CAAC,QAAA,oBACV,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,YACzC;AAAA;AAAA,SACF;AAAA,QAED,aAAA,KAAkB,OAAA,oBAAW,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB;AAAA;AAAA;AAAA,GACnE;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanel.js","sources":["../src/accordion/AccordionPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n} from \"react\";\n\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionPanelCss from \"./AccordionPanel.css\";\n\nexport interface AccordionPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of the Accordion Panel\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionPanel\");\n\nexport const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(\n function AccordionPanel(props, ref) {\n const { children, className, id, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-panel\",\n css: accordionPanelCss,\n window: targetWindow,\n });\n\n const { headerId, panelId, setPanelId, expanded, indicatorSide } =\n useAccordion();\n\n useIsomorphicLayoutEffect(() => {\n if (id) {\n setPanelId(id);\n }\n }, [id, setPanelId]);\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n role=\"region\"\n id={panelId}\n aria-labelledby={headerId}\n aria-hidden={!expanded ? \"true\" : undefined}\n hidden={!expanded}\n {...rest}\n >\n <div className={withBaseName(\"inner\")}>\n <div\n className={clsx(withBaseName(\"content\"), {\n [withBaseName(\"indentedContent\")]: indicatorSide === \"left\",\n })}\n >\n {children}\n </div>\n </div>\n </div>\n );\n },\n);\n"],"names":["AccordionPanel","accordionPanelCss"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,
|
|
1
|
+
{"version":3,"file":"AccordionPanel.js","sources":["../src/accordion/AccordionPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n} from \"react\";\n\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionPanelCss from \"./AccordionPanel.css\";\n\nexport interface AccordionPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content of the Accordion Panel\n */\n children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordionPanel\");\n\nexport const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(\n function AccordionPanel(props, ref) {\n const { children, className, id, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-accordion-panel\",\n css: accordionPanelCss,\n window: targetWindow,\n });\n\n const { headerId, panelId, setPanelId, expanded, indicatorSide } =\n useAccordion();\n\n useIsomorphicLayoutEffect(() => {\n if (id) {\n setPanelId(id);\n }\n }, [id, setPanelId]);\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n role=\"region\"\n id={panelId}\n aria-labelledby={headerId}\n aria-hidden={!expanded ? \"true\" : undefined}\n hidden={!expanded}\n {...rest}\n >\n <div className={withBaseName(\"inner\")}>\n <div\n className={clsx(withBaseName(\"content\"), {\n [withBaseName(\"indentedContent\")]: indicatorSide === \"left\",\n })}\n >\n {children}\n </div>\n </div>\n </div>\n );\n },\n);\n"],"names":["AccordionPanel","accordionPanelCss"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,EAAA,EAAI,GAAG,MAAK,GAAI,KAAA;AAE7C,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,OAAA,EAAS,YAAY,QAAA,EAAU,aAAA,KAC/C,YAAA,EAAa;AAEf,IAAA,yBAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,EAAA,EAAI;AACN,QAAA,UAAA,CAAW,EAAE,CAAA;AAAA,MACf;AAAA,IACF,CAAA,EAAG,CAAC,EAAA,EAAI,UAAU,CAAC,CAAA;AAEnB,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,IAAA,EAAK,QAAA;AAAA,QACL,EAAA,EAAI,OAAA;AAAA,QACJ,iBAAA,EAAiB,QAAA;AAAA,QACjB,aAAA,EAAa,CAAC,QAAA,GAAW,MAAA,GAAS,MAAA;AAAA,QAClC,QAAQ,CAAC,QAAA;AAAA,QACR,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,CAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA,CAAK,YAAA,CAAa,SAAS,CAAA,EAAG;AAAA,cACvC,CAAC,YAAA,CAAa,iBAAiB,CAAC,GAAG,aAAA,KAAkB;AAAA,aACtD,CAAA;AAAA,YAEA;AAAA;AAAA,SACH,EACF;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n /**\n * String which will be announced by screen readers on change\n */\n announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n announcement,\n}) => {\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (announcement) {\n announce(announcement);\n }\n }, [announce, announcement]);\n\n // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n return <></>;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D;AACF,
|
|
1
|
+
{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n /**\n * String which will be announced by screen readers on change\n */\n announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n announcement,\n}) => {\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (announcement) {\n announce(announcement);\n }\n }, [announce, announcement]);\n\n // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n return <></>;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AAEtC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAA,EAAc;AAChB,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA,IACvB;AAAA,EACF,CAAA,EAAG,CAAC,QAAA,EAAU,YAAY,CAAC,CAAA;AAG3B,EAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAE,CAAA;AACX;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n undefined,\n);\n"],"names":[],"mappings":";;AAQO,MAAM,
|
|
1
|
+
{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n undefined,\n);\n"],"names":[],"mappings":";;AAQO,MAAM,oBAAA,GAAuB,aAAA;AAAA,EAClC;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n type CSSProperties,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n children?: ReactNode;\n /**\n * Style overrides for the aria-live element\n */\n style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n children,\n style,\n}: AriaAnnouncerProviderProps) {\n // announcement that gets rendered inside aria-live and read out by screen readers\n const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n // queue that stores all the requested announcements\n const announcementsRef = useRef<string[]>([]);\n // we use this variable to decide whether to start the announcement queue if one is not already in progress\n const isAnnouncingRef = useRef(false);\n // we need to keep track of the state of the component mount since all the async function calls\n // might trigger a setState after a component has been unmounted\n const mountedRef = useRef(true);\n\n // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n const announceAll = useCallback(() => {\n isAnnouncingRef.current = true;\n if (mountedRef.current) {\n setCurrentAnnouncement(\"\");\n requestAnimationFrame(() => {\n if (mountedRef.current && announcementsRef.current.length) {\n const announcement = announcementsRef.current.shift() as string;\n setCurrentAnnouncement(announcement);\n setTimeout(() => {\n announceAll();\n }, ARIA_ANNOUNCE_DELAY);\n } else {\n isAnnouncingRef.current = false;\n }\n });\n }\n }, []);\n\n const announce = useCallback(\n (announcement: string) => {\n announcementsRef.current.push(announcement);\n if (!isAnnouncingRef.current) {\n announceAll();\n }\n },\n [announceAll],\n );\n\n useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n const value = useMemo(() => ({ announce }), [announce]);\n return (\n <AriaAnnouncerContext.Provider value={value}>\n {children}\n <div\n aria-atomic=\"true\"\n aria-live=\"assertive\"\n // hidden styling based on https://tailwindcss.com/docs/screen-readers\n style={{\n position: \"absolute\",\n height: 1,\n width: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0, 0, 0, 0)\",\n whiteSpace: \"nowrap\",\n borderWidth: 0,\n ...style,\n }}\n >\n {currentAnnouncement}\n </div>\n </AriaAnnouncerContext.Provider>\n );\n}\n"],"names":[],"mappings":";;;;AAYO,MAAM,
|
|
1
|
+
{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n type CSSProperties,\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n children?: ReactNode;\n /**\n * Style overrides for the aria-live element\n */\n style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n children,\n style,\n}: AriaAnnouncerProviderProps) {\n // announcement that gets rendered inside aria-live and read out by screen readers\n const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n // queue that stores all the requested announcements\n const announcementsRef = useRef<string[]>([]);\n // we use this variable to decide whether to start the announcement queue if one is not already in progress\n const isAnnouncingRef = useRef(false);\n // we need to keep track of the state of the component mount since all the async function calls\n // might trigger a setState after a component has been unmounted\n const mountedRef = useRef(true);\n\n // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n const announceAll = useCallback(() => {\n isAnnouncingRef.current = true;\n if (mountedRef.current) {\n setCurrentAnnouncement(\"\");\n requestAnimationFrame(() => {\n if (mountedRef.current && announcementsRef.current.length) {\n const announcement = announcementsRef.current.shift() as string;\n setCurrentAnnouncement(announcement);\n setTimeout(() => {\n announceAll();\n }, ARIA_ANNOUNCE_DELAY);\n } else {\n isAnnouncingRef.current = false;\n }\n });\n }\n }, []);\n\n const announce = useCallback(\n (announcement: string) => {\n announcementsRef.current.push(announcement);\n if (!isAnnouncingRef.current) {\n announceAll();\n }\n },\n [announceAll],\n );\n\n useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n const value = useMemo(() => ({ announce }), [announce]);\n return (\n <AriaAnnouncerContext.Provider value={value}>\n {children}\n <div\n aria-atomic=\"true\"\n aria-live=\"assertive\"\n // hidden styling based on https://tailwindcss.com/docs/screen-readers\n style={{\n position: \"absolute\",\n height: 1,\n width: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0, 0, 0, 0)\",\n whiteSpace: \"nowrap\",\n borderWidth: 0,\n ...style,\n }}\n >\n {currentAnnouncement}\n </div>\n </AriaAnnouncerContext.Provider>\n );\n}\n"],"names":[],"mappings":";;;;AAYO,MAAM,mBAAA,GAAsB;AAU5B,SAAS,qBAAA,CAAsB;AAAA,EACpC,QAAA;AAAA,EACA;AACF,CAAA,EAA+B;AAE7B,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GAAI,SAAS,EAAE,CAAA;AAEjE,EAAA,MAAM,gBAAA,GAAmB,MAAA,CAAiB,EAAE,CAAA;AAE5C,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAK,CAAA;AAGpC,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAG9B,EAAA,MAAM,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,sBAAA,CAAuB,EAAE,CAAA;AACzB,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,UAAA,CAAW,OAAA,IAAW,gBAAA,CAAiB,OAAA,CAAQ,MAAA,EAAQ;AACzD,UAAA,MAAM,YAAA,GAAe,gBAAA,CAAiB,OAAA,CAAQ,KAAA,EAAM;AACpD,UAAA,sBAAA,CAAuB,YAAY,CAAA;AACnC,UAAA,UAAA,CAAW,MAAM;AACf,YAAA,WAAA,EAAY;AAAA,UACd,GAAG,mBAAmB,CAAA;AAAA,QACxB,CAAA,MAAO;AACL,UAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAAA,QAC5B;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,YAAA,KAAyB;AACxB,MAAA,gBAAA,CAAiB,OAAA,CAAQ,KAAK,YAAY,CAAA;AAC1C,MAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,QAAA,WAAA,EAAY;AAAA,MACd;AAAA,IACF,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,KAAA,GAAQ,QAAQ,OAAO,EAAE,UAAS,CAAA,EAAI,CAAC,QAAQ,CAAC,CAAA;AACtD,EAAA,uBACE,IAAA,CAAC,oBAAA,CAAqB,QAAA,EAArB,EAA8B,KAAA,EAC5B,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,MAAA;AAAA,QACZ,WAAA,EAAU,WAAA;AAAA,QAEV,KAAA,EAAO;AAAA,UACL,QAAA,EAAU,UAAA;AAAA,UACV,MAAA,EAAQ,CAAA;AAAA,UACR,KAAA,EAAO,CAAA;AAAA,UACP,OAAA,EAAS,CAAA;AAAA,UACT,MAAA,EAAQ,EAAA;AAAA,UACR,QAAA,EAAU,QAAA;AAAA,UACV,IAAA,EAAM,kBAAA;AAAA,UACN,UAAA,EAAY,QAAA;AAAA,UACZ,WAAA,EAAa,CAAA;AAAA,UACb,GAAG;AAAA,SACL;AAAA,QAEC,QAAA,EAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils/debounce\";\nimport {\n type AriaAnnouncer,\n AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n debounce: debounceInterval = 0,\n} = {}) => {\n const context = useContext(AriaAnnouncerContext);\n const mountedRef = useRef(true);\n const baseAnnounce = useCallback(\n (announcement: string, delay?: number) => {\n const isReactAnnouncerInstalled = context?.announce;\n\n if (process.env.NODE_ENV !== \"production\") {\n if (isReactAnnouncerInstalled && warnedOnce) {\n console.warn(\n \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n );\n warnedOnce = true;\n }\n }\n\n function makeAnnouncement() {\n if (mountedRef.current) {\n if (isReactAnnouncerInstalled) {\n context.announce(announcement);\n }\n }\n }\n\n if (delay) {\n setTimeout(makeAnnouncement, delay);\n } else {\n makeAnnouncement();\n }\n },\n [context],\n );\n\n const announce = useMemo(\n () =>\n debounceInterval > 0\n ? debounce(baseAnnounce, debounceInterval)\n : baseAnnounce,\n [baseAnnounce, debounceInterval],\n );\n\n const ariaAnnouncer = useMemo(\n () => ({\n ...context,\n announce,\n }),\n [context, announce],\n );\n\n useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n return ariaAnnouncer;\n};\n"],"names":[],"mappings":";;;;AAgBO,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,
|
|
1
|
+
{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils/debounce\";\nimport {\n type AriaAnnouncer,\n AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n debounce: debounceInterval = 0,\n} = {}) => {\n const context = useContext(AriaAnnouncerContext);\n const mountedRef = useRef(true);\n const baseAnnounce = useCallback(\n (announcement: string, delay?: number) => {\n const isReactAnnouncerInstalled = context?.announce;\n\n if (process.env.NODE_ENV !== \"production\") {\n if (isReactAnnouncerInstalled && warnedOnce) {\n console.warn(\n \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n );\n warnedOnce = true;\n }\n }\n\n function makeAnnouncement() {\n if (mountedRef.current) {\n if (isReactAnnouncerInstalled) {\n context.announce(announcement);\n }\n }\n }\n\n if (delay) {\n setTimeout(makeAnnouncement, delay);\n } else {\n makeAnnouncement();\n }\n },\n [context],\n );\n\n const announce = useMemo(\n () =>\n debounceInterval > 0\n ? debounce(baseAnnounce, debounceInterval)\n : baseAnnounce,\n [baseAnnounce, debounceInterval],\n );\n\n const ariaAnnouncer = useMemo(\n () => ({\n ...context,\n announce,\n }),\n [context, announce],\n );\n\n useEffect(() => {\n mountedRef.current = true;\n return () => {\n mountedRef.current = false;\n };\n }, []);\n\n return ariaAnnouncer;\n};\n"],"names":[],"mappings":";;;;AAgBO,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAA,GAAmB;AAC/B,CAAA,GAAI,EAAC,KAAM;AACT,EAAA,MAAM,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAC/C,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAC9B,EAAA,MAAM,YAAA,GAAe,WAAA;AAAA,IACnB,CAAC,cAAsB,KAAA,KAAmB;AACxC,MAAA,MAAM,4BAA4B,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAS,QAAA;AAE3C,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AAS3C,MAAA,SAAS,gBAAA,GAAmB;AAC1B,QAAA,IAAI,WAAW,OAAA,EAAS;AACtB,UAAA,IAAI,yBAAA,EAA2B;AAC7B,YAAA,OAAA,CAAQ,SAAS,YAAY,CAAA;AAAA,UAC/B;AAAA,QACF;AAAA,MACF;AAEA,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,UAAA,CAAW,kBAAkB,KAAK,CAAA;AAAA,MACpC,CAAA,MAAO;AACL,QAAA,gBAAA,EAAiB;AAAA,MACnB;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,MACE,gBAAA,GAAmB,CAAA,GACf,QAAA,CAAS,YAAA,EAAc,gBAAgB,CAAA,GACvC,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB;AAAA,GACjC;AAEA,EAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,IACpB,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,GACpB;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,OAAO,aAAA;AACT;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * The name that Avatar represents.\n */\n name?: string;\n /**\n * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n * If a function is not passed or returns undefined, Avatar will default to Icon.\n */\n nameToInitials?: NameToInitials;\n /**\n * Image src of Avatar.\n */\n src?: string;\n /**\n * Multiplier for the base avatar.\n */\n size?: number;\n /**\n * Icon to be used as a default item. Defaults to `UserIcon`.\n */\n fallbackIcon?: ReactNode;\n /**\n * Changes Avatar's color.\n */\n color?:\n | \"accent\"\n | \"category-1\"\n | \"category-2\"\n | \"category-3\"\n | \"category-4\"\n | \"category-5\"\n | \"category-6\"\n | \"category-7\"\n | \"category-8\"\n | \"category-9\"\n | \"category-10\"\n | \"category-11\"\n | \"category-12\"\n | \"category-13\"\n | \"category-14\"\n | \"category-15\"\n | \"category-16\"\n | \"category-17\"\n | \"category-18\"\n | \"category-19\"\n | \"category-20\";\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n name\n ?.split(\" \")\n .slice(0, 2)\n .map((n) => n[0])\n .join(\"\")\n .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n {\n className,\n children: childrenProp,\n color = \"accent\",\n name,\n nameToInitials = defaultNameToInitials,\n src,\n size = DEFAULT_AVATAR_SIZE,\n style: styleProp,\n fallbackIcon: fallbackIconProp,\n ...rest\n },\n ref,\n) {\n const targetWindow = useWindow();\n const { UserIcon } = useIcon();\n\n const fallbackIcon =\n fallbackIconProp === undefined ? (\n <UserIcon aria-hidden />\n ) : (\n fallbackIconProp\n );\n\n useComponentCssInjection({\n testId: \"salt-avatar\",\n css: avatarCss,\n window: targetWindow,\n });\n\n let children: ReactNode;\n\n const style = {\n ...styleProp,\n \"--saltAvatar-size-multiplier\": `${size}`,\n };\n\n const status = useAvatarImage({ src });\n const hasImgNotFailing = status === \"loaded\";\n if (hasImgNotFailing) {\n children = <img alt=\"\" src={src} />;\n } else if (childrenProp != null) {\n children = childrenProp;\n }\n\n const avatarInitials = nameToInitials(name);\n\n const ariaProps = name\n ? {\n role: \"img\",\n \"aria-label\": name,\n }\n : {};\n\n return (\n <div\n ref={ref}\n style={style}\n className={clsx(\n withBaseName(),\n withBaseName(color),\n {\n [withBaseName(\"withImage\")]: hasImgNotFailing,\n },\n className,\n )}\n {...ariaProps}\n {...rest}\n >\n {children || avatarInitials || fallbackIcon}\n </div>\n );\n});\n"],"names":["Avatar","avatarCss"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAC9C,MAAM,
|
|
1
|
+
{"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer } from \"../utils\";\nimport avatarCss from \"./Avatar.css\";\nimport { useAvatarImage } from \"./useAvatarImage\";\n\nexport type NameToInitials = (name?: string) => string;\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * The name that Avatar represents.\n */\n name?: string;\n /**\n * Defines the function that gets initials. Default is capital first letter of each separate word in name.\n * If a function is not passed or returns undefined, Avatar will default to Icon.\n */\n nameToInitials?: NameToInitials;\n /**\n * Image src of Avatar.\n */\n src?: string;\n /**\n * Multiplier for the base avatar.\n */\n size?: number;\n /**\n * Icon to be used as a default item. Defaults to `UserIcon`.\n */\n fallbackIcon?: ReactNode;\n /**\n * Changes Avatar's color.\n */\n color?:\n | \"accent\"\n | \"category-1\"\n | \"category-2\"\n | \"category-3\"\n | \"category-4\"\n | \"category-5\"\n | \"category-6\"\n | \"category-7\"\n | \"category-8\"\n | \"category-9\"\n | \"category-10\"\n | \"category-11\"\n | \"category-12\"\n | \"category-13\"\n | \"category-14\"\n | \"category-15\"\n | \"category-16\"\n | \"category-17\"\n | \"category-18\"\n | \"category-19\"\n | \"category-20\";\n}\n\nconst withBaseName = makePrefixer(\"saltAvatar\");\nconst DEFAULT_AVATAR_SIZE = 2; // medium\n\nconst defaultNameToInitials = (name?: string) =>\n name\n ?.split(\" \")\n .slice(0, 2)\n .map((n) => n[0])\n .join(\"\")\n .toUpperCase();\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n {\n className,\n children: childrenProp,\n color = \"accent\",\n name,\n nameToInitials = defaultNameToInitials,\n src,\n size = DEFAULT_AVATAR_SIZE,\n style: styleProp,\n fallbackIcon: fallbackIconProp,\n ...rest\n },\n ref,\n) {\n const targetWindow = useWindow();\n const { UserIcon } = useIcon();\n\n const fallbackIcon =\n fallbackIconProp === undefined ? (\n <UserIcon aria-hidden />\n ) : (\n fallbackIconProp\n );\n\n useComponentCssInjection({\n testId: \"salt-avatar\",\n css: avatarCss,\n window: targetWindow,\n });\n\n let children: ReactNode;\n\n const style = {\n ...styleProp,\n \"--saltAvatar-size-multiplier\": `${size}`,\n };\n\n const status = useAvatarImage({ src });\n const hasImgNotFailing = status === \"loaded\";\n if (hasImgNotFailing) {\n children = <img alt=\"\" src={src} />;\n } else if (childrenProp != null) {\n children = childrenProp;\n }\n\n const avatarInitials = nameToInitials(name);\n\n const ariaProps = name\n ? {\n role: \"img\",\n \"aria-label\": name,\n }\n : {};\n\n return (\n <div\n ref={ref}\n style={style}\n className={clsx(\n withBaseName(),\n withBaseName(color),\n {\n [withBaseName(\"withImage\")]: hasImgNotFailing,\n },\n className,\n )}\n {...ariaProps}\n {...rest}\n >\n {children || avatarInitials || fallbackIcon}\n </div>\n );\n});\n"],"names":["Avatar","avatarCss"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA;AAC9C,MAAM,mBAAA,GAAsB,CAAA;AAE5B,MAAM,wBAAwB,CAAC,IAAA,KAC7B,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CACI,KAAA,CAAM,KACP,KAAA,CAAM,CAAA,EAAG,CAAA,CAAA,CACT,GAAA,CAAI,CAAC,CAAA,KAAM,CAAA,CAAE,CAAC,CAAA,CAAA,CACd,KAAK,EAAA,CAAA,CACL,WAAA,EAAA;AAEE,MAAM,MAAA,GAAS,UAAA,CAAwC,SAASA,OAAAA,CACrE;AAAA,EACE,SAAA;AAAA,EACA,QAAA,EAAU,YAAA;AAAA,EACV,KAAA,GAAQ,QAAA;AAAA,EACR,IAAA;AAAA,EACA,cAAA,GAAiB,qBAAA;AAAA,EACjB,GAAA;AAAA,EACA,IAAA,GAAO,mBAAA;AAAA,EACP,KAAA,EAAO,SAAA;AAAA,EACP,YAAA,EAAc,gBAAA;AAAA,EACd,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,OAAA,EAAQ;AAE7B,EAAA,MAAM,eACJ,gBAAA,KAAqB,MAAA,uBAClB,QAAA,EAAA,EAAS,aAAA,EAAW,MAAC,CAAA,GAEtB,gBAAA;AAGJ,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,aAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,IAAI,QAAA;AAEJ,EAAA,MAAM,KAAA,GAAQ;AAAA,IACZ,GAAG,SAAA;AAAA,IACH,8BAAA,EAAgC,GAAG,IAAI,CAAA;AAAA,GACzC;AAEA,EAAA,MAAM,MAAA,GAAS,cAAA,CAAe,EAAE,GAAA,EAAK,CAAA;AACrC,EAAA,MAAM,mBAAmB,MAAA,KAAW,QAAA;AACpC,EAAA,IAAI,gBAAA,EAAkB;AACpB,IAAA,QAAA,mBAAW,GAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAI,EAAA,EAAG,GAAA,EAAU,CAAA;AAAA,EACnC,CAAA,MAAA,IAAW,gBAAgB,IAAA,EAAM;AAC/B,IAAA,QAAA,GAAW,YAAA;AAAA,EACb;AAEA,EAAA,MAAM,cAAA,GAAiB,eAAe,IAAI,CAAA;AAE1C,EAAA,MAAM,YAAY,IAAA,GACd;AAAA,IACE,IAAA,EAAM,KAAA;AAAA,IACN,YAAA,EAAc;AAAA,MAEhB,EAAC;AAEL,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,aAAa,KAAK,CAAA;AAAA,QAClB;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC/B;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACH,GAAG,IAAA;AAAA,MAEH,sBAAY,cAAA,IAAkB;AAAA;AAAA,GACjC;AAEJ,CAAC;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useRef, useState } from 'react';
|
|
2
2
|
import 'clsx';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
|
|
@@ -6,29 +6,57 @@ import '../utils/useFloatingUI/useFloatingUI.js';
|
|
|
6
6
|
import '../utils/useId.js';
|
|
7
7
|
import '../salt-provider/SaltProvider.js';
|
|
8
8
|
import '../viewport/ViewportProvider.js';
|
|
9
|
+
import { useIsHydrated } from './useIsHydrated.js';
|
|
9
10
|
|
|
10
|
-
function
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
function resolveStatus(image, src) {
|
|
12
|
+
if (!image) {
|
|
13
|
+
return "pending";
|
|
14
|
+
}
|
|
15
|
+
if (!src) {
|
|
16
|
+
return "error";
|
|
17
|
+
}
|
|
18
|
+
if (image.src !== src) {
|
|
19
|
+
image.src = src;
|
|
20
|
+
}
|
|
21
|
+
return image.complete && image.naturalWidth > 0 ? "loaded" : "loading";
|
|
22
|
+
}
|
|
23
|
+
function useAvatarImage({
|
|
24
|
+
src,
|
|
25
|
+
referrerPolicy,
|
|
26
|
+
crossOrigin
|
|
27
|
+
}) {
|
|
28
|
+
const isHydrated = useIsHydrated();
|
|
29
|
+
const imageRef = useRef(null);
|
|
30
|
+
const image = (() => {
|
|
31
|
+
if (!isHydrated) return null;
|
|
32
|
+
if (!imageRef.current) {
|
|
33
|
+
imageRef.current = new Image();
|
|
34
|
+
}
|
|
35
|
+
return imageRef.current;
|
|
36
|
+
})();
|
|
37
|
+
const [status, setStatus] = useState(
|
|
38
|
+
() => resolveStatus(image, src)
|
|
39
|
+
);
|
|
15
40
|
useIsomorphicLayoutEffect(() => {
|
|
16
|
-
|
|
17
|
-
|
|
41
|
+
setStatus(resolveStatus(image, src));
|
|
42
|
+
}, [image, src]);
|
|
43
|
+
useIsomorphicLayoutEffect(() => {
|
|
44
|
+
if (!image) return;
|
|
45
|
+
const handleLoad = () => setStatus("loaded");
|
|
46
|
+
const handleError = () => setStatus("error");
|
|
47
|
+
image.addEventListener("load", handleLoad);
|
|
48
|
+
image.addEventListener("error", handleError);
|
|
49
|
+
if (referrerPolicy) {
|
|
50
|
+
image.referrerPolicy = referrerPolicy;
|
|
51
|
+
}
|
|
52
|
+
if (typeof crossOrigin === "string") {
|
|
53
|
+
image.crossOrigin = crossOrigin;
|
|
18
54
|
}
|
|
19
|
-
let active = true;
|
|
20
|
-
const image = new Image();
|
|
21
|
-
image.src = src;
|
|
22
|
-
const onLoad = () => active && setStatus("loaded");
|
|
23
|
-
const onError = () => active && setStatus("error");
|
|
24
|
-
image.addEventListener("load", onLoad, { once: true });
|
|
25
|
-
image.addEventListener("error", onError, { once: true });
|
|
26
55
|
return () => {
|
|
27
|
-
image.removeEventListener("load",
|
|
28
|
-
image.removeEventListener("
|
|
29
|
-
active = false;
|
|
56
|
+
image.removeEventListener("load", handleLoad);
|
|
57
|
+
image.removeEventListener("error", handleError);
|
|
30
58
|
};
|
|
31
|
-
}, [
|
|
59
|
+
}, [image, crossOrigin, referrerPolicy]);
|
|
32
60
|
return status;
|
|
33
61
|
}
|
|
34
62
|
|