@elliemae/ds-mini-toolbar 2.3.0-alpha.8 → 2.3.0-next.2

package/types/index.d.d.ts

@@ -0,0 +1,75 @@
+import React from 'react';
+declare type SvgIconSizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
+declare type SvgIconColorType = ['neutral', '900'] | ['neutral', '500'] | ['neutral', '0'] | ['danger', '900'] | ['warning', '600'] | ['success', '900'] | ['brand-primary', '600'];
+declare type SharedProps = {
+    options?: Record<string, unknown>[];
+    onClick?: (item: MiniToolbarItemT) => void;
+    Icon?: React.ComponentType<Record<string, unknown>>;
+    label?: string;
+} & Record<string, unknown>;
+declare type ShortcutProps = {
+    style?: React.CSSProperties;
+} & Record<string, unknown>;
+declare type ContextualRegionProps = {
+    position?: 'left' | 'right';
+    isOpen: boolean;
+} & Record<string, unknown>;
+declare type DropdownComponentProps = {
+    onClick?: (item: MiniToolbarItemT) => void;
+    label?: string;
+    Icon?: React.ComponentType<Record<string, unknown>>;
+    color?: SvgIconColorType;
+    onSelectMenuItem: (option: Record<string, unknown>) => void;
+} & Record<string, unknown>;
+declare type OverflowButtonProps = {
+    ariaLabel?: string;
+    style?: React.CSSProperties;
+    buttonType?: 'secondary' | 'text';
+};
+interface DefaultIconItemProps {
+    Icon: React.ComponentType<{
+        size: SvgIconSizeType;
+        color: SvgIconColorType;
+    }>;
+    size?: SvgIconSizeType;
+    color?: SvgIconColorType;
+    onClick?: (item: MiniToolbarItemT) => void;
+    ariaLabel?: string;
+    style?: React.CSSProperties;
+}
+declare type MiniToolbarIconItemPropsT = DefaultIconItemProps & Record<string, unknown>;
+declare type MiniToolbarButtonPropsT = {
+    ariaLabel: string;
+} & Record<string, unknown>;
+interface MiniToolbarItemT {
+    component: 'ds-button' | 'ds-icon-item' | 'ds-separator' | 'ds-search-box' | 'ds-combo-box' | React.ReactElement;
+    hasShortcut?: boolean;
+    shortcutComponent?: React.ReactElement;
+    shortcutProps?: ShortcutProps;
+    dropdownComponentProps?: DropdownComponentProps;
+    sharedProps?: SharedProps;
+    contextualRegion?: React.ReactElement;
+    contextualRegionProps?: ContextualRegionProps;
+    [key: string]: unknown;
+}
+interface ToolbarShortcutPropsT {
+    Component: React.ComponentType<Record<string, unknown>>;
+    shortcutProps: ShortcutProps;
+    sharedProps: SharedProps;
+    ContextualRegion: React.ComponentType<Record<string, unknown>>;
+    contextualRegionProps: ContextualRegionProps;
+}
+interface MiniToolbarPropsT {
+    items: MiniToolbarItemT[];
+    overflowButtonProps?: OverflowButtonProps;
+}
+declare type GeneratedDropdownItemT = {
+    id?: string;
+    label?: string;
+    onClick?: (item: MiniToolbarItemT) => void;
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    leftAddon?: React.ReactElement;
+    subItems?: Record<string, unknown>[];
+    type?: 'separator' | 'subMenu';
+};
+export { MiniToolbarIconItemPropsT, MiniToolbarButtonPropsT, MiniToolbarItemT, ToolbarShortcutPropsT, MiniToolbarPropsT, GeneratedDropdownItemT, };

package/types/index.d.ts

@@ -0,0 +1,2 @@
+export { MiniToolbar, MiniToolbarWithSchema } from './Components/MiniToolbar';
+export { ToolbarItemWithSchema } from './propTypes';

package/types/propTypes.d.ts

@@ -0,0 +1,17 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
+/// <reference types="react" />
+declare const miniToolbarProps: {
+    items: import("react-desc").PropTypesDescValue;
+    overflowButtonProps: {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValue;
+    };
+};
+declare const ToolbarItemWithSchema: {
+    (props?: unknown): JSX.Element;
+    propTypes: unknown;
+    toTypescript: () => import("react-desc").TypescriptSchema;
+};
+export { ToolbarItemWithSchema, miniToolbarProps };

package/types/styles.d.ts

@@ -0,0 +1,5 @@
+declare const Container: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
+declare const Separator: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+declare const Item: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
+declare const StyledButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
+export { Container, Separator, Item, StyledButton };

package/types/tests/DSMiniToolbar.events.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/tests/DSMiniToolbar.keyboard.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/tests/DSMiniToolbar.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/tests/utils.test.d.ts

@@ -0,0 +1,161 @@
+export const testItems: ({
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick: jest.Mock<null, []>;
+        ariaLabel: string;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick: jest.Mock<null, []>;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick?: undefined;
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick?: undefined;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick?: undefined;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        onClick: jest.Mock<null, []>;
+        color: string[];
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick: jest.Mock<null, []>;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick: jest.Mock<null, []>;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick: jest.Mock<null, []>;
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps?: undefined;
+    dropdownComponentProps?: undefined;
+    sharedProps?: undefined;
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick?: undefined;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick?: undefined;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick?: undefined;
+    };
+})[];
+export function addContextualRegionToItems(isOpen: any): ({
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick: jest.Mock<null, []>;
+        ariaLabel: string;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick: jest.Mock<null, []>;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick?: undefined;
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick?: undefined;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick?: undefined;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        onClick: jest.Mock<null, []>;
+        color: string[];
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick: jest.Mock<null, []>;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick: jest.Mock<null, []>;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick: jest.Mock<null, []>;
+    };
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps?: undefined;
+    dropdownComponentProps?: undefined;
+    sharedProps?: undefined;
+} | {
+    component: string;
+    hasShortcut: boolean;
+    shortcutProps: {
+        size: string;
+        onClick?: undefined;
+        ariaLabel?: undefined;
+    };
+    dropdownComponentProps: {
+        label: string;
+        size: string;
+        onClick?: undefined;
+    };
+    sharedProps: {
+        Icon: (rest: any) => JSX.Element;
+        color: string[];
+        onClick?: undefined;
+    };
+})[];
+export const shortcutCb: jest.Mock<null, []>;
+export const dropdownCb: jest.Mock<null, []>;
+export const sharedCb: jest.Mock<null, []>;

package/dist/cjs/Components/MiniToolbar.js

@@ -1,81 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var MiniToolbar_exports = {};
-__export(MiniToolbar_exports, {
-  MiniToolbar: () => MiniToolbar,
-  MiniToolbarWithSchema: () => MiniToolbarWithSchema
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_react_desc = require("react-desc");
-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, {
-  color: ["brand-primary", "600"],
-  size: "m"
-});
-const MiniToolbar = ({ items, overflowButtonProps }) => {
-  const [shortcutItems, dropdownMenuItems] = (0, import_useGenerateItems.useGenerateItems)(items);
-  const [isDropdownMenuOpen, setIsDropdownMenuOpen] = (0, import_react.useState)(false);
-  const closeDropdownMenu = (0, import_react.useCallback)(() => setIsDropdownMenuOpen(false), []);
-  const openDropdownMenu = (0, import_react.useCallback)(() => setIsDropdownMenuOpen(true), []);
-  const openDropdownMenuKeyPress = (0, import_react.useCallback)((e) => {
-    if (e.key === " ") {
-      setIsDropdownMenuOpen(true);
-    }
-  }, []);
-  const { ariaLabel, style, buttonType = "secondary" } = overflowButtonProps || {};
-  return /* @__PURE__ */ import_react.default.createElement(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
-    })
-  }));
-};
-MiniToolbar.propTypes = import_propTypes.miniToolbarProps;
-const MiniToolbarWithSchema = (0, import_react_desc.describe)(MiniToolbar);
-MiniToolbarWithSchema.propTypes = import_propTypes.miniToolbarProps;
-module.exports = __toCommonJS(MiniToolbar_exports);
-//# sourceMappingURL=MiniToolbar.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/Components/MiniToolbar.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { describe } from 'react-desc';\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;\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;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,wBAAyB;AACzB,6BAA+B;AAC/B,sBAAgC;AAChC,oBAAwC;AACxC,uBAAiC;AACjC,8BAAiC;AAGjC,MAAM,UAAU,mDAAC,iCAAD;AAAA,EAAiB,OAAO,CAAC,iBAAiB;AAAA,EAAQ,MAAK;AAAA;AAEvE,MAAM,cAAc,CAAC,EAAE,OAAO,0BAAiE;AAC7F,QAAM,CAAC,eAAe,qBAAqB,8CAAiB;AAC5D,QAAM,CAAC,oBAAoB,yBAAyB,2BAAkB;AAEtE,QAAM,oBAAoB,8BAAY,MAAM,sBAAsB,QAAQ;AAC1E,QAAM,mBAAmB,8BAAY,MAAM,sBAAsB,OAAO;AACxE,QAAM,2BAA2B,8BAAY,CAAC,MAAM;AAClD,QAAI,EAAE,QAAQ,KAAK;AACjB,4BAAsB;AAAA;AAAA,KAEvB;AAEH,QAAM,EAAE,WAAW,OAAO,aAAa,gBAAgB,uBAAuB;AAE9E,SACE,mDAAC,yBAAD;AAAA,IAAW,MAAK;AAAA,IAAU,eAAY;AAAA,KACnC,eACD,mDAAC,uCAAD;AAAA,IACE,eAAY;AAAA,IACZ,QAAQ;AAAA,IACR,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,SAAS;AAAA,IACT,kBACE,mDAAC,4BAAD;AAAA,MACE,cAAY;AAAA,MACZ,eAAY;AAAA,MACZ,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA;AAAA;AAAA;AAQtB,YAAY,YAAY;AACxB,MAAM,wBAAwB,gCAAS;AACvC,sBAAsB,YAAY;",
-  "names": []
-}

package/dist/cjs/Components/ToolbarShortcut.js

@@ -1,72 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var ToolbarShortcut_exports = {};
-__export(ToolbarShortcut_exports, {
-  ToolbarShortcut: () => ToolbarShortcut
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_styles = require("../styles");
-const ToolbarShortcut = (props) => {
-  const { Component, shortcutProps, sharedProps, ContextualRegion, contextualRegionProps } = props;
-  const leftRef = (0, import_react.useRef)(null);
-  const rightRef = (0, import_react.useRef)(null);
-  const timerLeft = (0, import_react.useRef)(null);
-  const timerRight = (0, import_react.useRef)(null);
-  const { position = "left", isOpen = false } = contextualRegionProps || {};
-  const { style } = shortcutProps || {};
-  const mergedProps = {
-    ...sharedProps,
-    ...shortcutProps
-  };
-  (0, import_react.useEffect)(() => {
-    if (isOpen && leftRef.current) {
-      timerLeft.current = setTimeout(() => leftRef.current.focus(), 200);
-    }
-    if (isOpen && rightRef.current) {
-      timerRight.current = setTimeout(() => rightRef.current.focus(), 200);
-    }
-    return () => {
-      clearTimeout(timerLeft.current);
-      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
-  })));
-};
-module.exports = __toCommonJS(ToolbarShortcut_exports);
-//# sourceMappingURL=ToolbarShortcut.js.map

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

@@ -1,7 +0,0 @@
-{
-  "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;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,oBAAqB;AAGrB,MAAM,kBAAkB,CAAC,UAAqD;AAC5E,QAAM,EAAE,WAAW,eAAe,aAAa,kBAAkB,0BAA0B;AAC3F,QAAM,UAAU,yBAA2B;AAC3C,QAAM,WAAW,yBAA2B;AAC5C,QAAM,YAAY,yBAA8C;AAChE,QAAM,aAAa,yBAA8C;AAEjE,QAAM,EAAE,WAAW,QAAQ,SAAS,UAAU,yBAAyB;AACvE,QAAM,EAAE,UAAU,iBAAiB;AAEnC,QAAM,cAAc;AAAA,OACf;AAAA,OACA;AAAA;AAGL,8BAAU,MAAM;AACd,QAAI,UAAU,QAAQ,SAAS;AAC7B,gBAAU,UAAU,WAAW,MAAM,QAAQ,QAAQ,SAAS;AAAA;AAEhE,QAAI,UAAU,SAAS,SAAS;AAC9B,iBAAW,UAAU,WAAW,MAAM,SAAS,QAAQ,SAAS;AAAA;AAGlE,WAAO,MAAM;AACX,mBAAa,UAAU;AACvB,mBAAa,WAAW;AAAA;AAAA,KAEzB,CAAC,QAAQ,SAAS;AAErB,SACE,wFACG,UAAU,aAAa,UACtB,mDAAC,oBAAD,MACE,mDAAC,kBAAD;AAAA,IAAkB,UAAU;AAAA,OAAa;AAAA,OAG5C,aACC,mDAAC,oBAAD;AAAA,IAAM;AAAA,KACJ,mDAAC,WAAD;AAAA,OAAe;AAAA,OAGlB,UAAU,aAAa,WACtB,mDAAC,oBAAD,MACE,mDAAC,kBAAD;AAAA,IAAkB,UAAU;AAAA,OAAc;AAAA;AAAA;",
-  "names": []
-}

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

@@ -1,41 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var Button_exports = {};
-__export(Button_exports, {
-  MiniToolbarButton: () => MiniToolbarButton
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_button = require("@elliemae/ds-button");
-const MiniToolbarButton = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
-  ...props,
-  "aria-label": props.ariaLabel,
-  "data-testid": "ds-mini-toolbar__shortcut"
-});
-module.exports = __toCommonJS(Button_exports);
-//# sourceMappingURL=Button.js.map

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

@@ -1,7 +0,0 @@
-{
-  "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;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,uBAAyB;AAEzB,MAAM,oBAAoB,CAAC,UACzB,mDAAC,2BAAD;AAAA,KAAc;AAAA,EAAO,cAAY,MAAM;AAAA,EAAW,eAAY;AAAA;",
-  "names": []
-}

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

@@ -1,39 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var ComboBox_exports = {};
-__export(ComboBox_exports, {
-  MiniToolbarComboBox: () => MiniToolbarComboBox
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_form = require("@elliemae/ds-form");
-const MiniToolbarComboBox = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSComboBox2, {
-  ...props
-});
-module.exports = __toCommonJS(ComboBox_exports);
-//# sourceMappingURL=ComboBox.js.map

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

@@ -1,7 +0,0 @@
-{
-  "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;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,qBAA4B;AAE5B,MAAM,sBAAsB,CAAC,UAAuD,mDAAC,4BAAD;AAAA,KAAiB;AAAA;",
-  "names": []
-}

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

@@ -1,50 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var IconItem_exports = {};
-__export(IconItem_exports, {
-  MiniToolbarIcon: () => MiniToolbarIcon
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-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, {
-    "aria-label": ariaLabel,
-    buttonType,
-    onClick,
-    style,
-    leftIcon: /* @__PURE__ */ import_react.default.createElement(Icon, {
-      size,
-      color
-    }),
-    "data-testid": "ds-mini-toolbar__shortcut"
-  });
-};
-module.exports = __toCommonJS(IconItem_exports);
-//# sourceMappingURL=IconItem.js.map

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

@@ -1,7 +0,0 @@
-{
-  "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;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,4BAAD;AAAA,IACE,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,mDAAC,MAAD;AAAA,MAAM;AAAA,MAAY;AAAA;AAAA,IAC5B,eAAY;AAAA;AAAA;",
-  "names": []
-}