@salt-ds/core 1.47.1 → 1.47.3

package/dist-cjs/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type ComponentType,\n  type ReactElement,\n  forwardRef,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { Text, type TextProps } from \"../text\";\nimport { type RenderPropsType, capitalize, makePrefixer } from \"../utils\";\nimport linkCss from \"./Link.css\";\nimport { LinkAction } from \"./LinkAction\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps\n  extends Omit<ComponentPropsWithoutRef<\"a\">, \"color\">,\n    Pick<TextProps<\"a\">, \"maxRows\" | \"styleAs\" | \"variant\"> {\n  /**\n   * Icon component displayed for external links. Defaults to `ExternalIcon` from `SemanticIconProvider`.\n   */\n  IconComponent?: ComponentType<IconProps> | null;\n  /**\n   * Render prop to enable customisation of anchor element.\n   */\n  render?: RenderPropsType[\"render\"];\n  /*\n   * The color of the text. Defaults to \"primary\".\n   */\n  color?: \"inherit\" | \"primary\" | \"secondary\" | \"accent\";\n  /**\n   *\n   * Either \"default\" or \"never\".\n   * Determines when underline should be applied to the link.\n   *\n   * @default \"default\".\n   */\n  underline?: \"default\" | \"never\";\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  {\n    IconComponent,\n    href,\n    className,\n    children,\n    color: colorProp,\n    variant,\n    target = \"_self\",\n    underline = \"default\",\n    ...rest\n  },\n  ref,\n): ReactElement<LinkProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-link\",\n    css: linkCss,\n    window: targetWindow,\n  });\n  const { ExternalIcon } = useIcon();\n\n  const color = variant ?? colorProp ?? \"primary\";\n  const LinkIconComponent =\n    IconComponent === undefined ? ExternalIcon : IconComponent;\n\n  return (\n    <Text\n      as={LinkAction}\n      className={clsx(\n        withBaseName(),\n        withBaseName(`underline${capitalize(underline)}`),\n        {\n          [withBaseName(color)]: color !== \"inherit\",\n        },\n        className,\n      )}\n      href={href}\n      ref={ref}\n      target={target}\n      color=\"inherit\"\n      {...rest}\n    >\n      {children}\n      {target === \"_blank\" && (\n        <>\n          {LinkIconComponent && (\n            <LinkIconComponent className={withBaseName(\"icon\")} aria-hidden />\n          )}\n          <span className={withBaseName(\"externalLinkADA\")}>External</span>\n        </>\n      )}\n    </Text>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Link","useWindow","useComponentCssInjection","linkCss","useIcon","jsxs","Text","LinkAction","clsx","capitalize","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA;AAiC/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,aAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACP,OAAA;AAAA,EACA,MAAS,GAAA,OAAA;AAAA,EACT,SAAY,GAAA,SAAA;AAAA,EACZ,GAAG;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,YAAa,EAAA,GAAIC,4BAAQ,EAAA;AAEjC,EAAM,MAAA,KAAA,GAAQ,WAAW,SAAa,IAAA,SAAA;AACtC,EAAM,MAAA,iBAAA,GACJ,aAAkB,KAAA,MAAA,GAAY,YAAe,GAAA,aAAA;AAE/C,EACE,uBAAAC,eAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAAC,qBAAA;AAAA,MACJ,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAa,CAAA,CAAA,SAAA,EAAYC,qBAAW,CAAA,SAAS,CAAC,CAAE,CAAA,CAAA;AAAA,QAChD;AAAA,UACE,CAAC,YAAA,CAAa,KAAK,CAAC,GAAG,KAAU,KAAA;AAAA,SACnC;AAAA,QACA;AAAA,OACF;AAAA,MACA,IAAA;AAAA,MACA,GAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAM,EAAA,SAAA;AAAA,MACL,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,MAAA,KAAW,4BAEPJ,eAAA,CAAAK,mBAAA,EAAA,EAAA,QAAA,EAAA;AAAA,UAAA,iBAAA,mCACE,iBAAkB,EAAA,EAAA,SAAA,EAAW,aAAa,MAAM,CAAA,EAAG,eAAW,IAAC,EAAA,CAAA;AAAA,yCAEjE,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,iBAAiB,GAAG,QAAQ,EAAA,UAAA,EAAA;AAAA,SAC5D,EAAA;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Link.js","sources":["../src/link/Link.tsx"],"sourcesContent":["import type { IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type ComponentType,\n  forwardRef,\n  type ReactElement,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { Text, type TextProps } from \"../text\";\nimport { capitalize, makePrefixer, type RenderPropsType } from \"../utils\";\nimport linkCss from \"./Link.css\";\nimport { LinkAction } from \"./LinkAction\";\n\nconst withBaseName = makePrefixer(\"saltLink\");\n\n/**\n * Links are a fundamental navigation element. When clicked, they take the user to an entirely different page.\n *\n * @example\n * <LinkExample to=\"#link\">Action</LinkExample>\n */\nexport interface LinkProps\n  extends Omit<ComponentPropsWithoutRef<\"a\">, \"color\">,\n    Pick<TextProps<\"a\">, \"maxRows\" | \"styleAs\" | \"variant\"> {\n  /**\n   * Icon component displayed for external links. Defaults to `ExternalIcon` from `SemanticIconProvider`.\n   */\n  IconComponent?: ComponentType<IconProps> | null;\n  /**\n   * Render prop to enable customisation of anchor element.\n   */\n  render?: RenderPropsType[\"render\"];\n  /*\n   * The color of the text. Defaults to \"primary\".\n   */\n  color?: \"inherit\" | \"primary\" | \"secondary\" | \"accent\";\n  /**\n   *\n   * Either \"default\" or \"never\".\n   * Determines when underline should be applied to the link.\n   *\n   * @default \"default\".\n   */\n  underline?: \"default\" | \"never\";\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  {\n    IconComponent,\n    href,\n    className,\n    children,\n    color: colorProp,\n    variant,\n    target = \"_self\",\n    underline = \"default\",\n    ...rest\n  },\n  ref,\n): ReactElement<LinkProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-link\",\n    css: linkCss,\n    window: targetWindow,\n  });\n  const { ExternalIcon } = useIcon();\n\n  const color = variant ?? colorProp ?? \"primary\";\n  const LinkIconComponent =\n    IconComponent === undefined ? ExternalIcon : IconComponent;\n\n  return (\n    <Text\n      as={LinkAction}\n      className={clsx(\n        withBaseName(),\n        withBaseName(`underline${capitalize(underline)}`),\n        {\n          [withBaseName(color)]: color !== \"inherit\",\n        },\n        className,\n      )}\n      href={href}\n      ref={ref}\n      target={target}\n      color=\"inherit\"\n      {...rest}\n    >\n      {children}\n      {target === \"_blank\" && (\n        <>\n          {LinkIconComponent && (\n            <LinkIconComponent className={withBaseName(\"icon\")} aria-hidden />\n          )}\n          <span className={withBaseName(\"externalLinkADA\")}>\n            Opens in a new tab\n          </span>\n        </>\n      )}\n    </Text>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Link","useWindow","useComponentCssInjection","linkCss","useIcon","jsxs","Text","LinkAction","clsx","capitalize","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA;AAiC/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,aAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACP,OAAA;AAAA,EACA,MAAS,GAAA,OAAA;AAAA,EACT,SAAY,GAAA,SAAA;AAAA,EACZ,GAAG;AACL,CAAA,EACA,GACyB,EAAA;AACzB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,YAAa,EAAA,GAAIC,4BAAQ,EAAA;AAEjC,EAAM,MAAA,KAAA,GAAQ,WAAW,SAAa,IAAA,SAAA;AACtC,EAAM,MAAA,iBAAA,GACJ,aAAkB,KAAA,MAAA,GAAY,YAAe,GAAA,aAAA;AAE/C,EACE,uBAAAC,eAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAAC,qBAAA;AAAA,MACJ,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAa,CAAA,CAAA,SAAA,EAAYC,qBAAW,CAAA,SAAS,CAAC,CAAE,CAAA,CAAA;AAAA,QAChD;AAAA,UACE,CAAC,YAAA,CAAa,KAAK,CAAC,GAAG,KAAU,KAAA;AAAA,SACnC;AAAA,QACA;AAAA,OACF;AAAA,MACA,IAAA;AAAA,MACA,GAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAM,EAAA,SAAA;AAAA,MACL,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,MAAA,KAAW,4BAEPJ,eAAA,CAAAK,mBAAA,EAAA,EAAA,QAAA,EAAA;AAAA,UAAA,iBAAA,mCACE,iBAAkB,EAAA,EAAA,SAAA,EAAW,aAAa,MAAM,CAAA,EAAG,eAAW,IAAC,EAAA,CAAA;AAAA,yCAEjE,MAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,iBAAiB,GAAG,QAElD,EAAA,oBAAA,EAAA;AAAA,SACF,EAAA;AAAA;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}

package/dist-cjs/link/LinkAction.js

@@ -1,12 +1,12 @@
 'use strict';
 
 var React = require('react');
+require('clsx');
 var renderProps = require('../utils/renderProps.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
-require('clsx');
 
 const LinkAction = React.forwardRef(
   function LinkAction2(props, ref) {

package/dist-cjs/link-card/LinkCard.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to LinkCard */\n.saltLinkCard {\n  border-radius: var(--saltLinkCard-borderRadius, var(--salt-palette-corner, 0));\n  border-style: var(--saltLinkCard-borderStyle, var(--salt-container-borderStyle));\n  border-width: var(--saltLinkCard-borderWidth, var(--salt-size-fixed-100));\n  box-shadow: var(--salt-overlayable-shadow);\n  display: block;\n  overflow: hidden;\n  padding: var(--saltLinkCard-padding, var(--salt-spacing-200));\n  position: relative;\n  text-decoration: none;\n  transition: box-shadow var(--salt-duration-instant) ease-in-out;\n  --linkCard-accent-color: var(--salt-accent-background);\n}\n\n/* Styles applied to LinkCard when variant=\"primary\" */\n.saltLinkCard-primary {\n  background: var(--saltLinkCard-background, var(--salt-container-primary-background));\n  border-color: var(--salt-container-primary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"secondary\" */\n.saltLinkCard-secondary {\n  background: var(--saltLinkCard-background, var(--salt-container-secondary-background));\n  border-color: var(--salt-container-secondary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"tertiary\" */\n.saltLinkCard-tertiary {\n  background: var(--saltLinkCard-background, var(--salt-container-tertiary-background));\n  border-color: var(--salt-container-tertiary-borderColor);\n}\n\n/* Styles applied to create accent */\n.saltLinkCard-accent::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--saltLinkCard-accent-color, var(--linkCard-accent-color));\n}\n\n/* Styles applied to LinkCard if `accent=\"bottom\"` (default) */\n.saltLinkCard-accentBottom::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  bottom: calc(-1 * var(--salt-size-fixed-100));\n  height: var(--salt-size-bar);\n  width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to LinkCard if `accent=\"left\"` */\n.saltLinkCard-accentLeft::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: calc(100% + var(--salt-size-fixed-200));\n  width: var(--salt-size-bar);\n}\n\n/* Styles applied to LinkCard if `accent=\"top\"` */\n.saltLinkCard-accentTop::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: var(--salt-size-bar);\n  width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to LinkCard if `accent=\"right\"` */\n.saltLinkCard-accentRight::after {\n  right: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: calc(100% + var(--salt-size-fixed-200));\n  width: var(--salt-size-bar);\n}\n\n/* Styles applied to LinkCard on focus */\n.saltLinkCard:focus-visible {\n  cursor: var(--salt-cursor-hover);\n  box-shadow: var(--salt-overlayable-shadow-hover);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: var(--salt-focused-outlineOffset);\n  --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n}\n\n/* Styles applied on hover state to LinkCard */\n@media (hover: hover) {\n  .saltLinkCard:hover {\n    cursor: var(--salt-cursor-hover);\n    box-shadow: var(--salt-overlayable-shadow-hover);\n    border-color: var(--salt-actionable-accented-borderColor-hover);\n  }\n}\n\n/* Styles applied on active state to LinkCard */\n.saltLinkCard:active {\n  cursor: var(--salt-cursor-active);\n  border-color: var(--salt-actionable-accented-borderColor-active);\n  box-shadow: var(--salt-overlayable-shadow);\n}\n";
+var css_248z = "/* Styles applied to LinkCard */\n.saltLinkCard {\n  border-radius: var(--saltLinkCard-borderRadius, var(--salt-palette-corner, 0));\n  border-style: var(--saltLinkCard-borderStyle, var(--salt-borderStyle-solid));\n  border-width: var(--saltLinkCard-borderWidth, var(--salt-size-fixed-100));\n  box-shadow: var(--salt-overlayable-shadow);\n  display: block;\n  overflow: hidden;\n  padding: var(--saltLinkCard-padding, var(--salt-spacing-200));\n  position: relative;\n  text-decoration: none;\n  transition: box-shadow var(--salt-duration-instant) ease-in-out;\n  --linkCard-accent-color: var(--salt-accent-background);\n}\n\n/* Styles applied to LinkCard when variant=\"primary\" */\n.saltLinkCard-primary {\n  background: var(--saltLinkCard-background, var(--salt-container-primary-background));\n  border-color: var(--salt-container-primary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"secondary\" */\n.saltLinkCard-secondary {\n  background: var(--saltLinkCard-background, var(--salt-container-secondary-background));\n  border-color: var(--salt-container-secondary-borderColor);\n}\n\n/* Styles applied to LinkCard when variant=\"tertiary\" */\n.saltLinkCard-tertiary {\n  background: var(--saltLinkCard-background, var(--salt-container-tertiary-background));\n  border-color: var(--salt-container-tertiary-borderColor);\n}\n\n/* Styles applied to create accent */\n.saltLinkCard-accent::after {\n  content: \"\";\n  position: absolute;\n  background-color: var(--saltLinkCard-accent-color, var(--linkCard-accent-color));\n}\n\n/* Styles applied to LinkCard if `accent=\"bottom\"` (default) */\n.saltLinkCard-accentBottom::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  bottom: calc(-1 * var(--salt-size-fixed-100));\n  height: var(--salt-size-bar);\n  width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to LinkCard if `accent=\"left\"` */\n.saltLinkCard-accentLeft::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: calc(100% + var(--salt-size-fixed-200));\n  width: var(--salt-size-bar);\n}\n\n/* Styles applied to LinkCard if `accent=\"top\"` */\n.saltLinkCard-accentTop::after {\n  left: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: var(--salt-size-bar);\n  width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to LinkCard if `accent=\"right\"` */\n.saltLinkCard-accentRight::after {\n  right: calc(-1 * var(--salt-size-fixed-100));\n  top: calc(-1 * var(--salt-size-fixed-100));\n  height: calc(100% + var(--salt-size-fixed-200));\n  width: var(--salt-size-bar);\n}\n\n/* Styles applied to LinkCard on focus */\n.saltLinkCard:focus-visible {\n  cursor: var(--salt-cursor-hover);\n  box-shadow: var(--salt-overlayable-shadow-hover);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: var(--salt-focused-outlineOffset);\n  --linkCard-accent-color: var(--salt-selectable-foreground-hover);\n}\n\n/* Styles applied on hover state to LinkCard */\n@media (hover: hover) {\n  .saltLinkCard:hover {\n    cursor: var(--salt-cursor-hover);\n    box-shadow: var(--salt-overlayable-shadow-hover);\n    border-color: var(--salt-actionable-accented-borderColor-hover);\n  }\n}\n\n/* Styles applied on active state to LinkCard */\n.saltLinkCard:active {\n  cursor: var(--salt-cursor-active);\n  border-color: var(--salt-actionable-accented-borderColor-active);\n  box-shadow: var(--salt-overlayable-shadow);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=LinkCard.css.js.map

package/dist-cjs/list-box/ListBox.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltListBox {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  background: var(--salt-container-primary-background);\n  overflow: auto;\n  padding-top: 1px;\n  padding-bottom: 1px;\n  box-sizing: border-box;\n  isolation: isolate;\n  position: relative;\n  max-height: inherit;\n}\n\n.saltListBox-bordered {\n  border: var(--salt-size-fixed-100) var(--salt-container-borderStyle) var(--salt-container-primary-borderColor);\n  border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltListBox:focus-visible {\n  outline: none;\n}\n";
+var css_248z = ".saltListBox {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  background: var(--salt-container-primary-background);\n  overflow: auto;\n  padding-top: 1px;\n  padding-bottom: 1px;\n  box-sizing: border-box;\n  isolation: isolate;\n  position: relative;\n  max-height: inherit;\n}\n\n.saltListBox-bordered {\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-container-primary-borderColor);\n  border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltListBox:focus-visible {\n  outline: none;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=ListBox.css.js.map

package/dist-cjs/list-box/ListBox.js

@@ -96,7 +96,7 @@ const ListBox = React.forwardRef(function ListBox2(props, ref) {
     if (activeOption === void 0) {
       return;
     }
-    let newActive = void 0;
+    let newActive;
     switch (event.key) {
       case "ArrowDown":
         newActive = getOptionAfter(activeOption) ?? getLastOption();
@@ -140,11 +140,6 @@ const ListBox = React.forwardRef(function ListBox2(props, ref) {
     wasMouseDown.current = true;
   };
   const handleFocus = (event) => {
-    var _a;
-    const activeElement = targetWindow == null ? void 0 : targetWindow.document.activeElement;
-    if (activeElement && ((_a = listRef.current) == null ? void 0 : _a.contains(activeElement))) {
-      listRef.current.focus({ preventScroll: true });
-    }
     if (wasMouseDown.current) {
       wasMouseDown.current = false;
       return;
@@ -152,7 +147,7 @@ const ListBox = React.forwardRef(function ListBox2(props, ref) {
     setFocusVisibleState(true);
     wasMouseDown.current = false;
     const activeIndex = activeState ? getIndexOfOption(activeState) : -1;
-    let newActive = void 0;
+    let newActive;
     if (activeIndex > 0) {
       return;
     }

package/dist-cjs/list-box/ListBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListBox.js","sources":["../src/list-box/ListBox.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  type ForwardedRef,\n  type KeyboardEvent,\n  type ReactNode,\n  type Ref,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport {\n  ListControlContext,\n  type OptionValue,\n} from \"../list-control/ListControlContext\";\nimport {\n  type ListControlProps,\n  defaultValueToString,\n  useListControl,\n} from \"../list-control/ListControlState\";\nimport { makePrefixer, useForkRef } from \"../utils\";\n\nimport listBoxCss from \"./ListBox.css\";\n\nexport type ListBoxProps<Item = string> = {\n  /**\n   * If `true`, the list box will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `false`, the list box will have not a border.\n   */\n  bordered?: boolean;\n  /**\n   * The options to display in the list box.\n   */\n  children?: ReactNode;\n  /**\n   * If `true`, the list box will be multiselect.\n   */\n  multiselect?: boolean;\n} & ComponentPropsWithoutRef<\"div\"> &\n  Omit<ListControlProps<Item>, \"onOpenChange\">;\n\nconst withBaseName = makePrefixer(\"saltListBox\");\n\nexport const ListBox = forwardRef(function ListBox<Item>(\n  props: ListBoxProps<Item>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    bordered,\n    className,\n    children,\n    defaultSelected,\n    disabled,\n    selected,\n    onSelectionChange,\n    multiselect,\n    valueToString = defaultValueToString,\n    onKeyDown,\n    onFocus,\n    onBlur,\n    ...rest\n  } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list-box\",\n    css: listBoxCss,\n    window: targetWindow,\n  });\n\n  const listControl = useListControl<Item>({\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    valueToString,\n    disabled,\n  });\n\n  const {\n    activeState,\n    setActive,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    getFirstOption,\n    getLastOption,\n    getOptionAfter,\n    getOptionBefore,\n    getOptionPageAbove,\n    getOptionPageBelow,\n    selectedState,\n    select,\n    setFocusVisibleState,\n    setFocusedState,\n    listRef,\n  } = listControl;\n\n  const typeaheadString = useRef(\"\");\n  const typeaheadTimeout = useRef<number | undefined>();\n\n  const handleTypeahead = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (typeaheadTimeout.current) {\n      clearTimeout(typeaheadTimeout.current);\n    }\n    typeaheadString.current += event.key;\n    typeaheadTimeout.current = window.setTimeout(() => {\n      typeaheadString.current = \"\";\n    }, 500);\n\n    let newOption = getOptionFromSearch(typeaheadString.current, activeState);\n\n    if (!newOption) {\n      newOption = getOptionFromSearch(typeaheadString.current);\n    }\n\n    if (newOption) {\n      setActive(newOption);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n\n    if (\n      event.key.length === 1 &&\n      !event.ctrlKey &&\n      !event.metaKey &&\n      !event.altKey\n    ) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleTypeahead(event);\n    }\n\n    const activeOption = activeState ?? getFirstOption()?.data;\n\n    if (activeOption === undefined) {\n      return;\n    }\n\n    let newActive:\n      | { data: OptionValue<Item>; element: HTMLElement }\n      | undefined = undefined;\n    switch (event.key) {\n      case \"ArrowDown\":\n        newActive = getOptionAfter(activeOption) ?? getLastOption();\n        break;\n      case \"ArrowUp\":\n        newActive = getOptionBefore(activeOption) ?? getFirstOption();\n        break;\n      case \"Home\":\n        newActive = getFirstOption();\n        break;\n      case \"End\":\n        newActive = getLastOption();\n        break;\n      case \"PageUp\":\n        newActive = getOptionPageAbove(activeOption);\n        break;\n      case \"PageDown\":\n        newActive = getOptionPageBelow(activeOption);\n        break;\n      case \"Enter\":\n      case \" \":\n        if (\n          Boolean(activeState?.disabled) ||\n          (typeaheadString.current.trim().length > 0 && event.key === \" \")\n        ) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!activeState) {\n          return;\n        }\n\n        event.preventDefault();\n        select(event, activeState);\n\n        break;\n    }\n\n    if (newActive && newActive.data.id !== activeState?.id) {\n      event.preventDefault();\n      setActive(newActive.data);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const wasMouseDown = useRef(false);\n\n  const handleMouseDown = () => {\n    wasMouseDown.current = true;\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n    const activeElement = targetWindow?.document.activeElement;\n    if (activeElement && listRef.current?.contains(activeElement)) {\n      listRef.current.focus({ preventScroll: true });\n    }\n\n    if (wasMouseDown.current) {\n      wasMouseDown.current = false;\n      return;\n    }\n\n    setFocusVisibleState(true);\n    wasMouseDown.current = false;\n\n    // We check the active index because the active item may have been removed\n    const activeIndex = activeState ? getIndexOfOption(activeState) : -1;\n    let newActive = undefined;\n\n    // If the active item is still in the list, we don't need to do anything\n    if (activeIndex > 0) {\n      return;\n    }\n\n    // If we have selected an item, we should make that the active item\n    if (selectedState.length > 0) {\n      newActive = getOptionsMatching(\n        (option) => option.value === selectedState[0],\n      ).pop();\n    }\n\n    // If we still don't have an active item, we should just select the first item\n    if (!newActive) {\n      newActive = getOptionAtIndex(0);\n    }\n\n    setActive(newActive?.data);\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n    setFocusedState(false);\n    setActive(undefined);\n    onBlur?.(event);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n    setActive(undefined);\n  };\n\n  const handleRef = useForkRef(listRef, ref);\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <div\n        className={clsx(\n          withBaseName(),\n          { [withBaseName(\"bordered\")]: bordered },\n          className,\n        )}\n        role=\"listbox\"\n        aria-activedescendant={activeState?.id}\n        aria-disabled={disabled || undefined}\n        aria-multiselectable={multiselect}\n        tabIndex={disabled ? -1 : 0}\n        onKeyDown={handleKeyDown}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        onMouseOver={handleListMouseOver}\n        onMouseDown={handleMouseDown}\n        ref={handleRef}\n        {...rest}\n      >\n        {children}\n      </div>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: ListBoxProps<Item> & { ref?: Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ListBox","defaultValueToString","useWindow","useComponentCssInjection","listBoxCss","useListControl","useRef","useForkRef","jsx","ListControlContext","clsx"],"mappings":"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"}
+{"version":3,"file":"ListBox.js","sources":["../src/list-box/ListBox.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  type ForwardedRef,\n  forwardRef,\n  type KeyboardEvent,\n  type ReactNode,\n  type Ref,\n  useRef,\n} from \"react\";\nimport {\n  ListControlContext,\n  type OptionValue,\n} from \"../list-control/ListControlContext\";\nimport {\n  defaultValueToString,\n  type ListControlProps,\n  useListControl,\n} from \"../list-control/ListControlState\";\nimport { makePrefixer, useForkRef } from \"../utils\";\n\nimport listBoxCss from \"./ListBox.css\";\n\nexport type ListBoxProps<Item = string> = {\n  /**\n   * If `true`, the list box will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If `false`, the list box will have not a border.\n   */\n  bordered?: boolean;\n  /**\n   * The options to display in the list box.\n   */\n  children?: ReactNode;\n  /**\n   * If `true`, the list box will be multiselect.\n   */\n  multiselect?: boolean;\n} & ComponentPropsWithoutRef<\"div\"> &\n  Omit<ListControlProps<Item>, \"onOpenChange\">;\n\nconst withBaseName = makePrefixer(\"saltListBox\");\n\nexport const ListBox = forwardRef(function ListBox<Item>(\n  props: ListBoxProps<Item>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    bordered,\n    className,\n    children,\n    defaultSelected,\n    disabled,\n    selected,\n    onSelectionChange,\n    multiselect,\n    valueToString = defaultValueToString,\n    onKeyDown,\n    onFocus,\n    onBlur,\n    ...rest\n  } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-list-box\",\n    css: listBoxCss,\n    window: targetWindow,\n  });\n\n  const listControl = useListControl<Item>({\n    multiselect,\n    defaultSelected,\n    selected,\n    onSelectionChange,\n    valueToString,\n    disabled,\n  });\n\n  const {\n    activeState,\n    setActive,\n    getOptionAtIndex,\n    getIndexOfOption,\n    getOptionsMatching,\n    getOptionFromSearch,\n    getFirstOption,\n    getLastOption,\n    getOptionAfter,\n    getOptionBefore,\n    getOptionPageAbove,\n    getOptionPageBelow,\n    selectedState,\n    select,\n    setFocusVisibleState,\n    setFocusedState,\n    listRef,\n  } = listControl;\n\n  const typeaheadString = useRef(\"\");\n  const typeaheadTimeout = useRef<number | undefined>();\n\n  const handleTypeahead = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (typeaheadTimeout.current) {\n      clearTimeout(typeaheadTimeout.current);\n    }\n    typeaheadString.current += event.key;\n    typeaheadTimeout.current = window.setTimeout(() => {\n      typeaheadString.current = \"\";\n    }, 500);\n\n    let newOption = getOptionFromSearch(typeaheadString.current, activeState);\n\n    if (!newOption) {\n      newOption = getOptionFromSearch(typeaheadString.current);\n    }\n\n    if (newOption) {\n      setActive(newOption);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n\n    if (\n      event.key.length === 1 &&\n      !event.ctrlKey &&\n      !event.metaKey &&\n      !event.altKey\n    ) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleTypeahead(event);\n    }\n\n    const activeOption = activeState ?? getFirstOption()?.data;\n\n    if (activeOption === undefined) {\n      return;\n    }\n\n    let newActive:\n      | { data: OptionValue<Item>; element: HTMLElement }\n      | undefined;\n    switch (event.key) {\n      case \"ArrowDown\":\n        newActive = getOptionAfter(activeOption) ?? getLastOption();\n        break;\n      case \"ArrowUp\":\n        newActive = getOptionBefore(activeOption) ?? getFirstOption();\n        break;\n      case \"Home\":\n        newActive = getFirstOption();\n        break;\n      case \"End\":\n        newActive = getLastOption();\n        break;\n      case \"PageUp\":\n        newActive = getOptionPageAbove(activeOption);\n        break;\n      case \"PageDown\":\n        newActive = getOptionPageBelow(activeOption);\n        break;\n      case \"Enter\":\n      case \" \":\n        if (\n          Boolean(activeState?.disabled) ||\n          (typeaheadString.current.trim().length > 0 && event.key === \" \")\n        ) {\n          event.preventDefault();\n          return;\n        }\n\n        if (!activeState) {\n          return;\n        }\n\n        event.preventDefault();\n        select(event, activeState);\n\n        break;\n    }\n\n    if (newActive && newActive.data.id !== activeState?.id) {\n      event.preventDefault();\n      setActive(newActive.data);\n      setFocusVisibleState(true);\n    }\n  };\n\n  const wasMouseDown = useRef(false);\n\n  const handleMouseDown = () => {\n    wasMouseDown.current = true;\n  };\n\n  const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n    if (wasMouseDown.current) {\n      wasMouseDown.current = false;\n      return;\n    }\n\n    setFocusVisibleState(true);\n    wasMouseDown.current = false;\n\n    // We check the active index because the active item may have been removed\n    const activeIndex = activeState ? getIndexOfOption(activeState) : -1;\n    let newActive: ReturnType<typeof getOptionAtIndex>;\n\n    // If the active item is still in the list, we don't need to do anything\n    if (activeIndex > 0) {\n      return;\n    }\n\n    // If we have selected an item, we should make that the active item\n    if (selectedState.length > 0) {\n      newActive = getOptionsMatching(\n        (option) => option.value === selectedState[0],\n      ).pop();\n    }\n\n    // If we still don't have an active item, we should just select the first item\n    if (!newActive) {\n      newActive = getOptionAtIndex(0);\n    }\n\n    setActive(newActive?.data);\n    setFocusedState(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n    setFocusedState(false);\n    setActive(undefined);\n    onBlur?.(event);\n  };\n\n  const handleListMouseOver = () => {\n    setFocusVisibleState(false);\n    setActive(undefined);\n  };\n\n  const handleRef = useForkRef(listRef, ref);\n\n  return (\n    <ListControlContext.Provider value={listControl}>\n      <div\n        className={clsx(\n          withBaseName(),\n          { [withBaseName(\"bordered\")]: bordered },\n          className,\n        )}\n        role=\"listbox\"\n        aria-activedescendant={activeState?.id}\n        aria-disabled={disabled || undefined}\n        aria-multiselectable={multiselect}\n        tabIndex={disabled ? -1 : 0}\n        onKeyDown={handleKeyDown}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        onMouseOver={handleListMouseOver}\n        onMouseDown={handleMouseDown}\n        ref={handleRef}\n        {...rest}\n      >\n        {children}\n      </div>\n    </ListControlContext.Provider>\n  );\n}) as <Item = string>(\n  props: ListBoxProps<Item> & { ref?: Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["makePrefixer","forwardRef","ListBox","defaultValueToString","useWindow","useComponentCssInjection","listBoxCss","useListControl","useRef","useForkRef","jsx","ListControlContext","clsx"],"mappings":"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"}

package/dist-cjs/list-control/ListControlContext.js

@@ -2,8 +2,8 @@
 
 var React = require('react');
 var createContext = require('../utils/createContext.js');
-require('react/jsx-runtime');
 require('clsx');
+require('react/jsx-runtime');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');
@@ -31,7 +31,8 @@ const ListControlContext = createContext.createContext(
     multiselect: false,
     focusVisibleState: false,
     valueToString: ListControlState.defaultValueToString,
-    disabled: false
+    disabled: false,
+    listRef: void 0
   }
 );
 function useListControlContext() {

package/dist-cjs/list-control/ListControlContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement,\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n  valueToString: (item: Item) => string;\n  disabled?: boolean;\n}\n\n// biome-ignore lint/suspicious/noExplicitAny: Need to use any here as a wider type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n    valueToString: defaultValueToString,\n    disabled: false,\n  },\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;;;;;AA8BO,MAAM,kBAAqB,GAAAA,2BAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,MAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,MAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,IACf,QAAU,EAAA;AAAA;AAEd;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA;AACtC;;;;;"}
+{"version":3,"file":"ListControlContext.js","sources":["../src/list-control/ListControlContext.tsx"],"sourcesContent":["import { type RefObject, type SyntheticEvent, useContext } from \"react\";\nimport { createContext } from \"../utils\";\nimport { defaultValueToString } from \"./ListControlState\";\n\nexport interface OptionValue<Item> {\n  id: string;\n  disabled: boolean;\n  value: Item;\n}\n\nexport type OpenChangeReason = \"input\" | \"manual\";\n\nexport interface ListControlContextValue<Item> {\n  openState: boolean;\n  setOpen: (newOpen: boolean, openChangeReason?: OpenChangeReason) => void;\n  register: (\n    optionValue: OptionValue<Item>,\n    element: HTMLElement,\n  ) => () => void;\n  selectedState: unknown[];\n  select: (event: SyntheticEvent, option: OptionValue<Item>) => void;\n  activeState?: OptionValue<Item>;\n  setActive: (option: OptionValue<Item>) => void;\n  multiselect: boolean;\n  focusVisibleState: boolean;\n  valueToString: (item: Item) => string;\n  disabled?: boolean;\n  listRef?: RefObject<HTMLDivElement>;\n}\n\n// biome-ignore lint/suspicious/noExplicitAny: Need to use any here as a wider type but it gets narrowed when using the useListControl hook.\nexport const ListControlContext = createContext<ListControlContextValue<any>>(\n  \"ListControlContext\",\n  {\n    openState: false,\n    setOpen() {\n      return undefined;\n    },\n    register() {\n      return () => undefined;\n    },\n    selectedState: [],\n    select() {\n      return undefined;\n    },\n    activeState: undefined,\n    setActive() {\n      return undefined;\n    },\n    multiselect: false,\n    focusVisibleState: false,\n    valueToString: defaultValueToString,\n    disabled: false,\n    listRef: undefined,\n  },\n);\n\nexport function useListControlContext<Item>() {\n  return useContext(ListControlContext) as ListControlContextValue<Item>;\n}\n"],"names":["createContext","defaultValueToString","useContext"],"mappings":";;;;;;;;;;;;AA+BO,MAAM,kBAAqB,GAAAA,2BAAA;AAAA,EAChC,oBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,OAAU,GAAA;AACR,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,QAAW,GAAA;AACT,MAAA,OAAO,MAAM,MAAA;AAAA,KACf;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,MAAS,GAAA;AACP,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,MAAA;AAAA,IACb,SAAY,GAAA;AACV,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,WAAa,EAAA,KAAA;AAAA,IACb,iBAAmB,EAAA,KAAA;AAAA,IACnB,aAAe,EAAAC,qCAAA;AAAA,IACf,QAAU,EAAA,KAAA;AAAA,IACV,OAAS,EAAA;AAAA;AAEb;AAEO,SAAS,qBAA8B,GAAA;AAC5C,EAAA,OAAOC,iBAAW,kBAAkB,CAAA;AACtC;;;;;"}

package/dist-cjs/list-control/ListControlState.js

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-require('react/jsx-runtime');
 require('clsx');
+require('react/jsx-runtime');
 var useControlled = require('../utils/useControlled.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');

package/dist-cjs/menu/MenuBase.js

@@ -5,9 +5,9 @@ var react = require('@floating-ui/react');
 var React = require('react');
 require('clsx');
 var useControlled = require('../utils/useControlled.js');
+var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
 var useFloatingUI = require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
-var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
 var MenuContext = require('./MenuContext.js');

package/dist-cjs/menu/MenuBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBase.js","sources":["../src/menu/MenuBase.tsx"],"sourcesContent":["import {\n  FloatingNode,\n  type ReferenceType,\n  flip,\n  limitShift,\n  offset,\n  safePolygon,\n  shift,\n  size,\n  useClick,\n  useDismiss,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useFloatingTree,\n  useHover,\n  useInteractions,\n  useListNavigation,\n  useRole,\n} from \"@floating-ui/react\";\nimport {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  type UseFloatingUIProps,\n  useControlled,\n  useFloatingUI,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { MenuContext } from \"./MenuContext\";\n\nexport interface MenuBaseProps {\n  children?: ReactNode;\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * If true, the menu will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (newOpen: boolean) => void;\n  /**\n   * Set the placement of the Menu component relative to the trigger element. Defaults to `bottom-start` if it's the root menu or `right-start` if it's nested.\n   */\n  placement?: UseFloatingUIProps[\"placement\"];\n  /**\n   * Function that returns a [virtual element](https://floating-ui.com/docs/virtual-elements). If this is provided, it will override MenuTrigger.\n   */\n  getVirtualElement?: () => ReferenceType | null;\n}\n\nexport function MenuBase(props: MenuBaseProps) {\n  const {\n    children,\n    defaultOpen,\n    open,\n    onOpenChange,\n    placement,\n    getVirtualElement,\n  } = props;\n  const parentId = useFloatingParentNodeId();\n  const nodeId = useFloatingNodeId();\n  const tree = useFloatingTree();\n  const elementsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const setOpen = useCallback(\n    (newOpen: boolean) => {\n      setOpenState(newOpen);\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange],\n  );\n\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [focusInside, setFocusInside] = useState(false);\n\n  const isNested = parentId != null;\n\n  const { x, y, strategy, elements, refs, context } = useFloatingUI({\n    nodeId,\n    open: openState,\n    onOpenChange: setOpen,\n    strategy: !getVirtualElement ? \"absolute\" : \"fixed\",\n    placement:\n      placement ??\n      (isNested || getVirtualElement ? \"right-start\" : \"bottom-start\"),\n    middleware: [\n      // Align the nested menu by shifting it by var(--salt-spacing-fixed-100)\n      offset(\n        isNested ? { crossAxis: -1, mainAxis: 2 } : !getVirtualElement ? 1 : 0,\n      ),\n      flip({}),\n      shift({ limiter: limitShift() }),\n      size({\n        apply({ elements, availableHeight }) {\n          Object.assign(elements.floating.style, {\n            maxHeight: `${availableHeight}px`,\n          });\n        },\n      }),\n    ],\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (getVirtualElement) {\n      refs.setPositionReference(getVirtualElement());\n    }\n  }, [getVirtualElement, refs]);\n\n  const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(\n    [\n      useHover(context, {\n        enabled: isNested && !focusInside,\n        handleClose: safePolygon({ blockPointerEvents: true }),\n      }),\n      useClick(context, {\n        event: \"mousedown\",\n        toggle: !isNested,\n        ignoreMouse: isNested,\n      }),\n      useRole(context, { role: \"menu\" }),\n      useDismiss(context, { bubbles: true }),\n      useListNavigation(context, {\n        listRef: elementsRef,\n        activeIndex,\n        nested: isNested,\n        onNavigate: setActiveIndex,\n      }),\n    ],\n  );\n\n  const getPanelPosition = () => ({\n    top: y ?? 0,\n    left: x ?? 0,\n    position: strategy,\n    width: elements.floating?.offsetWidth,\n    height: elements.floating?.offsetHeight,\n  });\n\n  useEffect(() => {\n    if (!tree) return;\n\n    function handleItemClick() {\n      setOpen(false);\n    }\n\n    tree.events.on(\"click\", handleItemClick);\n\n    return () => {\n      tree.events.off(\"click\", handleItemClick);\n    };\n  }, [tree, setOpen]);\n\n  return (\n    <FloatingNode id={nodeId}>\n      <MenuContext.Provider\n        value={{\n          openState,\n          getReferenceProps,\n          getFloatingProps,\n          refs,\n          getPanelPosition,\n          getItemProps,\n          activeIndex,\n          context,\n          elementsRef,\n          focusInside,\n          setFocusInside,\n          isNested,\n        }}\n      >\n        {children}\n      </MenuContext.Provider>\n    </FloatingNode>\n  );\n}\n"],"names":["useFloatingParentNodeId","useFloatingNodeId","useFloatingTree","useRef","useControlled","useCallback","useState","useFloatingUI","offset","flip","shift","limitShift","size","elements","useIsomorphicLayoutEffect","useInteractions","useHover","safePolygon","useClick","useRole","useDismiss","useListNavigation","useEffect","jsx","FloatingNode","MenuContext"],"mappings":"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"}
+{"version":3,"file":"MenuBase.js","sources":["../src/menu/MenuBase.tsx"],"sourcesContent":["import {\n  FloatingNode,\n  flip,\n  limitShift,\n  offset,\n  type ReferenceType,\n  safePolygon,\n  shift,\n  size,\n  useClick,\n  useDismiss,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useFloatingTree,\n  useHover,\n  useInteractions,\n  useListNavigation,\n  useRole,\n} from \"@floating-ui/react\";\nimport {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  type UseFloatingUIProps,\n  useControlled,\n  useFloatingUI,\n  useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { MenuContext } from \"./MenuContext\";\n\nexport interface MenuBaseProps {\n  children?: ReactNode;\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * If true, the menu will be open by default.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (newOpen: boolean) => void;\n  /**\n   * Set the placement of the Menu component relative to the trigger element. Defaults to `bottom-start` if it's the root menu or `right-start` if it's nested.\n   */\n  placement?: UseFloatingUIProps[\"placement\"];\n  /**\n   * Function that returns a [virtual element](https://floating-ui.com/docs/virtual-elements). If this is provided, it will override MenuTrigger.\n   */\n  getVirtualElement?: () => ReferenceType | null;\n}\n\nexport function MenuBase(props: MenuBaseProps) {\n  const {\n    children,\n    defaultOpen,\n    open,\n    onOpenChange,\n    placement,\n    getVirtualElement,\n  } = props;\n  const parentId = useFloatingParentNodeId();\n  const nodeId = useFloatingNodeId();\n  const tree = useFloatingTree();\n  const elementsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: Boolean(defaultOpen),\n    name: \"ListControl\",\n    state: \"open\",\n  });\n\n  const setOpen = useCallback(\n    (newOpen: boolean) => {\n      setOpenState(newOpen);\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange],\n  );\n\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [focusInside, setFocusInside] = useState(false);\n\n  const isNested = parentId != null;\n\n  const { x, y, strategy, elements, refs, context } = useFloatingUI({\n    nodeId,\n    open: openState,\n    onOpenChange: setOpen,\n    strategy: !getVirtualElement ? \"absolute\" : \"fixed\",\n    placement:\n      placement ??\n      (isNested || getVirtualElement ? \"right-start\" : \"bottom-start\"),\n    middleware: [\n      // Align the nested menu by shifting it by var(--salt-spacing-fixed-100)\n      offset(\n        isNested ? { crossAxis: -1, mainAxis: 2 } : !getVirtualElement ? 1 : 0,\n      ),\n      flip({}),\n      shift({ limiter: limitShift() }),\n      size({\n        apply({ elements, availableHeight }) {\n          Object.assign(elements.floating.style, {\n            maxHeight: `${availableHeight}px`,\n          });\n        },\n      }),\n    ],\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    if (getVirtualElement) {\n      refs.setPositionReference(getVirtualElement());\n    }\n  }, [getVirtualElement, refs]);\n\n  const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(\n    [\n      useHover(context, {\n        enabled: isNested && !focusInside,\n        handleClose: safePolygon({ blockPointerEvents: true }),\n      }),\n      useClick(context, {\n        event: \"mousedown\",\n        toggle: !isNested,\n        ignoreMouse: isNested,\n      }),\n      useRole(context, { role: \"menu\" }),\n      useDismiss(context, { bubbles: true }),\n      useListNavigation(context, {\n        listRef: elementsRef,\n        activeIndex,\n        nested: isNested,\n        onNavigate: setActiveIndex,\n      }),\n    ],\n  );\n\n  const getPanelPosition = () => ({\n    top: y ?? 0,\n    left: x ?? 0,\n    position: strategy,\n    width: elements.floating?.offsetWidth,\n    height: elements.floating?.offsetHeight,\n  });\n\n  useEffect(() => {\n    if (!tree) return;\n\n    function handleItemClick() {\n      setOpen(false);\n    }\n\n    tree.events.on(\"click\", handleItemClick);\n\n    return () => {\n      tree.events.off(\"click\", handleItemClick);\n    };\n  }, [tree, setOpen]);\n\n  return (\n    <FloatingNode id={nodeId}>\n      <MenuContext.Provider\n        value={{\n          openState,\n          getReferenceProps,\n          getFloatingProps,\n          refs,\n          getPanelPosition,\n          getItemProps,\n          activeIndex,\n          context,\n          elementsRef,\n          focusInside,\n          setFocusInside,\n          isNested,\n        }}\n      >\n        {children}\n      </MenuContext.Provider>\n    </FloatingNode>\n  );\n}\n"],"names":["useFloatingParentNodeId","useFloatingNodeId","useFloatingTree","useRef","useControlled","useCallback","useState","useFloatingUI","offset","flip","shift","limitShift","size","elements","useIsomorphicLayoutEffect","useInteractions","useHover","safePolygon","useClick","useRole","useDismiss","useListNavigation","useEffect","jsx","FloatingNode","MenuContext"],"mappings":"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"}

package/dist-cjs/menu/MenuContext.js

@@ -2,8 +2,8 @@
 
 var React = require('react');
 var createContext = require('../utils/createContext.js');
-require('react/jsx-runtime');
 require('clsx');
+require('react/jsx-runtime');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');

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

@@ -1 +1 @@
-{"version":3,"file":"MenuContext.js","sources":["../src/menu/MenuContext.ts"],"sourcesContent":["import type { useInteractions } from \"@floating-ui/react\";\nimport {\n  type Dispatch,\n  type MutableRefObject,\n  type SetStateAction,\n  useContext,\n} from \"react\";\nimport { type UseFloatingUIReturn, createContext } 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":["createContext","useContext"],"mappings":";;;;;;;;;;;AA0Ba,MAAA,WAAA,GAAcA,4BAAgC,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,MAAA;AAAA,EACtB,QAAU,EAAA;AACZ,CAAC;AAEM,SAAS,cAAiB,GAAA;AAC/B,EAAA,OAAOC,iBAAW,WAAW,CAAA;AAC/B;;;;;"}
+{"version":3,"file":"MenuContext.js","sources":["../src/menu/MenuContext.ts"],"sourcesContent":["import type { useInteractions } from \"@floating-ui/react\";\nimport {\n  type Dispatch,\n  type MutableRefObject,\n  type SetStateAction,\n  useContext,\n} from \"react\";\nimport { createContext, type 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":["createContext","useContext"],"mappings":";;;;;;;;;;;AA0Ba,MAAA,WAAA,GAAcA,4BAAgC,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,MAAA;AAAA,EACtB,QAAU,EAAA;AACZ,CAAC;AAEM,SAAS,cAAiB,GAAA;AAC/B,EAAA,OAAOC,iBAAW,WAAW,CAAA;AAC/B;;;;;"}

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltMenuGroup-label {\n  background: var(--salt-container-primary-background);\n  color: var(--salt-content-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-label-fontFamily);\n  line-height: var(--salt-text-label-lineHeight);\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n  display: flex;\n  box-sizing: border-box;\n}\n\n.saltMenuGroup {\n  border-top: var(--salt-size-fixed-100) var(--salt-separable-borderStyle) var(--salt-separable-tertiary-borderColor);\n}\n\n.saltMenuGroup:first-of-type {\n  border-top: 0;\n}\n";
+var css_248z = ".saltMenuGroup-label {\n  background: var(--salt-container-primary-background);\n  color: var(--salt-content-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-label-fontFamily);\n  line-height: var(--salt-text-label-lineHeight);\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n  display: flex;\n  box-sizing: border-box;\n}\n\n.saltMenuGroup {\n  border-top: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-tertiary-borderColor);\n}\n\n.saltMenuGroup:first-of-type {\n  border-top: 0;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=MenuGroup.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MenuGroup.js","sources":["../src/menu/MenuGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\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":["makePrefixer","forwardRef","MenuGroup","useWindow","useComponentCssInjection","menuGroupCss","useId","jsxs","clsx","jsx"],"mappings":";;;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,KAAO,EAAA,GAAG,MAAS,GAAA,KAAA;AAEhD,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,UAAUC,WAAM,EAAA;AAEtB,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,iBAAA,EAAiB,QAAQ,OAAU,GAAA,MAAA;AAAA,QACnC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,OAAA;AAAA,QACL,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UACC,KAAA,oBAAAC,cAAA,CAAC,KAAI,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA,SAAA,EAAW,aAAa,OAAO,CAAA,EAAG,EAAI,EAAA,OAAA,EACpD,QACH,EAAA,KAAA,EAAA,CAAA;AAAA,UAED;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"MenuGroup.js","sources":["../src/menu/MenuGroup.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, 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":["makePrefixer","forwardRef","MenuGroup","useWindow","useComponentCssInjection","menuGroupCss","useId","jsxs","clsx","jsx"],"mappings":";;;;;;;;;;;;;;AAsBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,KAAO,EAAA,GAAG,MAAS,GAAA,KAAA;AAEhD,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,UAAUC,WAAM,EAAA;AAEtB,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,iBAAA,EAAiB,QAAQ,OAAU,GAAA,MAAA;AAAA,QACnC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,IAAK,EAAA,OAAA;AAAA,QACL,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UACC,KAAA,oBAAAC,cAAA,CAAC,KAAI,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA,SAAA,EAAW,aAAa,OAAO,CAAA,EAAG,EAAI,EAAA,OAAA,EACpD,QACH,EAAA,KAAA,EAAA,CAAA;AAAA,UAED;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}

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

@@ -1,6 +1,6 @@
 'use strict';
 
-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  letter-spacing: var(--salt-text-letterSpacing);\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: relative;\n  cursor: var(--salt-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-fixed-100) * -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-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-fixed-100) 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-content-primary-foreground-disabled);\n  cursor: var(--salt-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-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n  box-shadow: 0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected), 0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n/* TODO: Find a better way of doing this */\n.saltMenuItem .saltIcon:not(.saltCheckboxIcon-icon) {\n  min-height: var(--salt-text-lineHeight);\n}\n\n.saltMenuItem-expandIcon.saltIcon {\n  margin-left: auto;\n}\n";
+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  letter-spacing: var(--salt-text-letterSpacing);\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding: calc(var(--salt-spacing-100) + var(--salt-spacing-25)) var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-spacing-100);\n  position: relative;\n  cursor: var(--salt-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-fixed-100) * -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:\n    0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n    0 var(--salt-size-fixed-100) 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-content-primary-foreground-disabled);\n  cursor: var(--salt-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:\n    0 calc(var(--salt-size-fixed-100) * -1) 0 0 var(--salt-selectable-borderColor-selected),\n    0 var(--salt-size-fixed-100) 0 0 var(--salt-selectable-borderColor-selected);\n}\n\n/* TODO: Find a better way of doing this */\n.saltMenuItem .saltIcon:not(.saltCheckboxIcon-icon) {\n  min-height: var(--salt-text-lineHeight);\n}\n\n.saltMenuItem-expandIcon.saltIcon {\n  margin-left: auto;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=MenuItem.css.js.map

package/dist-cjs/menu/MenuItem.js

@@ -6,13 +6,13 @@ var styles = require('@salt-ds/styles');
 var window$1 = require('@salt-ds/window');
 var clsx = require('clsx');
 var React = require('react');
+var SemanticIconProvider = require('../semantic-icon-provider/SemanticIconProvider.js');
 var makePrefixer = require('../utils/makePrefixer.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
 var useForkRef = require('../utils/useForkRef.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
-var SemanticIconProvider = require('../semantic-icon-provider/SemanticIconProvider.js');
 var MenuItem$1 = require('./MenuItem.css.js');
 var MenuPanelContext = require('./MenuPanelContext.js');
 var MenuTriggerContext = require('./MenuTriggerContext.js');

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

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","sources":["../src/menu/MenuItem.tsx"],"sourcesContent":["import { useFloatingTree, useListItem } from \"@floating-ui/react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  type KeyboardEvent,\n  type MouseEvent,\n  forwardRef,\n} from \"react\";\nimport { makePrefixer, useForkRef } from \"../utils\";\n\nimport { useIcon } from \"../semantic-icon-provider\";\nimport menuItemCss from \"./MenuItem.css\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { useIsMenuTrigger } from \"./MenuTriggerContext\";\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 { ExpandGroupIcon } = useIcon();\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              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            if (!disabled) {\n              onClick?.(event);\n              if (!triggersSubmenu) {\n                tree?.events.emit(\"click\");\n              }\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          <ExpandGroupIcon className={withBaseName(\"expandIcon\")} aria-hidden />\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MenuItem","useIsMenuTrigger","useIcon","useMenuPanelContext","useListItem","useFloatingTree","useWindow","useComponentCssInjection","menuItemCss","useForkRef","jsxs","clsx"],"mappings":"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"}
+{"version":3,"file":"MenuItem.js","sources":["../src/menu/MenuItem.tsx"],"sourcesContent":["import { useFloatingTree, useListItem } from \"@floating-ui/react\";\nimport { 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 KeyboardEvent,\n  type MouseEvent,\n} from \"react\";\nimport { useIcon } from \"../semantic-icon-provider\";\nimport { makePrefixer, useForkRef } from \"../utils\";\nimport menuItemCss from \"./MenuItem.css\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { useIsMenuTrigger } from \"./MenuTriggerContext\";\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 { ExpandGroupIcon } = useIcon();\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              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            if (!disabled) {\n              onClick?.(event);\n              if (!triggersSubmenu) {\n                tree?.events.emit(\"click\");\n              }\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          <ExpandGroupIcon className={withBaseName(\"expandIcon\")} aria-hidden />\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MenuItem","useIsMenuTrigger","useIcon","useMenuPanelContext","useListItem","useFloatingTree","useWindow","useComponentCssInjection","menuItemCss","useForkRef","jsxs","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;AAuBA,MAAM,YAAA,GAAeA,0BAAa,cAAc,CAAA;AAEzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SAAS,CAAA,KAAA,EAAO,GAAK,EAAA;AAC5B,IAAM,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,EAAE,eAAA,EAAiB,UAAW,EAAA,GAAIC,mCAAiB,EAAA;AACzD,IAAM,MAAA,EAAE,eAAgB,EAAA,GAAIC,4BAAQ,EAAA;AACpC,IAAA,MAAM,EAAE,WAAA,EAAa,YAAc,EAAA,cAAA,KAAmBC,oCAAoB,EAAA;AAC1E,IAAA,MAAM,OAAOC,iBAAY,EAAA;AACzB,IAAA,MAAM,OAAOC,qBAAgB,EAAA;AAC7B,IAAM,MAAA,MAAA,GAAS,KAAK,KAAU,KAAA,WAAA;AAC9B,IAAA,MAAM,eAAeC,kBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IAAA,MAAM,SAAY,GAAAC,qBAAA,CAA2B,GAAK,EAAA,IAAA,CAAK,GAAG,CAAA;AAC1D,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAAC,SAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG;AAAA,WAChC;AAAA,UACA;AAAA,SACF;AAAA,QACA,IAAK,EAAA,UAAA;AAAA,QACL,iBAAe,QAAY,IAAA,MAAA;AAAA,QAC1B,GAAG,YAAa,CAAA;AAAA,UACf,QAAU,EAAA,QAAA,GAAW,MAAY,GAAA,MAAA,GAAS,CAAI,GAAA,EAAA;AAAA,UAC9C,UAAU,KAAsC,EAAA;AAC9C,YAAA,MAAM,UAAU,KAAM,CAAA,aAAA;AACtB,YAAY,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,KAAA,CAAA;AACZ,YACG,IAAA,CAAA,KAAA,CAAM,QAAQ,GAAO,IAAA,KAAA,CAAM,QAAQ,OACpC,KAAA,CAAC,eACD,IAAA,CAAC,QACD,EAAA;AACA,cAAA,KAAA,CAAM,cAAe,EAAA;AACrB,cAAA,MAAM,EAAE,IAAA,EAAM,GAAG,SAAA,EAAc,GAAA,KAAA;AAC/B,cAAA,cAAA,CAAe,MAAM;AACnB,gBAAQ,OAAA,CAAA,aAAA;AAAA,kBACN,IAAI,MAAA,CAAO,UAAW,CAAA,OAAA,EAAS,SAAS;AAAA,iBAC1C;AAAA,eACD,CAAA;AACD,cAAA,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAM,OAAO,IAAK,CAAA,OAAA,CAAA;AAAA;AACpB,WACF;AAAA,UACA,QAAQ,KAAmC,EAAA;AACzC,YAAA,IAAI,CAAC,QAAU,EAAA;AACb,cAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AACV,cAAA,IAAI,CAAC,eAAiB,EAAA;AACpB,gBAAA,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAM,OAAO,IAAK,CAAA,OAAA,CAAA;AAAA;AACpB;AACF,WACF;AAAA,UACA,QAAQ,KAAmC,EAAA;AACzC,YAAU,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAA,KAAA,CAAA;AACV,YAAA,cAAA,CAAe,IAAI,CAAA;AAAA,WACrB;AAAA,UACA,GAAG;AAAA,SACJ,CAAA;AAAA,QACD,GAAK,EAAA,SAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,UACA,eAAA,mCACE,eAAgB,EAAA,EAAA,SAAA,EAAW,aAAa,YAAY,CAAA,EAAG,eAAW,IAAC,EAAA;AAAA;AAAA;AAAA,KAExE;AAAA;AAGN;;;;"}

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltMenuPanel {\n  background: var(--salt-container-primary-background);\n  border: var(--salt-size-fixed-100) 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-flyover);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  box-sizing: border-box;\n  border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltMenuPanel-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  max-height: inherit;\n  min-height: inherit;\n}\n\n.saltMenuPanel:focus-visible {\n  outline: none;\n}\n";
+var css_248z = ".saltMenuPanel {\n  background: var(--salt-container-primary-background);\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) 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-flyover);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  box-sizing: border-box;\n  border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltMenuPanel-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-fixed-100);\n  max-height: inherit;\n  min-height: inherit;\n}\n\n.saltMenuPanel:focus-visible {\n  outline: none;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=MenuPanel.css.js.map

package/dist-cjs/menu/MenuPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPanel.js","sources":["../src/menu/MenuPanel.tsx"],"sourcesContent":["import { FloatingList } from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { MenuPanelBase } from \"./MenuPanelBase\";\nimport { MenuPanelContext } from \"./MenuPanelContext\";\n\nexport interface MenuPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the menu panel.\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltMenuPanel\");\n\nexport const MenuPanel = forwardRef<HTMLDivElement, MenuPanelProps>(\n  function MenuPanel(props, ref) {\n    const { children, className, ...rest } = props;\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      getItemProps,\n      openState,\n      getFloatingProps,\n      refs,\n      getPanelPosition,\n      context,\n      elementsRef,\n      activeIndex,\n      setFocusInside,\n      isNested,\n    } = useMenuContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(ref, refs?.setFloating);\n\n    return (\n      <MenuPanelContext.Provider\n        value={{ activeIndex, getItemProps, setFocusInside }}\n      >\n        <FloatingList elementsRef={elementsRef}>\n          <FloatingComponent\n            open={openState}\n            role=\"menu\"\n            {...getFloatingProps()}\n            {...getPanelPosition()}\n            className={clsx(withBaseName(), className)}\n            focusManagerProps={\n              context\n                ? {\n                    context,\n                    initialFocus: isNested ? -1 : 0,\n                    returnFocus: !isNested,\n                    modal: false,\n                  }\n                : undefined\n            }\n            tabIndex={-1}\n            ref={handleRef}\n            {...rest}\n          >\n            <MenuPanelBase>{children}</MenuPanelBase>\n          </FloatingComponent>\n        </FloatingList>\n      </MenuPanelContext.Provider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MenuPanel","useFloatingComponent","useMenuContext","useForkRef","jsx","MenuPanelContext","FloatingList","clsx","MenuPanelBase"],"mappings":";;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AACzC,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,kCAAqB,EAAA;AAE9D,IAAM,MAAA;AAAA,MACJ,YAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,gBAAA;AAAA,MACA,OAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,QACEC,0BAAe,EAAA;AAEnB,IAAA,MAAM,SAAY,GAAAC,qBAAA,CAA2B,GAAK,EAAA,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAM,WAAW,CAAA;AAEnE,IACE,uBAAAC,cAAA;AAAA,MAACC,iCAAiB,CAAA,QAAA;AAAA,MAAjB;AAAA,QACC,KAAO,EAAA,EAAE,WAAa,EAAA,YAAA,EAAc,cAAe,EAAA;AAAA,QAEnD,QAAA,kBAAAD,cAAA,CAACE,sBAAa,WACZ,EAAA,QAAA,kBAAAF,cAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,IAAM,EAAA,SAAA;AAAA,YACN,IAAK,EAAA,MAAA;AAAA,YACJ,GAAG,gBAAiB,EAAA;AAAA,YACpB,GAAG,gBAAiB,EAAA;AAAA,YACrB,SAAW,EAAAG,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,YACzC,mBACE,OACI,GAAA;AAAA,cACE,OAAA;AAAA,cACA,YAAA,EAAc,WAAW,EAAK,GAAA,CAAA;AAAA,cAC9B,aAAa,CAAC,QAAA;AAAA,cACd,KAAO,EAAA;AAAA,aAET,GAAA,MAAA;AAAA,YAEN,QAAU,EAAA,EAAA;AAAA,YACV,GAAK,EAAA,SAAA;AAAA,YACJ,GAAG,IAAA;AAAA,YAEJ,QAAA,kBAAAH,cAAA,CAACI,+BAAe,QAAS,EAAA;AAAA;AAAA,SAE7B,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"MenuPanel.js","sources":["../src/menu/MenuPanel.tsx"],"sourcesContent":["import { FloatingList } from \"@floating-ui/react\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { MenuPanelBase } from \"./MenuPanelBase\";\nimport { MenuPanelContext } from \"./MenuPanelContext\";\n\nexport interface MenuPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the menu panel.\n   */\n  children?: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltMenuPanel\");\n\nexport const MenuPanel = forwardRef<HTMLDivElement, MenuPanelProps>(\n  function MenuPanel(props, ref) {\n    const { children, className, ...rest } = props;\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      getItemProps,\n      openState,\n      getFloatingProps,\n      refs,\n      getPanelPosition,\n      context,\n      elementsRef,\n      activeIndex,\n      setFocusInside,\n      isNested,\n    } = useMenuContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(ref, refs?.setFloating);\n\n    return (\n      <MenuPanelContext.Provider\n        value={{ activeIndex, getItemProps, setFocusInside }}\n      >\n        <FloatingList elementsRef={elementsRef}>\n          <FloatingComponent\n            open={openState}\n            role=\"menu\"\n            {...getFloatingProps()}\n            {...getPanelPosition()}\n            className={clsx(withBaseName(), className)}\n            focusManagerProps={\n              context\n                ? {\n                    context,\n                    initialFocus: isNested ? -1 : 0,\n                    returnFocus: !isNested,\n                    modal: false,\n                  }\n                : undefined\n            }\n            tabIndex={-1}\n            ref={handleRef}\n            {...rest}\n          >\n            <MenuPanelBase>{children}</MenuPanelBase>\n          </FloatingComponent>\n        </FloatingList>\n      </MenuPanelContext.Provider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MenuPanel","useFloatingComponent","useMenuContext","useForkRef","jsx","MenuPanelContext","FloatingList","clsx","MenuPanelBase"],"mappings":";;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AACzC,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,kCAAqB,EAAA;AAE9D,IAAM,MAAA;AAAA,MACJ,YAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,gBAAA;AAAA,MACA,OAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,QACEC,0BAAe,EAAA;AAEnB,IAAA,MAAM,SAAY,GAAAC,qBAAA,CAA2B,GAAK,EAAA,IAAA,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAM,WAAW,CAAA;AAEnE,IACE,uBAAAC,cAAA;AAAA,MAACC,iCAAiB,CAAA,QAAA;AAAA,MAAjB;AAAA,QACC,KAAO,EAAA,EAAE,WAAa,EAAA,YAAA,EAAc,cAAe,EAAA;AAAA,QAEnD,QAAA,kBAAAD,cAAA,CAACE,sBAAa,WACZ,EAAA,QAAA,kBAAAF,cAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,IAAM,EAAA,SAAA;AAAA,YACN,IAAK,EAAA,MAAA;AAAA,YACJ,GAAG,gBAAiB,EAAA;AAAA,YACpB,GAAG,gBAAiB,EAAA;AAAA,YACrB,SAAW,EAAAG,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,YACzC,mBACE,OACI,GAAA;AAAA,cACE,OAAA;AAAA,cACA,YAAA,EAAc,WAAW,EAAK,GAAA,CAAA;AAAA,cAC9B,aAAa,CAAC,QAAA;AAAA,cACd,KAAO,EAAA;AAAA,aAET,GAAA,MAAA;AAAA,YAEN,QAAU,EAAA,EAAA;AAAA,YACV,GAAK,EAAA,SAAA;AAAA,YACJ,GAAG,IAAA;AAAA,YAEJ,QAAA,kBAAAH,cAAA,CAACI,+BAAe,QAAS,EAAA;AAAA;AAAA,SAE7B,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-cjs/menu/MenuPanelContext.js

@@ -2,8 +2,8 @@
 
 var React = require('react');
 var createContext = require('../utils/createContext.js');
-require('react/jsx-runtime');
 require('clsx');
+require('react/jsx-runtime');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');

package/dist-cjs/menu/MenuTrigger.js

@@ -2,13 +2,13 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
+var getRefFromChildren = require('../utils/getRefFromChildren.js');
 var mergeProps = require('../utils/mergeProps.js');
 require('../utils/useFloatingUI/useFloatingUI.js');
 var useForkRef = require('../utils/useForkRef.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
-var getRefFromChildren = require('../utils/getRefFromChildren.js');
 var MenuContext = require('./MenuContext.js');
 var MenuPanelContext = require('./MenuPanelContext.js');
 var MenuTriggerContext = require('./MenuTriggerContext.js');

package/dist-cjs/menu/MenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTrigger.js","sources":["../src/menu/MenuTrigger.tsx"],"sourcesContent":["import {\n  type ReactNode,\n  type Ref,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n} from \"react\";\nimport { getRefFromChildren, mergeProps, useForkRef } from \"../utils\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { MenuTriggerContext } from \"./MenuTriggerContext\";\n\nexport interface MenuTriggerProps {\n  /**\n   * The trigger element for the menu. This should be a single child element and accept a ref.\n   */\n  children?: ReactNode;\n}\n\nexport const MenuTrigger = forwardRef<HTMLElement, MenuTriggerProps>(\n  function MenuTrigger(props, ref) {\n    const { children } = props;\n\n    const { getReferenceProps, refs, setFocusInside, focusInside, openState } =\n      useMenuContext();\n    const { setFocusInside: setFocusInsideParent } = useMenuPanelContext();\n\n    const handleFloatingRef = useForkRef(\n      getRefFromChildren(children),\n      refs?.setReference,\n    );\n    const handleRef = useForkRef(handleFloatingRef, ref);\n\n    if (!children || !isValidElement<{ ref?: Ref<unknown> }>(children)) {\n      // Should we log or throw error?\n      return <>{children}</>;\n    }\n\n    return (\n      <MenuTriggerContext.Provider\n        value={{ triggersSubmenu: true, blurActive: focusInside && openState }}\n      >\n        {cloneElement(children, {\n          ...mergeProps(\n            getReferenceProps({\n              onFocus() {\n                setFocusInsideParent(true);\n                setFocusInside(false);\n              },\n            }),\n            children.props,\n          ),\n          ref: handleRef,\n        })}\n      </MenuTriggerContext.Provider>\n    );\n  },\n);\n"],"names":["forwardRef","MenuTrigger","useMenuContext","useMenuPanelContext","useForkRef","getRefFromChildren","isValidElement","jsx","MenuTriggerContext","mergeProps"],"mappings":";;;;;;;;;;;;;;;AAmBO,MAAM,WAAc,GAAAA,gBAAA;AAAA,EACzB,SAASC,YAAY,CAAA,KAAA,EAAO,GAAK,EAAA;AAC/B,IAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AAErB,IAAA,MAAM,EAAE,iBAAmB,EAAA,IAAA,EAAM,gBAAgB,WAAa,EAAA,SAAA,KAC5DC,0BAAe,EAAA;AACjB,IAAA,MAAM,EAAE,cAAA,EAAgB,oBAAqB,EAAA,GAAIC,oCAAoB,EAAA;AAErE,IAAA,MAAM,iBAAoB,GAAAC,qBAAA;AAAA,MACxBC,sCAAmB,QAAQ,CAAA;AAAA,MAC3B,IAAM,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAA;AAAA,KACR;AACA,IAAM,MAAA,SAAA,GAAYD,qBAAW,CAAA,iBAAA,EAAmB,GAAG,CAAA;AAEnD,IAAA,IAAI,CAAC,QAAA,IAAY,CAACE,oBAAA,CAAuC,QAAQ,CAAG,EAAA;AAElE,MAAA,6DAAU,QAAS,EAAA,CAAA;AAAA;AAGrB,IACE,uBAAAC,cAAA;AAAA,MAACC,qCAAmB,CAAA,QAAA;AAAA,MAAnB;AAAA,QACC,OAAO,EAAE,eAAA,EAAiB,IAAM,EAAA,UAAA,EAAY,eAAe,SAAU,EAAA;AAAA,QAEpE,6BAAa,QAAU,EAAA;AAAA,UACtB,GAAGC,qBAAA;AAAA,YACD,iBAAkB,CAAA;AAAA,cAChB,OAAU,GAAA;AACR,gBAAA,oBAAA,CAAqB,IAAI,CAAA;AACzB,gBAAA,cAAA,CAAe,KAAK,CAAA;AAAA;AACtB,aACD,CAAA;AAAA,YACD,QAAS,CAAA;AAAA,WACX;AAAA,UACA,GAAK,EAAA;AAAA,SACN;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"MenuTrigger.js","sources":["../src/menu/MenuTrigger.tsx"],"sourcesContent":["import {\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { getRefFromChildren, mergeProps, useForkRef } from \"../utils\";\nimport { useMenuContext } from \"./MenuContext\";\nimport { useMenuPanelContext } from \"./MenuPanelContext\";\nimport { MenuTriggerContext } from \"./MenuTriggerContext\";\n\nexport interface MenuTriggerProps {\n  /**\n   * The trigger element for the menu. This should be a single child element and accept a ref.\n   */\n  children?: ReactNode;\n}\n\nexport const MenuTrigger = forwardRef<HTMLElement, MenuTriggerProps>(\n  function MenuTrigger(props, ref) {\n    const { children } = props;\n\n    const { getReferenceProps, refs, setFocusInside, focusInside, openState } =\n      useMenuContext();\n    const { setFocusInside: setFocusInsideParent } = useMenuPanelContext();\n\n    const handleFloatingRef = useForkRef(\n      getRefFromChildren(children),\n      refs?.setReference,\n    );\n    const handleRef = useForkRef(handleFloatingRef, ref);\n\n    if (!children || !isValidElement<{ ref?: Ref<unknown> }>(children)) {\n      // Should we log or throw error?\n      return <>{children}</>;\n    }\n\n    return (\n      <MenuTriggerContext.Provider\n        value={{ triggersSubmenu: true, blurActive: focusInside && openState }}\n      >\n        {cloneElement(children, {\n          ...mergeProps(\n            getReferenceProps({\n              onFocus() {\n                setFocusInsideParent(true);\n                setFocusInside(false);\n              },\n            }),\n            children.props,\n          ),\n          ref: handleRef,\n        })}\n      </MenuTriggerContext.Provider>\n    );\n  },\n);\n"],"names":["forwardRef","MenuTrigger","useMenuContext","useMenuPanelContext","useForkRef","getRefFromChildren","isValidElement","jsx","MenuTriggerContext","mergeProps"],"mappings":";;;;;;;;;;;;;;;AAmBO,MAAM,WAAc,GAAAA,gBAAA;AAAA,EACzB,SAASC,YAAY,CAAA,KAAA,EAAO,GAAK,EAAA;AAC/B,IAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AAErB,IAAA,MAAM,EAAE,iBAAmB,EAAA,IAAA,EAAM,gBAAgB,WAAa,EAAA,SAAA,KAC5DC,0BAAe,EAAA;AACjB,IAAA,MAAM,EAAE,cAAA,EAAgB,oBAAqB,EAAA,GAAIC,oCAAoB,EAAA;AAErE,IAAA,MAAM,iBAAoB,GAAAC,qBAAA;AAAA,MACxBC,sCAAmB,QAAQ,CAAA;AAAA,MAC3B,IAAM,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,CAAA;AAAA,KACR;AACA,IAAM,MAAA,SAAA,GAAYD,qBAAW,CAAA,iBAAA,EAAmB,GAAG,CAAA;AAEnD,IAAA,IAAI,CAAC,QAAA,IAAY,CAACE,oBAAA,CAAuC,QAAQ,CAAG,EAAA;AAElE,MAAA,6DAAU,QAAS,EAAA,CAAA;AAAA;AAGrB,IACE,uBAAAC,cAAA;AAAA,MAACC,qCAAmB,CAAA,QAAA;AAAA,MAAnB;AAAA,QACC,OAAO,EAAE,eAAA,EAAiB,IAAM,EAAA,UAAA,EAAY,eAAe,SAAU,EAAA;AAAA,QAEpE,6BAAa,QAAU,EAAA;AAAA,UACtB,GAAGC,qBAAA;AAAA,YACD,iBAAkB,CAAA;AAAA,cAChB,OAAU,GAAA;AACR,gBAAA,oBAAA,CAAqB,IAAI,CAAA;AACzB,gBAAA,cAAA,CAAe,KAAK,CAAA;AAAA;AACtB,aACD,CAAA;AAAA,YACD,QAAS,CAAA;AAAA,WACX;AAAA,UACA,GAAK,EAAA;AAAA,SACN;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}

package/dist-cjs/menu/MenuTriggerContext.js

@@ -2,8 +2,8 @@
 
 var React = require('react');
 var createContext = require('../utils/createContext.js');
-require('react/jsx-runtime');
 require('clsx');
+require('react/jsx-runtime');
 require('../utils/useFloatingUI/useFloatingUI.js');
 require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');

package/dist-cjs/multiline-input/MultilineInput.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Style applied to the root element */\n.saltMultilineInput {\n  align-items: center;\n  background: var(--multilineInput-background);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: auto;\n  min-height: var(--salt-size-base);\n  min-width: 4em;\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n\n/* Style applied on hover */\n.saltMultilineInput:hover {\n  background: var(--multilineInput-background-hover);\n  cursor: var(--salt-cursor-text);\n}\n\n/* Style applied if `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput {\n  border: var(--salt-size-fixed-100) var(--salt-editable-borderStyle) var(--multilineInput-borderColor);\n}\n\n.saltMultilineInput-bordered.saltMultilineInput:hover {\n  border-style: var(--salt-editable-borderStyle-hover);\n  border-color: var(--multilineInput-borderColor-hover);\n}\n\n/* Style applied if focused or active when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-focused,\n.saltMultilineInput-bordered.saltMultilineInput-focused:hover {\n  border-style: var(--salt-editable-borderStyle-active);\n  border-color: var(--multilineInput-borderColor-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-readOnly,\n.saltMultilineInput-bordered.saltMultilineInput-readOnly:hover {\n  border-style: var(--salt-editable-borderStyle-readonly);\n  border-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltMultilineInput-bordered.saltMultilineInput-disabled,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover {\n  border-style: var(--salt-editable-borderStyle-disabled);\n  border-color: var(--salt-editable-borderColor-disabled);\n}\n\n/* Style for activation indicator */\n.saltMultilineInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--salt-size-fixed-100) var(--salt-editable-borderStyle) var(--multilineInput-borderColor);\n}\n\n.saltMultilineInput:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-editable-borderStyle-hover);\n  border-bottom-color: var(--multilineInput-borderColor-hover);\n}\n\n.saltMultilineInput-focused .saltMultilineInput-activationIndicator,\n.saltMultilineInput-focused:hover .saltMultilineInput-activationIndicator {\n  border-bottom: var(--salt-size-fixed-200) var(--salt-editable-borderStyle-active) var(--multilineInput-borderColor-active);\n}\n\n.saltMultilineInput-readOnly .saltMultilineInput-activationIndicator,\n.saltMultilineInput-readOnly:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-editable-borderStyle-readonly);\n  border-bottom-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltMultilineInput-disabled .saltMultilineInput-activationIndicator,\n.saltMultilineInput-disabled:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-editable-borderStyle-disabled);\n  border-bottom-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltMultilineInput-bordered .saltMultilineInput-activationIndicator,\n.saltMultilineInput-bordered.saltMultilineInput-readOnly .saltMultilineInput-activationIndicator,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover .saltMultilineInput-activationIndicator {\n  border-bottom-width: 0;\n}\n\n.saltMultilineInput-bordered.saltMultilineInput-focused .saltMultilineInput-activationIndicator {\n  /* Activation indicator width minus the border from the input. */\n  border-bottom-width: var(--salt-size-fixed-100);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltMultilineInput-primary {\n  --multilineInput-background: var(--salt-editable-primary-background);\n  --multilineInput-background-active: var(--salt-editable-primary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-primary-background-hover);\n  --multilineInput-background-disabled: var(--salt-editable-primary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-primary-background-readonly);\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderColor-active: var(--salt-editable-borderColor-active);\n  --multilineInput-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltMultilineInput-secondary {\n  --multilineInput-background: var(--salt-editable-secondary-background);\n  --multilineInput-background-active: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-secondary-background-readonly);\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderColor-active: var(--salt-editable-borderColor-active);\n  --multilineInput-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltMultilineInput-error {\n  --multilineInput-background: var(--salt-status-error-background);\n  --multilineInput-background-active: var(--salt-status-error-background);\n  --multilineInput-background-hover: var(--salt-status-error-background);\n  --multilineInput-background-readonly: var(--salt-status-error-background);\n  --multilineInput-borderColor: var(--salt-status-error-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-error-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-error-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltMultilineInput-warning {\n  --multilineInput-background: var(--salt-status-warning-background);\n  --multilineInput-background-active: var(--salt-status-warning-background);\n  --multilineInput-background-hover: var(--salt-status-warning-background);\n  --multilineInput-background-readonly: var(--salt-status-warning-background);\n  --multilineInput-borderColor: var(--salt-status-warning-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-warning-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-warning-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltMultilineInput-success {\n  --multilineInput-background: var(--salt-status-success-background);\n  --multilineInput-background-active: var(--salt-status-success-background);\n  --multilineInput-background-hover: var(--salt-status-success-background);\n  --multilineInput-background-readonly: var(--salt-status-success-background);\n  --multilineInput-borderColor: var(--salt-status-success-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-success-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-success-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Styling when focused */\n.saltMultilineInput-focused,\n.saltMultilineInput-focused:hover {\n  background: var(--multilineInput-background-active);\n  cursor: var(--salt-cursor-text);\n  outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--multilineInput-outlineColor);\n}\n\n/* Style applied if `readOnly={true}` */\n.saltMultilineInput.saltMultilineInput-readOnly {\n  background: var(--multilineInput-background-readonly);\n  cursor: var(--salt-cursor-readonly);\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltMultilineInput.saltMultilineInput-disabled,\n.saltMultilineInput.saltMultilineInput-disabled:hover {\n  background: var(--input-background-disabled);\n  cursor: var(--salt-cursor-disabled);\n  color: var(--salt-content-primary-foreground-disabled);\n}\n\n.saltMultilineInput.saltMultilineInput-withAdornmentRow {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n/* Style applied to adornment containers */\n.saltMultilineInput-endAdornmentContainer,\n.saltMultilineInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to start adornment container */\n.saltMultilineInput-startAdornmentContainer {\n  align-self: self-start;\n  padding-right: var(--salt-spacing-100);\n}\n\n/* Style applied to suffix adornment container */\n.saltMultilineInput-suffixAdornments {\n  align-self: self-end;\n}\n\n/* Style applied to suffix adornment container when end adornments are provided */\n.saltMultilineInput-withAdornmentRow .saltMultilineInput-suffixAdornments {\n  display: inline-flex;\n  flex-basis: 100%;\n  justify-content: flex-end;\n}\n\n/* Style applied to end adornment container */\n.saltMultilineInput-endAdornmentContainer {\n  padding-left: var(--salt-spacing-100);\n}\n\n/* Style applied to status adornment container */\n.saltMultilineInput-statusAdornmentContainer {\n  align-self: self-end;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n}\n\n/* Style applied to button start adornment if first child */\n.saltMultilineInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-readOnly .saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: 0;\n}\n\n/* Styles for button adornment */\n.saltMultilineInput-startAdornmentContainer > .saltButton,\n.saltMultilineInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--button-borderWidth));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n\n/* Style applied to inner textarea element */\n.saltMultilineInput-textarea {\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: inherit;\n  flex-grow: 1;\n  font: inherit;\n  letter-spacing: 0;\n  line-height: var(--salt-text-lineHeight);\n  margin: var(--salt-spacing-75) 0;\n  min-width: 0;\n  min-height: 0;\n  max-height: inherit;\n  resize: vertical;\n  padding: 0;\n}\n\n/* Style applied to placeholder */\n.saltMultilineInput-textarea::placeholder {\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Reset in the  class */\n.saltMultilineInput-textarea:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltMultilineInput-textarea::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to selected text if `disabled={true}` */\n.saltMultilineInput-disabled .saltMultilineInput-textarea::selection {\n  background: none;\n}\n";
+var css_248z = "/* Style applied to the root element */\n.saltMultilineInput {\n  align-items: center;\n  background: var(--multilineInput-background);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: auto;\n  min-height: var(--salt-size-base);\n  min-width: 4em;\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n\n/* Style applied on hover */\n.saltMultilineInput:hover {\n  background: var(--multilineInput-background-hover);\n  cursor: var(--salt-cursor-text);\n}\n\n/* Style applied if `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput {\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--multilineInput-borderColor);\n}\n\n.saltMultilineInput-bordered.saltMultilineInput:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--multilineInput-borderColor-hover);\n}\n\n/* Style applied if focused or active when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-focused,\n.saltMultilineInput-bordered.saltMultilineInput-focused:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--multilineInput-borderColor-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-readOnly,\n.saltMultilineInput-bordered.saltMultilineInput-readOnly:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltMultilineInput-bordered.saltMultilineInput-disabled,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-disabled);\n}\n\n/* Style for activation indicator */\n.saltMultilineInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--multilineInput-borderColor);\n}\n\n.saltMultilineInput:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--multilineInput-borderColor-hover);\n}\n\n.saltMultilineInput-focused .saltMultilineInput-activationIndicator,\n.saltMultilineInput-focused:hover .saltMultilineInput-activationIndicator {\n  border-bottom: var(--salt-size-fixed-200) var(--salt-borderStyle-solid) var(--multilineInput-borderColor-active);\n}\n\n.saltMultilineInput-readOnly .saltMultilineInput-activationIndicator,\n.saltMultilineInput-readOnly:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltMultilineInput-disabled .saltMultilineInput-activationIndicator,\n.saltMultilineInput-disabled:hover .saltMultilineInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltMultilineInput-bordered .saltMultilineInput-activationIndicator,\n.saltMultilineInput-bordered.saltMultilineInput-readOnly .saltMultilineInput-activationIndicator,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover .saltMultilineInput-activationIndicator {\n  border-bottom-width: 0;\n}\n\n.saltMultilineInput-bordered.saltMultilineInput-focused .saltMultilineInput-activationIndicator {\n  /* Activation indicator width minus the border from the input. */\n  border-bottom-width: var(--salt-size-fixed-100);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltMultilineInput-primary {\n  --multilineInput-background: var(--salt-editable-primary-background);\n  --multilineInput-background-active: var(--salt-editable-primary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-primary-background-hover);\n  --multilineInput-background-disabled: var(--salt-editable-primary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-primary-background-readonly);\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderColor-active: var(--salt-editable-borderColor-active);\n  --multilineInput-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltMultilineInput-secondary {\n  --multilineInput-background: var(--salt-editable-secondary-background);\n  --multilineInput-background-active: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-secondary-background-readonly);\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderColor-active: var(--salt-editable-borderColor-active);\n  --multilineInput-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltMultilineInput-error {\n  --multilineInput-background: var(--salt-status-error-background);\n  --multilineInput-background-active: var(--salt-status-error-background);\n  --multilineInput-background-hover: var(--salt-status-error-background);\n  --multilineInput-background-readonly: var(--salt-status-error-background);\n  --multilineInput-borderColor: var(--salt-status-error-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-error-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-error-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltMultilineInput-warning {\n  --multilineInput-background: var(--salt-status-warning-background);\n  --multilineInput-background-active: var(--salt-status-warning-background);\n  --multilineInput-background-hover: var(--salt-status-warning-background);\n  --multilineInput-background-readonly: var(--salt-status-warning-background);\n  --multilineInput-borderColor: var(--salt-status-warning-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-warning-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-warning-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltMultilineInput-success {\n  --multilineInput-background: var(--salt-status-success-background);\n  --multilineInput-background-active: var(--salt-status-success-background);\n  --multilineInput-background-hover: var(--salt-status-success-background);\n  --multilineInput-background-readonly: var(--salt-status-success-background);\n  --multilineInput-borderColor: var(--salt-status-success-borderColor);\n  --multilineInput-borderColor-active: var(--salt-status-success-borderColor);\n  --multilineInput-borderColor-hover: var(--salt-status-success-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Styling when focused */\n.saltMultilineInput-focused,\n.saltMultilineInput-focused:hover {\n  background: var(--multilineInput-background-active);\n  cursor: var(--salt-cursor-text);\n  outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--multilineInput-outlineColor);\n}\n\n/* Style applied if `readOnly={true}` */\n.saltMultilineInput.saltMultilineInput-readOnly {\n  background: var(--multilineInput-background-readonly);\n  cursor: var(--salt-cursor-readonly);\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltMultilineInput.saltMultilineInput-disabled,\n.saltMultilineInput.saltMultilineInput-disabled:hover {\n  background: var(--input-background-disabled);\n  cursor: var(--salt-cursor-disabled);\n  color: var(--salt-content-primary-foreground-disabled);\n}\n\n.saltMultilineInput.saltMultilineInput-withAdornmentRow {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n/* Style applied to adornment containers */\n.saltMultilineInput-endAdornmentContainer,\n.saltMultilineInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to start adornment container */\n.saltMultilineInput-startAdornmentContainer {\n  align-self: self-start;\n  padding-right: var(--salt-spacing-100);\n}\n\n/* Style applied to suffix adornment container */\n.saltMultilineInput-suffixAdornments {\n  align-self: self-end;\n}\n\n/* Style applied to suffix adornment container when end adornments are provided */\n.saltMultilineInput-withAdornmentRow .saltMultilineInput-suffixAdornments {\n  display: inline-flex;\n  flex-basis: 100%;\n  justify-content: flex-end;\n}\n\n/* Style applied to end adornment container */\n.saltMultilineInput-endAdornmentContainer {\n  padding-left: var(--salt-spacing-100);\n}\n\n/* Style applied to status adornment container */\n.saltMultilineInput-statusAdornmentContainer {\n  align-self: self-end;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n}\n\n/* Style applied to button start adornment if first child */\n.saltMultilineInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-readOnly .saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: 0;\n}\n\n/* Styles for button adornment */\n.saltMultilineInput-startAdornmentContainer > .saltButton,\n.saltMultilineInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--button-borderWidth));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n\n/* Style applied to inner textarea element */\n.saltMultilineInput-textarea {\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: inherit;\n  flex-grow: 1;\n  font: inherit;\n  letter-spacing: 0;\n  line-height: var(--salt-text-lineHeight);\n  margin: var(--salt-spacing-75) 0;\n  min-width: 0;\n  min-height: 0;\n  max-height: inherit;\n  resize: vertical;\n  padding: 0;\n}\n\n/* Style applied to placeholder */\n.saltMultilineInput-textarea::placeholder {\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Reset in the  class */\n.saltMultilineInput-textarea:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltMultilineInput-textarea::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to selected text if `disabled={true}` */\n.saltMultilineInput-disabled .saltMultilineInput-textarea::selection {\n  background: none;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=MultilineInput.css.js.map