@salt-ds/core 1.65.1 → 1.67.0

package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js

@@ -10,7 +10,7 @@ require('../utils/useId.js');
 require('../salt-provider/SaltProvider.js');
 require('../viewport/ViewportProvider.js');
 
-const FileDropZoneTrigger = React.forwardRef(function FileDropZoneTrigger2({ accept, children, disabled, multiple = false, onChange, ...rest }, ref) {
+const FileDropZoneTrigger = React.forwardRef(function FileDropZoneTrigger2({ accept, children, disabled, multiple = false, onClick, onChange, ...rest }, ref) {
   const buttonRef = React.useRef(null);
   const fileInputRef = React.useRef(null);
   const triggerRef = useForkRef.useForkRef(ref, buttonRef);
@@ -21,13 +21,14 @@ const FileDropZoneTrigger = React.forwardRef(function FileDropZoneTrigger2({ acc
   };
   const handleClick = (event) => {
     var _a;
+    onClick == null ? void 0 : onClick(event);
     event.stopPropagation();
     (_a = fileInputRef.current) == null ? void 0 : _a.click();
   };
   const handleChange = (event) => {
     const files = Array.from(event.target.files ?? []);
-    event.target.value = "";
     onChange == null ? void 0 : onChange(event, files);
+    event.target.value = "";
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(

package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type SyntheticEvent,\n  useRef,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button\";\nimport { useForkRef } from \"../utils\";\n\nexport interface FileDropZoneTriggerProps\n  extends Omit<ComponentPropsWithoutRef<\"button\">, \"onChange\"> {\n  /**\n   * `accept` attribute for HTML <input>.\n   *\n   * A comma separated list of file types the user can pick from the file input dialog box.\n   */\n  accept?: string;\n  /**\n   * Disable all trigger elements.\n   */\n  disabled?: boolean;\n  /**\n   * Allows multiple files to be uploaded.\n   */\n  multiple?: boolean;\n  /**\n   * Callback for input change event\n   */\n  onChange?: (event: ChangeEvent<HTMLInputElement>, files: File[]) => void;\n  /**\n   * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n   * 'solid' is the default value.\n   */\n  appearance?: ButtonProps[\"appearance\"];\n  /**\n   * The sentiment of the button. Options are 'accented' and 'neutral'.\n   * 'neutral' is the default value.\n   *\n   */\n  sentiment?: Extract<ButtonProps[\"sentiment\"], \"accented\" | \"neutral\">;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n  HTMLButtonElement,\n  FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n  { accept, children, disabled, multiple = false, onChange, ...rest },\n  ref,\n) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const triggerRef = useForkRef(ref, buttonRef);\n\n  // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n  // move focus back on the button element so that all labels can be announced correctly\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    event.stopPropagation();\n    buttonRef.current?.focus();\n  };\n\n  const handleClick = (event: SyntheticEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    fileInputRef.current?.click();\n  };\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const files = Array.from((event.target as HTMLInputElement).files ?? []);\n    // Allow selecting the same file multiple times - #3591\n    // User would still be able to put back the value in onChange, if necessary\n    event.target.value = \"\";\n    onChange?.(event, files);\n  };\n  return (\n    <>\n      <Button\n        onClick={handleClick}\n        disabled={disabled}\n        ref={triggerRef}\n        {...rest}\n      >\n        {children ?? \"Browse files\"}\n      </Button>\n      <input\n        accept={accept}\n        style={{ display: \"none\" }}\n        disabled={disabled}\n        multiple={multiple}\n        onChange={handleChange}\n        onFocus={handleFocus}\n        ref={fileInputRef}\n        type=\"file\"\n      />\n    </>\n  );\n});\n"],"names":["forwardRef","FileDropZoneTrigger","useRef","useForkRef","jsxs","Fragment","jsx","Button"],"mappings":";;;;;;;;;;;;AA4CO,MAAM,mBAAA,GAAsBA,gBAAA,CAGjC,SAASC,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAA,EAAU,QAAA,EAAU,QAAA,GAAW,KAAA,EAAO,QAAA,EAAU,GAAG,IAAA,IAC7D,GAAA,EACA;AACA,EAAA,MAAM,SAAA,GAAYC,aAA0B,IAAI,CAAA;AAChD,EAAA,MAAM,YAAA,GAAeA,aAAyB,IAAI,CAAA;AAClD,EAAA,MAAM,UAAA,GAAaC,qBAAA,CAAW,GAAA,EAAK,SAAS,CAAA;AAI5C,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAwC;AAzD/D,IAAA,IAAA,EAAA;AA0DI,IAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAA,GAAA,MAAA,GAAA,EAAA,CAAmB,KAAA,EAAA;AAAA,EACrB,CAAA;AAEA,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6C;AA9DpE,IAAA,IAAA,EAAA;AA+DI,IAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAA,GAAA,MAAA,GAAA,EAAA,CAAsB,KAAA,EAAA;AAAA,EACxB,CAAA;AAEA,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAyC;AAC7D,IAAA,MAAM,QAAQ,KAAA,CAAM,IAAA,CAAM,MAAM,MAAA,CAA4B,KAAA,IAAS,EAAE,CAAA;AAGvE,IAAA,KAAA,CAAM,OAAO,KAAA,GAAQ,EAAA;AACrB,IAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,EAAO,KAAA,CAAA;AAAA,EACpB,CAAA;AACA,EAAA,uBACEC,eAAA,CAAAC,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAA,EAAK,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,QAAA,IAAY;AAAA;AAAA,KACf;AAAA,oBACAD,cAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,MAAA;AAAA,QACA,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAO;AAAA,QACzB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA,EAAU,YAAA;AAAA,QACV,OAAA,EAAS,WAAA;AAAA,QACT,GAAA,EAAK,YAAA;AAAA,QACL,IAAA,EAAK;AAAA;AAAA;AACP,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type ComponentPropsWithoutRef,\n  type FocusEvent,\n  forwardRef,\n  type MouseEvent,\n  useRef,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button\";\nimport { useForkRef } from \"../utils\";\n\nexport interface FileDropZoneTriggerProps\n  extends Omit<ComponentPropsWithoutRef<\"button\">, \"onChange\"> {\n  /**\n   * `accept` attribute for HTML <input>.\n   *\n   * A comma separated list of file types the user can pick from the file input dialog box.\n   */\n  accept?: string;\n  /**\n   * Disable all trigger elements.\n   */\n  disabled?: boolean;\n  /**\n   * Allows multiple files to be uploaded.\n   */\n  multiple?: boolean;\n  /**\n   * Callback for input change event\n   */\n  onChange?: (event: ChangeEvent<HTMLInputElement>, files: File[]) => void;\n  /**\n   * The appearance of the button. Options are 'solid', 'bordered', and 'transparent'.\n   * 'solid' is the default value.\n   */\n  appearance?: ButtonProps[\"appearance\"];\n  /**\n   * The sentiment of the button. Options are 'accented' and 'neutral'.\n   * 'neutral' is the default value.\n   *\n   */\n  sentiment?: Extract<ButtonProps[\"sentiment\"], \"accented\" | \"neutral\">;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n  HTMLButtonElement,\n  FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n  { accept, children, disabled, multiple = false, onClick, onChange, ...rest },\n  ref,\n) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const triggerRef = useForkRef(ref, buttonRef);\n\n  // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n  // move focus back on the button element so that all labels can be announced correctly\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    event.stopPropagation();\n    buttonRef.current?.focus();\n  };\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    onClick?.(event);\n    event.stopPropagation();\n    fileInputRef.current?.click();\n  };\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const files = Array.from((event.target as HTMLInputElement).files ?? []);\n    onChange?.(event, files);\n\n    // Reset after onChange so consumers can read the selected files first.\n    // Clearing the value allows selecting the same file again - #3591.\n    event.target.value = \"\";\n  };\n  return (\n    <>\n      <Button\n        onClick={handleClick}\n        disabled={disabled}\n        ref={triggerRef}\n        {...rest}\n      >\n        {children ?? \"Browse files\"}\n      </Button>\n      <input\n        accept={accept}\n        style={{ display: \"none\" }}\n        disabled={disabled}\n        multiple={multiple}\n        onChange={handleChange}\n        onFocus={handleFocus}\n        ref={fileInputRef}\n        type=\"file\"\n      />\n    </>\n  );\n});\n"],"names":["forwardRef","FileDropZoneTrigger","useRef","useForkRef","jsxs","Fragment","jsx","Button"],"mappings":";;;;;;;;;;;;AA4CO,MAAM,mBAAA,GAAsBA,gBAAA,CAGjC,SAASC,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAA,EAAU,QAAA,EAAU,QAAA,GAAW,OAAO,OAAA,EAAS,QAAA,EAAU,GAAG,IAAA,IACtE,GAAA,EACA;AACA,EAAA,MAAM,SAAA,GAAYC,aAA0B,IAAI,CAAA;AAChD,EAAA,MAAM,YAAA,GAAeA,aAAyB,IAAI,CAAA;AAClD,EAAA,MAAM,UAAA,GAAaC,qBAAA,CAAW,GAAA,EAAK,SAAS,CAAA;AAI5C,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAwC;AAzD/D,IAAA,IAAA,EAAA;AA0DI,IAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAA,GAAA,MAAA,GAAA,EAAA,CAAmB,KAAA,EAAA;AAAA,EACrB,CAAA;AAEA,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AA9DhE,IAAA,IAAA,EAAA;AA+DI,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,IAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAA,GAAA,MAAA,GAAA,EAAA,CAAsB,KAAA,EAAA;AAAA,EACxB,CAAA;AAEA,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAyC;AAC7D,IAAA,MAAM,QAAQ,KAAA,CAAM,IAAA,CAAM,MAAM,MAAA,CAA4B,KAAA,IAAS,EAAE,CAAA;AACvE,IAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,EAAO,KAAA,CAAA;AAIlB,IAAA,KAAA,CAAM,OAAO,KAAA,GAAQ,EAAA;AAAA,EACvB,CAAA;AACA,EAAA,uBACEC,eAAA,CAAAC,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAA,EAAK,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,QAAA,IAAY;AAAA;AAAA,KACf;AAAA,oBACAD,cAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,MAAA;AAAA,QACA,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAO;AAAA,QACzB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA,EAAU,YAAA;AAAA,QACV,OAAA,EAAS,WAAA;AAAA,QACT,GAAA,EAAK,YAAA;AAAA,QACL,IAAA,EAAK;AAAA;AAAA;AACP,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/grid-layout/GridLayout.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Style applied to the root element */\n.saltGridLayout {\n  display: grid;\n  column-gap: var(--gridLayout-columnGap);\n  row-gap: var(--gridLayout-rowGap);\n  grid-template-columns: var(--gridLayout-columns);\n  grid-template-rows: var(--gridLayout-rows);\n  margin: var(--gridLayout-margin);\n  padding: var(--gridLayout-padding);\n  grid-auto-columns: auto;\n  grid-auto-rows: auto;\n}\n\n.saltGridLayout-area {\n  grid-template: var(--gridLayout-gridTemplate);\n  grid-template-columns: min-content 1fr min-content;\n  grid-template-rows: min-content 1fr min-content;\n}\n";
+var css_248z = "/* Style applied to the root element */\n.saltGridLayout {\n  display: grid;\n  column-gap: var(--gridLayout-columnGap);\n  row-gap: var(--gridLayout-rowGap);\n  grid-template-columns: var(--gridLayout-columns);\n  grid-template-rows: var(--gridLayout-rows);\n  margin: var(--gridLayout-margin);\n  padding: var(--gridLayout-padding);\n  grid-auto-columns: auto;\n  grid-auto-rows: auto;\n}\n\n.saltGridLayout-area {\n  grid-template: var(--gridLayout-gridTemplate);\n  grid-template-columns: var(--gridLayout-areaColumns, min-content 1fr min-content);\n  grid-template-rows: var(--gridLayout-areaRows, min-content 1fr min-content);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=GridLayout.css.js.map

package/dist-cjs/index.js

@@ -60,6 +60,17 @@ var Link = require('./link/Link.js');
 var LinkCard = require('./link-card/LinkCard.js');
 var ListBox = require('./list-box/ListBox.js');
 var ListControlContext = require('./list-control/ListControlContext.js');
+var MegaMenu = require('./mega-menu/MegaMenu.js');
+var MegaMenuActions = require('./mega-menu/MegaMenuActions.js');
+var MegaMenuAside = require('./mega-menu/MegaMenuAside.js');
+var MegaMenuContent = require('./mega-menu/MegaMenuContent.js');
+var MegaMenuGroup = require('./mega-menu/MegaMenuGroup.js');
+var MegaMenuGroupHeading = require('./mega-menu/MegaMenuGroupHeading.js');
+var MegaMenuGroups = require('./mega-menu/MegaMenuGroups.js');
+var MegaMenuList = require('./mega-menu/MegaMenuList.js');
+var MegaMenuListItem = require('./mega-menu/MegaMenuListItem.js');
+var MegaMenuPanel = require('./mega-menu/MegaMenuPanel.js');
+var MegaMenuTrigger = require('./mega-menu/MegaMenuTrigger.js');
 var Menu = require('./menu/Menu.js');
 var MenuGroup = require('./menu/MenuGroup.js');
 var MenuItem = require('./menu/MenuItem.js');
@@ -268,6 +279,17 @@ exports.Link = Link.Link;
 exports.LinkCard = LinkCard.LinkCard;
 exports.ListBox = ListBox.ListBox;
 exports.useListControlContext = ListControlContext.useListControlContext;
+exports.MegaMenu = MegaMenu.MegaMenu;
+exports.MegaMenuActions = MegaMenuActions.MegaMenuActions;
+exports.MegaMenuAside = MegaMenuAside.MegaMenuAside;
+exports.MegaMenuContent = MegaMenuContent.MegaMenuContent;
+exports.MegaMenuGroup = MegaMenuGroup.MegaMenuGroup;
+exports.MegaMenuGroupHeading = MegaMenuGroupHeading.MegaMenuGroupHeading;
+exports.MegaMenuGroups = MegaMenuGroups.MegaMenuGroups;
+exports.MegaMenuList = MegaMenuList.MegaMenuList;
+exports.MegaMenuListItem = MegaMenuListItem.MegaMenuListItem;
+exports.MegaMenuPanel = MegaMenuPanel.MegaMenuPanel;
+exports.MegaMenuTrigger = MegaMenuTrigger.MegaMenuTrigger;
 exports.Menu = Menu.Menu;
 exports.MenuGroup = MenuGroup.MenuGroup;
 exports.MenuItem = MenuItem.MenuItem;

package/dist-cjs/index.js.map

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

package/dist-cjs/mega-menu/MegaMenu.js

@@ -0,0 +1,81 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('@floating-ui/react');
+var React = require('react');
+require('clsx');
+var useControlled = require('../utils/useControlled.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuContext = require('./MegaMenuContext.js');
+var useMegaMenuNavigation = require('./useMegaMenuNavigation.js');
+
+function MegaMenu({
+  children,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  placement = "bottom"
+}) {
+  const [openState, setOpenState] = useControlled.useControlled({
+    controlled: open,
+    default: defaultOpen,
+    name: "MegaMenu",
+    state: "open"
+  });
+  const [reference, setReference] = React.useState(null);
+  const [floating, setFloating] = React.useState(null);
+  const focusFirstItemOnOpenRef = React.useRef(false);
+  const [panelId, setPanelId] = React.useState();
+  const setOpen = React.useCallback(
+    (newOpen) => {
+      if (!newOpen) {
+        focusFirstItemOnOpenRef.current = false;
+      }
+      setOpenState(newOpen);
+      onOpenChange == null ? void 0 : onOpenChange(newOpen);
+    },
+    [onOpenChange]
+  );
+  const floatingRootContext = react.useFloatingRootContext({
+    open: openState,
+    onOpenChange: setOpen,
+    elements: { reference, floating }
+  });
+  const megaMenuNavigation = useMegaMenuNavigation.useMegaMenuNavigation(floatingRootContext);
+  const { getReferenceProps, getFloatingProps } = react.useInteractions([
+    react.useClick(floatingRootContext),
+    react.useDismiss(floatingRootContext),
+    megaMenuNavigation
+  ]);
+  const contextValue = React.useMemo(
+    () => ({
+      openState,
+      floatingRootContext,
+      placement,
+      getFloatingProps,
+      getReferenceProps,
+      setFloating,
+      setReference,
+      setOpen,
+      focusFirstItemOnOpenRef,
+      panelId,
+      setPanelId
+    }),
+    [
+      openState,
+      floatingRootContext,
+      placement,
+      getFloatingProps,
+      getReferenceProps,
+      setOpen,
+      panelId
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(MegaMenuContext.MegaMenuContext.Provider, { value: contextValue, children });
+}
+
+exports.MegaMenu = MegaMenu;
+//# sourceMappingURL=MegaMenu.js.map

package/dist-cjs/mega-menu/MegaMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenu.js","sources":["../src/mega-menu/MegaMenu.tsx"],"sourcesContent":["import {\n  useClick,\n  useDismiss,\n  useFloatingRootContext,\n  useInteractions,\n} from \"@floating-ui/react\";\nimport { type ReactNode, useCallback, useMemo, useRef, useState } from \"react\";\nimport { useControlled } from \"../utils\";\nimport { MegaMenuContext } from \"./MegaMenuContext\";\nimport { useMegaMenuNavigation } from \"./useMegaMenuNavigation\";\n\n/**\n * Supported placements for the mega menu panel.\n */\nexport type MegaMenuPlacement = \"bottom\" | \"bottom-start\" | \"bottom-end\";\n\nexport interface MegaMenuProps {\n  /**\n   * The content of the mega menu, typically `MegaMenuTrigger` and `MegaMenuPanel`.\n   */\n  children?: ReactNode;\n  /**\n   * Whether the mega menu is open. Use for controlled mode.\n   */\n  open?: boolean;\n  /**\n   * Whether the mega menu is initially open. Use for uncontrolled mode.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Callback fired when the open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * The placement of the mega menu panel relative to the trigger.\n   * @default \"bottom\"\n   */\n  placement?: MegaMenuPlacement;\n}\n\n/**\n * Root of a mega menu, coordinating its trigger and panel.\n *\n * Not intended to be nested inside another floating overlay (e.g. a dialog or\n * popover): the mega menu does not participate in floating-ui's `FloatingTree`\n */\nexport function MegaMenu({\n  children,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  placement = \"bottom\",\n}: MegaMenuProps) {\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: defaultOpen,\n    name: \"MegaMenu\",\n    state: \"open\",\n  });\n\n  const [reference, setReference] = useState<HTMLElement | null>(null);\n  const [floating, setFloating] = useState<HTMLElement | null>(null);\n  const focusFirstItemOnOpenRef = useRef(false);\n  const [panelId, setPanelId] = useState<string>();\n\n  const setOpen = useCallback(\n    (newOpen: boolean) => {\n      if (!newOpen) {\n        focusFirstItemOnOpenRef.current = false;\n      }\n      setOpenState(newOpen);\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange],\n  );\n\n  const floatingRootContext = useFloatingRootContext({\n    open: openState,\n    onOpenChange: setOpen,\n    elements: { reference, floating },\n  });\n\n  const megaMenuNavigation = useMegaMenuNavigation(floatingRootContext);\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useClick(floatingRootContext),\n    useDismiss(floatingRootContext),\n    megaMenuNavigation,\n  ]);\n\n  const contextValue = useMemo(\n    () => ({\n      openState,\n      floatingRootContext,\n      placement,\n      getFloatingProps,\n      getReferenceProps,\n      setFloating,\n      setReference,\n      setOpen,\n      focusFirstItemOnOpenRef,\n      panelId,\n      setPanelId,\n    }),\n    [\n      openState,\n      floatingRootContext,\n      placement,\n      getFloatingProps,\n      getReferenceProps,\n      setOpen,\n      panelId,\n    ],\n  );\n\n  return (\n    <MegaMenuContext.Provider value={contextValue}>\n      {children}\n    </MegaMenuContext.Provider>\n  );\n}\n"],"names":["useControlled","useState","useRef","useCallback","useFloatingRootContext","useMegaMenuNavigation","useInteractions","useClick","useDismiss","useMemo","MegaMenuContext"],"mappings":";;;;;;;;;;;;;;AA+CO,SAAS,QAAA,CAAS;AAAA,EACvB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,WAAA,GAAc,KAAA;AAAA,EACd,YAAA;AAAA,EACA,SAAA,GAAY;AACd,CAAA,EAAkB;AAChB,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,2BAAA,CAAc;AAAA,IAC9C,UAAA,EAAY,IAAA;AAAA,IACZ,OAAA,EAAS,WAAA;AAAA,IACT,IAAA,EAAM,UAAA;AAAA,IACN,KAAA,EAAO;AAAA,GACR,CAAA;AAED,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,eAA6B,IAAI,CAAA;AACnE,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIA,eAA6B,IAAI,CAAA;AACjE,EAAA,MAAM,uBAAA,GAA0BC,aAAO,KAAK,CAAA;AAC5C,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAID,cAAA,EAAiB;AAE/C,EAAA,MAAM,OAAA,GAAUE,iBAAA;AAAA,IACd,CAAC,OAAA,KAAqB;AACpB,MAAA,IAAI,CAAC,OAAA,EAAS;AACZ,QAAA,uBAAA,CAAwB,OAAA,GAAU,KAAA;AAAA,MACpC;AACA,MAAA,YAAA,CAAa,OAAO,CAAA;AACpB,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAe,OAAA,CAAA;AAAA,IACjB,CAAA;AAAA,IACA,CAAC,YAAY;AAAA,GACf;AAEA,EAAA,MAAM,sBAAsBC,4BAAA,CAAuB;AAAA,IACjD,IAAA,EAAM,SAAA;AAAA,IACN,YAAA,EAAc,OAAA;AAAA,IACd,QAAA,EAAU,EAAE,SAAA,EAAW,QAAA;AAAS,GACjC,CAAA;AAED,EAAA,MAAM,kBAAA,GAAqBC,4CAAsB,mBAAmB,CAAA;AAEpE,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAA,EAAiB,GAAIC,qBAAA,CAAgB;AAAA,IAC9DC,eAAS,mBAAmB,CAAA;AAAA,IAC5BC,iBAAW,mBAAmB,CAAA;AAAA,IAC9B;AAAA,GACD,CAAA;AAED,EAAA,MAAM,YAAA,GAAeC,aAAA;AAAA,IACnB,OAAO;AAAA,MACL,SAAA;AAAA,MACA,mBAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,iBAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,OAAA;AAAA,MACA,uBAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,SAAA;AAAA,MACA,mBAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,iBAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,sCACGC,+BAAA,CAAgB,QAAA,EAAhB,EAAyB,KAAA,EAAO,cAC9B,QAAA,EACH,CAAA;AAEJ;;;;"}

package/dist-cjs/mega-menu/MegaMenuActions.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuActions {\n  display: flex;\n  flex-wrap: wrap;\n  margin-block-start: auto;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuActions.css.js.map

package/dist-cjs/mega-menu/MegaMenuActions.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuActions.js

@@ -0,0 +1,37 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuActions$1 = require('./MegaMenuActions.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuActions");
+const MegaMenuActions = React.forwardRef(
+  function MegaMenuActions2({ className, ...rest }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-mega-menu-actions",
+      css: MegaMenuActions$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        "data-mega-menu-actions": "",
+        className: clsx.clsx(withBaseName(), className),
+        ref,
+        ...rest
+      }
+    );
+  }
+);
+
+exports.MegaMenuActions = MegaMenuActions;
+//# sourceMappingURL=MegaMenuActions.js.map

package/dist-cjs/mega-menu/MegaMenuActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuActions.js","sources":["../src/mega-menu/MegaMenuActions.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport megaMenuActionsCss from \"./MegaMenuActions.css\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuActions\");\n\nexport interface MegaMenuActionsProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the actions. Place `MegaMenuActions` inside\n   * `MegaMenuContent`, after `MegaMenuGroups`; it renders as a band beneath the\n   * groups, spanning their width.\n   */\n  children?: ReactNode;\n}\n\nexport const MegaMenuActions = forwardRef<HTMLDivElement, MegaMenuActionsProps>(\n  function MegaMenuActions({ className, ...rest }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-mega-menu-actions\",\n      css: megaMenuActionsCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div\n        data-mega-menu-actions=\"\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MegaMenuActions","useWindow","useComponentCssInjection","megaMenuActionsCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,qBAAqB,CAAA;AAWhD,MAAM,eAAA,GAAkBC,gBAAA;AAAA,EAC7B,SAASC,gBAAAA,CAAgB,EAAE,WAAW,GAAG,IAAA,IAAQ,GAAA,EAAK;AACpD,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,wBAAA;AAAA,MACR,GAAA,EAAKC,iBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,wBAAA,EAAuB,EAAA;AAAA,QACvB,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuAside.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuAside {\n  flex: 0 0 auto;\n  display: flex;\n  flex-direction: column;\n  padding: var(--salt-spacing-300);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuAside.css.js.map

package/dist-cjs/mega-menu/MegaMenuAside.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuAside.js

@@ -0,0 +1,37 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuAside$1 = require('./MegaMenuAside.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuAside");
+const MegaMenuAside = React.forwardRef(
+  function MegaMenuAside2({ className, ...rest }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-mega-menu-aside",
+      css: MegaMenuAside$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "aside",
+      {
+        "data-mega-menu-column": "",
+        className: clsx.clsx(withBaseName(), className),
+        ref,
+        ...rest
+      }
+    );
+  }
+);
+
+exports.MegaMenuAside = MegaMenuAside;
+//# sourceMappingURL=MegaMenuAside.js.map

package/dist-cjs/mega-menu/MegaMenuAside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuAside.js","sources":["../src/mega-menu/MegaMenuAside.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport megaMenuAsideCss from \"./MegaMenuAside.css\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuAside\");\n\nexport interface MegaMenuAsideProps extends ComponentPropsWithoutRef<\"aside\"> {\n  /**\n   * The content. Renders to the left of `MegaMenuContent` when placed before\n   * it, and to the right when placed after.\n   */\n  children?: ReactNode;\n}\n\nexport const MegaMenuAside = forwardRef<HTMLElement, MegaMenuAsideProps>(\n  function MegaMenuAside({ className, ...rest }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-mega-menu-aside\",\n      css: megaMenuAsideCss,\n      window: targetWindow,\n    });\n\n    // Side content is also a navigation column (`data-mega-menu-column`).\n    return (\n      <aside\n        data-mega-menu-column=\"\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MegaMenuAside","useWindow","useComponentCssInjection","megaMenuAsideCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA;AAU9C,MAAM,aAAA,GAAgBC,gBAAA;AAAA,EAC3B,SAASC,cAAAA,CAAc,EAAE,WAAW,GAAG,IAAA,IAAQ,GAAA,EAAK;AAClD,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,eAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAGD,IAAA,uBACEC,cAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,uBAAA,EAAsB,EAAA;AAAA,QACtB,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuContent.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuContent {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-300);\n  padding: var(--salt-spacing-300);\n  min-width: 0;\n  flex: 0 1 auto;\n  max-inline-size: var(--saltMegaMenuPanel-availableWidth);\n  box-sizing: border-box;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuContent.css.js.map

package/dist-cjs/mega-menu/MegaMenuContent.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuContent.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuContent$1 = require('./MegaMenuContent.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuContent");
+const MegaMenuContent = React.forwardRef(
+  function MegaMenuContent2({ children, className, ...rest }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-mega-menu-content",
+      css: MegaMenuContent$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(withBaseName(), className), ref, ...rest, children });
+  }
+);
+
+exports.MegaMenuContent = MegaMenuContent;
+//# sourceMappingURL=MegaMenuContent.js.map

package/dist-cjs/mega-menu/MegaMenuContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuContent.js","sources":["../src/mega-menu/MegaMenuContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport megaMenuContentCss from \"./MegaMenuContent.css\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuContent\");\n\nexport interface MegaMenuContentProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the mega menu navigation area, typically a `MegaMenuGroups`\n   * and an optional `MegaMenuActions`.\n   */\n  children?: ReactNode;\n}\n\nexport const MegaMenuContent = forwardRef<HTMLDivElement, MegaMenuContentProps>(\n  function MegaMenuContent({ children, className, ...rest }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-mega-menu-content\",\n      css: megaMenuContentCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MegaMenuContent","useWindow","useComponentCssInjection","megaMenuContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,qBAAqB,CAAA;AAUhD,MAAM,eAAA,GAAkBC,gBAAA;AAAA,EAC7B,SAASC,iBAAgB,EAAE,QAAA,EAAU,WAAW,GAAG,IAAA,IAAQ,GAAA,EAAK;AAC9D,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,wBAAA;AAAA,MACR,GAAA,EAAKC,iBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC5D,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuContext.js

@@ -0,0 +1,18 @@
+'use strict';
+
+var createContext = require('../utils/createContext.js');
+require('react');
+require('clsx');
+require('react/jsx-runtime');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+
+const MegaMenuContext = createContext.createContext(
+  "MegaMenuContext",
+  void 0
+);
+
+exports.MegaMenuContext = MegaMenuContext;
+//# sourceMappingURL=MegaMenuContext.js.map

package/dist-cjs/mega-menu/MegaMenuContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuContext.js","sources":["../src/mega-menu/MegaMenuContext.ts"],"sourcesContent":["import type { FloatingRootContext } from \"@floating-ui/react\";\nimport type {\n  Dispatch,\n  HTMLProps,\n  MutableRefObject,\n  SetStateAction,\n} from \"react\";\nimport { createContext } from \"../utils\";\nimport type { MegaMenuPlacement } from \"./MegaMenu\";\n\nexport interface MegaMenuContextValue {\n  /** Whether the mega menu is currently open. */\n  openState: boolean;\n  /** Toggle or set the open state of the mega menu. */\n  setOpen: (open: boolean) => void;\n  /** The floating-ui root context for coordinating interactions. */\n  floatingRootContext: FloatingRootContext;\n  /** The placement of the mega menu panel relative to the trigger. */\n  placement: MegaMenuPlacement;\n  /** Props getter for the trigger (reference) element. Merges floating-ui interaction props with user props. */\n  getReferenceProps: (\n    userProps?: HTMLProps<Element> | undefined,\n  ) => Record<string, unknown>;\n  /** Props getter for the floating panel element. Merges floating-ui interaction props with user props. */\n  getFloatingProps: (\n    userProps?: HTMLProps<HTMLElement> | undefined,\n  ) => Record<string, unknown>;\n  /** Ref setter for the floating panel element. */\n  setFloating: Dispatch<SetStateAction<HTMLElement | null>>;\n  /** Ref setter for the trigger (reference) element. */\n  setReference: Dispatch<SetStateAction<HTMLElement | null>>;\n  /** Whether the first item should receive focus when the panel opens. */\n  focusFirstItemOnOpenRef: MutableRefObject<boolean>;\n  /** The id of the mega menu panel, used for aria-controls on the trigger. */\n  panelId: string | undefined;\n  /** Registers the panel's id so the trigger's aria-controls stays in sync. */\n  setPanelId: Dispatch<SetStateAction<string | undefined>>;\n}\n\nexport const MegaMenuContext = createContext<MegaMenuContextValue | undefined>(\n  \"MegaMenuContext\",\n  undefined,\n);\n"],"names":["createContext"],"mappings":";;;;;;;;;;;AAuCO,MAAM,eAAA,GAAkBA,2BAAA;AAAA,EAC7B,iBAAA;AAAA,EACA;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuGroup.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuGroup {\n  display: flex;\n  flex-direction: column;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuGroup.css.js.map

package/dist-cjs/mega-menu/MegaMenuGroup.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuGroup.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuGroup$1 = require('./MegaMenuGroup.css.js');
+var MegaMenuGroupContext = require('./MegaMenuGroupContext.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuGroup");
+const MegaMenuGroup = React.forwardRef(
+  function MegaMenuGroup2({ children, className, ...rest }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-mega-menu-group",
+      css: MegaMenuGroup$1,
+      window: targetWindow
+    });
+    const [headingId, setHeadingId] = React.useState(void 0);
+    const contextValue = React.useMemo(
+      () => ({ headingId, setHeadingId }),
+      [headingId]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(MegaMenuGroupContext.MegaMenuGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        "data-mega-menu-column": "",
+        className: clsx.clsx(withBaseName(), className),
+        ref,
+        ...rest,
+        children
+      }
+    ) });
+  }
+);
+
+exports.MegaMenuGroup = MegaMenuGroup;
+//# sourceMappingURL=MegaMenuGroup.js.map

package/dist-cjs/mega-menu/MegaMenuGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuGroup.js","sources":["../src/mega-menu/MegaMenuGroup.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  useMemo,\n  useState,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport megaMenuGroupCss from \"./MegaMenuGroup.css\";\nimport { MegaMenuGroupContext } from \"./MegaMenuGroupContext\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuGroup\");\n\nexport interface MegaMenuGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of the mega menu group: a `MegaMenuGroupHeading` and a\n   * `MegaMenuList` of `MegaMenuListItem`s.\n   */\n  children?: ReactNode;\n}\n\nexport const MegaMenuGroup = forwardRef<HTMLDivElement, MegaMenuGroupProps>(\n  function MegaMenuGroup({ children, className, ...rest }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-mega-menu-group\",\n      css: megaMenuGroupCss,\n      window: targetWindow,\n    });\n\n    // The heading registers its id so the list can label itself; `undefined`\n    // with no heading. The group is also a navigation column.\n    const [headingId, setHeadingId] = useState<string | undefined>(undefined);\n    const contextValue = useMemo(\n      () => ({ headingId, setHeadingId }),\n      [headingId],\n    );\n\n    return (\n      <MegaMenuGroupContext.Provider value={contextValue}>\n        <div\n          data-mega-menu-column=\"\"\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </div>\n      </MegaMenuGroupContext.Provider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MegaMenuGroup","useWindow","useComponentCssInjection","megaMenuGroupCss","useState","useMemo","jsx","MegaMenuGroupContext","clsx"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,mBAAmB,CAAA;AAU9C,MAAM,aAAA,GAAgBC,gBAAA;AAAA,EAC3B,SAASC,eAAc,EAAE,QAAA,EAAU,WAAW,GAAG,IAAA,IAAQ,GAAA,EAAK;AAC5D,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,eAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAID,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,eAA6B,MAAS,CAAA;AACxE,IAAA,MAAM,YAAA,GAAeC,aAAA;AAAA,MACnB,OAAO,EAAE,SAAA,EAAW,YAAA,EAAa,CAAA;AAAA,MACjC,CAAC,SAAS;AAAA,KACZ;AAEA,IAAA,uBACEC,cAAA,CAACC,yCAAA,CAAqB,QAAA,EAArB,EAA8B,OAAO,YAAA,EACpC,QAAA,kBAAAD,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,uBAAA,EAAsB,EAAA;AAAA,QACtB,SAAA,EAAWE,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH,EACF,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuGroupContext.js

@@ -0,0 +1,23 @@
+'use strict';
+
+var React = require('react');
+var createContext = require('../utils/createContext.js');
+require('clsx');
+require('react/jsx-runtime');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+
+const MegaMenuGroupContext = createContext.createContext(
+  "MegaMenuGroupContext",
+  { headingId: void 0, setHeadingId: () => {
+  } }
+);
+function useMegaMenuGroup() {
+  return React.useContext(MegaMenuGroupContext);
+}
+
+exports.MegaMenuGroupContext = MegaMenuGroupContext;
+exports.useMegaMenuGroup = useMegaMenuGroup;
+//# sourceMappingURL=MegaMenuGroupContext.js.map

package/dist-cjs/mega-menu/MegaMenuGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuGroupContext.js","sources":["../src/mega-menu/MegaMenuGroupContext.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { createContext } from \"../utils\";\n\nexport interface MegaMenuGroupContextValue {\n  /**\n   * The rendered heading's id, used to label the item list via `aria-labelledby`.\n   * `undefined` when the group has no `MegaMenuGroupHeading`.\n   */\n  headingId: string | undefined;\n  /** Register (or clear, with `undefined`) the heading's id. */\n  setHeadingId: (id: string | undefined) => void;\n}\n\nexport const MegaMenuGroupContext = createContext<MegaMenuGroupContextValue>(\n  \"MegaMenuGroupContext\",\n  { headingId: undefined, setHeadingId: () => {} },\n);\n\n/** Access the nearest `MegaMenuGroup` context. */\nexport function useMegaMenuGroup(): MegaMenuGroupContextValue {\n  return useContext(MegaMenuGroupContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;;;;;AAaO,MAAM,oBAAA,GAAuBA,2BAAA;AAAA,EAClC,sBAAA;AAAA,EACA,EAAE,SAAA,EAAW,MAAA,EAAW,YAAA,EAAc,MAAM;AAAA,EAAC,CAAA;AAC/C;AAGO,SAAS,gBAAA,GAA8C;AAC5D,EAAA,OAAOC,iBAAW,oBAAoB,CAAA;AACxC;;;;;"}

package/dist-cjs/mega-menu/MegaMenuGroupHeading.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuGroupHeading {\n  display: flex;\n  align-items: center;\n  margin: 0 0 var(--salt-spacing-50);\n  padding: var(--salt-spacing-50) var(--salt-spacing-100);\n  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-tertiary-borderColor);\n  min-height: var(--salt-size-base);\n  font-family: var(--salt-text-label-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  font-weight: var(--salt-text-fontWeight-strong);\n  line-height: var(--salt-text-label-lineHeight);\n  color: var(--salt-content-secondary-foreground);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuGroupHeading.css.js.map

package/dist-cjs/mega-menu/MegaMenuGroupHeading.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuGroupHeading.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+var useId = require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuGroupContext = require('./MegaMenuGroupContext.js');
+var MegaMenuGroupHeading$1 = require('./MegaMenuGroupHeading.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuGroupHeading");
+const MegaMenuGroupHeading = React.forwardRef(function MegaMenuGroupHeading2({ children, className, id: idProp, as: Heading = "h3", ...rest }, ref) {
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-mega-menu-group-heading",
+    css: MegaMenuGroupHeading$1,
+    window: targetWindow
+  });
+  const id = useId.useId(idProp);
+  const { setHeadingId } = MegaMenuGroupContext.useMegaMenuGroup();
+  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+    setHeadingId(id);
+    return () => setHeadingId(void 0);
+  }, [id, setHeadingId]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Heading,
+    {
+      className: clsx.clsx(withBaseName(), className),
+      ref,
+      ...rest,
+      id,
+      children
+    }
+  );
+});
+
+exports.MegaMenuGroupHeading = MegaMenuGroupHeading;
+//# sourceMappingURL=MegaMenuGroupHeading.js.map

package/dist-cjs/mega-menu/MegaMenuGroupHeading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuGroupHeading.js","sources":["../src/mega-menu/MegaMenuGroupHeading.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, useIsomorphicLayoutEffect } from \"../utils\";\nimport { useMegaMenuGroup } from \"./MegaMenuGroupContext\";\nimport megaMenuGroupHeadingCss from \"./MegaMenuGroupHeading.css\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuGroupHeading\");\n\nexport interface MegaMenuGroupHeadingProps\n  extends ComponentPropsWithoutRef<\"h2\"> {\n  /**\n   * The content of the mega menu group heading.\n   */\n  children?: ReactNode;\n  /**\n   * The heading element to render.\n   * @default \"h3\"\n   */\n  as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n}\n\nexport const MegaMenuGroupHeading = forwardRef<\n  HTMLHeadingElement,\n  MegaMenuGroupHeadingProps\n>(function MegaMenuGroupHeading(\n  { children, className, id: idProp, as: Heading = \"h3\", ...rest },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-mega-menu-group-heading\",\n    css: megaMenuGroupHeadingCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n  const { setHeadingId } = useMegaMenuGroup();\n  useIsomorphicLayoutEffect(() => {\n    setHeadingId(id);\n    return () => setHeadingId(undefined);\n  }, [id, setHeadingId]);\n\n  return (\n    <Heading\n      className={clsx(withBaseName(), className)}\n      ref={ref}\n      {...rest}\n      id={id}\n    >\n      {children}\n    </Heading>\n  );\n});\n"],"names":["makePrefixer","forwardRef","MegaMenuGroupHeading","useWindow","useComponentCssInjection","megaMenuGroupHeadingCss","useId","useMegaMenuGroup","useIsomorphicLayoutEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,0BAAa,0BAA0B,CAAA;AAerD,MAAM,oBAAA,GAAuBC,gBAAA,CAGlC,SAASC,qBAAAA,CACT,EAAE,QAAA,EAAU,SAAA,EAAW,EAAA,EAAI,MAAA,EAAQ,IAAI,OAAA,GAAU,IAAA,EAAM,GAAG,IAAA,IAC1D,GAAA,EACA;AACA,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,8BAAA;AAAA,IACR,GAAA,EAAKC,sBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAA,GAAKC,YAAM,MAAM,CAAA;AACvB,EAAA,MAAM,EAAE,YAAA,EAAa,GAAIC,qCAAA,EAAiB;AAC1C,EAAAC,mDAAA,CAA0B,MAAM;AAC9B,IAAA,YAAA,CAAa,EAAE,CAAA;AACf,IAAA,OAAO,MAAM,aAAa,MAAS,CAAA;AAAA,EACrC,CAAA,EAAG,CAAC,EAAA,EAAI,YAAY,CAAC,CAAA;AAErB,EAAA,uBACEC,cAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,EAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-cjs/mega-menu/MegaMenuGroups.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuGroups {\n  align-self: start;\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(0, var(--saltMegaMenuGroups-columnWidth, 12rem)));\n  gap: var(--salt-spacing-300);\n  min-width: 0;\n  max-inline-size: var(--saltMegaMenuPanel-availableWidth);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuGroups.css.js.map

package/dist-cjs/mega-menu/MegaMenuGroups.css.js.map

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

package/dist-cjs/mega-menu/MegaMenuGroups.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var React = require('react');
+var makePrefixer = require('../utils/makePrefixer.js');
+require('../utils/useFloatingUI/useFloatingUI.js');
+require('../utils/useId.js');
+require('../salt-provider/SaltProvider.js');
+require('../viewport/ViewportProvider.js');
+var MegaMenuGroups$1 = require('./MegaMenuGroups.css.js');
+
+const withBaseName = makePrefixer.makePrefixer("saltMegaMenuGroups");
+const MegaMenuGroups = React.forwardRef(
+  function MegaMenuGroups2({ children, className, ...rest }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-mega-menu-groups",
+      css: MegaMenuGroups$1,
+      window: targetWindow
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(withBaseName(), className), ref, ...rest, children });
+  }
+);
+
+exports.MegaMenuGroups = MegaMenuGroups;
+//# sourceMappingURL=MegaMenuGroups.js.map

package/dist-cjs/mega-menu/MegaMenuGroups.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MegaMenuGroups.js","sources":["../src/mega-menu/MegaMenuGroups.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport megaMenuGroupsCss from \"./MegaMenuGroups.css\";\n\nconst withBaseName = makePrefixer(\"saltMegaMenuGroups\");\n\nexport interface MegaMenuGroupsProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The `MegaMenuGroup` columns of the mega menu.\n   */\n  children?: ReactNode;\n}\n\nexport const MegaMenuGroups = forwardRef<HTMLDivElement, MegaMenuGroupsProps>(\n  function MegaMenuGroups({ children, className, ...rest }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-mega-menu-groups\",\n      css: megaMenuGroupsCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","MegaMenuGroups","useWindow","useComponentCssInjection","megaMenuGroupsCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,oBAAoB,CAAA;AAS/C,MAAM,cAAA,GAAiBC,gBAAA;AAAA,EAC5B,SAASC,gBAAe,EAAE,QAAA,EAAU,WAAW,GAAG,IAAA,IAAQ,GAAA,EAAK;AAC7D,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,uBAAA;AAAA,MACR,GAAA,EAAKC,gBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC5D,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/mega-menu/MegaMenuList.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltMegaMenuList {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  gap: var(--salt-spacing-fixed-100);\n  flex-direction: column;\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=MegaMenuList.css.js.map

package/dist-cjs/mega-menu/MegaMenuList.css.js.map

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