@elliemae/ds-toolbar 3.21.0-rc.2 → 3.21.2-rc.1

package/dist/cjs/DSToolbarItemV2.js

@@ -45,7 +45,7 @@ var import_DSToolbarDefinitions = require("./DSToolbarDefinitions.js");
 const DSToolbarItemV2 = (props) => {
   const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultItemProps);
   (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.DSToolbarItemV2Schema, import_DSToolbarDefinitions.DSToolbarItemName);
-  const { render, isFirstItem } = propsWithDefaults;
+  const { render: ComponentRenderer, isFirstItem } = propsWithDefaults;
   const { id: providedId, ...restGlobals } = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefaults);
   const { registerReference, dndDraggingItem } = (0, import_react.useContext)(import_DSToolbarV2Context.DSToolbarV2Context);
   const ref = (0, import_react.useRef)(null);
@@ -67,7 +67,7 @@ const DSToolbarItemV2 = (props) => {
       className: "ds-toolbar-item",
       ...handlers,
       ...restGlobals,
-      children: render({ innerRef: ref, tabIndex })
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ComponentRenderer, { innerRef: ref, tabIndex })
     }
   );
 };

package/dist/cjs/DSToolbarItemV2.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSToolbarItemV2.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport {\n  describe,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context.js';\nimport { StyledToolbarItem } from './styled.js';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers.js';\nimport { defaultItemProps, DSToolbarItemV2Schema } from './react-desc-prop-types.js';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\nimport { DSToolbarItemName } from './DSToolbarDefinitions.js';\n\nconst DSToolbarItemV2: React.ComponentType<DSToolbarItemT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);\n\n  useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema, DSToolbarItemName);\n  const { render, isFirstItem } = propsWithDefaults;\n  const { id: providedId, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);\n  const { registerReference, dndDraggingItem } = useContext(DSToolbarV2Context);\n  const ref = useRef(null);\n  const toolbarItemId = useMemo(() => {\n    const id = providedId ?? `ds-toolbar-item-${uid()}`;\n    registerReference(id, ref);\n    return id;\n  }, [registerReference, ref, providedId]);\n\n  const tabIndex = useMemo(\n    () => (dndDraggingItem === toolbarItemId || (!dndDraggingItem && isFirstItem) ? 0 : -1),\n    [dndDraggingItem, isFirstItem, toolbarItemId],\n  );\n\n  const handlers = useToolbarItemHandlers(toolbarItemId);\n  return (\n    <StyledToolbarItem\n      id={toolbarItemId}\n      data-testid=\"ds-toolbar-item\"\n      className=\"ds-toolbar-item\"\n      {...handlers}\n      {...restGlobals}\n    >\n      {render({ innerRef: ref, tabIndex })}\n    </StyledToolbarItem>\n  );\n};\n\nDSToolbarItemV2.propTypes = DSToolbarItemV2Schema;\n\nDSToolbarItemV2.displayName = DSToolbarItemName;\nconst DSToolbarItemV2WithSchema = describe(DSToolbarItemV2).description('Toolbar Item');\nDSToolbarItemV2WithSchema.propTypes = DSToolbarItemV2Schema;\n\nexport { DSToolbarItemV2, DSToolbarItemV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqCnB;AApCJ,mBAAmD;AACnD,8BAKO;AACP,iBAAoB;AACpB,gCAAmC;AACnC,oBAAkC;AAClC,oCAAuC;AACvC,mCAAwD;AAExD,kCAAkC;AAElC,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,wBAAoB,sDAA6B,OAAO,6CAAgB;AAE9E,8DAA+B,mBAAmB,oDAAuB,6CAAiB;AAC1F,QAAM,EAAE,QAAQ,YAAY,IAAI;AAChC,QAAM,EAAE,IAAI,YAAY,GAAG,YAAY,QAAI,gDAAuB,iBAAiB;AACnF,QAAM,EAAE,mBAAmB,gBAAgB,QAAI,yBAAW,4CAAkB;AAC5E,QAAM,UAAM,qBAAO,IAAI;AACvB,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,UAAM,KAAK,cAAc,uBAAmB,gBAAI;AAChD,sBAAkB,IAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAEvC,QAAM,eAAW;AAAA,IACf,MAAO,oBAAoB,iBAAkB,CAAC,mBAAmB,cAAe,IAAI;AAAA,IACpF,CAAC,iBAAiB,aAAa,aAAa;AAAA,EAC9C;AAEA,QAAM,eAAW,sDAAuB,aAAa;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,eAAY;AAAA,MACZ,WAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MAEH,iBAAO,EAAE,UAAU,KAAK,SAAS,CAAC;AAAA;AAAA,EACrC;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,gCAA4B,kCAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
+  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport {\n  describe,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context.js';\nimport { StyledToolbarItem } from './styled.js';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers.js';\nimport { defaultItemProps, DSToolbarItemV2Schema } from './react-desc-prop-types.js';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\nimport { DSToolbarItemName } from './DSToolbarDefinitions.js';\n\nconst DSToolbarItemV2: React.ComponentType<DSToolbarItemT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);\n\n  useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema, DSToolbarItemName);\n  const { render: ComponentRenderer, isFirstItem } = propsWithDefaults;\n  const { id: providedId, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);\n  const { registerReference, dndDraggingItem } = useContext(DSToolbarV2Context);\n  const ref = useRef<HTMLElement | null>(null);\n\n  const toolbarItemId = useMemo(() => {\n    const id = providedId ?? `ds-toolbar-item-${uid()}`;\n    registerReference(id, ref);\n    return id;\n  }, [registerReference, ref, providedId]);\n\n  const tabIndex = useMemo(\n    () => (dndDraggingItem === toolbarItemId || (!dndDraggingItem && isFirstItem) ? 0 : -1),\n    [dndDraggingItem, isFirstItem, toolbarItemId],\n  );\n\n  const handlers = useToolbarItemHandlers(toolbarItemId);\n  return (\n    <StyledToolbarItem\n      id={toolbarItemId}\n      data-testid=\"ds-toolbar-item\"\n      className=\"ds-toolbar-item\"\n      {...handlers}\n      {...restGlobals}\n    >\n      <ComponentRenderer innerRef={ref} tabIndex={tabIndex} />\n    </StyledToolbarItem>\n  );\n};\n\nDSToolbarItemV2.propTypes = DSToolbarItemV2Schema;\n\nDSToolbarItemV2.displayName = DSToolbarItemName;\nconst DSToolbarItemV2WithSchema = describe(DSToolbarItemV2).description('Toolbar Item');\nDSToolbarItemV2WithSchema.propTypes = DSToolbarItemV2Schema;\n\nexport { DSToolbarItemV2, DSToolbarItemV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6CjB;AA5CN,mBAAmD;AACnD,8BAKO;AACP,iBAAoB;AACpB,gCAAmC;AACnC,oBAAkC;AAClC,oCAAuC;AACvC,mCAAwD;AAExD,kCAAkC;AAElC,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,wBAAoB,sDAA6B,OAAO,6CAAgB;AAE9E,8DAA+B,mBAAmB,oDAAuB,6CAAiB;AAC1F,QAAM,EAAE,QAAQ,mBAAmB,YAAY,IAAI;AACnD,QAAM,EAAE,IAAI,YAAY,GAAG,YAAY,QAAI,gDAAuB,iBAAiB;AACnF,QAAM,EAAE,mBAAmB,gBAAgB,QAAI,yBAAW,4CAAkB;AAC5E,QAAM,UAAM,qBAA2B,IAAI;AAE3C,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,UAAM,KAAK,cAAc,uBAAmB,gBAAI;AAChD,sBAAkB,IAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAEvC,QAAM,eAAW;AAAA,IACf,MAAO,oBAAoB,iBAAkB,CAAC,mBAAmB,cAAe,IAAI;AAAA,IACpF,CAAC,iBAAiB,aAAa,aAAa;AAAA,EAC9C;AAEA,QAAM,eAAW,sDAAuB,aAAa;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,eAAY;AAAA,MACZ,WAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,sDAAC,qBAAkB,UAAU,KAAK,UAAoB;AAAA;AAAA,EACxD;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,gCAA4B,kCAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
   "names": []
 }

package/dist/cjs/DSToolbarV2Context.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSToolbarV2Context.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type { MutableRefObject } from 'react';\nimport { createContext } from 'react';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\ninterface IDSToolbarV2Context {\n  registerReference: (uid: string, ref: MutableRefObject<DSToolbarItemT.RenderHTMLElementT>) => void;\n  itemReferences: Record<string, MutableRefObject<DSToolbarItemT.RenderHTMLElementT>>;\n  toolbarUid: string;\n  dndDraggingItem: string;\n  setDndDraggingItem: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n  registerReference: () => null,\n  itemReferences: {},\n  toolbarUid: '',\n  dndDraggingItem: '',\n  setDndDraggingItem: () => {},\n});\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA8B;AAUvB,MAAM,yBAAqB,4BAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,oBAAoB,MAAM;AAAA,EAAC;AAC7B,CAAC;",
+  "sourcesContent": ["import type { MutableRefObject } from 'react';\nimport { createContext } from 'react';\ninterface IDSToolbarV2Context {\n  registerReference: (uid: string, ref: MutableRefObject<HTMLElement | null>) => void;\n  itemReferences: Record<string, MutableRefObject<HTMLElement | null>>;\n  toolbarUid: string;\n  dndDraggingItem: string;\n  setDndDraggingItem: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n  registerReference: () => null,\n  itemReferences: {},\n  toolbarUid: '',\n  dndDraggingItem: '',\n  setDndDraggingItem: () => {},\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA8B;AASvB,MAAM,yBAAqB,4BAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,oBAAoB,MAAM;AAAA,EAAC;AAC7B,CAAC;",
   "names": []
 }

package/dist/cjs/deprecated/ToolbarItem.js

@@ -36,12 +36,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = __toESM(require("react"));
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_ds_button = require("@elliemae/ds-button");
+var import_ds_button_v2 = require("@elliemae/ds-button-v2");
 var import_ds_popper = require("@elliemae/ds-popper");
 const ToolbarItem = ({ icon, labelText, menu = void 0, containerProps = {}, ...otherProps }) => {
   const [ref, setRef] = (0, import_react.useState)(null);
   (0, import_ds_shared.useFocusGroupWithState)(ref);
-  const btn = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButtonV2, { ...otherProps, buttonType: "icon", innerRef: (r) => setRef(r), labelText, ...containerProps, children: icon });
+  const btn = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button_v2.DSButtonV2, { ...otherProps, buttonType: "icon", innerRef: (r) => setRef(r), labelText, ...containerProps, children: icon });
   if (menu) {
     return import_react.default.cloneElement(menu, {
       ...menu.props,

package/dist/cjs/deprecated/ToolbarItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/deprecated/ToolbarItem.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable eslint-comments/no-unlimited-disable */\n/* eslint-disable */\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useFocusGroupWithState } from '@elliemae/ds-shared';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { PopperPositions as Position } from '@elliemae/ds-popper';\n\nconst ToolbarItem = ({ icon, labelText, menu = undefined, containerProps = {}, ...otherProps }) => {\n  const [ref, setRef] = useState(null);\n\n  useFocusGroupWithState(ref);\n  const btn = (\n    <DSButtonV2 {...otherProps} buttonType=\"icon\" innerRef={(r) => setRef(r)} labelText={labelText} {...containerProps}>\n      {icon}\n    </DSButtonV2>\n  );\n  if (menu) {\n    return React.cloneElement(menu, {\n      ...menu.props,\n      placement: Position.BOTTOM_END,\n      triggerComponent: btn,\n    });\n  }\n  return btn;\n};\n\nToolbarItem.displayName = 'ToolbarItem';\n\nToolbarItem.propTypes = {\n  icon: PropTypes.element,\n  labelText: PropTypes.string,\n};\n\nexport default ToolbarItem;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAXJ,mBAAgC;AAChC,wBAAsB;AACtB,uBAAuC;AACvC,uBAA2B;AAC3B,uBAA4C;AAE5C,MAAM,cAAc,CAAC,EAAE,MAAM,WAAW,OAAO,QAAW,iBAAiB,CAAC,GAAG,GAAG,WAAW,MAAM;AACjG,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,IAAI;AAEnC,+CAAuB,GAAG;AAC1B,QAAM,MACJ,4CAAC,+BAAY,GAAG,YAAY,YAAW,QAAO,UAAU,CAAC,MAAM,OAAO,CAAC,GAAG,WAAuB,GAAG,gBACjG,gBACH;AAEF,MAAI,MAAM;AACR,WAAO,aAAAA,QAAM,aAAa,MAAM;AAAA,MAC9B,GAAG,KAAK;AAAA,MACR,WAAW,iBAAAC,gBAAS;AAAA,MACpB,kBAAkB;AAAA,IACpB,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEA,YAAY,cAAc;AAE1B,YAAY,YAAY;AAAA,EACtB,MAAM,kBAAAC,QAAU;AAAA,EAChB,WAAW,kBAAAA,QAAU;AACvB;AAEA,IAAO,sBAAQ;",
+  "sourcesContent": ["/* eslint-disable eslint-comments/no-unlimited-disable */\n/* eslint-disable */\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useFocusGroupWithState } from '@elliemae/ds-shared';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { PopperPositions as Position } from '@elliemae/ds-popper';\n\nconst ToolbarItem = ({ icon, labelText, menu = undefined, containerProps = {}, ...otherProps }) => {\n  const [ref, setRef] = useState(null);\n\n  useFocusGroupWithState(ref);\n  const btn = (\n    <DSButtonV2 {...otherProps} buttonType=\"icon\" innerRef={(r) => setRef(r)} labelText={labelText} {...containerProps}>\n      {icon}\n    </DSButtonV2>\n  );\n  if (menu) {\n    return React.cloneElement(menu, {\n      ...menu.props,\n      placement: Position.BOTTOM_END,\n      triggerComponent: btn,\n    });\n  }\n  return btn;\n};\n\nToolbarItem.displayName = 'ToolbarItem';\n\nToolbarItem.propTypes = {\n  icon: PropTypes.element,\n  labelText: PropTypes.string,\n};\n\nexport default ToolbarItem;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAXJ,mBAAgC;AAChC,wBAAsB;AACtB,uBAAuC;AACvC,0BAA2B;AAC3B,uBAA4C;AAE5C,MAAM,cAAc,CAAC,EAAE,MAAM,WAAW,OAAO,QAAW,iBAAiB,CAAC,GAAG,GAAG,WAAW,MAAM;AACjG,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,IAAI;AAEnC,+CAAuB,GAAG;AAC1B,QAAM,MACJ,4CAAC,kCAAY,GAAG,YAAY,YAAW,QAAO,UAAU,CAAC,MAAM,OAAO,CAAC,GAAG,WAAuB,GAAG,gBACjG,gBACH;AAEF,MAAI,MAAM;AACR,WAAO,aAAAA,QAAM,aAAa,MAAM;AAAA,MAC9B,GAAG,KAAK;AAAA,MACR,WAAW,iBAAAC,gBAAS;AAAA,MACpB,kBAAkB;AAAA,IACpB,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEA,YAAY,cAAc;AAE1B,YAAY,YAAY;AAAA,EACtB,MAAM,kBAAAC,QAAU;AAAA,EAChB,WAAW,kBAAAA,QAAU;AACvB;AAEA,IAAO,sBAAQ;",
   "names": ["React", "Position", "PropTypes"]
 }

package/dist/cjs/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSToolbarT {\n  export interface Props {\n    alignment?: 'left' | 'right';\n    withDepth?: boolean;\n    compact?: boolean;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n    children: React.Component<DSToolbarItemT.Props>;\n  }\n}\n\nexport declare namespace DSToolbarItemT {\n  export type RenderHTMLElementT =\n    | HTMLButtonElement\n    | HTMLInputElement\n    | HTMLTextAreaElement\n    | HTMLSelectElement\n    | HTMLOptionElement;\n  export interface Props {\n    render: (props: { innerRef: React.MutableRefObject<HTMLElement>; tabIndex: number }) => JSX.Element;\n    isFirstItem?: boolean;\n  }\n}\n\nexport const defaultItemProps = {\n  render: () => {},\n  isFirstItem: false,\n};\n\nexport const defaultProps = {\n  alignment: 'right',\n  withDepth: true,\n  compact: false,\n};\n\nexport const DSToolbarV2Schema = {\n  ...globalAttributesPropTypes,\n  alignment: PropTypes.oneOf(['right', 'left'])\n    .description('Whether to align the content left or right')\n    .defaultValue('right'),\n  withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),\n  compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper'),\n};\n\nexport const DSToolbarItemV2Schema = {\n  ...globalAttributesPropTypes,\n  render: PropTypes.func.isRequired.description('render function').defaultValue(() => {}),\n  isFirstItem: PropTypes.bool\n    .description(\n      'If true the item will have tab index 0 to be the first element focusable by keyboard on the page load',\n    )\n    .defaultValue(false),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSToolbarT {\n  export interface Props {\n    alignment?: 'left' | 'right';\n    withDepth?: boolean;\n    compact?: boolean;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n    children: React.Component<DSToolbarItemT.Props>;\n  }\n}\n\nexport declare namespace DSToolbarItemT {\n  export type RenderHTMLElementT =\n    | HTMLButtonElement\n    | HTMLInputElement\n    | HTMLTextAreaElement\n    | HTMLSelectElement\n    | HTMLOptionElement;\n  export interface Props {\n    render: (props: { innerRef: React.MutableRefObject<HTMLElement | null>; tabIndex: number }) => JSX.Element;\n    isFirstItem?: boolean;\n  }\n}\n\nexport const defaultItemProps = {\n  render: () => {},\n  isFirstItem: false,\n};\n\nexport const defaultProps = {\n  alignment: 'right',\n  withDepth: true,\n  compact: false,\n};\n\nexport const DSToolbarV2Schema = {\n  ...globalAttributesPropTypes,\n  alignment: PropTypes.oneOf(['right', 'left'])\n    .description('Whether to align the content left or right')\n    .defaultValue('right'),\n  withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),\n  compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper'),\n};\n\nexport const DSToolbarItemV2Schema = {\n  ...globalAttributesPropTypes,\n  render: PropTypes.func.isRequired.description('render function').defaultValue(() => {}),\n  isFirstItem: PropTypes.bool\n    .description(\n      'If true the item will have tab index 0 to be the first element focusable by keyboard on the page load',\n    )\n    .defaultValue(false),\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAqD;AAyB9C,MAAM,mBAAmB;AAAA,EAC9B,QAAQ,MAAM;AAAA,EAAC;AAAA,EACf,aAAa;AACf;AAEO,MAAM,eAAe;AAAA,EAC1B,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AACX;AAEO,MAAM,oBAAoB;AAAA,EAC/B,GAAG;AAAA,EACH,WAAW,kCAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EACzC,YAAY,4CAA4C,EACxD,aAAa,OAAO;AAAA,EACvB,WAAW,kCAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,IAAI;AAAA,EACvG,SAAS,kCAAU,KAAK,YAAY,qDAAqD,EAAE,aAAa,KAAK;AAAA,EAC7G,UAAU,kCAAU,UAAU,CAAC,kCAAU,MAAM,kCAAU,MAAM,CAAC,EAAE,YAAY,oCAAoC;AACpH;AAEO,MAAM,wBAAwB;AAAA,EACnC,GAAG;AAAA,EACH,QAAQ,kCAAU,KAAK,WAAW,YAAY,iBAAiB,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EACtF,aAAa,kCAAU,KACpB;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AACvB;",
   "names": []
 }

package/dist/esm/DSToolbarItemV2.js

@@ -16,7 +16,7 @@ import { DSToolbarItemName } from "./DSToolbarDefinitions.js";
 const DSToolbarItemV2 = (props) => {
   const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);
   useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema, DSToolbarItemName);
-  const { render, isFirstItem } = propsWithDefaults;
+  const { render: ComponentRenderer, isFirstItem } = propsWithDefaults;
   const { id: providedId, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);
   const { registerReference, dndDraggingItem } = useContext(DSToolbarV2Context);
   const ref = useRef(null);
@@ -38,7 +38,7 @@ const DSToolbarItemV2 = (props) => {
       className: "ds-toolbar-item",
       ...handlers,
       ...restGlobals,
-      children: render({ innerRef: ref, tabIndex })
+      children: /* @__PURE__ */ jsx(ComponentRenderer, { innerRef: ref, tabIndex })
     }
   );
 };

package/dist/esm/DSToolbarItemV2.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarItemV2.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport {\n  describe,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context.js';\nimport { StyledToolbarItem } from './styled.js';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers.js';\nimport { defaultItemProps, DSToolbarItemV2Schema } from './react-desc-prop-types.js';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\nimport { DSToolbarItemName } from './DSToolbarDefinitions.js';\n\nconst DSToolbarItemV2: React.ComponentType<DSToolbarItemT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);\n\n  useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema, DSToolbarItemName);\n  const { render, isFirstItem } = propsWithDefaults;\n  const { id: providedId, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);\n  const { registerReference, dndDraggingItem } = useContext(DSToolbarV2Context);\n  const ref = useRef(null);\n  const toolbarItemId = useMemo(() => {\n    const id = providedId ?? `ds-toolbar-item-${uid()}`;\n    registerReference(id, ref);\n    return id;\n  }, [registerReference, ref, providedId]);\n\n  const tabIndex = useMemo(\n    () => (dndDraggingItem === toolbarItemId || (!dndDraggingItem && isFirstItem) ? 0 : -1),\n    [dndDraggingItem, isFirstItem, toolbarItemId],\n  );\n\n  const handlers = useToolbarItemHandlers(toolbarItemId);\n  return (\n    <StyledToolbarItem\n      id={toolbarItemId}\n      data-testid=\"ds-toolbar-item\"\n      className=\"ds-toolbar-item\"\n      {...handlers}\n      {...restGlobals}\n    >\n      {render({ innerRef: ref, tabIndex })}\n    </StyledToolbarItem>\n  );\n};\n\nDSToolbarItemV2.propTypes = DSToolbarItemV2Schema;\n\nDSToolbarItemV2.displayName = DSToolbarItemName;\nconst DSToolbarItemV2WithSchema = describe(DSToolbarItemV2).description('Toolbar Item');\nDSToolbarItemV2WithSchema.propTypes = DSToolbarItemV2Schema;\n\nexport { DSToolbarItemV2, DSToolbarItemV2WithSchema };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqCnB;AApCJ,SAAgB,YAAY,SAAS,cAAc;AACnD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW;AACpB,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB,6BAA6B;AAExD,SAAS,yBAAyB;AAElC,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,oBAAoB,6BAA6B,OAAO,gBAAgB;AAE9E,iCAA+B,mBAAmB,uBAAuB,iBAAiB;AAC1F,QAAM,EAAE,QAAQ,YAAY,IAAI;AAChC,QAAM,EAAE,IAAI,YAAY,GAAG,YAAY,IAAI,uBAAuB,iBAAiB;AACnF,QAAM,EAAE,mBAAmB,gBAAgB,IAAI,WAAW,kBAAkB;AAC5E,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,KAAK,cAAc,mBAAmB,IAAI;AAChD,sBAAkB,IAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAEvC,QAAM,WAAW;AAAA,IACf,MAAO,oBAAoB,iBAAkB,CAAC,mBAAmB,cAAe,IAAI;AAAA,IACpF,CAAC,iBAAiB,aAAa,aAAa;AAAA,EAC9C;AAEA,QAAM,WAAW,uBAAuB,aAAa;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,eAAY;AAAA,MACZ,WAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MAEH,iBAAO,EAAE,UAAU,KAAK,SAAS,CAAC;AAAA;AAAA,EACrC;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport {\n  describe,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context.js';\nimport { StyledToolbarItem } from './styled.js';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers.js';\nimport { defaultItemProps, DSToolbarItemV2Schema } from './react-desc-prop-types.js';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\nimport { DSToolbarItemName } from './DSToolbarDefinitions.js';\n\nconst DSToolbarItemV2: React.ComponentType<DSToolbarItemT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);\n\n  useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema, DSToolbarItemName);\n  const { render: ComponentRenderer, isFirstItem } = propsWithDefaults;\n  const { id: providedId, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);\n  const { registerReference, dndDraggingItem } = useContext(DSToolbarV2Context);\n  const ref = useRef<HTMLElement | null>(null);\n\n  const toolbarItemId = useMemo(() => {\n    const id = providedId ?? `ds-toolbar-item-${uid()}`;\n    registerReference(id, ref);\n    return id;\n  }, [registerReference, ref, providedId]);\n\n  const tabIndex = useMemo(\n    () => (dndDraggingItem === toolbarItemId || (!dndDraggingItem && isFirstItem) ? 0 : -1),\n    [dndDraggingItem, isFirstItem, toolbarItemId],\n  );\n\n  const handlers = useToolbarItemHandlers(toolbarItemId);\n  return (\n    <StyledToolbarItem\n      id={toolbarItemId}\n      data-testid=\"ds-toolbar-item\"\n      className=\"ds-toolbar-item\"\n      {...handlers}\n      {...restGlobals}\n    >\n      <ComponentRenderer innerRef={ref} tabIndex={tabIndex} />\n    </StyledToolbarItem>\n  );\n};\n\nDSToolbarItemV2.propTypes = DSToolbarItemV2Schema;\n\nDSToolbarItemV2.displayName = DSToolbarItemName;\nconst DSToolbarItemV2WithSchema = describe(DSToolbarItemV2).description('Toolbar Item');\nDSToolbarItemV2WithSchema.propTypes = DSToolbarItemV2Schema;\n\nexport { DSToolbarItemV2, DSToolbarItemV2WithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC6CjB;AA5CN,SAAgB,YAAY,SAAS,cAAc;AACnD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW;AACpB,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB,6BAA6B;AAExD,SAAS,yBAAyB;AAElC,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,oBAAoB,6BAA6B,OAAO,gBAAgB;AAE9E,iCAA+B,mBAAmB,uBAAuB,iBAAiB;AAC1F,QAAM,EAAE,QAAQ,mBAAmB,YAAY,IAAI;AACnD,QAAM,EAAE,IAAI,YAAY,GAAG,YAAY,IAAI,uBAAuB,iBAAiB;AACnF,QAAM,EAAE,mBAAmB,gBAAgB,IAAI,WAAW,kBAAkB;AAC5E,QAAM,MAAM,OAA2B,IAAI;AAE3C,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,KAAK,cAAc,mBAAmB,IAAI;AAChD,sBAAkB,IAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,KAAK,UAAU,CAAC;AAEvC,QAAM,WAAW;AAAA,IACf,MAAO,oBAAoB,iBAAkB,CAAC,mBAAmB,cAAe,IAAI;AAAA,IACpF,CAAC,iBAAiB,aAAa,aAAa;AAAA,EAC9C;AAEA,QAAM,WAAW,uBAAuB,aAAa;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,eAAY;AAAA,MACZ,WAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,8BAAC,qBAAkB,UAAU,KAAK,UAAoB;AAAA;AAAA,EACxD;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
   "names": []
 }

package/dist/esm/DSToolbarV2Context.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarV2Context.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { MutableRefObject } from 'react';\nimport { createContext } from 'react';\nimport type { DSToolbarItemT } from './react-desc-prop-types.js';\ninterface IDSToolbarV2Context {\n  registerReference: (uid: string, ref: MutableRefObject<DSToolbarItemT.RenderHTMLElementT>) => void;\n  itemReferences: Record<string, MutableRefObject<DSToolbarItemT.RenderHTMLElementT>>;\n  toolbarUid: string;\n  dndDraggingItem: string;\n  setDndDraggingItem: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n  registerReference: () => null,\n  itemReferences: {},\n  toolbarUid: '',\n  dndDraggingItem: '',\n  setDndDraggingItem: () => {},\n});\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,qBAAqB;AAUvB,MAAM,qBAAqB,cAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,oBAAoB,MAAM;AAAA,EAAC;AAC7B,CAAC;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { MutableRefObject } from 'react';\nimport { createContext } from 'react';\ninterface IDSToolbarV2Context {\n  registerReference: (uid: string, ref: MutableRefObject<HTMLElement | null>) => void;\n  itemReferences: Record<string, MutableRefObject<HTMLElement | null>>;\n  toolbarUid: string;\n  dndDraggingItem: string;\n  setDndDraggingItem: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n  registerReference: () => null,\n  itemReferences: {},\n  toolbarUid: '',\n  dndDraggingItem: '',\n  setDndDraggingItem: () => {},\n});\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,qBAAqB;AASvB,MAAM,qBAAqB,cAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,oBAAoB,MAAM;AAAA,EAAC;AAC7B,CAAC;",
   "names": []
 }

package/dist/esm/deprecated/ToolbarItem.js

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import React2, { useState } from "react";
 import PropTypes from "prop-types";
 import { useFocusGroupWithState } from "@elliemae/ds-shared";
-import { DSButtonV2 } from "@elliemae/ds-button";
+import { DSButtonV2 } from "@elliemae/ds-button-v2";
 import { PopperPositions as Position } from "@elliemae/ds-popper";
 const ToolbarItem = ({ icon, labelText, menu = void 0, containerProps = {}, ...otherProps }) => {
   const [ref, setRef] = useState(null);

package/dist/esm/deprecated/ToolbarItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/ToolbarItem.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable eslint-comments/no-unlimited-disable */\n/* eslint-disable */\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useFocusGroupWithState } from '@elliemae/ds-shared';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { PopperPositions as Position } from '@elliemae/ds-popper';\n\nconst ToolbarItem = ({ icon, labelText, menu = undefined, containerProps = {}, ...otherProps }) => {\n  const [ref, setRef] = useState(null);\n\n  useFocusGroupWithState(ref);\n  const btn = (\n    <DSButtonV2 {...otherProps} buttonType=\"icon\" innerRef={(r) => setRef(r)} labelText={labelText} {...containerProps}>\n      {icon}\n    </DSButtonV2>\n  );\n  if (menu) {\n    return React.cloneElement(menu, {\n      ...menu.props,\n      placement: Position.BOTTOM_END,\n      triggerComponent: btn,\n    });\n  }\n  return btn;\n};\n\nToolbarItem.displayName = 'ToolbarItem';\n\nToolbarItem.propTypes = {\n  icon: PropTypes.element,\n  labelText: PropTypes.string,\n};\n\nexport default ToolbarItem;\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable eslint-comments/no-unlimited-disable */\n/* eslint-disable */\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useFocusGroupWithState } from '@elliemae/ds-shared';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { PopperPositions as Position } from '@elliemae/ds-popper';\n\nconst ToolbarItem = ({ icon, labelText, menu = undefined, containerProps = {}, ...otherProps }) => {\n  const [ref, setRef] = useState(null);\n\n  useFocusGroupWithState(ref);\n  const btn = (\n    <DSButtonV2 {...otherProps} buttonType=\"icon\" innerRef={(r) => setRef(r)} labelText={labelText} {...containerProps}>\n      {icon}\n    </DSButtonV2>\n  );\n  if (menu) {\n    return React.cloneElement(menu, {\n      ...menu.props,\n      placement: Position.BOTTOM_END,\n      triggerComponent: btn,\n    });\n  }\n  return btn;\n};\n\nToolbarItem.displayName = 'ToolbarItem';\n\nToolbarItem.propTypes = {\n  icon: PropTypes.element,\n  labelText: PropTypes.string,\n};\n\nexport default ToolbarItem;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACenB;AAXJ,OAAOA,UAAS,gBAAgB;AAChC,OAAO,eAAe;AACtB,SAAS,8BAA8B;AACvC,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB,gBAAgB;AAE5C,MAAM,cAAc,CAAC,EAAE,MAAM,WAAW,OAAO,QAAW,iBAAiB,CAAC,GAAG,GAAG,WAAW,MAAM;AACjG,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,IAAI;AAEnC,yBAAuB,GAAG;AAC1B,QAAM,MACJ,oBAAC,cAAY,GAAG,YAAY,YAAW,QAAO,UAAU,CAAC,MAAM,OAAO,CAAC,GAAG,WAAuB,GAAG,gBACjG,gBACH;AAEF,MAAI,MAAM;AACR,WAAOA,OAAM,aAAa,MAAM;AAAA,MAC9B,GAAG,KAAK;AAAA,MACR,WAAW,SAAS;AAAA,MACpB,kBAAkB;AAAA,IACpB,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEA,YAAY,cAAc;AAE1B,YAAY,YAAY;AAAA,EACtB,MAAM,UAAU;AAAA,EAChB,WAAW,UAAU;AACvB;AAEA,IAAO,sBAAQ;",
   "names": ["React"]
 }

package/dist/esm/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSToolbarT {\n  export interface Props {\n    alignment?: 'left' | 'right';\n    withDepth?: boolean;\n    compact?: boolean;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n    children: React.Component<DSToolbarItemT.Props>;\n  }\n}\n\nexport declare namespace DSToolbarItemT {\n  export type RenderHTMLElementT =\n    | HTMLButtonElement\n    | HTMLInputElement\n    | HTMLTextAreaElement\n    | HTMLSelectElement\n    | HTMLOptionElement;\n  export interface Props {\n    render: (props: { innerRef: React.MutableRefObject<HTMLElement>; tabIndex: number }) => JSX.Element;\n    isFirstItem?: boolean;\n  }\n}\n\nexport const defaultItemProps = {\n  render: () => {},\n  isFirstItem: false,\n};\n\nexport const defaultProps = {\n  alignment: 'right',\n  withDepth: true,\n  compact: false,\n};\n\nexport const DSToolbarV2Schema = {\n  ...globalAttributesPropTypes,\n  alignment: PropTypes.oneOf(['right', 'left'])\n    .description('Whether to align the content left or right')\n    .defaultValue('right'),\n  withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),\n  compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper'),\n};\n\nexport const DSToolbarItemV2Schema = {\n  ...globalAttributesPropTypes,\n  render: PropTypes.func.isRequired.description('render function').defaultValue(() => {}),\n  isFirstItem: PropTypes.bool\n    .description(\n      'If true the item will have tab index 0 to be the first element focusable by keyboard on the page load',\n    )\n    .defaultValue(false),\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSToolbarT {\n  export interface Props {\n    alignment?: 'left' | 'right';\n    withDepth?: boolean;\n    compact?: boolean;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n    children: React.Component<DSToolbarItemT.Props>;\n  }\n}\n\nexport declare namespace DSToolbarItemT {\n  export type RenderHTMLElementT =\n    | HTMLButtonElement\n    | HTMLInputElement\n    | HTMLTextAreaElement\n    | HTMLSelectElement\n    | HTMLOptionElement;\n  export interface Props {\n    render: (props: { innerRef: React.MutableRefObject<HTMLElement | null>; tabIndex: number }) => JSX.Element;\n    isFirstItem?: boolean;\n  }\n}\n\nexport const defaultItemProps = {\n  render: () => {},\n  isFirstItem: false,\n};\n\nexport const defaultProps = {\n  alignment: 'right',\n  withDepth: true,\n  compact: false,\n};\n\nexport const DSToolbarV2Schema = {\n  ...globalAttributesPropTypes,\n  alignment: PropTypes.oneOf(['right', 'left'])\n    .description('Whether to align the content left or right')\n    .defaultValue('right'),\n  withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),\n  compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper'),\n};\n\nexport const DSToolbarItemV2Schema = {\n  ...globalAttributesPropTypes,\n  render: PropTypes.func.isRequired.description('render function').defaultValue(() => {}),\n  isFirstItem: PropTypes.bool\n    .description(\n      'If true the item will have tab index 0 to be the first element focusable by keyboard on the page load',\n    )\n    .defaultValue(false),\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,2BAA2B,iBAAiB;AAyB9C,MAAM,mBAAmB;AAAA,EAC9B,QAAQ,MAAM;AAAA,EAAC;AAAA,EACf,aAAa;AACf;AAEO,MAAM,eAAe;AAAA,EAC1B,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AACX;AAEO,MAAM,oBAAoB;AAAA,EAC/B,GAAG;AAAA,EACH,WAAW,UAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EACzC,YAAY,4CAA4C,EACxD,aAAa,OAAO;AAAA,EACvB,WAAW,UAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,IAAI;AAAA,EACvG,SAAS,UAAU,KAAK,YAAY,qDAAqD,EAAE,aAAa,KAAK;AAAA,EAC7G,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,CAAC,EAAE,YAAY,oCAAoC;AACpH;AAEO,MAAM,wBAAwB;AAAA,EACnC,GAAG;AAAA,EACH,QAAQ,UAAU,KAAK,WAAW,YAAY,iBAAiB,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EACtF,aAAa,UAAU,KACpB;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AACvB;",
   "names": []
 }

package/dist/types/DSToolbarV2Context.d.ts

@@ -1,8 +1,7 @@
 import type { MutableRefObject } from 'react';
-import type { DSToolbarItemT } from './react-desc-prop-types.js';
 interface IDSToolbarV2Context {
-    registerReference: (uid: string, ref: MutableRefObject<DSToolbarItemT.RenderHTMLElementT>) => void;
-    itemReferences: Record<string, MutableRefObject<DSToolbarItemT.RenderHTMLElementT>>;
+    registerReference: (uid: string, ref: MutableRefObject<HTMLElement | null>) => void;
+    itemReferences: Record<string, MutableRefObject<HTMLElement | null>>;
     toolbarUid: string;
     dndDraggingItem: string;
     setDndDraggingItem: React.Dispatch<React.SetStateAction<string>>;

package/dist/types/react-desc-prop-types.d.ts

@@ -12,7 +12,7 @@ export declare namespace DSToolbarItemT {
     type RenderHTMLElementT = HTMLButtonElement | HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLOptionElement;
     interface Props {
         render: (props: {
-            innerRef: React.MutableRefObject<HTMLElement>;
+            innerRef: React.MutableRefObject<HTMLElement | null>;
             tabIndex: number;
         }) => JSX.Element;
         isFirstItem?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-toolbar",
-  "version": "3.21.0-rc.2",
+  "version": "3.21.2-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Toolbar",
   "files": [
@@ -89,15 +89,16 @@
   "dependencies": {
     "prop-types": "~15.8.1",
     "uid": "2.0.1",
-    "@elliemae/ds-button": "3.21.0-rc.2",
-    "@elliemae/ds-classnames": "3.21.0-rc.2",
-    "@elliemae/ds-grid": "3.21.0-rc.2",
-    "@elliemae/ds-icons": "3.21.0-rc.2",
-    "@elliemae/ds-popper": "3.21.0-rc.2",
-    "@elliemae/ds-system": "3.21.0-rc.2",
-    "@elliemae/ds-props-helpers": "3.21.0-rc.2",
-    "@elliemae/ds-shared": "3.21.0-rc.2",
-    "@elliemae/ds-utilities": "3.21.0-rc.2"
+    "@elliemae/ds-button-v2": "3.21.2-rc.1",
+    "@elliemae/ds-button": "3.21.2-rc.1",
+    "@elliemae/ds-classnames": "3.21.2-rc.1",
+    "@elliemae/ds-grid": "3.21.2-rc.1",
+    "@elliemae/ds-popper": "3.21.2-rc.1",
+    "@elliemae/ds-props-helpers": "3.21.2-rc.1",
+    "@elliemae/ds-shared": "3.21.2-rc.1",
+    "@elliemae/ds-icons": "3.21.2-rc.1",
+    "@elliemae/ds-system": "3.21.2-rc.1",
+    "@elliemae/ds-utilities": "3.21.2-rc.1"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "~5.16.5",