@salt-ds/core 1.25.0 → 1.27.0

package/dist-es/menu/MenuContext.js

@@ -0,0 +1,121 @@
+import { useContext } from 'react';
+import { createContext } from '../utils/createContext.js';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import 'clsx';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import 'react/jsx-runtime';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../breakpoints/BreakpointProvider.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/styles';
+import '@salt-ds/window';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../dialog/DialogHeader.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Code.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextAction.js';
+import '../text/TextNotation.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '@floating-ui/react';
+import './MenuItem.js';
+import './MenuPanel.js';
+import './MenuTriggerContext.js';
+import './MenuPanelContext.js';
+import './MenuGroup.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../overlay/OverlayContext.js';
+import '../overlay/OverlayPanel.js';
+import '../overlay/OverlayPanelCloseButton.js';
+import '../overlay/OverlayPanelContent.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../parent-child-layout/ParentChildLayout.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+
+const MenuContext = createContext("MenuContext", {
+  openState: false,
+  getReferenceProps: () => ({}),
+  getFloatingProps: () => ({}),
+  getPanelPosition: () => ({}),
+  getItemProps: () => ({}),
+  activeIndex: null,
+  elementsRef: { current: [] },
+  focusInside: false,
+  setFocusInside: () => void 0,
+  isNested: false
+});
+function useMenuContext() {
+  return useContext(MenuContext);
+}
+
+export { MenuContext, useMenuContext };
+//# sourceMappingURL=MenuContext.js.map

package/dist-es/menu/MenuContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuContext.js","sources":["../src/menu/MenuContext.ts"],"sourcesContent":["import { Dispatch, MutableRefObject, SetStateAction, useContext } from \"react\";\nimport { useInteractions } from \"@floating-ui/react\";\nimport { createContext, UseFloatingUIReturn } from \"../utils\";\n\ntype UseInteractionsReturn = ReturnType<typeof useInteractions>;\n\nexport interface MenuContextValue\n  extends Pick<\n      UseInteractionsReturn,\n      \"getItemProps\" | \"getReferenceProps\" | \"getFloatingProps\"\n    >,\n    Partial<Pick<UseFloatingUIReturn, \"context\" | \"refs\">> {\n  openState: boolean;\n  activeIndex: number | null;\n  getPanelPosition: () => Record<string, unknown>;\n  elementsRef: MutableRefObject<(HTMLDivElement | null)[]>;\n  focusInside: boolean;\n  setFocusInside: Dispatch<SetStateAction<boolean>>;\n  isNested: boolean;\n}\n\nexport const MenuContext = createContext<MenuContextValue>(\"MenuContext\", {\n  openState: false,\n  getReferenceProps: () => ({}),\n  getFloatingProps: () => ({}),\n  getPanelPosition: () => ({}),\n  getItemProps: () => ({}),\n  activeIndex: null,\n  elementsRef: { current: [] },\n  focusInside: false,\n  setFocusInside: () => undefined,\n  isNested: false,\n});\n\nexport function useMenuContext() {\n  return useContext(MenuContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBa,MAAA,WAAA,GAAc,cAAgC,aAAe,EAAA;AAAA,EACxE,SAAW,EAAA,KAAA;AAAA,EACX,iBAAA,EAAmB,OAAO,EAAC,CAAA;AAAA,EAC3B,gBAAA,EAAkB,OAAO,EAAC,CAAA;AAAA,EAC1B,gBAAA,EAAkB,OAAO,EAAC,CAAA;AAAA,EAC1B,YAAA,EAAc,OAAO,EAAC,CAAA;AAAA,EACtB,WAAa,EAAA,IAAA;AAAA,EACb,WAAa,EAAA,EAAE,OAAS,EAAA,EAAG,EAAA;AAAA,EAC3B,WAAa,EAAA,KAAA;AAAA,EACb,gBAAgB,MAAM,KAAA,CAAA;AAAA,EACtB,QAAU,EAAA,KAAA;AACZ,CAAC,EAAA;AAEM,SAAS,cAAiB,GAAA;AAC/B,EAAA,OAAO,WAAW,WAAW,CAAA,CAAA;AAC/B;;;;"}

package/dist-es/menu/MenuGroup.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltMenuGroup-label {\n  background: var(--salt-container-primary-background);\n  color: var(--salt-text-secondary-foreground);\n  font-size: var(--salt-text-label-fontSize);\n  font-weight: var(--salt-text-label-fontWeight-strong);\n  font-family: var(--salt-text-fontFamily);\n  line-height: var(--salt-text-lineHeight);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  align-items: center;\n}\n\n.saltMenuGroup {\n  border-top: var(--salt-size-border) var(--salt-separable-borderStyle) var(--salt-separable-tertiary-borderColor);\n}\n\n.saltMenuGroup:first-of-type {\n  border-top: 0;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=MenuGroup.css.js.map

package/dist-es/menu/MenuGroup.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuGroup.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-es/menu/MenuGroup.js

@@ -0,0 +1,136 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { clsx } from 'clsx';
+import { useWindow } from '@salt-ds/window';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { makePrefixer } from '../utils/makePrefixer.js';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import { useId } from '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../breakpoints/BreakpointProvider.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../dialog/DialogHeader.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Code.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextAction.js';
+import '../text/TextNotation.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import './MenuContext.js';
+import '@floating-ui/react';
+import './MenuItem.js';
+import './MenuPanel.js';
+import './MenuTriggerContext.js';
+import './MenuPanelContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../overlay/OverlayContext.js';
+import '../overlay/OverlayPanel.js';
+import '../overlay/OverlayPanelCloseButton.js';
+import '../overlay/OverlayPanelContent.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../parent-child-layout/ParentChildLayout.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import css_248z from './MenuGroup.css.js';
+
+const withBaseName = makePrefixer("saltMenuGroup");
+const MenuGroup = forwardRef(
+  function MenuGroup2(props, ref) {
+    const { className, children, label, ...rest } = props;
+    const targetWindow = useWindow();
+    useComponentCssInjection({
+      testId: "salt-menu-group",
+      css: css_248z,
+      window: targetWindow
+    });
+    const labelId = useId();
+    return /* @__PURE__ */ jsxs("div", {
+      "aria-labelledby": label ? labelId : void 0,
+      className: clsx(withBaseName(), className),
+      role: "group",
+      ref,
+      ...rest,
+      children: [
+        label && /* @__PURE__ */ jsx("div", {
+          "aria-hidden": true,
+          className: withBaseName("label"),
+          id: labelId,
+          children: label
+        }),
+        children
+      ]
+    });
+  }
+);
+
+export { MenuGroup };
+//# sourceMappingURL=MenuGroup.js.map

package/dist-es/menu/MenuGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuGroup.js","sources":["../src/menu/MenuGroup.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer, useId } from \"../utils\";\nimport menuGroupCss from \"./MenuGroup.css\";\n\nexport interface MenuGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The label of the menu group.\n   */\n  label?: string;\n  /**\n   * Menus to be rendered inside the menu group.\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltMenuGroup\");\n\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuGroupProps>(\n  function MenuGroup(props, ref) {\n    const { className, children, label, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-menu-group\",\n      css: menuGroupCss,\n      window: targetWindow,\n    });\n\n    const labelId = useId();\n\n    return (\n      <div\n        aria-labelledby={label ? labelId : undefined}\n        className={clsx(withBaseName(), className)}\n        role=\"group\"\n        ref={ref}\n        {...rest}\n      >\n        {label && (\n          <div aria-hidden className={withBaseName(\"label\")} id={labelId}>\n            {label}\n          </div>\n        )}\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["MenuGroup","menuGroupCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,SAASA,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAA,MAAM,EAAE,SAAA,EAAW,QAAU,EAAA,KAAA,EAAA,GAAU,MAAS,GAAA,KAAA,CAAA;AAEhD,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,UAAU,KAAM,EAAA,CAAA;AAEtB,IAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,MACC,iBAAA,EAAiB,QAAQ,OAAU,GAAA,KAAA,CAAA;AAAA,MACnC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,IAAK,EAAA,OAAA;AAAA,MACL,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,KAAA,oBACE,GAAA,CAAA,KAAA,EAAA;AAAA,UAAI,aAAW,EAAA,IAAA;AAAA,UAAC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAG,EAAI,EAAA,OAAA;AAAA,UACpD,QAAA,EAAA,KAAA;AAAA,SACH,CAAA;AAAA,QAED,QAAA;AAAA,OAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/menu/MenuItem.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltMenuItem {\n  color: var(--salt-content-primary-foreground);\n  background: var(--salt-selectable-background);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  font-family: var(--salt-text-fontFamily);\n  line-height: var(--salt-text-lineHeight);\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  display: flex;\n  justify-content: flex-start;\n  gap: var(--salt-spacing-100);\n  position: relative;\n  align-items: center;\n  cursor: var(--salt-selectable-cursor-hover);\n  box-sizing: border-box;\n  flex-shrink: 0;\n}\n\n.saltMenuItem:focus-visible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-size-border) * -2);\n}\n\n.saltMenuItem:hover {\n  outline: none;\n}\n\n.saltMenuItem:hover,\n.saltMenuItem:focus-visible {\n  background: var(--salt-selectable-background-hover);\n}\n\n.saltMenuItem:active {\n  background: var(--salt-selectable-background-selected);\n  box-shadow: 0 calc(var(--salt-size-border) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-border) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltMenuItem[aria-disabled=\"true\"],\n.saltMenuItem[aria-disabled=\"true\"]:active {\n  background: var(--salt-selectable-background-disabled);\n  color: var(--salt-text-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n  box-shadow: none;\n}\n\n.saltMenuItem-blurActive {\n  z-index: var(--salt-zIndex-default);\n  background: var(--salt-selectable-background-selected);\n  box-shadow: 0 calc(var(--salt-size-border) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-border) 0 0 var(--salt-selectable-borderColor-selected);\n  box-shadow: 0 calc(var(--salt-size-border) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-border) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n.saltMenuItem-expandIcon.saltIcon {\n  margin-left: auto;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=MenuItem.css.js.map

package/dist-es/menu/MenuItem.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-es/menu/MenuItem.js

@@ -0,0 +1,181 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { clsx } from 'clsx';
+import { useWindow } from '@salt-ds/window';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { ChevronRightIcon } from '@salt-ds/icons';
+import { useListItem, useFloatingTree } from '@floating-ui/react';
+import { makePrefixer } from '../utils/makePrefixer.js';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import { useForkRef } from '../utils/useForkRef.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../breakpoints/BreakpointProvider.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../dialog/DialogHeader.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Code.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextAction.js';
+import '../text/TextNotation.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import './MenuContext.js';
+import './MenuPanel.js';
+import { useIsMenuTrigger } from './MenuTriggerContext.js';
+import { useMenuPanelContext } from './MenuPanelContext.js';
+import './MenuGroup.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../overlay/OverlayContext.js';
+import '../overlay/OverlayPanel.js';
+import '../overlay/OverlayPanelCloseButton.js';
+import '../overlay/OverlayPanelContent.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../parent-child-layout/ParentChildLayout.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import css_248z from './MenuItem.css.js';
+
+const withBaseName = makePrefixer("saltMenuItem");
+const MenuItem = forwardRef(
+  function MenuItem2(props, ref) {
+    const {
+      children,
+      className,
+      disabled,
+      onClick,
+      onFocus,
+      onKeyDown,
+      ...rest
+    } = props;
+    const { triggersSubmenu, blurActive } = useIsMenuTrigger();
+    const { activeIndex, getItemProps, setFocusInside } = useMenuPanelContext();
+    const item = useListItem();
+    const tree = useFloatingTree();
+    const active = item.index === activeIndex;
+    const targetWindow = useWindow();
+    useComponentCssInjection({
+      testId: "salt-menu-item",
+      css: css_248z,
+      window: targetWindow
+    });
+    const handleRef = useForkRef(ref, item.ref);
+    return /* @__PURE__ */ jsxs("div", {
+      className: clsx(
+        withBaseName(),
+        {
+          [withBaseName("blurActive")]: blurActive
+        },
+        className
+      ),
+      role: "menuitem",
+      "aria-disabled": disabled || void 0,
+      ...getItemProps({
+        tabIndex: disabled ? void 0 : active ? 0 : -1,
+        onKeyDown(event) {
+          const element = event.currentTarget;
+          onKeyDown == null ? void 0 : onKeyDown(event);
+          if ((event.key == " " || event.key == "Enter") && !triggersSubmenu && !disabled) {
+            event.preventDefault();
+            const { view, ...eventInit } = event;
+            queueMicrotask(() => {
+              element.dispatchEvent(
+                new window.MouseEvent("click", eventInit)
+              );
+            });
+            tree == null ? void 0 : tree.events.emit("click");
+          }
+        },
+        onClick(event) {
+          onClick == null ? void 0 : onClick(event);
+          if (!triggersSubmenu && !disabled) {
+            tree == null ? void 0 : tree.events.emit("click");
+          }
+        },
+        onFocus(event) {
+          onFocus == null ? void 0 : onFocus(event);
+          setFocusInside(true);
+        },
+        ...rest
+      }),
+      ref: handleRef,
+      children: [
+        children,
+        triggersSubmenu && /* @__PURE__ */ jsx(ChevronRightIcon, {
+          className: withBaseName("expandIcon"),
+          "aria-hidden": true
+        })
+      ]
+    });
+  }
+);
+
+export { MenuItem };
+//# sourceMappingURL=MenuItem.js.map

package/dist-es/menu/MenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.js","sources":["../src/menu/MenuItem.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { ChevronRightIcon } from \"@salt-ds/icons\";\nimport { useFloatingTree, useListItem } from \"@floating-ui/react\";\nimport { makePrefixer, useForkRef } from \"../utils\";\n\nimport menuItemCss from \"./MenuItem.css\";\nimport { useIsMenuTrigger } from \"./MenuTriggerContext\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\n\nexport interface MenuItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * If `true`, the item will be disabled.\n   */\n  disabled?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltMenuItem\");\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n  function MenuItem(props, ref) {\n    const {\n      children,\n      className,\n      disabled,\n      onClick,\n      onFocus,\n      onKeyDown,\n      ...rest\n    } = props;\n\n    const { triggersSubmenu, blurActive } = useIsMenuTrigger();\n    const { activeIndex, getItemProps, setFocusInside } = useMenuPanelContext();\n    const item = useListItem();\n    const tree = useFloatingTree();\n    const active = item.index === activeIndex;\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-menu-item\",\n      css: menuItemCss,\n      window: targetWindow,\n    });\n    const handleRef = useForkRef<HTMLDivElement>(ref, item.ref);\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"blurActive\")]: blurActive,\n          },\n          className\n        )}\n        role=\"menuitem\"\n        aria-disabled={disabled || undefined}\n        {...getItemProps({\n          tabIndex: disabled ? undefined : active ? 0 : -1,\n          onKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n            const element = event.currentTarget;\n            onKeyDown?.(event);\n            if (\n              (event.key == \" \" || event.key == \"Enter\") &&\n              !triggersSubmenu &&\n              !disabled\n            ) {\n              event.preventDefault();\n              // eslint-disable-next-line @typescript-eslint/no-unused-vars -- view is unused.\n              const { view, ...eventInit } = event;\n              queueMicrotask(() => {\n                element.dispatchEvent(\n                  new window.MouseEvent(\"click\", eventInit)\n                );\n              });\n              tree?.events.emit(\"click\");\n            }\n          },\n          onClick(event: MouseEvent<HTMLDivElement>) {\n            onClick?.(event);\n            if (!triggersSubmenu && !disabled) {\n              tree?.events.emit(\"click\");\n            }\n          },\n          onFocus(event: FocusEvent<HTMLDivElement>) {\n            onFocus?.(event);\n            setFocusInside(true);\n          },\n          ...rest,\n        })}\n        ref={handleRef}\n      >\n        {children}\n        {triggersSubmenu && (\n          <ChevronRightIcon\n            className={withBaseName(\"expandIcon\")}\n            aria-hidden\n          />\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["MenuItem","menuItemCss"],"mappings":"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"}

package/dist-es/menu/MenuPanel.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltMenuPanel {\n  background: var(--salt-container-primary-background);\n  border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n  overflow: hidden;\n  overflow-y: auto;\n  min-width: 10em;\n  position: relative;\n  z-index: var(--salt-zIndex-popout);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  box-sizing: border-box;\n}\n\n.saltMenuPanel-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-size-border);\n  max-height: inherit;\n  min-height: inherit;\n}\n\n.saltMenuPanel:focus-visible {\n  outline: none;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=MenuPanel.css.js.map

package/dist-es/menu/MenuPanel.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuPanel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-es/menu/MenuPanel.js

@@ -0,0 +1,153 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { clsx } from 'clsx';
+import { FloatingList } from '@floating-ui/react';
+import { useMenuContext } from './MenuContext.js';
+import { MenuPanelBase } from './MenuPanelBase.js';
+import { MenuPanelContext } from './MenuPanelContext.js';
+import { makePrefixer } from '../utils/makePrefixer.js';
+import { useFloatingComponent } from '../utils/useFloatingUI/useFloatingUI.js';
+import { useForkRef } from '../utils/useForkRef.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../breakpoints/BreakpointProvider.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/styles';
+import '@salt-ds/window';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../dialog/DialogHeader.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Code.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextAction.js';
+import '../text/TextNotation.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../interactable-card/InteractableCard.js';
+import '../interactable-card/InteractableCardGroup.js';
+import '../interactable-card/InteractableCardGroupContext.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import './MenuItem.js';
+import './MenuTriggerContext.js';
+import './MenuGroup.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../overlay/OverlayContext.js';
+import '../overlay/OverlayPanel.js';
+import '../overlay/OverlayPanelCloseButton.js';
+import '../overlay/OverlayPanelContent.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../parent-child-layout/ParentChildLayout.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../segmented-button-group/SegmentedButtonGroup.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+
+const withBaseName = makePrefixer("saltMenuPanel");
+const MenuPanel = forwardRef(
+  function MenuPanel2(props, ref) {
+    const { children, className, ...rest } = props;
+    const { Component: FloatingComponent } = useFloatingComponent();
+    const {
+      getItemProps,
+      openState,
+      getFloatingProps,
+      refs,
+      getPanelPosition,
+      context,
+      elementsRef,
+      activeIndex,
+      setFocusInside,
+      isNested
+    } = useMenuContext();
+    const handleRef = useForkRef(ref, refs == null ? void 0 : refs.setFloating);
+    return /* @__PURE__ */ jsx(MenuPanelContext.Provider, {
+      value: { activeIndex, getItemProps, setFocusInside },
+      children: /* @__PURE__ */ jsx(FloatingList, {
+        elementsRef,
+        children: /* @__PURE__ */ jsx(FloatingComponent, {
+          open: openState,
+          role: "menu",
+          ...getFloatingProps(),
+          ...getPanelPosition(),
+          className: clsx(withBaseName(), className),
+          focusManagerProps: context ? {
+            context,
+            initialFocus: isNested ? -1 : 0,
+            returnFocus: !isNested,
+            modal: false
+          } : void 0,
+          tabIndex: -1,
+          ref: handleRef,
+          ...rest,
+          children: /* @__PURE__ */ jsx(MenuPanelBase, {
+            children
+          })
+        })
+      })
+    });
+  }
+);
+
+export { MenuPanel };
+//# sourceMappingURL=MenuPanel.js.map