@elliemae/ds-toolbar 1.54.0-rc.1 → 1.55.0-next.1

package/DSToolbarItemV2/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/DSToolbarItemV2",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../cjs/DSToolbarItemV2.js",
+  "module": "../esm/DSToolbarItemV2.js"
+}

package/DSToolbarSeparatorV2/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/DSToolbarSeparatorV2",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../cjs/DSToolbarSeparatorV2.js",
+  "module": "../esm/DSToolbarSeparatorV2.js"
+}

package/DSToolbarV2/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/DSToolbarV2",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../cjs/DSToolbarV2.js",
+  "module": "../esm/DSToolbarV2.js"
+}

package/DSToolbarV2Context/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/DSToolbarV2Context",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../cjs/DSToolbarV2Context.js",
+  "module": "../esm/DSToolbarV2Context.js"
+}

package/cjs/DSToolbarItemV2.js

@@ -0,0 +1,43 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _extends = require('@babel/runtime/helpers/extends');
+var React = require('react');
+var uid = require('uid');
+var DSToolbarV2Context = require('./DSToolbarV2Context.js');
+var styled = require('./styled.js');
+var useToolbarItemHandlers = require('./useToolbarItemHandlers.js');
+require('styled-components');
+require('@elliemae/ds-grid');
+require('@babel/runtime/helpers/toConsumableArray');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var DSToolbarItemV2 = function DSToolbarItemV2(_ref) {
+  var render = _ref.render;
+
+  var _useContext = React.useContext(DSToolbarV2Context.DSToolbarV2Context),
+      registerReference = _useContext.registerReference;
+
+  var ref = React.useRef(null);
+  var toolbarItemId = React.useMemo(function () {
+    var id = "ds-toolbar-item-".concat(uid.uid());
+    registerReference(id, ref);
+    return id;
+  }, [registerReference, ref]);
+  var handlers = useToolbarItemHandlers.useToolbarItemHandlers(toolbarItemId);
+  return /*#__PURE__*/React__default['default'].createElement(styled.StyledToolbarItem, _extends__default['default']({
+    id: toolbarItemId,
+    "data-testid": "ds-toolbar-item",
+    className: "ds-toolbar-item"
+  }, handlers), render({
+    innerRef: ref
+  }));
+};
+
+exports.DSToolbarItemV2 = DSToolbarItemV2;
+//# sourceMappingURL=DSToolbarItemV2.js.map

package/cjs/DSToolbarItemV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DSToolbarItemV2.js","sources":["../../src/DSToolbarItemV2.tsx"],"sourcesContent":["/* eslint-disable react/prop-types */\nimport React, { MutableRefObject, useContext, useMemo, useRef } from 'react';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\nimport { StyledToolbarItem } from './styled';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers';\n\ninterface ToolbarItemProps {\n  render: (props: { innerRef: MutableRefObject<HTMLElement> }) => JSX.Element;\n}\n\nexport const DSToolbarItemV2: React.ComponentType<ToolbarItemProps> = ({ render }) => {\n  const { registerReference } = useContext(DSToolbarV2Context);\n  const ref = useRef(null);\n\n  const toolbarItemId = useMemo(() => {\n    const id = `ds-toolbar-item-${uid()}`;\n    registerReference(id, ref);\n    return id;\n  }, [registerReference, ref]);\n\n  const handlers = useToolbarItemHandlers(toolbarItemId);\n\n  return (\n    <StyledToolbarItem id={toolbarItemId} data-testid=\"ds-toolbar-item\" className=\"ds-toolbar-item\" {...handlers}>\n      {render({ innerRef: ref })}\n    </StyledToolbarItem>\n  );\n};\n"],"names":["DSToolbarItemV2","render","useContext","DSToolbarV2Context","registerReference","ref","useRef","toolbarItemId","useMemo","id","uid","handlers","useToolbarItemHandlers","React","StyledToolbarItem","innerRef"],"mappings":";;;;;;;;;;;;;;;;;;;IAWaA,eAAsD,GAAG,SAAzDA,eAAyD,OAAgB;AAAA,MAAbC,MAAa,QAAbA,MAAa;;AACpF,oBAA8BC,gBAAU,CAACC,qCAAD,CAAxC;AAAA,MAAQC,iBAAR,eAAQA,iBAAR;;AACA,MAAMC,GAAG,GAAGC,YAAM,CAAC,IAAD,CAAlB;AAEA,MAAMC,aAAa,GAAGC,aAAO,CAAC,YAAM;AAClC,QAAMC,EAAE,6BAAsBC,OAAG,EAAzB,CAAR;AACAN,IAAAA,iBAAiB,CAACK,EAAD,EAAKJ,GAAL,CAAjB;AACA,WAAOI,EAAP;AACD,GAJ4B,EAI1B,CAACL,iBAAD,EAAoBC,GAApB,CAJ0B,CAA7B;AAMA,MAAMM,QAAQ,GAAGC,6CAAsB,CAACL,aAAD,CAAvC;AAEA,sBACEM,wCAACC,wBAAD;AAAmB,IAAA,EAAE,EAAEP,aAAvB;AAAsC,mBAAY,iBAAlD;AAAoE,IAAA,SAAS,EAAC;AAA9E,KAAoGI,QAApG,GACGV,MAAM,CAAC;AAAEc,IAAAA,QAAQ,EAAEV;AAAZ,GAAD,CADT,CADF;AAKD;;;;"}

package/cjs/DSToolbarSeparatorV2.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var styled = require('./styled.js');
+require('styled-components');
+require('@elliemae/ds-grid');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var DSToolbarSeparatorV2 = function DSToolbarSeparatorV2() {
+  return /*#__PURE__*/React__default['default'].createElement(styled.StyledSeparator, {
+    className: "ds-toolbar-separator"
+  });
+};
+
+exports.DSToolbarSeparatorV2 = DSToolbarSeparatorV2;
+//# sourceMappingURL=DSToolbarSeparatorV2.js.map

package/cjs/DSToolbarSeparatorV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DSToolbarSeparatorV2.js","sources":["../../src/DSToolbarSeparatorV2.tsx"],"sourcesContent":["import React from 'react';\nimport { StyledSeparator } from './styled';\n\nexport const DSToolbarSeparatorV2: React.ComponentType = () => <StyledSeparator className=\"ds-toolbar-separator\" />;\n"],"names":["DSToolbarSeparatorV2","React","StyledSeparator"],"mappings":";;;;;;;;;;;;;IAGaA,oBAAyC,GAAG,SAA5CA,oBAA4C;AAAA,sBAAMC,wCAACC,sBAAD;AAAiB,IAAA,SAAS,EAAC;AAA3B,IAAN;AAAA;;;;"}

package/cjs/DSToolbarV2.js

@@ -0,0 +1,81 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var React = require('react');
+var dsPropsHelpers = require('@elliemae/ds-props-helpers');
+var reactDesc = require('react-desc');
+var uid = require('uid');
+var DSToolbarV2Context = require('./DSToolbarV2Context.js');
+var props = require('./props.js');
+var styled = require('./styled.js');
+require('styled-components');
+require('@elliemae/ds-grid');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var DSToolbarV2 = function DSToolbarV2(props) {
+  var alignment = props.alignment,
+      withDepth = props.withDepth,
+      compact = props.compact,
+      innerRef = props.innerRef,
+      children = props.children;
+  dsPropsHelpers.useValidateTypescriptPropTypes(props, DSToolbarV2WithSchema.toTypescript());
+  var toolbarUid = React.useMemo(function () {
+    return "ds-toolbar-".concat(uid.uid());
+  }, []);
+
+  var _useState = React.useState({}),
+      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      itemReferences = _useState2[0],
+      setItemReferences = _useState2[1];
+
+  var registerReference = React.useCallback(function (itemId, ref) {
+    setItemReferences(function (prevItemReferences) {
+      return _objectSpread(_objectSpread({}, prevItemReferences), {}, _defineProperty__default['default']({}, itemId, ref));
+    });
+  }, [setItemReferences]);
+  return /*#__PURE__*/React__default['default'].createElement(DSToolbarV2Context.DSToolbarV2Context.Provider, {
+    value: {
+      toolbarUid: toolbarUid,
+      registerReference: registerReference,
+      itemReferences: itemReferences
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(styled.StyledToolbarWrapper, {
+    role: "toolbar",
+    "data-testid": "ds-toolbar-wrapper",
+    id: toolbarUid,
+    alignItems: "center",
+    justifyContent: alignment === 'left' ? 'flex-start' : 'flex-end',
+    withDepth: withDepth,
+    cols: React__default['default'].Children.map(children, function () {
+      return ['auto'];
+    }),
+    gutter: "xxs2",
+    compact: compact,
+    ref: innerRef
+  }, children));
+};
+
+DSToolbarV2.propTypes = props.DSToolbarV2Schema;
+DSToolbarV2.defaultProps = {
+  alignment: 'right',
+  withDepth: true,
+  compact: false
+};
+var DSToolbarV2WithSchema = reactDesc.describe(DSToolbarV2).description('Toolbar');
+DSToolbarV2WithSchema.propTypes = props.DSToolbarV2Schema;
+
+exports.DSToolbarV2 = DSToolbarV2;
+exports.DSToolbarV2WithSchema = DSToolbarV2WithSchema;
+//# sourceMappingURL=DSToolbarV2.js.map

package/cjs/DSToolbarV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DSToolbarV2.js","sources":["../../src/DSToolbarV2.tsx"],"sourcesContent":["/* eslint-disable react/prop-types */\nimport React, { useCallback, useMemo, useState } from 'react';\nimport { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { describe } from 'react-desc';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\nimport { DSToolbarV2Schema } from './props';\nimport { StyledToolbarWrapper } from './styled';\ninterface ToolbarProps {\n  alignment?: 'left' | 'right';\n  withDepth?: boolean;\n  compact?: boolean;\n  innerRef?: React.MutableRefObject<HTMLDivElement>;\n}\n\nconst DSToolbarV2: React.ComponentType<ToolbarProps> = (props) => {\n  const { alignment, withDepth, compact, innerRef, children } = props;\n\n  console.log('JSON', DSToolbarV2WithSchema.toJSON());\n  console.log('TYPESCRIPT', DSToolbarV2WithSchema.toTypescript());\n\n  useValidateTypescriptPropTypes(props, DSToolbarV2WithSchema.toTypescript());\n\n  const toolbarUid = useMemo(() => `ds-toolbar-${uid()}`, []);\n\n  const [itemReferences, setItemReferences] = useState({});\n\n  const registerReference = useCallback(\n    (itemId: string, ref: React.MutableRefObject<HTMLElement>) => {\n      setItemReferences((prevItemReferences) => ({ ...prevItemReferences, [itemId]: ref }));\n    },\n    [setItemReferences],\n  );\n\n  return (\n    <DSToolbarV2Context.Provider value={{ toolbarUid, registerReference, itemReferences }}>\n      <StyledToolbarWrapper\n        role=\"toolbar\"\n        data-testid=\"ds-toolbar-wrapper\"\n        id={toolbarUid}\n        alignItems=\"center\"\n        justifyContent={alignment === 'left' ? 'flex-start' : 'flex-end'}\n        withDepth={withDepth}\n        cols={React.Children.map(children, () => ['auto'])}\n        gutter=\"xxs2\"\n        compact={compact}\n        ref={innerRef}\n      >\n        {children}\n      </StyledToolbarWrapper>\n    </DSToolbarV2Context.Provider>\n  );\n};\n\nDSToolbarV2.propTypes = DSToolbarV2Schema;\nDSToolbarV2.defaultProps = {\n  alignment: 'right',\n  withDepth: true,\n  compact: false,\n};\nconst DSToolbarV2WithSchema = describe(DSToolbarV2).description('Toolbar');\nDSToolbarV2WithSchema.propTypes = DSToolbarV2Schema;\n\nexport { DSToolbarV2, DSToolbarV2WithSchema };\n"],"names":["DSToolbarV2","props","alignment","withDepth","compact","innerRef","children","useValidateTypescriptPropTypes","DSToolbarV2WithSchema","toTypescript","toolbarUid","useMemo","uid","useState","itemReferences","setItemReferences","registerReference","useCallback","itemId","ref","prevItemReferences","React","DSToolbarV2Context","StyledToolbarWrapper","Children","map","propTypes","DSToolbarV2Schema","defaultProps","describe","description"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;IAeMA,WAA8C,GAAG,SAAjDA,WAAiD,CAACC,KAAD,EAAW;AAChE,MAAQC,SAAR,GAA8DD,KAA9D,CAAQC,SAAR;AAAA,MAAmBC,SAAnB,GAA8DF,KAA9D,CAAmBE,SAAnB;AAAA,MAA8BC,OAA9B,GAA8DH,KAA9D,CAA8BG,OAA9B;AAAA,MAAuCC,QAAvC,GAA8DJ,KAA9D,CAAuCI,QAAvC;AAAA,MAAiDC,QAAjD,GAA8DL,KAA9D,CAAiDK,QAAjD;AAKAC,EAAAA,6CAA8B,CAACN,KAAD,EAAQO,qBAAqB,CAACC,YAAtB,EAAR,CAA9B;AAEA,MAAMC,UAAU,GAAGC,aAAO,CAAC;AAAA,gCAAoBC,OAAG,EAAvB;AAAA,GAAD,EAA8B,EAA9B,CAA1B;;AAEA,kBAA4CC,cAAQ,CAAC,EAAD,CAApD;AAAA;AAAA,MAAOC,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,MAAMC,iBAAiB,GAAGC,iBAAW,CACnC,UAACC,MAAD,EAAiBC,GAAjB,EAA8D;AAC5DJ,IAAAA,iBAAiB,CAAC,UAACK,kBAAD;AAAA,6CAA8BA,kBAA9B,+CAAmDF,MAAnD,EAA4DC,GAA5D;AAAA,KAAD,CAAjB;AACD,GAHkC,EAInC,CAACJ,iBAAD,CAJmC,CAArC;AAOA,sBACEM,wCAACC,qCAAD,CAAoB,QAApB;AAA6B,IAAA,KAAK,EAAE;AAAEZ,MAAAA,UAAU,EAAVA,UAAF;AAAcM,MAAAA,iBAAiB,EAAjBA,iBAAd;AAAiCF,MAAAA,cAAc,EAAdA;AAAjC;AAApC,kBACEO,wCAACE,2BAAD;AACE,IAAA,IAAI,EAAC,SADP;AAEE,mBAAY,oBAFd;AAGE,IAAA,EAAE,EAAEb,UAHN;AAIE,IAAA,UAAU,EAAC,QAJb;AAKE,IAAA,cAAc,EAAER,SAAS,KAAK,MAAd,GAAuB,YAAvB,GAAsC,UALxD;AAME,IAAA,SAAS,EAAEC,SANb;AAOE,IAAA,IAAI,EAAEkB,yBAAK,CAACG,QAAN,CAAeC,GAAf,CAAmBnB,QAAnB,EAA6B;AAAA,aAAM,CAAC,MAAD,CAAN;AAAA,KAA7B,CAPR;AAQE,IAAA,MAAM,EAAC,MART;AASE,IAAA,OAAO,EAAEF,OATX;AAUE,IAAA,GAAG,EAAEC;AAVP,KAYGC,QAZH,CADF,CADF;AAkBD;;AAEDN,WAAW,CAAC0B,SAAZ,GAAwBC,uBAAxB;AACA3B,WAAW,CAAC4B,YAAZ,GAA2B;AACzB1B,EAAAA,SAAS,EAAE,OADc;AAEzBC,EAAAA,SAAS,EAAE,IAFc;AAGzBC,EAAAA,OAAO,EAAE;AAHgB,CAA3B;IAKMI,qBAAqB,GAAGqB,kBAAQ,CAAC7B,WAAD,CAAR,CAAsB8B,WAAtB,CAAkC,SAAlC;AAC9BtB,qBAAqB,CAACkB,SAAtB,GAAkCC,uBAAlC;;;;;"}

package/cjs/DSToolbarV2Context.js

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+var DSToolbarV2Context = /*#__PURE__*/React.createContext({
+  registerReference: function registerReference() {
+    return null;
+  },
+  itemReferences: {},
+  toolbarUid: ''
+});
+
+exports.DSToolbarV2Context = DSToolbarV2Context;
+//# sourceMappingURL=DSToolbarV2Context.js.map

package/cjs/DSToolbarV2Context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DSToolbarV2Context.js","sources":["../../src/DSToolbarV2Context.tsx"],"sourcesContent":["import { createContext, MutableRefObject } from 'react';\n\ninterface IDSToolbarV2Context {\n  registerReference: (uid: string, ref: MutableRefObject<HTMLElement>) => void;\n  itemReferences: Record<string, MutableRefObject<HTMLElement>>;\n  toolbarUid: string;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n  registerReference: () => null,\n  itemReferences: {},\n  toolbarUid: '',\n});\n"],"names":["DSToolbarV2Context","createContext","registerReference","itemReferences","toolbarUid"],"mappings":";;;;;;IAQaA,kBAAkB,gBAAGC,mBAAa,CAAsB;AACnEC,EAAAA,iBAAiB,EAAE;AAAA,WAAM,IAAN;AAAA,GADgD;AAEnEC,EAAAA,cAAc,EAAE,EAFmD;AAGnEC,EAAAA,UAAU,EAAE;AAHuD,CAAtB;;;;"}

package/cjs/{DSToolbar.js → deprecated/DSToolbar.js}

@@ -10,10 +10,10 @@ var reactDesc = require('react-desc');
 var dsClassnames = require('@elliemae/ds-classnames');
 var FocusGroupProvider = require('@elliemae/ds-shared/FocusGroup/FocusGroupManager');
 var system = require('@elliemae/ds-utilities/system');
-var decorateToolbarChildren = require('./decorateToolbarChildren.js');
-var ToolbarItem = require('./ToolbarItem.js');
-var ToolbarGroup = require('./ToolbarGroup.js');
-var ToolbarDivider = require('./ToolbarDivider.js');
+var deprecated_decorateToolbarChildren = require('./decorateToolbarChildren.js');
+var deprecated_ToolbarItem = require('./ToolbarItem.js');
+var deprecated_ToolbarGroup = require('./ToolbarGroup.js');
+var deprecated_ToolbarDivider = require('./ToolbarDivider.js');
 require('@babel/runtime/helpers/slicedToArray');
 require('prop-types');
 require('@elliemae/ds-shared/FocusGroup');
@@ -74,7 +74,7 @@ var DSToolbar = function DSToolbar(_ref3) {
       size: size
     },
     innerRef: system.mergeRefs(innerRef, containerRef)
-  }), decorateToolbarChildren(children)));
+  }), deprecated_decorateToolbarChildren(children)));
 };
 
 var toolbarProps = {
@@ -90,9 +90,9 @@ DSToolbar.propTypes = toolbarProps;
 var ToolbarWithSchema = reactDesc.describe(DSToolbar);
 ToolbarWithSchema.propTypes = toolbarProps;
 
-exports.ToolbarItem = ToolbarItem;
-exports.ToolbarGroup = ToolbarGroup;
-exports.ToolbarDivider = ToolbarDivider;
+exports.ToolbarItem = deprecated_ToolbarItem;
+exports.ToolbarGroup = deprecated_ToolbarGroup;
+exports.ToolbarDivider = deprecated_ToolbarDivider;
 exports.DSToolbar = DSToolbar;
 exports.ToolbarWithSchema = ToolbarWithSchema;
 exports['default'] = DSToolbar;

package/cjs/deprecated/DSToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DSToolbar.js","sources":["../../../src/deprecated/DSToolbar.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport FocusGroupProvider from '@elliemae/ds-shared/FocusGroup/FocusGroupManager';\nimport { mergeRefs } from '@elliemae/ds-utilities/system';\nimport decorateToolbarChildren from './decorateToolbarChildren';\nimport Item from './ToolbarItem';\nimport ToolbarGroup from './ToolbarGroup';\nimport Divider from './ToolbarDivider';\n\nconst blockName = 'toolbar';\n\nconst ToolbarContainer = aggregatedClasses('div')(\n  blockName,\n  null,\n  ({ withDepth, alignment, size }) => ({\n    'without-depth': !withDepth,\n    [alignment]: !!alignment,\n    [size]: size,\n  }),\n);\n\nconst DSToolbar = ({\n  containerProps = {},\n  innerRef,\n  withDepth = true,\n  alignment = 'right', // left || right\n  autoFocusOnMount = true,\n  children = [],\n  size = 'normal',\n  ...otherProps\n}) => {\n  const containerRef = useRef(null);\n  return (\n    <FocusGroupProvider\n      autoFocusOnMount={autoFocusOnMount}\n      getContainer={() => containerRef.current}\n      keyBindings={{\n        Tab: 'next',\n      }}\n      orientation=\"horizontal\"\n    >\n      <ToolbarContainer\n        {...containerProps}\n        {...otherProps}\n        classProps={{ withDepth, alignment, size }}\n        innerRef={mergeRefs(innerRef, containerRef)}\n      >\n        {decorateToolbarChildren(children)}\n      </ToolbarContainer>\n    </FocusGroupProvider>\n  );\n};\n\nconst toolbarProps = {\n  containerProps: PropTypes.object.description(\n    'Set of Properties attached to the main container',\n  ),\n  withDepth: PropTypes.bool\n    .description('Shows a shadow rear the toolbar')\n    .defaultValue(true),\n  alignment: PropTypes.oneOf(['right', 'left'])\n    .description('Aligns the toolbar to the left or right')\n    .defaultValue('right'),\n  size: PropTypes.oneOf(['normal', 'compact'])\n    .description('Toolbar size')\n    .defaultValue('normal'),\n  autoFocusOnMount: PropTypes.bool\n    .description('Wheter to focus the component when it mounts or not')\n    .defaultValue(true),\n  children: PropTypes.oneOfType([\n    PropTypes.array,\n    PropTypes.func,\n    PropTypes.node,\n  ]).description('Toolbar items').isRequired,\n  innerRef: PropTypes.object.description(\n    'Ref to the Toolbar container element',\n  ),\n};\n\nDSToolbar.propTypes = toolbarProps;\n\nconst ToolbarWithSchema = describe(DSToolbar);\nToolbarWithSchema.propTypes = toolbarProps;\n\nexport {\n  DSToolbar,\n  Item as ToolbarItem,\n  ToolbarGroup,\n  Divider as ToolbarDivider,\n  ToolbarWithSchema,\n};\n\nexport default DSToolbar;\n"],"names":["blockName","ToolbarContainer","aggregatedClasses","withDepth","alignment","size","DSToolbar","containerProps","innerRef","autoFocusOnMount","children","otherProps","containerRef","useRef","React","FocusGroupProvider","current","Tab","mergeRefs","decorateToolbarChildren","toolbarProps","PropTypes","object","description","bool","defaultValue","oneOf","oneOfType","array","func","node","isRequired","propTypes","ToolbarWithSchema","describe"],"mappings":"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"}

package/cjs/deprecated/ToolbarDivider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarDivider.js","sources":["../../../src/deprecated/ToolbarDivider.tsx"],"sourcesContent":["import { aggregatedClasses } from '@elliemae/ds-classnames';\n\nconst blockName = 'toolbar';\n\nconst ToolbarDivider = aggregatedClasses('div')(blockName, 'divider');\n\nToolbarDivider.displayName = 'ToolbarDivider';\n\nexport default ToolbarDivider;\n"],"names":["blockName","ToolbarDivider","aggregatedClasses","displayName"],"mappings":";;;;AAEA,IAAMA,SAAS,GAAG,SAAlB;IAEMC,cAAc,GAAGC,8BAAiB,CAAC,KAAD,CAAjB,CAAyBF,SAAzB,EAAoC,SAApC;AAEvBC,cAAc,CAACE,WAAf,GAA6B,gBAA7B;;;;"}

package/cjs/{ToolbarGroup.js → deprecated/ToolbarGroup.js}

@@ -4,7 +4,7 @@ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var React = require('react');
 var PropTypes = require('prop-types');
 var dsClassnames = require('@elliemae/ds-classnames');
-var decorateToolbarChildren = require('./decorateToolbarChildren.js');
+var deprecated_decorateToolbarChildren = require('./decorateToolbarChildren.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -27,7 +27,7 @@ var ToolbarGroup = function ToolbarGroup(_ref3) {
     classProps: {
       space: space
     }
-  }, decorateToolbarChildren(children, {
+  }, deprecated_decorateToolbarChildren(children, {
     size: size
   }));
 };

package/cjs/deprecated/ToolbarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarGroup.js","sources":["../../../src/deprecated/ToolbarGroup.tsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport decorateToolbarChildren from './decorateToolbarChildren';\n\nconst blockName = 'toolbar-group';\n\nconst ToolbarGroupContainer = aggregatedClasses('div')(\n  blockName,\n  null,\n  ({ space }) => ({\n    [`space-${space}`]: !!space,\n  }),\n);\n\nconst ToolbarGroup = ({ children, size, space = 0 }) => (\n  <ToolbarGroupContainer classProps={{ space }}>\n    {decorateToolbarChildren(children, { size })}\n  </ToolbarGroupContainer>\n);\n\nToolbarGroup.propTypes = {\n  children: PropTypes.any,\n  size: PropTypes.number,\n  space: PropTypes.number,\n};\n\nexport default ToolbarGroup;\n"],"names":["blockName","ToolbarGroupContainer","aggregatedClasses","space","ToolbarGroup","children","size","React","decorateToolbarChildren","propTypes","PropTypes","any","number"],"mappings":";;;;;;;;;;;;;;AAKA,IAAMA,SAAS,GAAG,eAAlB;AAEA,IAAMC,qBAAqB,GAAGC,8BAAiB,CAAC,KAAD,CAAjB,CAC5BF,SAD4B,EAE5B,IAF4B,EAG5B;AAAA,MAAGG,KAAH,QAAGA,KAAH;AAAA,iEACYA,KADZ,GACsB,CAAC,CAACA,KADxB;AAAA,CAH4B,CAA9B;;IAQMC,YAAY,GAAG,SAAfA,YAAe;AAAA,MAAGC,QAAH,SAAGA,QAAH;AAAA,MAAaC,IAAb,SAAaA,IAAb;AAAA,0BAAmBH,KAAnB;AAAA,MAAmBA,KAAnB,4BAA2B,CAA3B;AAAA,sBACnBI,wCAAC,qBAAD;AAAuB,IAAA,UAAU,EAAE;AAAEJ,MAAAA,KAAK,EAALA;AAAF;AAAnC,KACGK,kCAAuB,CAACH,QAAD,EAAW;AAAEC,IAAAA,IAAI,EAAJA;AAAF,GAAX,CAD1B,CADmB;AAAA;;AAMrBF,YAAY,CAACK,SAAb,GAAyB;AACvBJ,EAAAA,QAAQ,EAAEK,6BAAS,CAACC,GADG;AAEvBL,EAAAA,IAAI,EAAEI,6BAAS,CAACE,MAFO;AAGvBT,EAAAA,KAAK,EAAEO,6BAAS,CAACE;AAHM,CAAzB;;;;"}

package/cjs/deprecated/ToolbarItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarItem.js","sources":["../../../src/deprecated/ToolbarItem.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { useFocusGroupWithState } from '@elliemae/ds-shared/FocusGroup';\nimport DSButton from '@elliemae/ds-button';\nimport { Position } from '@elliemae/ds-popper/positions';\n\nconst ToolbarItem = ({ icon, labelText, menu = undefined, ...otherProps }) => {\n  const [ref, setRef] = useState(null);\n\n  useFocusGroupWithState(ref);\n  const btn = (\n    <DSButton\n      {...otherProps}\n      buttonType=\"text\"\n      icon={icon}\n      innerRef={(r) => setRef(r)}\n      labelText={labelText}\n    />\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"],"names":["ToolbarItem","icon","labelText","menu","undefined","otherProps","useState","ref","setRef","useFocusGroupWithState","btn","React","DSButton","r","cloneElement","props","placement","Position","BOTTOM_END","triggerComponent","displayName","propTypes","PropTypes","element","string"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;IAMMA,WAAW,GAAG,SAAdA,WAAc,OAA0D;AAAA,MAAvDC,IAAuD,QAAvDA,IAAuD;AAAA,MAAjDC,SAAiD,QAAjDA,SAAiD;AAAA,uBAAtCC,IAAsC;AAAA,MAAtCA,IAAsC,0BAA/BC,SAA+B;AAAA,MAAjBC,UAAiB;;AAC5E,kBAAsBC,cAAQ,CAAC,IAAD,CAA9B;AAAA;AAAA,MAAOC,GAAP;AAAA,MAAYC,MAAZ;;AAEAC,EAAAA,iCAAsB,CAACF,GAAD,CAAtB;AACA,MAAMG,GAAG,gBACPC,wCAACC,4BAAD,mCACMP,UADN;AAEE,IAAA,UAAU,EAAC,MAFb;AAGE,IAAA,IAAI,EAAEJ,IAHR;AAIE,IAAA,QAAQ,EAAE,kBAACY,CAAD;AAAA,aAAOL,MAAM,CAACK,CAAD,CAAb;AAAA,KAJZ;AAKE,IAAA,SAAS,EAAEX;AALb,KADF;;AASA,MAAIC,IAAJ,EAAU;AACR,wBAAOQ,yBAAK,CAACG,YAAN,CAAmBX,IAAnB,kCACFA,IAAI,CAACY,KADH;AAELC,MAAAA,SAAS,EAAEC,kBAAQ,CAACC,UAFf;AAGLC,MAAAA,gBAAgB,EAAET;AAHb,OAAP;AAKD;;AACD,SAAOA,GAAP;AACD;;AAEDV,WAAW,CAACoB,WAAZ,GAA0B,aAA1B;AAEApB,WAAW,CAACqB,SAAZ,GAAwB;AACtBpB,EAAAA,IAAI,EAAEqB,6BAAS,CAACC,OADM;AAEtBrB,EAAAA,SAAS,EAAEoB,6BAAS,CAACE;AAFC,CAAxB;;;;"}

package/cjs/deprecated/decorateToolbarChildren.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"decorateToolbarChildren.js","sources":["../../../src/deprecated/decorateToolbarChildren.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nexport default (children, extraProps = {}) =>\n  React.Children.map(\n    children,\n    component =>\n      component\n        ? cloneElement(component, {\n            ...extraProps,\n            ...component.props,\n            className: `${component.props.className} toolbar-item`,\n          })\n        : component,\n    null,\n  );\n"],"names":["children","extraProps","React","Children","map","component","cloneElement","props","className"],"mappings":";;;;;;;;;;;;;AAEA,+BAAe,UAACA,QAAD;AAAA,MAAWC,UAAX,uEAAwB,EAAxB;AAAA,SACbC,yBAAK,CAACC,QAAN,CAAeC,GAAf,CACEJ,QADF,EAEE,UAAAK,SAAS;AAAA,WACPA,SAAS,gBACLC,kBAAY,CAACD,SAAD,gDACPJ,UADO,GAEPI,SAAS,CAACE,KAFH;AAGVC,MAAAA,SAAS,YAAKH,SAAS,CAACE,KAAV,CAAgBC,SAArB;AAHC,OADP,GAMLH,SAPG;AAAA,GAFX,EAUE,IAVF,CADa;AAAA,CAAf;;;;"}

package/cjs/deprecated/index.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var deprecated_DSToolbar = require('./DSToolbar.js');
+var deprecated_ToolbarItem = require('./ToolbarItem.js');
+var deprecated_ToolbarGroup = require('./ToolbarGroup.js');
+var deprecated_ToolbarDivider = require('./ToolbarDivider.js');
+require('@babel/runtime/helpers/extends');
+require('@babel/runtime/helpers/objectWithoutProperties');
+require('@babel/runtime/helpers/defineProperty');
+require('react');
+require('react-desc');
+require('@elliemae/ds-classnames');
+require('@elliemae/ds-shared/FocusGroup/FocusGroupManager');
+require('@elliemae/ds-utilities/system');
+require('./decorateToolbarChildren.js');
+require('@babel/runtime/helpers/slicedToArray');
+require('prop-types');
+require('@elliemae/ds-shared/FocusGroup');
+require('@elliemae/ds-button');
+require('@elliemae/ds-popper/positions');
+
+
+
+exports.DSToolbar = deprecated_DSToolbar.DSToolbar;
+exports.ToolbarWithSchema = deprecated_DSToolbar.ToolbarWithSchema;
+exports.default = deprecated_DSToolbar.DSToolbar;
+exports.ToolbarItem = deprecated_ToolbarItem;
+exports.ToolbarGroup = deprecated_ToolbarGroup;
+exports.ToolbarDivider = deprecated_ToolbarDivider;
+//# sourceMappingURL=index.js.map

package/cjs/deprecated/index.js.map

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

package/cjs/index.js

@@ -2,10 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var DSToolbar = require('./DSToolbar.js');
-var ToolbarItem = require('./ToolbarItem.js');
-var ToolbarGroup = require('./ToolbarGroup.js');
-var ToolbarDivider = require('./ToolbarDivider.js');
+var deprecated_DSToolbar = require('./deprecated/DSToolbar.js');
+var DSToolbarV2 = require('./DSToolbarV2.js');
+var DSToolbarItemV2 = require('./DSToolbarItemV2.js');
+var DSToolbarSeparatorV2 = require('./DSToolbarSeparatorV2.js');
+var deprecated_ToolbarItem = require('./deprecated/ToolbarItem.js');
+var deprecated_ToolbarGroup = require('./deprecated/ToolbarGroup.js');
+var deprecated_ToolbarDivider = require('./deprecated/ToolbarDivider.js');
 require('@babel/runtime/helpers/extends');
 require('@babel/runtime/helpers/objectWithoutProperties');
 require('@babel/runtime/helpers/defineProperty');
@@ -14,8 +17,17 @@ require('react-desc');
 require('@elliemae/ds-classnames');
 require('@elliemae/ds-shared/FocusGroup/FocusGroupManager');
 require('@elliemae/ds-utilities/system');
-require('./decorateToolbarChildren.js');
+require('./deprecated/decorateToolbarChildren.js');
 require('@babel/runtime/helpers/slicedToArray');
+require('@elliemae/ds-props-helpers');
+require('uid');
+require('./DSToolbarV2Context.js');
+require('./props.js');
+require('./styled.js');
+require('styled-components');
+require('@elliemae/ds-grid');
+require('./useToolbarItemHandlers.js');
+require('@babel/runtime/helpers/toConsumableArray');
 require('prop-types');
 require('@elliemae/ds-shared/FocusGroup');
 require('@elliemae/ds-button');
@@ -23,10 +35,14 @@ require('@elliemae/ds-popper/positions');
 
 
 
-exports.DSToolbar = DSToolbar.DSToolbar;
-exports.ToolbarWithSchema = DSToolbar.ToolbarWithSchema;
-exports.default = DSToolbar.DSToolbar;
-exports.ToolbarItem = ToolbarItem;
-exports.ToolbarGroup = ToolbarGroup;
-exports.ToolbarDivider = ToolbarDivider;
+exports.DSToolbar = deprecated_DSToolbar.DSToolbar;
+exports.ToolbarWithSchema = deprecated_DSToolbar.ToolbarWithSchema;
+exports.default = deprecated_DSToolbar.DSToolbar;
+exports.DSToolbarV2 = DSToolbarV2.DSToolbarV2;
+exports.DSToolbarV2WithSchema = DSToolbarV2.DSToolbarV2WithSchema;
+exports.DSToolbarItemV2 = DSToolbarItemV2.DSToolbarItemV2;
+exports.DSToolbarSeparatorV2 = DSToolbarSeparatorV2.DSToolbarSeparatorV2;
+exports.ToolbarItem = deprecated_ToolbarItem;
+exports.ToolbarGroup = deprecated_ToolbarGroup;
+exports.ToolbarDivider = deprecated_ToolbarDivider;
 //# sourceMappingURL=index.js.map

package/cjs/index.js.map

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

package/cjs/props.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var reactDesc = require('react-desc');
+
+var DSToolbarV2Schema = {
+  alignment: reactDesc.PropTypes.oneOf(['right', 'left']).description('Whether to align the content left or right').defaultValue('right'),
+  withDepth: reactDesc.PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),
+  compact: reactDesc.PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),
+  innerRef: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.func, reactDesc.PropTypes.object]).description('Reference to attach to the wrapper')
+};
+
+exports.DSToolbarV2Schema = DSToolbarV2Schema;
+//# sourceMappingURL=props.js.map

package/cjs/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","sources":["../../src/props.tsx"],"sourcesContent":["import { PropTypes } from 'react-desc';\n\nexport const DSToolbarV2Schema = {\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"],"names":["DSToolbarV2Schema","alignment","PropTypes","oneOf","description","defaultValue","withDepth","bool","compact","innerRef","oneOfType","func","object"],"mappings":";;;;;;IAEaA,iBAAiB,GAAG;AAC/BC,EAAAA,SAAS,EAAEC,mBAAS,CAACC,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,EACRC,WADQ,CACI,4CADJ,EAERC,YAFQ,CAEK,OAFL,CADoB;AAI/BC,EAAAA,SAAS,EAAEJ,mBAAS,CAACK,IAAV,CAAeH,WAAf,CAA2B,8CAA3B,EAA2EC,YAA3E,CAAwF,IAAxF,CAJoB;AAK/BG,EAAAA,OAAO,EAAEN,mBAAS,CAACK,IAAV,CAAeH,WAAf,CAA2B,qDAA3B,EAAkFC,YAAlF,CAA+F,KAA/F,CALsB;AAM/BI,EAAAA,QAAQ,EAAEP,mBAAS,CAACQ,SAAV,CAAoB,CAACR,mBAAS,CAACS,IAAX,EAAiBT,mBAAS,CAACU,MAA3B,CAApB,EAAwDR,WAAxD,CAAoE,oCAApE;AANqB;;;;"}

package/cjs/styled.js

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('styled-components');
+var Grid = require('@elliemae/ds-grid');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
+
+var StyledToolbarWrapper = /*#__PURE__*/styled__default['default'](Grid__default['default']).withConfig({
+  componentId: "sc-8ez8n4-0"
+})(["background-color:", ";min-height:", ";max-height:", ";padding:0 ", ";box-shadow:", ";"], function (props) {
+  return props.theme.colors.neutral['000'];
+}, function (props) {
+  return props.compact ? '28px' : '40px';
+}, function (props) {
+  return props.theme.space.xxl;
+}, function (props) {
+  return props.theme.space.xxs;
+}, function (props) {
+  return !props.withDepth ? 'none' : '0 1px 5px 0 rgb(0 0 0 / 13%), 0 2px 4px 0 rgb(0 0 0 / 20%)';
+});
+var StyledToolbarItem = /*#__PURE__*/styled__default['default'](Grid__default['default']).withConfig({
+  componentId: "sc-8ez8n4-1"
+})([""]);
+var StyledSeparator = /*#__PURE__*/styled__default['default'](Grid__default['default']).withConfig({
+  componentId: "sc-8ez8n4-2"
+})(["height:30px;width:1px;background-color:", ";"], function (props) {
+  return props.theme.colors.neutral[200];
+});
+
+exports.StyledSeparator = StyledSeparator;
+exports.StyledToolbarItem = StyledToolbarItem;
+exports.StyledToolbarWrapper = StyledToolbarWrapper;
+//# sourceMappingURL=styled.js.map

package/cjs/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sources":["../../src/styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport Grid from '@elliemae/ds-grid';\n\nexport const StyledToolbarWrapper = styled(Grid)`\n  background-color: ${(props) => props.theme.colors.neutral['000']};\n\n  min-height: ${(props) => (props.compact ? '28px' : '40px')};\n  max-height: ${(props) => props.theme.space.xxl};\n\n  padding: 0 ${(props) => props.theme.space.xxs};\n\n  box-shadow: ${(props) => (!props.withDepth ? 'none' : '0 1px 5px 0 rgb(0 0 0 / 13%), 0 2px 4px 0 rgb(0 0 0 / 20%)')};\n`;\n\nexport const StyledToolbarItem = styled(Grid)``;\n\nexport const StyledSeparator = styled(Grid)`\n  height: 30px;\n  width: 1px;\n  background-color: ${(props) => props.theme.colors.neutral[200]};\n`;\n"],"names":["StyledToolbarWrapper","styled","Grid","props","theme","colors","neutral","compact","space","xxl","xxs","withDepth","StyledToolbarItem","StyledSeparator"],"mappings":";;;;;;;;;;;;IAGaA,oBAAoB,gBAAGC,0BAAM,CAACC,wBAAD,CAAT;AAAA;AAAA,8FACX,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,KAA3B,CAAX;AAAA,CADW,EAGjB,UAACH,KAAD;AAAA,SAAYA,KAAK,CAACI,OAAN,GAAgB,MAAhB,GAAyB,MAArC;AAAA,CAHiB,EAIjB,UAACJ,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYI,KAAZ,CAAkBC,GAA7B;AAAA,CAJiB,EAMlB,UAACN,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYI,KAAZ,CAAkBE,GAA7B;AAAA,CANkB,EAQjB,UAACP,KAAD;AAAA,SAAY,CAACA,KAAK,CAACQ,SAAP,GAAmB,MAAnB,GAA4B,4DAAxC;AAAA,CARiB;IAWpBC,iBAAiB,gBAAGX,0BAAM,CAACC,wBAAD,CAAT;AAAA;AAAA;IAEjBW,eAAe,gBAAGZ,0BAAM,CAACC,wBAAD,CAAT;AAAA;AAAA,qDAGN,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,GAA3B,CAAX;AAAA,CAHM;;;;;;"}

package/cjs/useToolbarItemHandlers.js

@@ -0,0 +1,47 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
+var React = require('react');
+var DSToolbarV2Context = require('./DSToolbarV2Context.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
+
+var useToolbarItemHandlers = function useToolbarItemHandlers(toolbarItemId) {
+  var _useContext = React.useContext(DSToolbarV2Context.DSToolbarV2Context),
+      toolbarUid = _useContext.toolbarUid,
+      itemReferences = _useContext.itemReferences;
+
+  var onKeyDown = React.useCallback(function (e) {
+    var toolbarItems = _toConsumableArray__default['default'](document.querySelectorAll("#".concat(toolbarUid, " .ds-toolbar-item")));
+
+    var nextToolbarItemIndex = -1;
+
+    if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {
+      var toolbarItemIndex = toolbarItems.findIndex(function (domElem) {
+        return domElem.id === toolbarItemId;
+      });
+      nextToolbarItemIndex = toolbarItemIndex + (e.code === 'ArrowLeft' ? -1 : 1);
+    } else if (e.code === 'Home') {
+      nextToolbarItemIndex = 0;
+    } else if (e.code === 'End') {
+      nextToolbarItemIndex = toolbarItems.length - 1;
+    }
+
+    if (nextToolbarItemIndex >= 0 && nextToolbarItemIndex < toolbarItems.length) {
+      e.preventDefault();
+      e.stopPropagation();
+      var ref = itemReferences[toolbarItems[nextToolbarItemIndex].id];
+      if (ref.current) ref.current.focus();
+    }
+  }, [toolbarUid, toolbarItemId, itemReferences]);
+  return {
+    onKeyDown: onKeyDown
+  };
+};
+
+exports.useToolbarItemHandlers = useToolbarItemHandlers;
+//# sourceMappingURL=useToolbarItemHandlers.js.map

package/cjs/useToolbarItemHandlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useToolbarItemHandlers.js","sources":["../../src/useToolbarItemHandlers.tsx"],"sourcesContent":["import { useCallback, useContext } from 'react';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\n\nexport const useToolbarItemHandlers = (\n  toolbarItemId: string,\n): {\n  onKeyDown: React.KeyboardEventHandler;\n} => {\n  const { toolbarUid, itemReferences } = useContext(DSToolbarV2Context);\n\n  const onKeyDown: React.KeyboardEventHandler = useCallback(\n    (e) => {\n      const toolbarItems = [...document.querySelectorAll(`#${toolbarUid} .ds-toolbar-item`)];\n      let nextToolbarItemIndex = -1;\n\n      if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n        const toolbarItemIndex = toolbarItems.findIndex((domElem) => domElem.id === toolbarItemId);\n        nextToolbarItemIndex = toolbarItemIndex + (e.code === 'ArrowLeft' ? -1 : 1);\n      } else if (e.code === 'Home') {\n        nextToolbarItemIndex = 0;\n      } else if (e.code === 'End') {\n        nextToolbarItemIndex = toolbarItems.length - 1;\n      }\n\n      if (nextToolbarItemIndex >= 0 && nextToolbarItemIndex < toolbarItems.length) {\n        e.preventDefault();\n        e.stopPropagation();\n        const ref = itemReferences[toolbarItems[nextToolbarItemIndex].id];\n        if (ref.current) ref.current.focus();\n      }\n    },\n    [toolbarUid, toolbarItemId, itemReferences],\n  );\n\n  return { onKeyDown };\n};\n"],"names":["useToolbarItemHandlers","toolbarItemId","useContext","DSToolbarV2Context","toolbarUid","itemReferences","onKeyDown","useCallback","e","toolbarItems","document","querySelectorAll","nextToolbarItemIndex","includes","code","toolbarItemIndex","findIndex","domElem","id","length","preventDefault","stopPropagation","ref","current","focus"],"mappings":";;;;;;;;;;;;IAGaA,sBAAsB,GAAG,SAAzBA,sBAAyB,CACpCC,aADoC,EAIjC;AACH,oBAAuCC,gBAAU,CAACC,qCAAD,CAAjD;AAAA,MAAQC,UAAR,eAAQA,UAAR;AAAA,MAAoBC,cAApB,eAAoBA,cAApB;;AAEA,MAAMC,SAAqC,GAAGC,iBAAW,CACvD,UAACC,CAAD,EAAO;AACL,QAAMC,YAAY,0CAAOC,QAAQ,CAACC,gBAAT,YAA8BP,UAA9B,uBAAP,CAAlB;;AACA,QAAIQ,oBAAoB,GAAG,CAAC,CAA5B;;AAEA,QAAI,CAAC,WAAD,EAAc,YAAd,EAA4BC,QAA5B,CAAqCL,CAAC,CAACM,IAAvC,CAAJ,EAAkD;AAChD,UAAMC,gBAAgB,GAAGN,YAAY,CAACO,SAAb,CAAuB,UAACC,OAAD;AAAA,eAAaA,OAAO,CAACC,EAAR,KAAejB,aAA5B;AAAA,OAAvB,CAAzB;AACAW,MAAAA,oBAAoB,GAAGG,gBAAgB,IAAIP,CAAC,CAACM,IAAF,KAAW,WAAX,GAAyB,CAAC,CAA1B,GAA8B,CAAlC,CAAvC;AACD,KAHD,MAGO,IAAIN,CAAC,CAACM,IAAF,KAAW,MAAf,EAAuB;AAC5BF,MAAAA,oBAAoB,GAAG,CAAvB;AACD,KAFM,MAEA,IAAIJ,CAAC,CAACM,IAAF,KAAW,KAAf,EAAsB;AAC3BF,MAAAA,oBAAoB,GAAGH,YAAY,CAACU,MAAb,GAAsB,CAA7C;AACD;;AAED,QAAIP,oBAAoB,IAAI,CAAxB,IAA6BA,oBAAoB,GAAGH,YAAY,CAACU,MAArE,EAA6E;AAC3EX,MAAAA,CAAC,CAACY,cAAF;AACAZ,MAAAA,CAAC,CAACa,eAAF;AACA,UAAMC,GAAG,GAAGjB,cAAc,CAACI,YAAY,CAACG,oBAAD,CAAZ,CAAmCM,EAApC,CAA1B;AACA,UAAII,GAAG,CAACC,OAAR,EAAiBD,GAAG,CAACC,OAAJ,CAAYC,KAAZ;AAClB;AACF,GApBsD,EAqBvD,CAACpB,UAAD,EAAaH,aAAb,EAA4BI,cAA5B,CArBuD,CAAzD;AAwBA,SAAO;AAAEC,IAAAA,SAAS,EAATA;AAAF,GAAP;AACD;;;;"}

package/deprecated/DSToolbar/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/deprecated/DSToolbar",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../cjs/deprecated/DSToolbar.js",
+  "module": "../../esm/deprecated/DSToolbar.js"
+}

package/deprecated/ToolbarDivider/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/deprecated/ToolbarDivider",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../cjs/deprecated/ToolbarDivider.js",
+  "module": "../../esm/deprecated/ToolbarDivider.js"
+}

package/deprecated/ToolbarGroup/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/deprecated/ToolbarGroup",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../cjs/deprecated/ToolbarGroup.js",
+  "module": "../../esm/deprecated/ToolbarGroup.js"
+}

package/deprecated/ToolbarItem/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-toolbar/deprecated/ToolbarItem",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../cjs/deprecated/ToolbarItem.js",
+  "module": "../../esm/deprecated/ToolbarItem.js"
+}