@elliemae/ds-mini-toolbar 3.4.3-rc.0 → 3.4.4-next.0

package/dist/cjs/Components/MiniToolbar.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var MiniToolbar_exports = {};
 __export(MiniToolbar_exports, {
@@ -26,14 +29,15 @@ __export(MiniToolbar_exports, {
 });
 module.exports = __toCommonJS(MiniToolbar_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_dropdownmenu = require("@elliemae/ds-dropdownmenu");
 var import_ds_icons = require("@elliemae/ds-icons");
 var import_styles = require("../styles");
 var import_propTypes = require("../propTypes");
 var import_useGenerateItems = require("../hooks/useGenerateItems");
-const Elipsis = /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, {
+const Elipsis = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MoreOptionsVert, {
   color: ["brand-primary", "600"],
   size: "m"
 });
@@ -48,26 +52,30 @@ const MiniToolbar = ({ items, overflowButtonProps }) => {
     }
   }, []);
   const { ariaLabel, style, buttonType = "secondary" } = overflowButtonProps || {};
-  return /* @__PURE__ */ import_react.default.createElement(import_styles.Container, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.Container, {
     role: "toolbar",
-    "data-testid": "ds-mini-toolbar"
-  }, shortcutItems, /* @__PURE__ */ import_react.default.createElement(import_ds_dropdownmenu.DSDropdownMenu, {
-    "data-testid": "ds-mini-toolbar__dropdown-menu",
-    isOpen: isDropdownMenuOpen,
-    onSelectMenuItem: closeDropdownMenu,
-    onClickOutsideMenu: closeDropdownMenu,
-    options: dropdownMenuItems,
-    triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_styles.StyledButton, {
-      "aria-label": ariaLabel,
-      "data-testid": "ds-mini-toolbar__elipsis",
-      size: "m",
-      style,
-      buttonType,
-      onClick: openDropdownMenu,
-      onKeyPress: openDropdownMenuKeyPress,
-      leftIcon: Elipsis
-    })
-  }));
+    "data-testid": "ds-mini-toolbar",
+    children: [
+      shortcutItems,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_dropdownmenu.DSDropdownMenu, {
+        "data-testid": "ds-mini-toolbar__dropdown-menu",
+        isOpen: isDropdownMenuOpen,
+        onSelectMenuItem: closeDropdownMenu,
+        onClickOutsideMenu: closeDropdownMenu,
+        options: dropdownMenuItems,
+        triggerComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledButton, {
+          "aria-label": ariaLabel,
+          "data-testid": "ds-mini-toolbar__elipsis",
+          size: "m",
+          style,
+          buttonType,
+          onClick: openDropdownMenu,
+          onKeyPress: openDropdownMenuKeyPress,
+          leftIcon: Elipsis
+        })
+      })
+    ]
+  });
 };
 MiniToolbar.propTypes = import_propTypes.miniToolbarProps;
 MiniToolbar.displayName = "MiniToolbar";

package/dist/cjs/Components/MiniToolbar.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/Components/MiniToolbar.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { StyledButton, Container } from '../styles';\nimport { miniToolbarProps } from '../propTypes';\nimport { useGenerateItems } from '../hooks/useGenerateItems';\nimport { MiniToolbarPropsT } from '../index.d';\n\nconst Elipsis = <MoreOptionsVert color={['brand-primary', '600']} size=\"m\" />;\n\nconst MiniToolbar = ({ items, overflowButtonProps }: MiniToolbarPropsT): React.ReactElement => {\n  const [shortcutItems, dropdownMenuItems] = useGenerateItems(items);\n  const [isDropdownMenuOpen, setIsDropdownMenuOpen] = useState<boolean>(false);\n\n  const closeDropdownMenu = useCallback(() => setIsDropdownMenuOpen(false), []);\n  const openDropdownMenu = useCallback(() => setIsDropdownMenuOpen(true), []);\n  const openDropdownMenuKeyPress = useCallback((e) => {\n    if (e.key === ' ') {\n      setIsDropdownMenuOpen(true);\n    }\n  }, []);\n\n  const { ariaLabel, style, buttonType = 'secondary' } = overflowButtonProps || {};\n\n  return (\n    <Container role=\"toolbar\" data-testid=\"ds-mini-toolbar\">\n      {shortcutItems}\n      <DSDropdownMenu\n        data-testid=\"ds-mini-toolbar__dropdown-menu\"\n        isOpen={isDropdownMenuOpen}\n        onSelectMenuItem={closeDropdownMenu}\n        onClickOutsideMenu={closeDropdownMenu}\n        options={dropdownMenuItems}\n        triggerComponent={\n          <StyledButton\n            aria-label={ariaLabel}\n            data-testid=\"ds-mini-toolbar__elipsis\"\n            size=\"m\"\n            style={style}\n            buttonType={buttonType}\n            onClick={openDropdownMenu}\n            onKeyPress={openDropdownMenuKeyPress}\n            leftIcon={Elipsis}\n          />\n        }\n      />\n    </Container>\n  );\n};\n\nMiniToolbar.propTypes = miniToolbarProps;\nMiniToolbar.displayName = 'MiniToolbar';\nconst MiniToolbarWithSchema = describe(MiniToolbar);\nMiniToolbarWithSchema.propTypes = miniToolbarProps;\n\nexport { MiniToolbar, MiniToolbarWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,0BAAyB;AACzB,6BAA+B;AAC/B,sBAAgC;AAChC,oBAAwC;AACxC,uBAAiC;AACjC,8BAAiC;AAGjC,MAAM,UAAU,mDAAC;AAAA,EAAgB,OAAO,CAAC,iBAAiB,KAAK;AAAA,EAAG,MAAK;AAAA,CAAI;AAE3E,MAAM,cAAc,CAAC,EAAE,OAAO,0BAAiE;AAC7F,QAAM,CAAC,eAAe,qBAAqB,8CAAiB,KAAK;AACjE,QAAM,CAAC,oBAAoB,yBAAyB,2BAAkB,KAAK;AAE3E,QAAM,oBAAoB,8BAAY,MAAM,sBAAsB,KAAK,GAAG,CAAC,CAAC;AAC5E,QAAM,mBAAmB,8BAAY,MAAM,sBAAsB,IAAI,GAAG,CAAC,CAAC;AAC1E,QAAM,2BAA2B,8BAAY,CAAC,MAAM;AAClD,QAAI,EAAE,QAAQ,KAAK;AACjB,4BAAsB,IAAI;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,EAAE,WAAW,OAAO,aAAa,gBAAgB,uBAAuB,CAAC;AAE/E,SACE,mDAAC;AAAA,IAAU,MAAK;AAAA,IAAU,eAAY;AAAA,KACnC,eACD,mDAAC;AAAA,IACC,eAAY;AAAA,IACZ,QAAQ;AAAA,IACR,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,SAAS;AAAA,IACT,kBACE,mDAAC;AAAA,MACC,cAAY;AAAA,MACZ,eAAY;AAAA,MACZ,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,KACZ;AAAA,GAEJ,CACF;AAEJ;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,wBAAwB,kCAAS,WAAW;AAClD,sBAAsB,YAAY;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA6C;AAC7C,0BAAyB;AACzB,6BAA+B;AAC/B,sBAAgC;AAChC,oBAAwC;AACxC,uBAAiC;AACjC,8BAAiC;AAGjC,MAAM,UAAU,4CAAC;AAAA,EAAgB,OAAO,CAAC,iBAAiB,KAAK;AAAA,EAAG,MAAK;AAAA,CAAI;AAE3E,MAAM,cAAc,CAAC,EAAE,OAAO,oBAAoB,MAA6C;AAC7F,QAAM,CAAC,eAAe,iBAAiB,QAAI,0CAAiB,KAAK;AACjE,QAAM,CAAC,oBAAoB,qBAAqB,QAAI,uBAAkB,KAAK;AAE3E,QAAM,wBAAoB,0BAAY,MAAM,sBAAsB,KAAK,GAAG,CAAC,CAAC;AAC5E,QAAM,uBAAmB,0BAAY,MAAM,sBAAsB,IAAI,GAAG,CAAC,CAAC;AAC1E,QAAM,+BAA2B,0BAAY,CAAC,MAAM;AAClD,QAAI,EAAE,QAAQ,KAAK;AACjB,4BAAsB,IAAI;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,EAAE,WAAW,OAAO,aAAa,YAAY,IAAI,uBAAuB,CAAC;AAE/E,SACE,6CAAC;AAAA,IAAU,MAAK;AAAA,IAAU,eAAY;AAAA,IACnC;AAAA;AAAA,MACD,4CAAC;AAAA,QACC,eAAY;AAAA,QACZ,QAAQ;AAAA,QACR,kBAAkB;AAAA,QAClB,oBAAoB;AAAA,QACpB,SAAS;AAAA,QACT,kBACE,4CAAC;AAAA,UACC,cAAY;AAAA,UACZ,eAAY;AAAA,UACZ,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,UAAU;AAAA,SACZ;AAAA,OAEJ;AAAA;AAAA,GACF;AAEJ;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,4BAAwB,8BAAS,WAAW;AAClD,sBAAsB,YAAY;",
   "names": []
 }

package/dist/cjs/Components/ToolbarShortcut.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var ToolbarShortcut_exports = {};
 __export(ToolbarShortcut_exports, {
@@ -25,7 +28,8 @@ __export(ToolbarShortcut_exports, {
 });
 module.exports = __toCommonJS(ToolbarShortcut_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_styles = require("../styles");
 const ToolbarShortcut = (props) => {
   const { Component, shortcutProps, sharedProps, ContextualRegion, contextualRegionProps } = props;
@@ -51,16 +55,27 @@ const ToolbarShortcut = (props) => {
       clearTimeout(timerRight.current);
     };
   }, [isOpen, leftRef, rightRef]);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, isOpen && position === "left" && /* @__PURE__ */ import_react.default.createElement(import_styles.Item, null, /* @__PURE__ */ import_react.default.createElement(ContextualRegion, {
-    innerRef: leftRef,
-    ...contextualRegionProps
-  })), Component && /* @__PURE__ */ import_react.default.createElement(import_styles.Item, {
-    style
-  }, /* @__PURE__ */ import_react.default.createElement(Component, {
-    ...mergedProps
-  })), isOpen && position === "right" && /* @__PURE__ */ import_react.default.createElement(import_styles.Item, null, /* @__PURE__ */ import_react.default.createElement(ContextualRegion, {
-    innerRef: rightRef,
-    ...contextualRegionProps
-  })));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+    children: [
+      isOpen && position === "left" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Item, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ContextualRegion, {
+          innerRef: leftRef,
+          ...contextualRegionProps
+        })
+      }),
+      Component && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Item, {
+        style,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {
+          ...mergedProps
+        })
+      }),
+      isOpen && position === "right" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Item, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ContextualRegion, {
+          innerRef: rightRef,
+          ...contextualRegionProps
+        })
+      })
+    ]
+  });
 };
 //# sourceMappingURL=ToolbarShortcut.js.map

package/dist/cjs/Components/ToolbarShortcut.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/Components/ToolbarShortcut.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useRef, useEffect } from 'react';\nimport { Item } from '../styles';\nimport { ToolbarShortcutPropsT } from '../index.d';\n\nconst ToolbarShortcut = (props: ToolbarShortcutPropsT): React.ReactElement => {\n  const { Component, shortcutProps, sharedProps, ContextualRegion, contextualRegionProps } = props;\n  const leftRef = useRef<HTMLElement | null>(null);\n  const rightRef = useRef<HTMLElement | null>(null);\n  const timerLeft = useRef<ReturnType<typeof setInterval> | null>(null);\n  const timerRight = useRef<ReturnType<typeof setInterval> | null>(null);\n\n  const { position = 'left', isOpen = false } = contextualRegionProps || {};\n  const { style } = shortcutProps || {};\n\n  const mergedProps = {\n    ...sharedProps,\n    ...shortcutProps,\n  };\n\n  useEffect(() => {\n    if (isOpen && leftRef.current) {\n      timerLeft.current = setTimeout(() => leftRef.current.focus(), 200);\n    }\n    if (isOpen && rightRef.current) {\n      timerRight.current = setTimeout(() => rightRef.current.focus(), 200);\n    }\n\n    return () => {\n      clearTimeout(timerLeft.current);\n      clearTimeout(timerRight.current);\n    };\n  }, [isOpen, leftRef, rightRef]);\n\n  return (\n    <>\n      {isOpen && position === 'left' && (\n        <Item>\n          <ContextualRegion innerRef={leftRef} {...contextualRegionProps} />\n        </Item>\n      )}\n      {Component && (\n        <Item style={style}>\n          <Component {...mergedProps} />\n        </Item>\n      )}\n      {isOpen && position === 'right' && (\n        <Item>\n          <ContextualRegion innerRef={rightRef} {...contextualRegionProps} />\n        </Item>\n      )}\n    </>\n  );\n};\n\nexport { ToolbarShortcut };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,oBAAqB;AAGrB,MAAM,kBAAkB,CAAC,UAAqD;AAC5E,QAAM,EAAE,WAAW,eAAe,aAAa,kBAAkB,0BAA0B;AAC3F,QAAM,UAAU,yBAA2B,IAAI;AAC/C,QAAM,WAAW,yBAA2B,IAAI;AAChD,QAAM,YAAY,yBAA8C,IAAI;AACpE,QAAM,aAAa,yBAA8C,IAAI;AAErE,QAAM,EAAE,WAAW,QAAQ,SAAS,UAAU,yBAAyB,CAAC;AACxE,QAAM,EAAE,UAAU,iBAAiB,CAAC;AAEpC,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,8BAAU,MAAM;AACd,QAAI,UAAU,QAAQ,SAAS;AAC7B,gBAAU,UAAU,WAAW,MAAM,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAAA,IACnE;AACA,QAAI,UAAU,SAAS,SAAS;AAC9B,iBAAW,UAAU,WAAW,MAAM,SAAS,QAAQ,MAAM,GAAG,GAAG;AAAA,IACrE;AAEA,WAAO,MAAM;AACX,mBAAa,UAAU,OAAO;AAC9B,mBAAa,WAAW,OAAO;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,QAAQ,SAAS,QAAQ,CAAC;AAE9B,SACE,wFACG,UAAU,aAAa,UACtB,mDAAC,0BACC,mDAAC;AAAA,IAAiB,UAAU;AAAA,IAAU,GAAG;AAAA,GAAuB,CAClE,GAED,aACC,mDAAC;AAAA,IAAK;AAAA,KACJ,mDAAC;AAAA,IAAW,GAAG;AAAA,GAAa,CAC9B,GAED,UAAU,aAAa,WACtB,mDAAC,0BACC,mDAAC;AAAA,IAAiB,UAAU;AAAA,IAAW,GAAG;AAAA,GAAuB,CACnE,CAEJ;AAEJ;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAyC;AACzC,oBAAqB;AAGrB,MAAM,kBAAkB,CAAC,UAAqD;AAC5E,QAAM,EAAE,WAAW,eAAe,aAAa,kBAAkB,sBAAsB,IAAI;AAC3F,QAAM,cAAU,qBAA2B,IAAI;AAC/C,QAAM,eAAW,qBAA2B,IAAI;AAChD,QAAM,gBAAY,qBAA8C,IAAI;AACpE,QAAM,iBAAa,qBAA8C,IAAI;AAErE,QAAM,EAAE,WAAW,QAAQ,SAAS,MAAM,IAAI,yBAAyB,CAAC;AACxE,QAAM,EAAE,MAAM,IAAI,iBAAiB,CAAC;AAEpC,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,8BAAU,MAAM;AACd,QAAI,UAAU,QAAQ,SAAS;AAC7B,gBAAU,UAAU,WAAW,MAAM,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAAA,IACnE;AACA,QAAI,UAAU,SAAS,SAAS;AAC9B,iBAAW,UAAU,WAAW,MAAM,SAAS,QAAQ,MAAM,GAAG,GAAG;AAAA,IACrE;AAEA,WAAO,MAAM;AACX,mBAAa,UAAU,OAAO;AAC9B,mBAAa,WAAW,OAAO;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,QAAQ,SAAS,QAAQ,CAAC;AAE9B,SACE;AAAA,IACG;AAAA,gBAAU,aAAa,UACtB,4CAAC;AAAA,QACC,sDAAC;AAAA,UAAiB,UAAU;AAAA,UAAU,GAAG;AAAA,SAAuB;AAAA,OAClE;AAAA,MAED,aACC,4CAAC;AAAA,QAAK;AAAA,QACJ,sDAAC;AAAA,UAAW,GAAG;AAAA,SAAa;AAAA,OAC9B;AAAA,MAED,UAAU,aAAa,WACtB,4CAAC;AAAA,QACC,sDAAC;AAAA,UAAiB,UAAU;AAAA,UAAW,GAAG;AAAA,SAAuB;AAAA,OACnE;AAAA;AAAA,GAEJ;AAEJ;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/Button.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Button_exports = {};
 __export(Button_exports, {
@@ -25,9 +28,9 @@ __export(Button_exports, {
 });
 module.exports = __toCommonJS(Button_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_button = require("@elliemae/ds-button");
-const MiniToolbarButton = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+const MiniToolbarButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButton, {
   ...props,
   "aria-label": props.ariaLabel,
   "data-testid": "ds-mini-toolbar__shortcut"

package/dist/cjs/Components/outOfTheBox/Button.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/Button.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\n\nconst MiniToolbarButton = (props: Record<string, unknown>): React.ReactElement => (\n  <DSButton {...props} aria-label={props.ariaLabel} data-testid=\"ds-mini-toolbar__shortcut\" />\n);\n\nexport { MiniToolbarButton };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,uBAAyB;AAEzB,MAAM,oBAAoB,CAAC,UACzB,mDAAC;AAAA,EAAU,GAAG;AAAA,EAAO,cAAY,MAAM;AAAA,EAAW,eAAY;AAAA,CAA4B;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,uBAAyB;AAEzB,MAAM,oBAAoB,CAAC,UACzB,4CAAC;AAAA,EAAU,GAAG;AAAA,EAAO,cAAY,MAAM;AAAA,EAAW,eAAY;AAAA,CAA4B;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/ComboBox.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var ComboBox_exports = {};
 __export(ComboBox_exports, {
@@ -25,9 +28,9 @@ __export(ComboBox_exports, {
 });
 module.exports = __toCommonJS(ComboBox_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_form = require("@elliemae/ds-form");
-const MiniToolbarComboBox = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSComboBox2, {
+const MiniToolbarComboBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSComboBox2, {
   ...props
 });
 //# sourceMappingURL=ComboBox.js.map

package/dist/cjs/Components/outOfTheBox/ComboBox.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/ComboBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { DSComboBox2 } from '@elliemae/ds-form';\n\nconst MiniToolbarComboBox = (props: Record<string, unknown>): React.ReactElement => <DSComboBox2 {...props} />;\n\nexport { MiniToolbarComboBox };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,qBAA4B;AAE5B,MAAM,sBAAsB,CAAC,UAAuD,mDAAC;AAAA,EAAa,GAAG;AAAA,CAAO;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,qBAA4B;AAE5B,MAAM,sBAAsB,CAAC,UAAuD,4CAAC;AAAA,EAAa,GAAG;AAAA,CAAO;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/IconItem.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var IconItem_exports = {};
 __export(IconItem_exports, {
@@ -25,16 +28,16 @@ __export(IconItem_exports, {
 });
 module.exports = __toCommonJS(IconItem_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_styles = require("../../styles");
 const MiniToolbarIcon = (props) => {
   const { Icon, size, color, onClick, ariaLabel, style, buttonType = "secondary" } = props;
-  return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledButton, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledButton, {
     "aria-label": ariaLabel,
     buttonType,
     onClick,
     style,
-    leftIcon: /* @__PURE__ */ import_react.default.createElement(Icon, {
+    leftIcon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {
       size,
       color
     }),

package/dist/cjs/Components/outOfTheBox/IconItem.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/IconItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarIcon = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n  const { Icon, size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n  return (\n    <StyledButton\n      aria-label={ariaLabel}\n      buttonType={buttonType}\n      onClick={onClick}\n      style={style}\n      leftIcon={<Icon size={size} color={color} />}\n      data-testid=\"ds-mini-toolbar__shortcut\"\n    />\n  );\n};\n\nexport { MiniToolbarIcon };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,oBAA6B;AAG7B,MAAM,kBAAkB,CAAC,UAAyD;AAChF,QAAM,EAAE,MAAM,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,gBAAgB;AAEnF,SACE,mDAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,mDAAC;AAAA,MAAK;AAAA,MAAY;AAAA,KAAc;AAAA,IAC1C,eAAY;AAAA,GACd;AAEJ;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,oBAA6B;AAG7B,MAAM,kBAAkB,CAAC,UAAyD;AAChF,QAAM,EAAE,MAAM,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAEnF,SACE,4CAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,4CAAC;AAAA,MAAK;AAAA,MAAY;AAAA,KAAc;AAAA,IAC1C,eAAY;AAAA,GACd;AAEJ;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/SearchBox.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var SearchBox_exports = {};
 __export(SearchBox_exports, {
@@ -26,25 +29,25 @@ __export(SearchBox_exports, {
 });
 module.exports = __toCommonJS(SearchBox_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_icons = require("@elliemae/ds-icons");
 var import_ds_form = require("@elliemae/ds-form");
 var import_styles = require("../../styles");
 const MiniToolbarSearchButton = (props) => {
   const { size, color, onClick, ariaLabel, style, buttonType = "secondary" } = props;
-  return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledButton, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledButton, {
     "aria-label": ariaLabel,
     buttonType,
     onClick,
     style,
-    leftIcon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Search, {
+    leftIcon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.Search, {
       size,
       color
     }),
     "data-testid": "ds-mini-toolbar__shortcut"
   });
 };
-const MiniToolbarSearchBox = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSSearchBox, {
+const MiniToolbarSearchBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSSearchBox, {
   clearable: true,
   showIcon: false,
   ...props

package/dist/cjs/Components/outOfTheBox/SearchBox.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/SearchBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { DSSearchBox } from '@elliemae/ds-form';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarSearchButton = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n  const { size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n  return (\n    <StyledButton\n      aria-label={ariaLabel}\n      buttonType={buttonType}\n      onClick={onClick}\n      style={style}\n      leftIcon={<Search size={size} color={color} />}\n      data-testid=\"ds-mini-toolbar__shortcut\"\n    />\n  );\n};\n\nconst MiniToolbarSearchBox = (props: Record<string, unknown>): JSX.Element => (\n  <DSSearchBox clearable showIcon={false} {...props} />\n);\n\nexport { MiniToolbarSearchButton, MiniToolbarSearchBox };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,sBAAuB;AACvB,qBAA4B;AAC5B,oBAA6B;AAG7B,MAAM,0BAA0B,CAAC,UAAyD;AACxF,QAAM,EAAE,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,gBAAgB;AAE7E,SACE,mDAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,mDAAC;AAAA,MAAO;AAAA,MAAY;AAAA,KAAc;AAAA,IAC5C,eAAY;AAAA,GACd;AAEJ;AAEA,MAAM,uBAAuB,CAAC,UAC5B,mDAAC;AAAA,EAAY,WAAS;AAAA,EAAC,UAAU;AAAA,EAAQ,GAAG;AAAA,CAAO;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,sBAAuB;AACvB,qBAA4B;AAC5B,oBAA6B;AAG7B,MAAM,0BAA0B,CAAC,UAAyD;AACxF,QAAM,EAAE,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAE7E,SACE,4CAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,4CAAC;AAAA,MAAO;AAAA,MAAY;AAAA,KAAc;AAAA,IAC5C,eAAY;AAAA,GACd;AAEJ;AAEA,MAAM,uBAAuB,CAAC,UAC5B,4CAAC;AAAA,EAAY,WAAS;AAAA,EAAC,UAAU;AAAA,EAAQ,GAAG;AAAA,CAAO;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/Separator.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Separator_exports = {};
 __export(Separator_exports, {
@@ -25,9 +28,9 @@ __export(Separator_exports, {
 });
 module.exports = __toCommonJS(Separator_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_styles = require("../../styles");
-const MiniToolbarSeparator = () => /* @__PURE__ */ import_react.default.createElement(import_styles.Separator, {
+const MiniToolbarSeparator = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Separator, {
   "data-testid": "ds-mini-toolbar__separator"
 });
 //# sourceMappingURL=Separator.js.map

package/dist/cjs/Components/outOfTheBox/Separator.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/Separator.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { Separator } from '../../styles';\n\nconst MiniToolbarSeparator = (): React.ReactElement => (\n  <Separator data-testid=\"ds-mini-toolbar__separator\" />\n);\n\nexport { MiniToolbarSeparator };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,oBAA0B;AAE1B,MAAM,uBAAuB,MAC3B,mDAAC;AAAA,EAAU,eAAY;AAAA,CAA6B;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,oBAA0B;AAE1B,MAAM,uBAAuB,MAC3B,4CAAC;AAAA,EAAU,eAAY;AAAA,CAA6B;",
   "names": []
 }

package/dist/cjs/Components/outOfTheBox/index.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var outOfTheBox_exports = {};
 __export(outOfTheBox_exports, {

package/dist/cjs/Components/outOfTheBox/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/Components/outOfTheBox/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["export { MiniToolbarButton } from './Button';\nexport { MiniToolbarIcon } from './IconItem';\nexport { MiniToolbarSearchBox } from './SearchBox';\nexport { MiniToolbarSeparator } from './Separator';\nexport { MiniToolbarComboBox } from './ComboBox';\n\nexport const ICON_ITEM = 'ds-icon-item';\nexport const SEPARATOR = 'ds-separator';\nexport const BUTTON = 'ds-button';\nexport const SEARCH_BOX = 'ds-search-box';\nexport const COMBO_BOX = 'ds-combo-box';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAkC;AAClC,sBAAgC;AAChC,uBAAqC;AACrC,uBAAqC;AACrC,sBAAoC;AAE7B,MAAM,YAAY;AAClB,MAAM,YAAY;AAClB,MAAM,SAAS;AACf,MAAM,aAAa;AACnB,MAAM,YAAY;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAkC;AAClC,sBAAgC;AAChC,uBAAqC;AACrC,uBAAqC;AACrC,sBAAoC;AAE7B,MAAM,YAAY;AAClB,MAAM,YAAY;AAClB,MAAM,SAAS;AACf,MAAM,aAAa;AACnB,MAAM,YAAY;",
   "names": []
 }

package/dist/cjs/hooks/useGenerateItems.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var useGenerateItems_exports = {};
 __export(useGenerateItems_exports, {
@@ -25,7 +28,8 @@ __export(useGenerateItems_exports, {
 });
 module.exports = __toCommonJS(useGenerateItems_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_uid = require("uid");
 var import_ds_icons = require("@elliemae/ds-icons");
 var import_outOfTheBox = require("../Components/outOfTheBox");
@@ -33,82 +37,87 @@ var import_ToolbarShortcut = require("../Components/ToolbarShortcut");
 var import_SearchBox = require("../Components/outOfTheBox/SearchBox");
 const useGenerateItems = (items) => {
   const instanceUID = (0, import_react.useMemo)(() => (0, import_uid.uid)(6), []);
-  const shortcutItems = (0, import_react.useMemo)(() => items.filter((item) => item.hasShortcut || item.component === import_outOfTheBox.SEARCH_BOX || item.contextualRegion).map((item, index) => {
-    const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } = item;
-    let Component;
-    let ContextualRegion;
-    if (component === import_outOfTheBox.SEPARATOR)
-      return /* @__PURE__ */ import_react.default.createElement(import_outOfTheBox.MiniToolbarSeparator, null);
-    if (component === import_outOfTheBox.BUTTON)
-      Component = import_outOfTheBox.MiniToolbarButton;
-    else if (component === import_outOfTheBox.ICON_ITEM)
-      Component = import_outOfTheBox.MiniToolbarIcon;
-    else if (component === import_outOfTheBox.COMBO_BOX)
-      Component = import_outOfTheBox.MiniToolbarComboBox;
-    else if (component === import_outOfTheBox.SEARCH_BOX) {
-      if (item.hasShortcut) {
-        Component = import_SearchBox.MiniToolbarSearchButton;
-      }
-      ContextualRegion = import_outOfTheBox.MiniToolbarSearchBox;
-    }
-    if (!ContextualRegion) {
-      ContextualRegion = contextualRegion;
-    }
-    if (!Component) {
-      Component = shortcutComponent;
-    }
-    return /* @__PURE__ */ import_react.default.createElement(import_ToolbarShortcut.ToolbarShortcut, {
-      key: `${instanceUID}-shortcut-${index}`,
-      Component,
-      shortcutProps,
-      sharedProps,
-      ContextualRegion,
-      contextualRegionProps
-    });
-  }), [instanceUID, items]);
-  const dropdownMenuItems = (0, import_react.useMemo)(() => items.map((item, index) => {
-    const { component, sharedProps, dropdownComponentProps } = item;
-    const dropdownItem = {};
-    const { Icon, color, label, onClick } = {
-      ...sharedProps,
-      ...dropdownComponentProps
-    };
-    if (component === import_outOfTheBox.SEPARATOR)
-      dropdownItem.type = "separator";
-    else {
-      dropdownItem.id = `${instanceUID}-dropdown-${index}`;
-      dropdownItem.onClick = () => onClick(item);
-      dropdownItem.label = label;
-      dropdownItem.onKeyDown = (e) => {
-        if (e.key === "Enter" || e.key === " ") {
-          onClick(item);
+  const shortcutItems = (0, import_react.useMemo)(
+    () => items.filter((item) => item.hasShortcut || item.component === import_outOfTheBox.SEARCH_BOX || item.contextualRegion).map((item, index) => {
+      const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } = item;
+      let Component;
+      let ContextualRegion;
+      if (component === import_outOfTheBox.SEPARATOR)
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outOfTheBox.MiniToolbarSeparator, {});
+      if (component === import_outOfTheBox.BUTTON)
+        Component = import_outOfTheBox.MiniToolbarButton;
+      else if (component === import_outOfTheBox.ICON_ITEM)
+        Component = import_outOfTheBox.MiniToolbarIcon;
+      else if (component === import_outOfTheBox.COMBO_BOX)
+        Component = import_outOfTheBox.MiniToolbarComboBox;
+      else if (component === import_outOfTheBox.SEARCH_BOX) {
+        if (item.hasShortcut) {
+          Component = import_SearchBox.MiniToolbarSearchButton;
         }
+        ContextualRegion = import_outOfTheBox.MiniToolbarSearchBox;
+      }
+      if (!ContextualRegion) {
+        ContextualRegion = contextualRegion;
+      }
+      if (!Component) {
+        Component = shortcutComponent;
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ToolbarShortcut.ToolbarShortcut, {
+        Component,
+        shortcutProps,
+        sharedProps,
+        ContextualRegion,
+        contextualRegionProps
+      }, `${instanceUID}-shortcut-${index}`);
+    }),
+    [instanceUID, items]
+  );
+  const dropdownMenuItems = (0, import_react.useMemo)(
+    () => items.map((item, index) => {
+      const { component, sharedProps, dropdownComponentProps } = item;
+      const dropdownItem = {};
+      const { Icon, color, label, onClick } = {
+        ...sharedProps,
+        ...dropdownComponentProps
       };
-    }
-    if (component === import_outOfTheBox.ICON_ITEM) {
-      dropdownItem.leftAddon = /* @__PURE__ */ import_react.default.createElement(Icon, {
-        color
-      });
-    } else if (component === import_outOfTheBox.SEARCH_BOX) {
-      dropdownItem.leftAddon = /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Search, {
-        color
-      });
-    } else if (component === import_outOfTheBox.COMBO_BOX) {
-      dropdownItem.type = "subMenu";
-      dropdownItem.label = label;
-      dropdownItem.subItems = sharedProps.options.map((option, index2) => {
-        option.id = `${instanceUID}-option-${index2}`;
-        option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);
-        option.onKeyDown = (e) => {
-          if (e.key === " " || e.key === "Enter") {
-            dropdownComponentProps.onSelectMenuItem(option);
+      if (component === import_outOfTheBox.SEPARATOR)
+        dropdownItem.type = "separator";
+      else {
+        dropdownItem.id = `${instanceUID}-dropdown-${index}`;
+        dropdownItem.onClick = () => onClick(item);
+        dropdownItem.label = label;
+        dropdownItem.onKeyDown = (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            onClick(item);
           }
         };
-        return option;
-      });
-    }
-    return dropdownItem;
-  }), [instanceUID, items]);
+      }
+      if (component === import_outOfTheBox.ICON_ITEM) {
+        dropdownItem.leftAddon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {
+          color
+        });
+      } else if (component === import_outOfTheBox.SEARCH_BOX) {
+        dropdownItem.leftAddon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.Search, {
+          color
+        });
+      } else if (component === import_outOfTheBox.COMBO_BOX) {
+        dropdownItem.type = "subMenu";
+        dropdownItem.label = label;
+        dropdownItem.subItems = sharedProps.options.map((option, index2) => {
+          option.id = `${instanceUID}-option-${index2}`;
+          option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);
+          option.onKeyDown = (e) => {
+            if (e.key === " " || e.key === "Enter") {
+              dropdownComponentProps.onSelectMenuItem(option);
+            }
+          };
+          return option;
+        });
+      }
+      return dropdownItem;
+    }),
+    [instanceUID, items]
+  );
   return [shortcutItems, dropdownMenuItems];
 };
 //# sourceMappingURL=useGenerateItems.js.map

package/dist/cjs/hooks/useGenerateItems.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/hooks/useGenerateItems.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useMemo } from 'react';\nimport { uid } from 'uid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n  ICON_ITEM,\n  SEPARATOR,\n  BUTTON,\n  SEARCH_BOX,\n  COMBO_BOX,\n  MiniToolbarButton,\n  MiniToolbarSeparator,\n  MiniToolbarSearchBox,\n  MiniToolbarIcon,\n  MiniToolbarComboBox,\n} from '../Components/outOfTheBox';\nimport { ToolbarShortcut } from '../Components/ToolbarShortcut';\nimport { MiniToolbarSearchButton } from '../Components/outOfTheBox/SearchBox';\nimport { GeneratedDropdownItemT, MiniToolbarItemT } from '../index.d';\n\nconst useGenerateItems = (items: MiniToolbarItemT[]): [React.ReactElement[], GeneratedDropdownItemT[]] => {\n  const instanceUID = useMemo(() => uid(6), []);\n\n  const shortcutItems = useMemo(\n    () =>\n      items\n        .filter((item) => item.hasShortcut || item.component === SEARCH_BOX || item.contextualRegion)\n        .map((item, index) => {\n          const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } =\n            item;\n\n          let Component;\n          let ContextualRegion;\n\n          if (component === SEPARATOR) return <MiniToolbarSeparator />;\n          if (component === BUTTON) Component = MiniToolbarButton;\n          else if (component === ICON_ITEM) Component = MiniToolbarIcon;\n          else if (component === COMBO_BOX) Component = MiniToolbarComboBox;\n          else if (component === SEARCH_BOX) {\n            if (item.hasShortcut) {\n              Component = MiniToolbarSearchButton;\n            }\n            ContextualRegion = MiniToolbarSearchBox;\n          }\n          if (!ContextualRegion) {\n            ContextualRegion = contextualRegion;\n          }\n          if (!Component) {\n            Component = shortcutComponent;\n          }\n\n          return (\n            <ToolbarShortcut\n              key={`${instanceUID}-shortcut-${index}`}\n              Component={Component}\n              shortcutProps={shortcutProps}\n              sharedProps={sharedProps}\n              ContextualRegion={ContextualRegion}\n              contextualRegionProps={contextualRegionProps}\n            />\n          );\n        }),\n    [instanceUID, items],\n  );\n\n  const dropdownMenuItems = useMemo(\n    () =>\n      items.map((item, index) => {\n        const { component, sharedProps, dropdownComponentProps } = item;\n        const dropdownItem: GeneratedDropdownItemT = {};\n\n        const { Icon, color, label, onClick } = {\n          ...sharedProps,\n          ...dropdownComponentProps,\n        };\n\n        if (component === SEPARATOR) dropdownItem.type = 'separator';\n        else {\n          dropdownItem.id = `${instanceUID}-dropdown-${index}`;\n          dropdownItem.onClick = () => onClick(item);\n          dropdownItem.label = label;\n          dropdownItem.onKeyDown = (e: React.KeyboardEvent) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              onClick(item);\n            }\n          };\n        }\n\n        if (component === ICON_ITEM) {\n          dropdownItem.leftAddon = <Icon color={color} />;\n        } else if (component === SEARCH_BOX) {\n          dropdownItem.leftAddon = <Search color={color} />;\n        } else if (component === COMBO_BOX) {\n          dropdownItem.type = 'subMenu';\n          dropdownItem.label = label;\n          dropdownItem.subItems = sharedProps.options.map((option, index) => {\n            option.id = `${instanceUID}-option-${index}`;\n            option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);\n            option.onKeyDown = (e: React.KeyboardEvent) => {\n              if (e.key === ' ' || e.key === 'Enter') {\n                dropdownComponentProps.onSelectMenuItem(option);\n              }\n            };\n            return option;\n          });\n        }\n\n        return dropdownItem;\n      }),\n    [instanceUID, items],\n  );\n\n  return [shortcutItems, dropdownMenuItems];\n};\n\nexport { useGenerateItems };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA+B;AAC/B,iBAAoB;AACpB,sBAAuB;AACvB,yBAWO;AACP,6BAAgC;AAChC,uBAAwC;AAGxC,MAAM,mBAAmB,CAAC,UAAgF;AACxG,QAAM,cAAc,0BAAQ,MAAM,oBAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,gBAAgB,0BACpB,MACE,MACG,OAAO,CAAC,SAAS,KAAK,eAAe,KAAK,cAAc,iCAAc,KAAK,gBAAgB,EAC3F,IAAI,CAAC,MAAM,UAAU;AACpB,UAAM,EAAE,WAAW,mBAAmB,eAAe,aAAa,kBAAkB,0BAClF;AAEF,QAAI;AACJ,QAAI;AAEJ,QAAI,cAAc;AAAW,aAAO,mDAAC,6CAAqB;AAC1D,QAAI,cAAc;AAAQ,kBAAY;AAAA,aAC7B,cAAc;AAAW,kBAAY;AAAA,aACrC,cAAc;AAAW,kBAAY;AAAA,aACrC,cAAc,+BAAY;AACjC,UAAI,KAAK,aAAa;AACpB,oBAAY;AAAA,MACd;AACA,yBAAmB;AAAA,IACrB;AACA,QAAI,CAAC,kBAAkB;AACrB,yBAAmB;AAAA,IACrB;AACA,QAAI,CAAC,WAAW;AACd,kBAAY;AAAA,IACd;AAEA,WACE,mDAAC;AAAA,MACC,KAAK,GAAG,wBAAwB;AAAA,MAChC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,KACF;AAAA,EAEJ,CAAC,GACL,CAAC,aAAa,KAAK,CACrB;AAEA,QAAM,oBAAoB,0BACxB,MACE,MAAM,IAAI,CAAC,MAAM,UAAU;AACzB,UAAM,EAAE,WAAW,aAAa,2BAA2B;AAC3D,UAAM,eAAuC,CAAC;AAE9C,UAAM,EAAE,MAAM,OAAO,OAAO,YAAY;AAAA,MACtC,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAEA,QAAI,cAAc;AAAW,mBAAa,OAAO;AAAA,SAC5C;AACH,mBAAa,KAAK,GAAG,wBAAwB;AAC7C,mBAAa,UAAU,MAAM,QAAQ,IAAI;AACzC,mBAAa,QAAQ;AACrB,mBAAa,YAAY,CAAC,MAA2B;AACnD,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,kBAAQ,IAAI;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAEA,QAAI,cAAc,8BAAW;AAC3B,mBAAa,YAAY,mDAAC;AAAA,QAAK;AAAA,OAAc;AAAA,IAC/C,WAAW,cAAc,+BAAY;AACnC,mBAAa,YAAY,mDAAC;AAAA,QAAO;AAAA,OAAc;AAAA,IACjD,WAAW,cAAc,8BAAW;AAClC,mBAAa,OAAO;AACpB,mBAAa,QAAQ;AACrB,mBAAa,WAAW,YAAY,QAAQ,IAAI,CAAC,QAAQ,WAAU;AACjE,eAAO,KAAK,GAAG,sBAAsB;AACrC,eAAO,UAAU,MAAM,uBAAuB,iBAAiB,MAAM;AACrE,eAAO,YAAY,CAAC,MAA2B;AAC7C,cAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,mCAAuB,iBAAiB,MAAM;AAAA,UAChD;AAAA,QACF;AACA,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAEA,WAAO;AAAA,EACT,CAAC,GACH,CAAC,aAAa,KAAK,CACrB;AAEA,SAAO,CAAC,eAAe,iBAAiB;AAC1C;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+B;AAC/B,iBAAoB;AACpB,sBAAuB;AACvB,yBAWO;AACP,6BAAgC;AAChC,uBAAwC;AAGxC,MAAM,mBAAmB,CAAC,UAAgF;AACxG,QAAM,kBAAc,sBAAQ,UAAM,gBAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,oBAAgB;AAAA,IACpB,MACE,MACG,OAAO,CAAC,SAAS,KAAK,eAAe,KAAK,cAAc,iCAAc,KAAK,gBAAgB,EAC3F,IAAI,CAAC,MAAM,UAAU;AACpB,YAAM,EAAE,WAAW,mBAAmB,eAAe,aAAa,kBAAkB,sBAAsB,IACxG;AAEF,UAAI;AACJ,UAAI;AAEJ,UAAI,cAAc;AAAW,eAAO,4CAAC,2CAAqB;AAC1D,UAAI,cAAc;AAAQ,oBAAY;AAAA,eAC7B,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc,+BAAY;AACjC,YAAI,KAAK,aAAa;AACpB,sBAAY;AAAA,QACd;AACA,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,kBAAkB;AACrB,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,WAAW;AACd,oBAAY;AAAA,MACd;AAEA,aACE,4CAAC;AAAA,QAEC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,SALK,GAAG,wBAAwB,OAMlC;AAAA,IAEJ,CAAC;AAAA,IACL,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,QAAM,wBAAoB;AAAA,IACxB,MACE,MAAM,IAAI,CAAC,MAAM,UAAU;AACzB,YAAM,EAAE,WAAW,aAAa,uBAAuB,IAAI;AAC3D,YAAM,eAAuC,CAAC;AAE9C,YAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,IAAI;AAAA,QACtC,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAEA,UAAI,cAAc;AAAW,qBAAa,OAAO;AAAA,WAC5C;AACH,qBAAa,KAAK,GAAG,wBAAwB;AAC7C,qBAAa,UAAU,MAAM,QAAQ,IAAI;AACzC,qBAAa,QAAQ;AACrB,qBAAa,YAAY,CAAC,MAA2B;AACnD,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,oBAAQ,IAAI;AAAA,UACd;AAAA,QACF;AAAA,MACF;AAEA,UAAI,cAAc,8BAAW;AAC3B,qBAAa,YAAY,4CAAC;AAAA,UAAK;AAAA,SAAc;AAAA,MAC/C,WAAW,cAAc,+BAAY;AACnC,qBAAa,YAAY,4CAAC;AAAA,UAAO;AAAA,SAAc;AAAA,MACjD,WAAW,cAAc,8BAAW;AAClC,qBAAa,OAAO;AACpB,qBAAa,QAAQ;AACrB,qBAAa,WAAW,YAAY,QAAQ,IAAI,CAAC,QAAQA,WAAU;AACjE,iBAAO,KAAK,GAAG,sBAAsBA;AACrC,iBAAO,UAAU,MAAM,uBAAuB,iBAAiB,MAAM;AACrE,iBAAO,YAAY,CAAC,MAA2B;AAC7C,gBAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,qCAAuB,iBAAiB,MAAM;AAAA,YAChD;AAAA,UACF;AACA,iBAAO;AAAA,QACT,CAAC;AAAA,MACH;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,IACH,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,SAAO,CAAC,eAAe,iBAAiB;AAC1C;",
+  "names": ["index"]
 }