@salt-ds/lab 1.0.0-alpha.7 → 1.0.0-alpha.71

package/dist-cjs/cascading-menu/CascadingMenuList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CascadingMenuList.js","sources":["../src/cascading-menu/CascadingMenuList.tsx"],"sourcesContent":["import {\n  type UseFloatingUIProps,\n  useFloatingUI,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, useCallback, useEffect, useMemo, useState } from \"react\";\nimport { List, type ListProps } from \"../list-deprecated\";\nimport { Portal } from \"../portal\";\n\nimport { useWindow as usePortalWindow } from \"../window\";\nimport { DefaultMenuItem, type MenuItemProps } from \"./CascadingMenuItem\";\nimport { CascadingMenuAction } from \"./internal/CascadingMenuAction\";\nimport { getKeyDownHandlers } from \"./internal/keydownHandlers\";\nimport {\n  getHeight,\n  getMaxHeight,\n  type screenBounds,\n} from \"./internal/menuPositioning\";\nimport { hasIcon, hasSubMenu, type menuState } from \"./internal/stateUtils\";\nimport { useMouseHandlers } from \"./internal/useMouseHandlers\";\nimport type { refsManager } from \"./internal/useRefsManager\";\nimport { stateChangeTypes } from \"./stateChangeTypes\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport cascadingMenuListCss from \"./CascadingMenuList.css\";\n\nexport interface CascadingMenuListProps {\n  className?: string;\n  data: menuState;\n  delay?: number;\n  disableMouseOutInteractions?: boolean;\n  // TODO any\n  dispatch: (action: any) => void;\n  getBoundingClientRect?: (element: HTMLElement) => DOMRect;\n  getScreenBounds?: () => screenBounds;\n  height?: number;\n  highlightedItemIndex: number | null;\n  isChildMenuOpen: boolean;\n  itemToString: MenuItemProps[\"itemToString\"];\n  isNavigatingWithKeyboard: boolean;\n  isRoot: boolean;\n  maxWidth?: ListProps[\"maxWidth\"];\n  menuId: string;\n  menuTriggerRef: HTMLElement | null;\n  minWidth?: ListProps[\"minWidth\"];\n  onItemClick?: MenuItemProps[\"onItemClick\"];\n  parentElement?: HTMLElement | null;\n  refsManager: refsManager;\n  rootPlacement?: UseFloatingUIProps[\"placement\"];\n  rootPlacementOffset?: string;\n  rowHeight?: number;\n  setIsNavigatingWithKeyboard: (value: boolean) => void;\n  tooltipEnterDelay: number;\n  tooltipLeaveDelay: number;\n}\n\nexport const CascadingMenuList = forwardRef<\n  HTMLDivElement,\n  CascadingMenuListProps\n>(function CascadingMenuList(props, ref) {\n  const {\n    className,\n    maxWidth,\n    minWidth,\n    itemToString,\n    onItemClick,\n    refsManager,\n    dispatch,\n    rowHeight: rowHeightProp,\n    isNavigatingWithKeyboard,\n    data,\n    tooltipEnterDelay,\n    tooltipLeaveDelay,\n    height: heightProp,\n    isChildMenuOpen,\n    isRoot,\n    highlightedItemIndex,\n    menuId,\n    parentElement = null,\n    getScreenBounds,\n    disableMouseOutInteractions,\n    rootPlacementOffset,\n    rootPlacement = \"bottom-start\",\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-cascading-menu-list\",\n    css: cascadingMenuListCss,\n    window: targetWindow,\n  });\n\n  const baseClass = \"saltCascadingMenuList\";\n\n  const [menuRef, setInternalMenuRef] = useState<HTMLElement | null>(null);\n  const setMenuRef = useCallback(\n    (node: HTMLElement) => {\n      refsManager.set(menuId, node);\n    },\n    [refsManager, menuId],\n  );\n\n  // TODO removed useCharacteristic here\n  const sizeStackable = 36;\n  const defaultRowHeight = sizeStackable;\n\n  // TODO removed useCharacteristic here\n  const spacing = 8;\n\n  const isMenuActiveState = useState(true);\n  const [isMenuActive, setIsMenuActive] = isMenuActiveState;\n  const listRef = useForkRef<HTMLElement>(ref, setInternalMenuRef);\n  const handleRef = useForkRef(setMenuRef, listRef);\n\n  useEffect(() => {\n    if (menuRef?.focus) {\n      // timeout prevents scrolling issue by waiting a split second\n      // and menu should be correctly positioned by then and\n      // focusing popper content offscreen will not scroll page\n      // it would be better to maybe use popper onUpdate callback\n      // or some kind of polling mechanism to confirm placement is\n      // correct before focus call\n      const id = setTimeout(() => {\n        menuRef.focus();\n      });\n      return () => {\n        clearTimeout(id);\n      };\n    }\n  }, [menuRef, rootPlacementOffset]);\n\n  const handleKeyDown = getKeyDownHandlers(props, setIsMenuActive);\n\n  const onFocusHandler = useCallback(() => {\n    setIsMenuActive(true);\n    // When navigating via keyboard on open highlight first time in the list\n    if (isNavigatingWithKeyboard) {\n      if (!highlightedItemIndex) {\n        dispatch({\n          type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n          cause: stateChangeTypes.KEYBOARD_NAV_AUTO_FOCUS,\n          targetId: menuId,\n          highlightedItemIndex: 0,\n        });\n      }\n    }\n  }, [\n    setIsMenuActive,\n    isNavigatingWithKeyboard,\n    highlightedItemIndex,\n    dispatch,\n    menuId,\n  ]);\n\n  const [handleMouseMove, handleMouseOut] = useMouseHandlers(\n    props,\n    isMenuActiveState,\n    menuRef,\n  );\n\n  const hasEndAdornment = useMemo(\n    () => data.menuItems.some(hasSubMenu),\n    [data],\n  );\n  const hasStartAdornment = useMemo(() => data.menuItems.some(hasIcon), [data]);\n  const rowHeight = rowHeightProp != null ? rowHeightProp : defaultRowHeight;\n  const maxHeight = getMaxHeight(heightProp, spacing, getScreenBounds);\n  const calculatedMenuHeight = rowHeight * data.menuItems.length;\n  const menuHeight = getHeight(heightProp, calculatedMenuHeight, maxHeight);\n  const hasScrollbar = menuHeight >= maxHeight;\n\n  // menu container size is 2px larger than the list to include the border\n  const menuContainerHeight = menuHeight + 2;\n  const Window = usePortalWindow();\n  const { reference, floating, x, y, strategy } = useFloatingUI({\n    placement: isRoot ? rootPlacement : \"right-start\",\n  });\n  useIsomorphicLayoutEffect(() => {\n    if (parentElement) {\n      reference(\n        isRoot\n          ? parentElement\n          : parentElement.querySelector(\n              `#${\n                parentElement.getAttribute(\"aria-activedescendant\") as string\n              }`,\n            ),\n      );\n    }\n  }, [reference, isRoot, parentElement]);\n\n  if (parentElement === null) {\n    return null;\n  }\n\n  return (\n    <Portal>\n      <Window\n        className={`${baseClass}-popper`}\n        id={menuId}\n        style={{\n          top: y ?? 0,\n          left: x ?? 0,\n          position: strategy,\n        }}\n        ref={floating}\n      >\n        <List\n          className={clsx(baseClass, className)}\n          height={menuContainerHeight}\n          highlightedIndex={\n            highlightedItemIndex === null ? -1 : highlightedItemIndex\n          }\n          id={menuId}\n          itemHeight={rowHeight}\n          itemToString={itemToString}\n          key={menuId}\n          listRef={handleRef}\n          maxWidth={maxWidth}\n          minWidth={minWidth}\n          onFocus={onFocusHandler}\n          onKeyDown={handleKeyDown}\n          onMouseOut={disableMouseOutInteractions ? undefined : handleMouseOut}\n          role=\"menu\"\n          width=\"auto\"\n        >\n          {data.menuItems.map((menuItem, idx) => {\n            const isInteracted = highlightedItemIndex === idx;\n            return (\n              <DefaultMenuItem\n                blurSelected={!isMenuActive && isInteracted}\n                hasEndAdornment={hasEndAdornment}\n                hasScrollbar={hasScrollbar}\n                hasStartAdornment={hasStartAdornment}\n                hasSubMenu={hasSubMenu(menuItem)}\n                isChildMenuOpen={isChildMenuOpen}\n                isInteracted={isInteracted}\n                isNavigatingWithKeyboard={isNavigatingWithKeyboard}\n                itemToString={itemToString}\n                key={menuItem.id}\n                onItemClick={onItemClick}\n                onMouseMove={() => handleMouseMove(idx)}\n                sourceItem={menuItem}\n                tooltipEnterDelay={tooltipEnterDelay}\n                tooltipLeaveDelay={tooltipLeaveDelay}\n              />\n            );\n          })}\n        </List>\n      </Window>\n    </Portal>\n  );\n});\n"],"names":["forwardRef","CascadingMenuList","useWindow","useComponentCssInjection","cascadingMenuListCss","useState","useCallback","useForkRef","useEffect","getKeyDownHandlers","CascadingMenuAction","stateChangeTypes","useMouseHandlers","useMemo","hasSubMenu","hasIcon","getMaxHeight","getHeight","usePortalWindow","useFloatingUI","useIsomorphicLayoutEffect","Portal","jsx","List","clsx","DefaultMenuItem"],"mappings":"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"}

package/dist-cjs/cascading-menu/internal/CascadingMenuAction.js

@@ -0,0 +1,13 @@
+'use strict';
+
+const CascadingMenuAction = {
+  SET_CURRENT_INTERACTED_ITEM: "setCurrentInteractedItem",
+  RESET_MENU: "resetMenu",
+  OPEN_MENU: "openMenu",
+  CLOSE_MENU: "closeMenu",
+  CLOSE_CASCADING_MENU: "closeCascadingMenu",
+  SET_FLIPPED: "setFlipped"
+};
+
+exports.CascadingMenuAction = CascadingMenuAction;
+//# sourceMappingURL=CascadingMenuAction.js.map

package/dist-cjs/cascading-menu/internal/CascadingMenuAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CascadingMenuAction.js","sources":["../src/cascading-menu/internal/CascadingMenuAction.ts"],"sourcesContent":["import type { stateChangeCause } from \"../stateChangeTypes\";\n\nexport type menuActionType =\n  | \"setCurrentInteractedItem\"\n  | \"resetMenu\"\n  | \"openMenu\"\n  | \"closeMenu\"\n  | \"closeCascadingMenu\"\n  | \"setFlipped\";\n\nexport type menuAction = {\n  type: menuActionType;\n  cause: stateChangeCause;\n  flipped?: boolean;\n  highlightedItemIndex?: number;\n  targetId: string;\n};\n\nexport const CascadingMenuAction: Record<string, menuActionType> = {\n  SET_CURRENT_INTERACTED_ITEM: \"setCurrentInteractedItem\",\n  RESET_MENU: \"resetMenu\",\n  OPEN_MENU: \"openMenu\",\n  CLOSE_MENU: \"closeMenu\",\n  CLOSE_CASCADING_MENU: \"closeCascadingMenu\",\n  SET_FLIPPED: \"setFlipped\",\n};\n"],"names":[],"mappings":";;AAkBO,MAAM,mBAAsD,GAAA;AAAA,EACjE,2BAA6B,EAAA,0BAAA;AAAA,EAC7B,UAAY,EAAA,WAAA;AAAA,EACZ,SAAW,EAAA,UAAA;AAAA,EACX,UAAY,EAAA,WAAA;AAAA,EACZ,oBAAsB,EAAA,oBAAA;AAAA,EACtB,WAAa,EAAA;AACf;;;;"}

package/dist-cjs/cascading-menu/internal/keydownHandlers.js

@@ -0,0 +1,194 @@
+'use strict';
+
+var stateChangeTypes = require('../stateChangeTypes.js');
+var CascadingMenuAction = require('./CascadingMenuAction.js');
+var stateUtils = require('./stateUtils.js');
+
+function getKeyDownHandlers(props, setIsMenuActive) {
+  const {
+    keyDownHandlersOverride,
+    onItemClick,
+    dispatch,
+    isNavigatingWithKeyboard,
+    setIsNavigatingWithKeyboard,
+    data,
+    menuTriggerRef,
+    highlightedItemIndex,
+    menuId,
+    parentElement,
+    isRoot
+  } = props;
+  const rowCount = data.menuItems.length;
+  const isIndexDisabled = () => {
+    var _a, _b;
+    return highlightedItemIndex ? (_b = (_a = data.menuItems) == null ? void 0 : _a[highlightedItemIndex]) == null ? void 0 : _b.disabled : false;
+  };
+  const handlers = {
+    Enter(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (highlightedItemIndex === null || isIndexDisabled()) {
+        return;
+      }
+      const selectedItem = data.menuItems[highlightedItemIndex];
+      const subMenuId = data.childMenus[highlightedItemIndex];
+      if (stateUtils.isMenuItem(selectedItem)) {
+        onItemClick == null ? void 0 : onItemClick(selectedItem, event);
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.CLOSE_CASCADING_MENU,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ENTER,
+          targetId: menuId
+        });
+        if (menuTriggerRef == null ? void 0 : menuTriggerRef.focus) {
+          menuTriggerRef.focus();
+        }
+      } else if (stateUtils.hasSubMenu(selectedItem)) {
+        setIsMenuActive(false);
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ENTER,
+          targetId: subMenuId
+        });
+      }
+    },
+    ArrowRight(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (highlightedItemIndex === null && !isNavigatingWithKeyboard) {
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_RIGHT,
+          targetId: menuId,
+          highlightedItemIndex: 0
+        });
+        return;
+      }
+      if (highlightedItemIndex === null || isIndexDisabled()) {
+        return;
+      }
+      const selectedItem = data.menuItems[highlightedItemIndex];
+      const subMenuId = data.childMenus[highlightedItemIndex];
+      if (stateUtils.hasSubMenu(selectedItem)) {
+        setIsMenuActive(false);
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_RIGHT,
+          targetId: subMenuId
+        });
+      }
+    },
+    " ": (event) => {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (highlightedItemIndex === null || isIndexDisabled()) {
+        return;
+      }
+      const selectedItem = data.menuItems[highlightedItemIndex];
+      const subMenuId = data.childMenus[highlightedItemIndex];
+      if (stateUtils.isMenuItem(selectedItem)) {
+        onItemClick == null ? void 0 : onItemClick(selectedItem, event);
+      } else if (stateUtils.hasSubMenu(selectedItem)) {
+        setIsMenuActive(false);
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_SPACEBAR,
+          targetId: subMenuId
+        });
+      }
+    },
+    Tab() {
+      setIsNavigatingWithKeyboard(true);
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.CLOSE_CASCADING_MENU,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_TAB,
+        targetId: menuId
+      });
+      if (menuTriggerRef == null ? void 0 : menuTriggerRef.focus) {
+        menuTriggerRef.focus();
+      }
+    },
+    ArrowLeft(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (parentElement && !isRoot) {
+        parentElement.focus();
+        dispatch({
+          type: CascadingMenuAction.CascadingMenuAction.CLOSE_MENU,
+          cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_LEFT,
+          targetId: menuId
+        });
+      }
+    },
+    Escape(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.CLOSE_MENU,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ESCAPE,
+        targetId: menuId
+      });
+      if (parentElement) {
+        parentElement.focus();
+      }
+    },
+    ArrowDown(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      let indexAfterMovement = highlightedItemIndex === null ? 0 : highlightedItemIndex + 1;
+      indexAfterMovement = indexAfterMovement > rowCount - 1 ? 0 : indexAfterMovement;
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_DOWN,
+        targetId: menuId,
+        highlightedItemIndex: indexAfterMovement
+      });
+    },
+    ArrowUp(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      let indexAfterMovement = highlightedItemIndex === null ? rowCount - 1 : highlightedItemIndex - 1;
+      indexAfterMovement = indexAfterMovement < 0 ? rowCount - 1 : indexAfterMovement;
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_UP,
+        targetId: menuId,
+        highlightedItemIndex: indexAfterMovement
+      });
+    },
+    Home(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (highlightedItemIndex === 0) {
+        return;
+      }
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_HOME,
+        targetId: menuId,
+        highlightedItemIndex: 0
+      });
+    },
+    End(event) {
+      event.preventDefault();
+      setIsNavigatingWithKeyboard(true);
+      if (highlightedItemIndex === rowCount - 1) {
+        return;
+      }
+      dispatch({
+        type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+        cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ESCAPE,
+        targetId: menuId,
+        highlightedItemIndex: rowCount - 1
+      });
+    },
+    ...keyDownHandlersOverride
+  };
+  const handleKeyDown = (event) => {
+    var _a;
+    (_a = handlers[event.key]) == null ? void 0 : _a.call(handlers, event);
+  };
+  return handleKeyDown;
+}
+
+exports.getKeyDownHandlers = getKeyDownHandlers;
+//# sourceMappingURL=keydownHandlers.js.map

package/dist-cjs/cascading-menu/internal/keydownHandlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keydownHandlers.js","sources":["../src/cascading-menu/internal/keydownHandlers.ts"],"sourcesContent":["import type { Dispatch, KeyboardEvent, SetStateAction } from \"react\";\nimport type { CascadingMenuListProps } from \"../CascadingMenuList\";\nimport { stateChangeTypes } from \"../stateChangeTypes\";\nimport { CascadingMenuAction } from \"./CascadingMenuAction\";\nimport { hasSubMenu, isMenuItem } from \"./stateUtils\";\n\ninterface getKeyDownHandlersProps extends CascadingMenuListProps {\n  keyDownHandlersOverride?: Record<string, (event: Event) => void>;\n}\n\nexport function getKeyDownHandlers(\n  props: getKeyDownHandlersProps,\n  setIsMenuActive: Dispatch<SetStateAction<boolean>>,\n) {\n  const {\n    keyDownHandlersOverride,\n    onItemClick,\n    dispatch,\n    isNavigatingWithKeyboard,\n    setIsNavigatingWithKeyboard,\n    data,\n    menuTriggerRef,\n    highlightedItemIndex,\n    menuId,\n    parentElement,\n    isRoot,\n  } = props;\n\n  const rowCount = data.menuItems.length;\n  const isIndexDisabled = () =>\n    highlightedItemIndex\n      ? data.menuItems?.[highlightedItemIndex]?.disabled\n      : false;\n\n  const handlers: Record<string, (event: KeyboardEvent<HTMLElement>) => void> =\n    {\n      Enter(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n\n        if (highlightedItemIndex === null || isIndexDisabled()) {\n          return;\n        }\n        // If it is an actionable item -> execute action, close cascading menu and move focus to menu trigger\n        const selectedItem = data.menuItems[highlightedItemIndex];\n        const subMenuId = data.childMenus[highlightedItemIndex];\n        if (isMenuItem(selectedItem)) {\n          onItemClick?.(selectedItem, event);\n\n          dispatch({\n            type: CascadingMenuAction.CLOSE_CASCADING_MENU,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ENTER,\n            targetId: menuId,\n          });\n          if (menuTriggerRef?.focus) {\n            menuTriggerRef.focus();\n          }\n        } else if (hasSubMenu(selectedItem)) {\n          setIsMenuActive(false);\n          dispatch({\n            type: CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ENTER,\n            targetId: subMenuId,\n          });\n        }\n      },\n      ArrowRight(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n\n        // User is switching from mouse to keyboard interaction\n        if (highlightedItemIndex === null && !isNavigatingWithKeyboard) {\n          // Move focus to first item in the list\n          dispatch({\n            type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_RIGHT,\n            targetId: menuId,\n            highlightedItemIndex: 0,\n          });\n          return;\n        }\n\n        if (highlightedItemIndex === null || isIndexDisabled()) {\n          return;\n        }\n\n        const selectedItem = data.menuItems[highlightedItemIndex];\n        const subMenuId = data.childMenus[highlightedItemIndex];\n        if (hasSubMenu(selectedItem)) {\n          setIsMenuActive(false);\n          dispatch({\n            type: CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_RIGHT,\n            targetId: subMenuId,\n          });\n        }\n      },\n      \" \": (event: KeyboardEvent<HTMLElement>) => {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n\n        if (highlightedItemIndex === null || isIndexDisabled()) {\n          return;\n        }\n\n        const selectedItem = data.menuItems[highlightedItemIndex];\n        const subMenuId = data.childMenus[highlightedItemIndex];\n        if (isMenuItem(selectedItem)) {\n          onItemClick?.(selectedItem, event);\n        } else if (hasSubMenu(selectedItem)) {\n          setIsMenuActive(false);\n          dispatch({\n            type: CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.ITEM_KEYDOWN_SPACEBAR,\n            targetId: subMenuId,\n          });\n        }\n      },\n      Tab() {\n        // On tab close the cascading menu and focus the menu trigger so that focus event bubbling can either select\n        // next element in tab order for Tab key or previous one for Tab + Shift key\n        setIsNavigatingWithKeyboard(true);\n        dispatch({\n          type: CascadingMenuAction.CLOSE_CASCADING_MENU,\n          cause: stateChangeTypes.ITEM_KEYDOWN_TAB,\n          targetId: menuId,\n        });\n        if (menuTriggerRef?.focus) {\n          menuTriggerRef.focus();\n        }\n      },\n      ArrowLeft(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        if (parentElement && !isRoot) {\n          parentElement.focus();\n          dispatch({\n            type: CascadingMenuAction.CLOSE_MENU,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_LEFT,\n            targetId: menuId,\n          });\n        }\n      },\n      Escape(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        dispatch({\n          type: CascadingMenuAction.CLOSE_MENU,\n          cause: stateChangeTypes.ITEM_KEYDOWN_ESCAPE,\n          targetId: menuId,\n        });\n\n        if (parentElement) {\n          parentElement.focus();\n        }\n      },\n      ArrowDown(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        let indexAfterMovement =\n          highlightedItemIndex === null ? 0 : highlightedItemIndex + 1;\n        indexAfterMovement =\n          indexAfterMovement > rowCount - 1 ? 0 : indexAfterMovement;\n\n        // Move to next item or first item if at the end of the list\n        dispatch({\n          type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n          cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_DOWN,\n          targetId: menuId,\n          highlightedItemIndex: indexAfterMovement,\n        });\n      },\n      ArrowUp(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        let indexAfterMovement =\n          highlightedItemIndex === null\n            ? rowCount - 1\n            : highlightedItemIndex - 1;\n        indexAfterMovement =\n          indexAfterMovement < 0 ? rowCount - 1 : indexAfterMovement;\n\n        // Move to previous item or last item if at the start of the list\n        dispatch({\n          type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n          cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_UP,\n          targetId: menuId,\n          highlightedItemIndex: indexAfterMovement,\n        });\n      },\n      Home(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        if (highlightedItemIndex === 0) {\n          return;\n        }\n\n        // Move focus to first item in the list\n        dispatch({\n          type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n          cause: stateChangeTypes.ITEM_KEYDOWN_HOME,\n          targetId: menuId,\n          highlightedItemIndex: 0,\n        });\n      },\n\n      End(event: KeyboardEvent<HTMLElement>) {\n        event.preventDefault();\n        setIsNavigatingWithKeyboard(true);\n        if (highlightedItemIndex === rowCount - 1) {\n          return;\n        }\n\n        // Move focus to last item in the list\n        dispatch({\n          type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n          cause: stateChangeTypes.ITEM_KEYDOWN_ESCAPE,\n          targetId: menuId,\n          highlightedItemIndex: rowCount - 1,\n        });\n      },\n      ...keyDownHandlersOverride,\n    };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n    handlers[event.key]?.(event);\n  };\n\n  return handleKeyDown;\n}\n"],"names":["isMenuItem","CascadingMenuAction","stateChangeTypes","hasSubMenu"],"mappings":"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"}

package/dist-cjs/cascading-menu/internal/menuPositioning.js

@@ -0,0 +1,25 @@
+'use strict';
+
+function getMaxHeight(heightProp, menuMargin = 0, getScreenBounds = defaultGetScreenBounds) {
+  const { clientHeight } = getScreenBounds();
+  let suggestedHeight = clientHeight - menuMargin;
+  if (heightProp) {
+    suggestedHeight = Math.min(heightProp, clientHeight) - menuMargin;
+  }
+  return Math.max(suggestedHeight, 0);
+}
+function getHeight(heightProp, calculatedMenuHeight, maxHeight) {
+  if (heightProp) {
+    return Math.min(heightProp, calculatedMenuHeight, maxHeight);
+  }
+  return Math.min(calculatedMenuHeight, maxHeight);
+}
+const defaultGetScreenBounds = () => {
+  const { clientHeight, clientWidth } = document.documentElement;
+  return { clientHeight, clientWidth };
+};
+
+exports.defaultGetScreenBounds = defaultGetScreenBounds;
+exports.getHeight = getHeight;
+exports.getMaxHeight = getMaxHeight;
+//# sourceMappingURL=menuPositioning.js.map

package/dist-cjs/cascading-menu/internal/menuPositioning.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menuPositioning.js","sources":["../src/cascading-menu/internal/menuPositioning.ts"],"sourcesContent":["export type screenBounds = {\n  clientHeight: number;\n  clientWidth: number;\n};\n\nexport function getMaxHeight(\n  heightProp: number | undefined,\n  menuMargin: number | undefined = 0,\n  getScreenBounds: () => screenBounds = defaultGetScreenBounds,\n) {\n  const { clientHeight } = getScreenBounds();\n\n  let suggestedHeight = clientHeight - menuMargin;\n  if (heightProp) {\n    suggestedHeight = Math.min(heightProp, clientHeight) - menuMargin;\n  }\n\n  return Math.max(suggestedHeight, 0);\n}\n\nexport function getHeight(\n  heightProp: number | undefined,\n  calculatedMenuHeight: number,\n  maxHeight: number,\n): number {\n  if (heightProp) {\n    return Math.min(heightProp, calculatedMenuHeight, maxHeight);\n  }\n\n  return Math.min(calculatedMenuHeight, maxHeight);\n}\n\nexport const defaultGetScreenBounds = (): screenBounds => {\n  const { clientHeight, clientWidth } = document.documentElement;\n  return { clientHeight, clientWidth };\n};\n"],"names":[],"mappings":";;AAKO,SAAS,YACd,CAAA,UAAA,EACA,UAAiC,GAAA,CAAA,EACjC,kBAAsC,sBACtC,EAAA;AACA,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,eAAgB,EAAA;AAEzC,EAAA,IAAI,kBAAkB,YAAe,GAAA,UAAA;AACrC,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,eAAA,GAAkB,IAAK,CAAA,GAAA,CAAI,UAAY,EAAA,YAAY,CAAI,GAAA,UAAA;AAAA;AAGzD,EAAO,OAAA,IAAA,CAAK,GAAI,CAAA,eAAA,EAAiB,CAAC,CAAA;AACpC;AAEgB,SAAA,SAAA,CACd,UACA,EAAA,oBAAA,EACA,SACQ,EAAA;AACR,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,OAAO,IAAK,CAAA,GAAA,CAAI,UAAY,EAAA,oBAAA,EAAsB,SAAS,CAAA;AAAA;AAG7D,EAAO,OAAA,IAAA,CAAK,GAAI,CAAA,oBAAA,EAAsB,SAAS,CAAA;AACjD;AAEO,MAAM,yBAAyB,MAAoB;AACxD,EAAA,MAAM,EAAE,YAAA,EAAc,WAAY,EAAA,GAAI,QAAS,CAAA,eAAA;AAC/C,EAAO,OAAA,EAAE,cAAc,WAAY,EAAA;AACrC;;;;;;"}

package/dist-cjs/cascading-menu/internal/stateUtils.js

@@ -0,0 +1,47 @@
+'use strict';
+
+const ID_SEPARATOR = "-";
+function deriveFlatStateFromTree(tree, parentId = null, level = 0, generatedId = "salt-cascading-menu") {
+  const { id = generatedId, menuItems = [] } = tree;
+  return menuItems.reduce(
+    (menuStructure, menuItem, index) => {
+      if (hasSubMenu(menuItem)) {
+        const generatedChildId = [generatedId, index].join(ID_SEPARATOR);
+        menuStructure[id].childMenus[index] = menuItem.id || generatedChildId;
+        const innerState = deriveFlatStateFromTree(
+          menuItem,
+          id,
+          level + 1,
+          generatedChildId
+        );
+        return { ...menuStructure, ...innerState };
+      }
+      return menuStructure;
+    },
+    // Initialize the structure with the root menu
+    {
+      [id]: {
+        id,
+        parentId,
+        childMenus: {},
+        menuItems: tree.menuItems,
+        level
+      }
+    }
+  );
+}
+function hasSubMenu(item) {
+  return item != null && !!item.menuItems && item.menuItems.length > 0;
+}
+function isMenuItem(item) {
+  return item != null && !item.menuItems;
+}
+function hasIcon(item) {
+  return item != null && !!item.icon;
+}
+
+exports.deriveFlatStateFromTree = deriveFlatStateFromTree;
+exports.hasIcon = hasIcon;
+exports.hasSubMenu = hasSubMenu;
+exports.isMenuItem = isMenuItem;
+//# sourceMappingURL=stateUtils.js.map

package/dist-cjs/cascading-menu/internal/stateUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stateUtils.js","sources":["../src/cascading-menu/internal/stateUtils.ts"],"sourcesContent":["import type { MenuDescriptor } from \"../CascadingMenuProps\";\n\nconst ID_SEPARATOR = \"-\";\n\nexport type menuState = {\n  id: string;\n  flipped?: boolean;\n  highlightedItemIndex?: number;\n  level: number;\n  parentId: string | null;\n  childMenus: {\n    [key: number]: string;\n  };\n  menuItems: MenuDescriptor[];\n};\n\nexport type flattenedMenuState = {\n  [key: string]: menuState;\n};\n\nexport function deriveFlatStateFromTree(\n  tree: MenuDescriptor,\n  parentId: string | null = null,\n  level = 0,\n  generatedId = \"salt-cascading-menu\",\n): flattenedMenuState {\n  const { id = generatedId, menuItems = [] } = tree;\n  return menuItems.reduce(\n    (menuStructure, menuItem, index) => {\n      if (hasSubMenu(menuItem)) {\n        const generatedChildId = [generatedId, index].join(ID_SEPARATOR);\n        menuStructure[id].childMenus[index] = menuItem.id || generatedChildId;\n\n        const innerState = deriveFlatStateFromTree(\n          menuItem,\n          id,\n          level + 1,\n          generatedChildId,\n        );\n        // biome-ignore lint/performance/noAccumulatingSpread: reduce on object\n        return { ...menuStructure, ...innerState };\n      }\n      return menuStructure;\n    },\n    // Initialize the structure with the root menu\n    {\n      [id]: {\n        id,\n        parentId,\n        childMenus: {},\n        menuItems: tree.menuItems,\n        level,\n      },\n    } as flattenedMenuState,\n  );\n}\n\nexport function hasSubMenu(item: MenuDescriptor) {\n  return item != null && !!item.menuItems && item.menuItems.length > 0;\n}\n\nexport function isMenuItem(item: MenuDescriptor) {\n  return item != null && !item.menuItems;\n}\n\nexport function hasIcon(item: MenuDescriptor) {\n  return item != null && !!item.icon;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,YAAe,GAAA,GAAA;AAkBd,SAAS,wBACd,IACA,EAAA,QAAA,GAA0B,MAC1B,KAAQ,GAAA,CAAA,EACR,cAAc,qBACM,EAAA;AACpB,EAAA,MAAM,EAAE,EAAK,GAAA,WAAA,EAAa,SAAY,GAAA,IAAO,GAAA,IAAA;AAC7C,EAAA,OAAO,SAAU,CAAA,MAAA;AAAA,IACf,CAAC,aAAe,EAAA,QAAA,EAAU,KAAU,KAAA;AAClC,MAAI,IAAA,UAAA,CAAW,QAAQ,CAAG,EAAA;AACxB,QAAA,MAAM,mBAAmB,CAAC,WAAA,EAAa,KAAK,CAAA,CAAE,KAAK,YAAY,CAAA;AAC/D,QAAA,aAAA,CAAc,EAAE,CAAE,CAAA,UAAA,CAAW,KAAK,CAAA,GAAI,SAAS,EAAM,IAAA,gBAAA;AAErD,QAAA,MAAM,UAAa,GAAA,uBAAA;AAAA,UACjB,QAAA;AAAA,UACA,EAAA;AAAA,UACA,KAAQ,GAAA,CAAA;AAAA,UACR;AAAA,SACF;AAEA,QAAA,OAAO,EAAE,GAAG,aAAe,EAAA,GAAG,UAAW,EAAA;AAAA;AAE3C,MAAO,OAAA,aAAA;AAAA,KACT;AAAA;AAAA,IAEA;AAAA,MACE,CAAC,EAAE,GAAG;AAAA,QACJ,EAAA;AAAA,QACA,QAAA;AAAA,QACA,YAAY,EAAC;AAAA,QACb,WAAW,IAAK,CAAA,SAAA;AAAA,QAChB;AAAA;AACF;AACF,GACF;AACF;AAEO,SAAS,WAAW,IAAsB,EAAA;AAC/C,EAAO,OAAA,IAAA,IAAQ,QAAQ,CAAC,CAAC,KAAK,SAAa,IAAA,IAAA,CAAK,UAAU,MAAS,GAAA,CAAA;AACrE;AAEO,SAAS,WAAW,IAAsB,EAAA;AAC/C,EAAO,OAAA,IAAA,IAAQ,IAAQ,IAAA,CAAC,IAAK,CAAA,SAAA;AAC/B;AAEO,SAAS,QAAQ,IAAsB,EAAA;AAC5C,EAAA,OAAO,IAAQ,IAAA,IAAA,IAAQ,CAAC,CAAC,IAAK,CAAA,IAAA;AAChC;;;;;;;"}

package/dist-cjs/cascading-menu/internal/useClickAway.js

@@ -0,0 +1,66 @@
+'use strict';
+
+var react = require('react');
+var useEventCallback = require('../../utils/useEventCallback.js');
+require('@salt-ds/core');
+var useMountedRef = require('./useMountedRef.js');
+
+function eventComingFromNodes(nodes, event) {
+  return nodes.some(
+    (node) => node != null && (node === event.target || node.contains(event.target))
+  );
+}
+const useClickAway = (nodes, containingDocument, onClickAway, onClick = () => void 0, mouseEvent = "mouseup") => {
+  const mountedRef = useMountedRef.useMountedRef();
+  const handleClickAway = useEventCallback.useEventCallback((event) => {
+    var _a;
+    if (event.defaultPrevented) {
+      return;
+    }
+    if (!mountedRef.current) {
+      return;
+    }
+    onClick(event);
+    if (!nodes) {
+      return;
+    }
+    const resolvedNodes = typeof nodes === "function" ? nodes() : nodes;
+    const isEventComingFromNodes = eventComingFromNodes(resolvedNodes, event);
+    const ownerDocumentNode = resolvedNodes.find(
+      (node) => (
+        // node could be null, e.g. left click on surrounding area of context menu examples
+        node ? node.ownerDocument : false
+      )
+    );
+    const doc = containingDocument || (ownerDocumentNode == null ? void 0 : ownerDocumentNode.ownerDocument);
+    if (((_a = doc.documentElement) == null ? void 0 : _a.contains(event.target)) && !isEventComingFromNodes) {
+      onClickAway(event);
+    }
+  });
+  react.useEffect(() => {
+    var _a;
+    if (containingDocument) {
+      containingDocument.addEventListener(
+        mouseEvent,
+        handleClickAway
+      );
+      (_a = containingDocument.defaultView) == null ? void 0 : _a.addEventListener("blur", onClickAway);
+    }
+    return () => {
+      var _a2;
+      if (containingDocument) {
+        containingDocument.removeEventListener(
+          mouseEvent,
+          handleClickAway
+        );
+        (_a2 = containingDocument.defaultView) == null ? void 0 : _a2.removeEventListener(
+          "blur",
+          onClickAway
+        );
+      }
+    };
+  }, [handleClickAway, mouseEvent, containingDocument, onClickAway]);
+};
+
+exports.useClickAway = useClickAway;
+//# sourceMappingURL=useClickAway.js.map

package/dist-cjs/cascading-menu/internal/useClickAway.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickAway.js","sources":["../src/cascading-menu/internal/useClickAway.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { useEventCallback } from \"../../utils\";\n\nimport { useMountedRef } from \"./useMountedRef\";\n\nfunction eventComingFromNodes(nodes: HTMLElement[], event: MouseEvent) {\n  return nodes.some(\n    (node) =>\n      node != null &&\n      (node === event.target || node.contains(event.target as HTMLElement)),\n  );\n}\n\ntype clickAwayHook = (\n  nodes: HTMLElement[] | (() => HTMLElement[]) | null,\n  containingDocument: Document,\n  onClickAway: (event: FocusEvent) => void,\n  onClick: (event: MouseEvent) => void,\n  mouseEvent?: keyof DocumentEventMap,\n) => void;\n\nexport const useClickAway: clickAwayHook = (\n  nodes,\n  containingDocument,\n  onClickAway,\n  onClick = () => undefined,\n  mouseEvent = \"mouseup\",\n) => {\n  //TODO can we get rid of this if it's just for IE11 ?\n  const mountedRef = useMountedRef();\n\n  const handleClickAway = useEventCallback((event: MouseEvent) => {\n    // Ignore events that have been `event.preventDefault()` marked.\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    // IE 11 support, which trigger the handleClickAway even after the unbind\n    if (!mountedRef.current) {\n      return;\n    }\n\n    onClick(event);\n\n    if (!nodes) {\n      return;\n    }\n\n    const resolvedNodes = typeof nodes === \"function\" ? nodes() : nodes;\n    const isEventComingFromNodes = eventComingFromNodes(resolvedNodes, event);\n\n    const ownerDocumentNode = resolvedNodes.find((node) =>\n      // node could be null, e.g. left click on surrounding area of context menu examples\n      node ? node.ownerDocument : false,\n    );\n    const doc = containingDocument || ownerDocumentNode?.ownerDocument;\n\n    if (\n      doc.documentElement?.contains(event.target as HTMLElement) &&\n      !isEventComingFromNodes\n    ) {\n      onClickAway(event);\n    }\n  });\n\n  useEffect(() => {\n    if (containingDocument) {\n      containingDocument.addEventListener(\n        mouseEvent,\n        handleClickAway as EventListener,\n      );\n      containingDocument.defaultView?.addEventListener(\"blur\", onClickAway);\n    }\n    return () => {\n      if (containingDocument) {\n        containingDocument.removeEventListener(\n          mouseEvent,\n          handleClickAway as EventListener,\n        );\n        containingDocument.defaultView?.removeEventListener(\n          \"blur\",\n          onClickAway,\n        );\n      }\n    };\n  }, [handleClickAway, mouseEvent, containingDocument, onClickAway]);\n};\n"],"names":["useMountedRef","useEventCallback","useEffect","_a"],"mappings":";;;;;;;AAKA,SAAS,oBAAA,CAAqB,OAAsB,KAAmB,EAAA;AACrE,EAAA,OAAO,KAAM,CAAA,IAAA;AAAA,IACX,CAAC,IACC,KAAA,IAAA,IAAQ,IACP,KAAA,IAAA,KAAS,MAAM,MAAU,IAAA,IAAA,CAAK,QAAS,CAAA,KAAA,CAAM,MAAqB,CAAA;AAAA,GACvE;AACF;AAUa,MAAA,YAAA,GAA8B,CACzC,KACA,EAAA,kBAAA,EACA,aACA,OAAU,GAAA,MAAM,MAChB,EAAA,UAAA,GAAa,SACV,KAAA;AAEH,EAAA,MAAM,aAAaA,2BAAc,EAAA;AAEjC,EAAM,MAAA,eAAA,GAAkBC,iCAAiB,CAAA,CAAC,KAAsB,KAAA;AA/BlE,IAAA,IAAA,EAAA;AAiCI,IAAA,IAAI,MAAM,gBAAkB,EAAA;AAC1B,MAAA;AAAA;AAIF,IAAI,IAAA,CAAC,WAAW,OAAS,EAAA;AACvB,MAAA;AAAA;AAGF,IAAA,OAAA,CAAQ,KAAK,CAAA;AAEb,IAAA,IAAI,CAAC,KAAO,EAAA;AACV,MAAA;AAAA;AAGF,IAAA,MAAM,aAAgB,GAAA,OAAO,KAAU,KAAA,UAAA,GAAa,OAAU,GAAA,KAAA;AAC9D,IAAM,MAAA,sBAAA,GAAyB,oBAAqB,CAAA,aAAA,EAAe,KAAK,CAAA;AAExE,IAAA,MAAM,oBAAoB,aAAc,CAAA,IAAA;AAAA,MAAK,CAAC,IAAA;AAAA;AAAA,QAE5C,IAAA,GAAO,KAAK,aAAgB,GAAA;AAAA;AAAA,KAC9B;AACA,IAAM,MAAA,GAAA,GAAM,uBAAsB,iBAAmB,IAAA,IAAA,GAAA,MAAA,GAAA,iBAAA,CAAA,aAAA,CAAA;AAErD,IAAA,IAAA,CAAA,CACE,SAAI,eAAJ,KAAA,IAAA,GAAA,MAAA,GAAA,EAAA,CAAqB,SAAS,KAAM,CAAA,MAAA,CAAA,KACpC,CAAC,sBACD,EAAA;AACA,MAAA,WAAA,CAAY,KAAK,CAAA;AAAA;AACnB,GACD,CAAA;AAED,EAAAC,eAAA,CAAU,MAAM;AAjElB,IAAA,IAAA,EAAA;AAkEI,IAAA,IAAI,kBAAoB,EAAA;AACtB,MAAmB,kBAAA,CAAA,gBAAA;AAAA,QACjB,UAAA;AAAA,QACA;AAAA,OACF;AACA,MAAmB,CAAA,EAAA,GAAA,kBAAA,CAAA,WAAA,KAAnB,IAAgC,GAAA,MAAA,GAAA,EAAA,CAAA,gBAAA,CAAiB,MAAQ,EAAA,WAAA,CAAA;AAAA;AAE3D,IAAA,OAAO,MAAM;AAzEjB,MAAAC,IAAAA,GAAAA;AA0EM,MAAA,IAAI,kBAAoB,EAAA;AACtB,QAAmB,kBAAA,CAAA,mBAAA;AAAA,UACjB,UAAA;AAAA,UACA;AAAA,SACF;AACA,QAAA,CAAAA,GAAA,GAAA,kBAAA,CAAmB,WAAnB,KAAA,IAAA,GAAA,MAAA,GAAAA,GAAgC,CAAA,mBAAA;AAAA,UAC9B,MAAA;AAAA,UACA;AAAA,SAAA;AAAA;AAEJ,KACF;AAAA,KACC,CAAC,eAAA,EAAiB,UAAY,EAAA,kBAAA,EAAoB,WAAW,CAAC,CAAA;AACnE;;;;"}

package/dist-cjs/cascading-menu/internal/useMenuTriggerHandlers.js

@@ -0,0 +1,90 @@
+'use strict';
+
+var react = require('react');
+var useEventCallback = require('../../utils/useEventCallback.js');
+require('@salt-ds/core');
+var stateChangeTypes = require('../stateChangeTypes.js');
+var CascadingMenuAction = require('./CascadingMenuAction.js');
+
+function useMenuTriggerHandlers({
+  dispatch,
+  children,
+  setIsNavigatingWithKeyboard,
+  openCloseMenu,
+  rootMenuState,
+  rootMenuId,
+  menusDataById = {}
+}) {
+  const handleOnClick = useEventCallback.useEventCallback((event) => {
+    var _a;
+    const { type } = event;
+    setIsNavigatingWithKeyboard(false);
+    if (type === "click") {
+      if (react.isValidElement(children)) {
+        const childrenProps = children.props;
+        (_a = childrenProps.onClick) == null ? void 0 : _a.call(childrenProps, event);
+      }
+      openCloseMenu(!rootMenuState);
+    }
+  });
+  const handleOnKeydown = useEventCallback.useEventCallback(
+    (event) => {
+      var _a;
+      const { key } = event;
+      switch (key) {
+        case "Spacebar":
+        case " ":
+        case "Enter":
+          event.stopPropagation();
+          event.preventDefault();
+          setIsNavigatingWithKeyboard(true);
+          dispatch({
+            type: rootMenuState ? CascadingMenuAction.CascadingMenuAction.CLOSE_MENU : CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+            cause: stateChangeTypes.stateChangeTypes.KEYBOARD_TOGGLE,
+            targetId: rootMenuId
+          });
+          break;
+        case "ArrowDown":
+          event.stopPropagation();
+          event.preventDefault();
+          setIsNavigatingWithKeyboard(true);
+          if (rootMenuState) {
+            break;
+          }
+          dispatch({
+            type: CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+            cause: stateChangeTypes.stateChangeTypes.KEYBOARD_TOGGLE,
+            targetId: rootMenuId
+          });
+          break;
+        case "ArrowUp":
+          event.stopPropagation();
+          event.preventDefault();
+          setIsNavigatingWithKeyboard(true);
+          if (rootMenuState || !rootMenuId) {
+            break;
+          }
+          dispatch({
+            type: CascadingMenuAction.CascadingMenuAction.OPEN_MENU,
+            cause: stateChangeTypes.stateChangeTypes.KEYBOARD_TOGGLE,
+            targetId: rootMenuId
+          });
+          dispatch({
+            type: CascadingMenuAction.CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,
+            cause: stateChangeTypes.stateChangeTypes.ITEM_KEYDOWN_ARROW_UP,
+            targetId: rootMenuId,
+            highlightedItemIndex: menusDataById[rootMenuId].menuItems.length - 1
+          });
+          break;
+      }
+      if (react.isValidElement(children)) {
+        const childrenProps = children.props;
+        (_a = childrenProps.onKeyDown) == null ? void 0 : _a.call(childrenProps, event);
+      }
+    }
+  );
+  return [handleOnClick, handleOnKeydown];
+}
+
+exports.useMenuTriggerHandlers = useMenuTriggerHandlers;
+//# sourceMappingURL=useMenuTriggerHandlers.js.map

package/dist-cjs/cascading-menu/internal/useMenuTriggerHandlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuTriggerHandlers.js","sources":["../src/cascading-menu/internal/useMenuTriggerHandlers.ts"],"sourcesContent":["import {\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type MouseEvent,\n  isValidElement,\n} from \"react\";\nimport { useEventCallback } from \"../../utils\";\nimport type { CascadingMenuProps } from \"../CascadingMenuProps\";\nimport { stateChangeTypes } from \"../stateChangeTypes\";\nimport { CascadingMenuAction } from \"./CascadingMenuAction\";\nimport type { menuState } from \"./stateUtils\";\nimport type { stateItem } from \"./useStateReducer\";\n\ninterface useMenuTriggerHandlersProps {\n  dispatch: (action: any) => void;\n  children: CascadingMenuProps[\"children\"];\n  setIsNavigatingWithKeyboard: (value: boolean) => void;\n  openCloseMenu: (open: boolean) => void;\n  rootMenuState: stateItem;\n  rootMenuId: string | undefined;\n  menusDataById: Record<string, menuState>;\n}\n\nexport function useMenuTriggerHandlers({\n  dispatch,\n  children,\n  setIsNavigatingWithKeyboard,\n  openCloseMenu,\n  rootMenuState,\n  rootMenuId,\n  menusDataById = {},\n}: useMenuTriggerHandlersProps) {\n  const handleOnClick = useEventCallback((event: MouseEvent<HTMLElement>) => {\n    const { type } = event;\n\n    setIsNavigatingWithKeyboard(false);\n    if (type === \"click\") {\n      if (isValidElement(children)) {\n        const childrenProps = children.props as HTMLAttributes<HTMLElement>;\n        childrenProps.onClick?.(event);\n      }\n      openCloseMenu(!rootMenuState);\n    }\n  });\n\n  const handleOnKeydown = useEventCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      const { key } = event;\n\n      switch (key) {\n        case \"Spacebar\":\n        case \" \":\n        case \"Enter\":\n          event.stopPropagation();\n          event.preventDefault();\n          setIsNavigatingWithKeyboard(true);\n          dispatch({\n            type: rootMenuState\n              ? CascadingMenuAction.CLOSE_MENU\n              : CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.KEYBOARD_TOGGLE,\n            targetId: rootMenuId,\n          });\n          break;\n        case \"ArrowDown\":\n          event.stopPropagation();\n          event.preventDefault();\n          setIsNavigatingWithKeyboard(true);\n          if (rootMenuState) {\n            break;\n          }\n          dispatch({\n            type: CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.KEYBOARD_TOGGLE,\n            targetId: rootMenuId,\n          });\n          break;\n        case \"ArrowUp\":\n          event.stopPropagation();\n          event.preventDefault();\n          setIsNavigatingWithKeyboard(true);\n          if (rootMenuState || !rootMenuId) {\n            break;\n          }\n          dispatch({\n            type: CascadingMenuAction.OPEN_MENU,\n            cause: stateChangeTypes.KEYBOARD_TOGGLE,\n            targetId: rootMenuId,\n          });\n          dispatch({\n            type: CascadingMenuAction.SET_CURRENT_INTERACTED_ITEM,\n            cause: stateChangeTypes.ITEM_KEYDOWN_ARROW_UP,\n            targetId: rootMenuId,\n            highlightedItemIndex:\n              menusDataById[rootMenuId].menuItems.length - 1,\n          });\n          break;\n        default:\n          break;\n      }\n\n      if (isValidElement(children)) {\n        const childrenProps = children.props as HTMLAttributes<HTMLElement>;\n        childrenProps.onKeyDown?.(event);\n      }\n    },\n  );\n\n  return [handleOnClick, handleOnKeydown] as const;\n}\n"],"names":["useEventCallback","isValidElement","CascadingMenuAction","stateChangeTypes"],"mappings":"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"}

package/dist-cjs/cascading-menu/internal/useMountedRef.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var react = require('react');
+
+function useMountedRef() {
+  const mountedRef = react.useRef(false);
+  react.useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  return mountedRef;
+}
+
+exports.useMountedRef = useMountedRef;
+//# sourceMappingURL=useMountedRef.js.map

package/dist-cjs/cascading-menu/internal/useMountedRef.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMountedRef.js","sources":["../src/cascading-menu/internal/useMountedRef.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n/**\n * Used to know if the component is mounted or not\n */\nexport function useMountedRef() {\n  const mountedRef = useRef(false);\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  return mountedRef;\n}\n"],"names":["useRef","useEffect"],"mappings":";;;;AAIO,SAAS,aAAgB,GAAA;AAC9B,EAAM,MAAA,UAAA,GAAaA,aAAO,KAAK,CAAA;AAC/B,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAU,GAAA,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAU,GAAA,KAAA;AAAA,KACvB;AAAA,GACF,EAAG,EAAE,CAAA;AAEL,EAAO,OAAA,UAAA;AACT;;;;"}