@elliemae/ds-toolbar 3.3.1-rc.0 → 3.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/dist/esm/DSToolbarItemV2.js +0 -1
  2. package/dist/esm/DSToolbarItemV2.js.map +1 -1
  3. package/dist/esm/DSToolbarSeparatorV2.js +0 -1
  4. package/dist/esm/DSToolbarSeparatorV2.js.map +1 -1
  5. package/dist/esm/DSToolbarV2.js +0 -1
  6. package/dist/esm/DSToolbarV2.js.map +1 -1
  7. package/dist/esm/DSToolbarV2Context.js +0 -1
  8. package/dist/esm/DSToolbarV2Context.js.map +1 -1
  9. package/dist/esm/deprecated/DSToolbar.js +0 -1
  10. package/dist/esm/deprecated/DSToolbar.js.map +1 -1
  11. package/dist/esm/deprecated/ToolbarDivider.js +0 -1
  12. package/dist/esm/deprecated/ToolbarDivider.js.map +1 -1
  13. package/dist/esm/deprecated/ToolbarGroup.js +0 -1
  14. package/dist/esm/deprecated/ToolbarGroup.js.map +1 -1
  15. package/dist/esm/deprecated/ToolbarItem.js +0 -1
  16. package/dist/esm/deprecated/ToolbarItem.js.map +1 -1
  17. package/dist/esm/deprecated/decorateToolbarChildren.js +0 -1
  18. package/dist/esm/deprecated/decorateToolbarChildren.js.map +1 -1
  19. package/dist/esm/deprecated/hooks/useKeyboardNavigation.js +0 -1
  20. package/dist/esm/deprecated/hooks/useKeyboardNavigation.js.map +1 -1
  21. package/dist/esm/deprecated/index.js +0 -1
  22. package/dist/esm/deprecated/index.js.map +1 -1
  23. package/dist/esm/index.js +0 -1
  24. package/dist/esm/index.js.map +1 -1
  25. package/dist/esm/react-desc-prop-types.js +0 -1
  26. package/dist/esm/react-desc-prop-types.js.map +1 -1
  27. package/dist/esm/styled.js +0 -1
  28. package/dist/esm/styled.js.map +1 -1
  29. package/dist/esm/useToolbarItemHandlers.js +0 -1
  30. package/dist/esm/useToolbarItemHandlers.js.map +1 -1
  31. package/package.json +9 -9
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2, { useContext, useMemo, useRef } from "react";
4
3
  import {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarItemV2.tsx"],
4
4
  "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-utilities';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\nimport { StyledToolbarItem } from './styled';\nimport { useToolbarItemHandlers } from './useToolbarItemHandlers';\nimport { defaultItemProps, DSToolbarItemV2Schema } from './react-desc-prop-types';\nimport type { DSToolbarItemT } from './react-desc-prop-types';\nconst DSToolbarItemV2: React.ComponentType<DSToolbarItemT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultItemProps);\n\n useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarItemV2Schema);\n const { render, isFirstItem } = propsWithDefaults;\n const { id, ...restGlobals } = useGetGlobalAttributes(propsWithDefaults);\n const { registerReference, activeItem } = useContext(DSToolbarV2Context);\n const ref = useRef(null);\n const toolbarItemId = useMemo(() => {\n const id = `ds-toolbar-item-${uid()}`;\n registerReference(id, ref);\n return id;\n }, [registerReference, ref]);\n\n const tabIndex = useMemo(\n () => (activeItem === toolbarItemId || (!activeItem && isFirstItem) ? 0 : -1),\n [activeItem, 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 = 'DSToolbarItemV2';\nconst DSToolbarItemV2WithSchema = describe(DSToolbarItemV2).description('Toolbar Item');\nDSToolbarItemV2WithSchema.propTypes = DSToolbarItemV2Schema;\n\nexport { DSToolbarItemV2, DSToolbarItemV2WithSchema };\n"],
5
- "mappings": ";AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAEA,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,oBAAoB,6BAA6B,OAAO,gBAAgB;AAE9E,iCAA+B,mBAAmB,qBAAqB;AACvE,QAAM,EAAE,QAAQ,gBAAgB;AAChC,QAAM,EAAE,OAAO,gBAAgB,uBAAuB,iBAAiB;AACvE,QAAM,EAAE,mBAAmB,eAAe,WAAW,kBAAkB;AACvE,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,MAAK,mBAAmB,IAAI;AAClC,sBAAkB,KAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,GAAG,CAAC;AAE3B,QAAM,WAAW,QACf,MAAO,eAAe,iBAAkB,CAAC,cAAc,cAAe,IAAI,IAC1E,CAAC,YAAY,aAAa,aAAa,CACzC;AAEA,QAAM,WAAW,uBAAuB,aAAa;AACrD,SACE,qCAAC;AAAA,IACC,IAAI;AAAA,IACJ,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,KAEH,OAAO,EAAE,UAAU,KAAK,SAAS,CAAC,CACrC;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
5
+ "mappings": "AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAEA,MAAM,kBAA6D,CAAC,UAAU;AAC5E,QAAM,oBAAoB,6BAA6B,OAAO,gBAAgB;AAE9E,iCAA+B,mBAAmB,qBAAqB;AACvE,QAAM,EAAE,QAAQ,gBAAgB;AAChC,QAAM,EAAE,OAAO,gBAAgB,uBAAuB,iBAAiB;AACvE,QAAM,EAAE,mBAAmB,eAAe,WAAW,kBAAkB;AACvE,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,MAAK,mBAAmB,IAAI;AAClC,sBAAkB,KAAI,GAAG;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,mBAAmB,GAAG,CAAC;AAE3B,QAAM,WAAW,QACf,MAAO,eAAe,iBAAkB,CAAC,cAAc,cAAe,IAAI,IAC1E,CAAC,YAAY,aAAa,aAAa,CACzC;AAEA,QAAM,WAAW,uBAAuB,aAAa;AACrD,SACE,qCAAC;AAAA,IACC,IAAI;AAAA,IACJ,eAAY;AAAA,IACZ,WAAU;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,KAEH,OAAO,EAAE,UAAU,KAAK,SAAS,CAAC,CACrC;AAEJ;AAEA,gBAAgB,YAAY;AAE5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe,EAAE,YAAY,cAAc;AACtF,0BAA0B,YAAY;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2 from "react";
4
3
  import { StyledSeparator } from "./styled";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarSeparatorV2.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledSeparator } from './styled';\n\nexport const DSToolbarSeparatorV2: React.ComponentType = () => <StyledSeparator className=\"ds-toolbar-separator\" />;\n"],
5
- "mappings": ";AAAA;ACAA;AACA;AAEO,MAAM,uBAA4C,MAAM,qCAAC;AAAA,EAAgB,WAAU;AAAA,CAAuB;",
5
+ "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,uBAA4C,MAAM,qCAAC;AAAA,EAAgB,WAAU;AAAA,CAAuB;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2, { useCallback, useMemo, useState } from "react";
4
3
  import {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarV2.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useCallback, useMemo, useState } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n useGetGlobalAttributes,\n} from '@elliemae/ds-utilities';\nimport { describe } from '@elliemae/ds-utilities';\nimport { uid } from 'uid';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\nimport { DSToolbarV2Schema, defaultProps } from './react-desc-prop-types';\nimport { StyledToolbarWrapper } from './styled';\nimport type { DSToolbarT, DSToolbarItemT } from './react-desc-prop-types';\n\nconst DSToolbarV2: React.ComponentType<DSToolbarT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n\n useValidateTypescriptPropTypes(propsWithDefaults, DSToolbarV2Schema);\n\n const { alignment, withDepth, compact, innerRef, children } = propsWithDefaults;\n\n const globalsProps = useGetGlobalAttributes(propsWithDefaults);\n\n const toolbarUid = useMemo(() => `ds-toolbar-${uid()}`, []);\n\n const [itemReferences, setItemReferences] = useState({});\n const [activeItem, setActiveItem] = useState('');\n\n const registerReference = useCallback(\n (itemId: string, ref: React.MutableRefObject<DSToolbarItemT.RenderHTMLElementT>) => {\n setItemReferences((prevItemReferences) => ({ ...prevItemReferences, [itemId]: ref }));\n },\n [setItemReferences],\n );\n\n const ctx = useMemo(\n () => ({ toolbarUid, registerReference, itemReferences, activeItem, setActiveItem }),\n [activeItem, itemReferences, registerReference, toolbarUid],\n );\n\n return (\n <DSToolbarV2Context.Provider value={ctx}>\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 gutter=\"xxs2\"\n compact={compact}\n ref={innerRef}\n {...globalsProps}\n >\n {children}\n </StyledToolbarWrapper>\n </DSToolbarV2Context.Provider>\n );\n};\n\nDSToolbarV2.propTypes = DSToolbarV2Schema;\n\nDSToolbarV2.displayName = 'DSToolbarV2';\nconst DSToolbarV2WithSchema = describe(DSToolbarV2).description('Toolbar');\nDSToolbarV2WithSchema.propTypes = DSToolbarV2Schema;\n\nexport { DSToolbarV2, DSToolbarV2WithSchema };\n"],
5
- "mappings": ";AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AAGA,MAAM,cAAqD,CAAC,UAAU;AACpE,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAE1E,iCAA+B,mBAAmB,iBAAiB;AAEnE,QAAM,EAAE,WAAW,WAAW,SAAS,UAAU,aAAa;AAE9D,QAAM,eAAe,uBAAuB,iBAAiB;AAE7D,QAAM,aAAa,QAAQ,MAAM,cAAc,IAAI,KAAK,CAAC,CAAC;AAE1D,QAAM,CAAC,gBAAgB,qBAAqB,SAAS,CAAC,CAAC;AACvD,QAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;AAE/C,QAAM,oBAAoB,YACxB,CAAC,QAAgB,QAAmE;AAClF,sBAAkB,CAAC,uBAAwB,GAAE,GAAG,oBAAoB,CAAC,SAAS,IAAI,EAAE;AAAA,EACtF,GACA,CAAC,iBAAiB,CACpB;AAEA,QAAM,MAAM,QACV,MAAO,GAAE,YAAY,mBAAmB,gBAAgB,YAAY,cAAc,IAClF,CAAC,YAAY,gBAAgB,mBAAmB,UAAU,CAC5D;AAEA,SACE,qCAAC,mBAAmB,UAAnB;AAAA,IAA4B,OAAO;AAAA,KAClC,qCAAC;AAAA,IACC,MAAK;AAAA,IACL,eAAY;AAAA,IACZ,IAAI;AAAA,IACJ,YAAW;AAAA,IACX,gBAAgB,cAAc,SAAS,eAAe;AAAA,IACtD;AAAA,IACA,QAAO;AAAA,IACP;AAAA,IACA,KAAK;AAAA,IACJ,GAAG;AAAA,KAEH,QACH,CACF;AAEJ;AAEA,YAAY,YAAY;AAExB,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW,EAAE,YAAY,SAAS;AACzE,sBAAsB,YAAY;",
5
+ "mappings": "AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AAGA,MAAM,cAAqD,CAAC,UAAU;AACpE,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAE1E,iCAA+B,mBAAmB,iBAAiB;AAEnE,QAAM,EAAE,WAAW,WAAW,SAAS,UAAU,aAAa;AAE9D,QAAM,eAAe,uBAAuB,iBAAiB;AAE7D,QAAM,aAAa,QAAQ,MAAM,cAAc,IAAI,KAAK,CAAC,CAAC;AAE1D,QAAM,CAAC,gBAAgB,qBAAqB,SAAS,CAAC,CAAC;AACvD,QAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;AAE/C,QAAM,oBAAoB,YACxB,CAAC,QAAgB,QAAmE;AAClF,sBAAkB,CAAC,uBAAwB,GAAE,GAAG,oBAAoB,CAAC,SAAS,IAAI,EAAE;AAAA,EACtF,GACA,CAAC,iBAAiB,CACpB;AAEA,QAAM,MAAM,QACV,MAAO,GAAE,YAAY,mBAAmB,gBAAgB,YAAY,cAAc,IAClF,CAAC,YAAY,gBAAgB,mBAAmB,UAAU,CAC5D;AAEA,SACE,qCAAC,mBAAmB,UAAnB;AAAA,IAA4B,OAAO;AAAA,KAClC,qCAAC;AAAA,IACC,MAAK;AAAA,IACL,eAAY;AAAA,IACZ,IAAI;AAAA,IACJ,YAAW;AAAA,IACX,gBAAgB,cAAc,SAAS,eAAe;AAAA,IACtD;AAAA,IACA,QAAO;AAAA,IACP;AAAA,IACA,KAAK;AAAA,IACJ,GAAG;AAAA,KAEH,QACH,CACF;AAEJ;AAEA,YAAY,YAAY;AAExB,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW,EAAE,YAAY,SAAS;AACzE,sBAAsB,YAAY;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { createContext } from "react";
4
3
  const DSToolbarV2Context = createContext({
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSToolbarV2Context.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext, MutableRefObject } from 'react';\nimport type { DSToolbarItemT } from './react-desc-prop-types';\ninterface IDSToolbarV2Context {\n registerReference: (uid: string, ref: MutableRefObject<DSToolbarItemT.RenderHTMLElementT>) => void;\n itemReferences: Record<string, MutableRefObject<DSToolbarItemT.RenderHTMLElementT>>;\n toolbarUid: string;\n activeItem: string;\n setActiveItem: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const DSToolbarV2Context = createContext<IDSToolbarV2Context>({\n registerReference: () => null,\n itemReferences: {},\n toolbarUid: '',\n activeItem: '',\n setActiveItem: () => {},\n});\n"],
5
- "mappings": ";AAAA;ACAA;AAUO,MAAM,qBAAqB,cAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe,MAAM;AAAA,EAAC;AACxB,CAAC;",
5
+ "mappings": "AAAA;ACAA;AAUO,MAAM,qBAAqB,cAAmC;AAAA,EACnE,mBAAmB,MAAM;AAAA,EACzB,gBAAgB,CAAC;AAAA,EACjB,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe,MAAM;AAAA,EAAC;AACxB,CAAC;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2, { useRef } from "react";
4
3
  import { aggregatedClasses } from "@elliemae/ds-classnames";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/DSToolbar.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { describe, PropTypes, mergeRefs } from '@elliemae/ds-utilities';\nimport decorateToolbarChildren from './decorateToolbarChildren';\nimport Item from './ToolbarItem';\nimport ToolbarGroup from './ToolbarGroup';\nimport Divider from './ToolbarDivider';\nimport { useKeyboardNavigation } from './hooks/useKeyboardNavigation';\n\nconst blockName = 'toolbar';\n\nconst ToolbarContainer = aggregatedClasses('div')(blockName, null, ({ withDepth, alignment, size }) => ({\n 'without-depth': !withDepth,\n [alignment]: !!alignment,\n [size]: size,\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<HTMLDivElement | null>(null);\n\n const { handleOnKeyDown } = useKeyboardNavigation({ containerRef, autoFocusOnMount });\n\n return (\n <ToolbarContainer\n {...containerProps}\n {...otherProps}\n classProps={{ withDepth, alignment, size }}\n innerRef={mergeRefs(innerRef, containerRef)}\n onKeyDown={handleOnKeyDown}\n >\n {decorateToolbarChildren(children)}\n </ToolbarContainer>\n );\n};\n\nconst toolbarProps = {\n containerProps: PropTypes.object.description('Set of Properties attached to the main container'),\n withDepth: PropTypes.bool.description('Shows a shadow rear the toolbar').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']).description('Toolbar size').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([PropTypes.array, PropTypes.func, PropTypes.node]).description('Toolbar items')\n .isRequired,\n innerRef: PropTypes.object.description('Ref to the Toolbar container element'),\n};\n\nDSToolbar.propTypes = toolbarProps;\nDSToolbar.displayName = 'DSToolbar';\nconst ToolbarWithSchema = describe(DSToolbar);\nToolbarWithSchema.propTypes = toolbarProps;\n\nexport { DSToolbar, Item as ToolbarItem, ToolbarGroup, Divider as ToolbarDivider, ToolbarWithSchema };\n\nexport default DSToolbar;\n"],
5
- "mappings": ";AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,mBAAmB,kBAAkB,KAAK,EAAE,WAAW,MAAM,CAAC,EAAE,WAAW,WAAW,WAAY;AAAA,EACtG,iBAAiB,CAAC;AAAA,EAClB,CAAC,YAAY,CAAC,CAAC;AAAA,EACf,CAAC,OAAO;AACV,EAAE;AAEF,MAAM,YAAY,CAAC;AAAA,EACjB,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,WAAW,CAAC;AAAA,EACZ,OAAO;AAAA,KACJ;AAAA,MACC;AACJ,QAAM,eAAe,OAA8B,IAAI;AAEvD,QAAM,EAAE,oBAAoB,sBAAsB,EAAE,cAAc,iBAAiB,CAAC;AAEpF,SACE,qCAAC;AAAA,IACE,GAAG;AAAA,IACH,GAAG;AAAA,IACJ,YAAY,EAAE,WAAW,WAAW,KAAK;AAAA,IACzC,UAAU,UAAU,UAAU,YAAY;AAAA,IAC1C,WAAW;AAAA,KAEV,wBAAwB,QAAQ,CACnC;AAEJ;AAEA,MAAM,eAAe;AAAA,EACnB,gBAAgB,UAAU,OAAO,YAAY,kDAAkD;AAAA,EAC/F,WAAW,UAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,IAAI;AAAA,EAC1F,WAAW,UAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EACzC,YAAY,yCAAyC,EACrD,aAAa,OAAO;AAAA,EACvB,MAAM,UAAU,MAAM,CAAC,UAAU,SAAS,CAAC,EAAE,YAAY,cAAc,EAAE,aAAa,QAAQ;AAAA,EAC9F,kBAAkB,UAAU,KACzB,YAAY,qDAAqD,EACjE,aAAa,IAAI;AAAA,EACpB,UAAU,UAAU,UAAU,CAAC,UAAU,OAAO,UAAU,MAAM,UAAU,IAAI,CAAC,EAAE,YAAY,eAAe,EACzG;AAAA,EACH,UAAU,UAAU,OAAO,YAAY,sCAAsC;AAC/E;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,oBAAoB,SAAS,SAAS;AAC5C,kBAAkB,YAAY;AAI9B,IAAO,oBAAQ;",
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,mBAAmB,kBAAkB,KAAK,EAAE,WAAW,MAAM,CAAC,EAAE,WAAW,WAAW,WAAY;AAAA,EACtG,iBAAiB,CAAC;AAAA,EAClB,CAAC,YAAY,CAAC,CAAC;AAAA,EACf,CAAC,OAAO;AACV,EAAE;AAEF,MAAM,YAAY,CAAC;AAAA,EACjB,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,WAAW,CAAC;AAAA,EACZ,OAAO;AAAA,KACJ;AAAA,MACC;AACJ,QAAM,eAAe,OAA8B,IAAI;AAEvD,QAAM,EAAE,oBAAoB,sBAAsB,EAAE,cAAc,iBAAiB,CAAC;AAEpF,SACE,qCAAC;AAAA,IACE,GAAG;AAAA,IACH,GAAG;AAAA,IACJ,YAAY,EAAE,WAAW,WAAW,KAAK;AAAA,IACzC,UAAU,UAAU,UAAU,YAAY;AAAA,IAC1C,WAAW;AAAA,KAEV,wBAAwB,QAAQ,CACnC;AAEJ;AAEA,MAAM,eAAe;AAAA,EACnB,gBAAgB,UAAU,OAAO,YAAY,kDAAkD;AAAA,EAC/F,WAAW,UAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,IAAI;AAAA,EAC1F,WAAW,UAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EACzC,YAAY,yCAAyC,EACrD,aAAa,OAAO;AAAA,EACvB,MAAM,UAAU,MAAM,CAAC,UAAU,SAAS,CAAC,EAAE,YAAY,cAAc,EAAE,aAAa,QAAQ;AAAA,EAC9F,kBAAkB,UAAU,KACzB,YAAY,qDAAqD,EACjE,aAAa,IAAI;AAAA,EACpB,UAAU,UAAU,UAAU,CAAC,UAAU,OAAO,UAAU,MAAM,UAAU,IAAI,CAAC,EAAE,YAAY,eAAe,EACzG;AAAA,EACH,UAAU,UAAU,OAAO,YAAY,sCAAsC;AAC/E;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,oBAAoB,SAAS,SAAS;AAC5C,kBAAkB,YAAY;AAI9B,IAAO,oBAAQ;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { aggregatedClasses } from "@elliemae/ds-classnames";
4
3
  const blockName = "toolbar";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/ToolbarDivider.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
- "mappings": ";AAAA;ACAA;AAEA,MAAM,YAAY;AAElB,MAAM,iBAAiB,kBAAkB,KAAK,EAAE,WAAW,SAAS;AAEpE,eAAe,cAAc;AAE7B,IAAO,yBAAQ;",
5
+ "mappings": "AAAA;ACAA;AAEA,MAAM,YAAY;AAElB,MAAM,iBAAiB,kBAAkB,KAAK,EAAE,WAAW,SAAS;AAEpE,eAAe,cAAc;AAE7B,IAAO,yBAAQ;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2 from "react";
4
3
  import PropTypes from "prop-types";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/ToolbarGroup.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
- "mappings": ";AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,wBAAwB,kBAAkB,KAAK,EACnD,WACA,MACA,CAAC,EAAE,YAAa;AAAA,EACd,CAAC,SAAS,UAAU,CAAC,CAAC;AACxB,EACF;AAEA,MAAM,eAAe,CAAC,EAAE,UAAU,MAAM,QAAQ,QAC9C,qCAAC;AAAA,EAAsB,YAAY,EAAE,MAAM;AAAA,GACxC,wBAAwB,UAAU,EAAE,KAAK,CAAC,CAC7C;AAGF,aAAa,YAAY;AAAA,EACvB,UAAU,UAAU;AAAA,EACpB,MAAM,UAAU;AAAA,EAChB,OAAO,UAAU;AACnB;AAEA,IAAO,uBAAQ;",
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,wBAAwB,kBAAkB,KAAK,EACnD,WACA,MACA,CAAC,EAAE,YAAa;AAAA,EACd,CAAC,SAAS,UAAU,CAAC,CAAC;AACxB,EACF;AAEA,MAAM,eAAe,CAAC,EAAE,UAAU,MAAM,QAAQ,QAC9C,qCAAC;AAAA,EAAsB,YAAY,EAAE,MAAM;AAAA,GACxC,wBAAwB,UAAU,EAAE,KAAK,CAAC,CAC7C;AAGF,aAAa,YAAY;AAAA,EACvB,UAAU,UAAU;AAAA,EACpB,MAAM,UAAU;AAAA,EAChB,OAAO,UAAU;AACnB;AAEA,IAAO,uBAAQ;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2, { useState } from "react";
4
3
  import PropTypes from "prop-types";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/ToolbarItem.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import 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"],
5
- "mappings": ";AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,cAAc,CAAC,EAAE,MAAM,WAAW,OAAO,QAAW,iBAAiB,CAAC,MAAM,iBAAiB;AACjG,QAAM,CAAC,KAAK,UAAU,SAAS,IAAI;AAEnC,yBAAuB,GAAG;AAC1B,QAAM,MACJ,qCAAC;AAAA,IAAY,GAAG;AAAA,IAAY,YAAW;AAAA,IAAO,UAAU,CAAC,MAAM,OAAO,CAAC;AAAA,IAAG;AAAA,IAAuB,GAAG;AAAA,KACjG,IACH;AAEF,MAAI,MAAM;AACR,WAAO,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;",
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,cAAc,CAAC,EAAE,MAAM,WAAW,OAAO,QAAW,iBAAiB,CAAC,MAAM,iBAAiB;AACjG,QAAM,CAAC,KAAK,UAAU,SAAS,IAAI;AAEnC,yBAAuB,GAAG;AAC1B,QAAM,MACJ,qCAAC;AAAA,IAAY,GAAG;AAAA,IAAY,YAAW;AAAA,IAAO,UAAU,CAAC,MAAM,OAAO,CAAC;AAAA,IAAG;AAAA,IAAuB,GAAG;AAAA,KACjG,IACH;AAEF,MAAI,MAAM;AACR,WAAO,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;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import React2, { cloneElement } from "react";
4
3
  var decorateToolbarChildren_default = (children, extraProps = {}) => React2.Children.map(children, (component) => component ? cloneElement(component, {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/decorateToolbarChildren.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
- "mappings": ";AAAA;ACAA;AAEA,IAAO,kCAAQ,CAAC,UAAU,aAAa,CAAC,MACtC,OAAM,SAAS,IACb,UACA,eACE,YACI,aAAa,WAAW;AAAA,EACtB,GAAG;AAAA,EACH,GAAG,UAAU;AAAA,EACb,WAAW,GAAG,UAAU,MAAM;AAChC,CAAC,IACD,WACN,IACF;",
5
+ "mappings": "AAAA;ACAA;AAEA,IAAO,kCAAQ,CAAC,UAAU,aAAa,CAAC,MACtC,OAAM,SAAS,IACb,UACA,eACE,YACI,aAAa,WAAW;AAAA,EACtB,GAAG;AAAA,EACH,GAAG,UAAU;AAAA,EACb,WAAW,GAAG,UAAU,MAAM;AAChC,CAAC,IACD,WACN,IACF;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { useRef, useEffect, useCallback } from "react";
4
3
  const useKeyboardNavigation = ({ containerRef, autoFocusOnMount }) => {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/deprecated/hooks/useKeyboardNavigation.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useEffect, useCallback } from 'react';\n\ninterface useKeyboardNavigationT {\n containerRef: React.MutableRefObject<HTMLDivElement | null>;\n autoFocusOnMount: boolean;\n}\n\n// Toolbar should not allow to use Tab/Shift+Tab to navigate between ToolbarItems.\n// Tab/Shift+Tab should be only used once to enter the whole controller.\n// Toolbars should be only navigable with Arrows to follow correct a11y.\n// https://www.w3.org/TR/wai-aria-practices/examples/toolbar/toolbar.html\n\nexport const useKeyboardNavigation = ({ containerRef, autoFocusOnMount }: useKeyboardNavigationT) => {\n const allChildrenButtonRef = useRef<NodeListOf<HTMLButtonElement> | null>(null);\n\n useEffect(() => {\n if (containerRef.current) {\n allChildrenButtonRef.current = containerRef.current.querySelectorAll('button');\n // allChildrenButtonRef.current.forEach((button, index) => {\n // if (index !== 0) {\n // button.setAttribute('tabindex', '-1');\n // }\n // });\n }\n\n if (autoFocusOnMount) {\n setTimeout(() => allChildrenButtonRef.current?.[0].focus());\n }\n\n // return () => {\n // allChildrenButtonRef.current?.forEach((button, index) => {\n // if (index !== 0) {\n // button.setAttribute('tabindex', '');\n // }\n // });\n // };\n }, [autoFocusOnMount]);\n\n const handleOnKeyDown = useCallback((e) => {\n if (allChildrenButtonRef.current) {\n const lastButton = allChildrenButtonRef.current[allChildrenButtonRef.current?.length - 1];\n const firstButton = allChildrenButtonRef.current[0];\n\n if (e.key === 'ArrowRight') {\n e.preventDefault();\n if (e.target !== lastButton) {\n e.target.nextSibling.focus();\n } else {\n firstButton.focus();\n }\n }\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n if (e.target !== firstButton) {\n e.target.previousSibling.focus();\n } else {\n lastButton.focus();\n }\n }\n }\n }, []);\n\n return {\n handleOnKeyDown,\n };\n};\n"],
5
- "mappings": ";AAAA;ACAA;AAYO,MAAM,wBAAwB,CAAC,EAAE,cAAc,uBAA+C;AACnG,QAAM,uBAAuB,OAA6C,IAAI;AAE9E,YAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,2BAAqB,UAAU,aAAa,QAAQ,iBAAiB,QAAQ;AAAA,IAM/E;AAEA,QAAI,kBAAkB;AACpB,iBAAW,MAAM,qBAAqB,UAAU,GAAG,MAAM,CAAC;AAAA,IAC5D;AAAA,EASF,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,kBAAkB,YAAY,CAAC,MAAM;AACzC,QAAI,qBAAqB,SAAS;AAChC,YAAM,aAAa,qBAAqB,QAAQ,qBAAqB,SAAS,SAAS;AACvF,YAAM,cAAc,qBAAqB,QAAQ;AAEjD,UAAI,EAAE,QAAQ,cAAc;AAC1B,UAAE,eAAe;AACjB,YAAI,EAAE,WAAW,YAAY;AAC3B,YAAE,OAAO,YAAY,MAAM;AAAA,QAC7B,OAAO;AACL,sBAAY,MAAM;AAAA,QACpB;AAAA,MACF;AACA,UAAI,EAAE,QAAQ,aAAa;AACzB,UAAE,eAAe;AACjB,YAAI,EAAE,WAAW,aAAa;AAC5B,YAAE,OAAO,gBAAgB,MAAM;AAAA,QACjC,OAAO;AACL,qBAAW,MAAM;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AAAA,IACL;AAAA,EACF;AACF;",
5
+ "mappings": "AAAA;ACAA;AAYO,MAAM,wBAAwB,CAAC,EAAE,cAAc,uBAA+C;AACnG,QAAM,uBAAuB,OAA6C,IAAI;AAE9E,YAAU,MAAM;AACd,QAAI,aAAa,SAAS;AACxB,2BAAqB,UAAU,aAAa,QAAQ,iBAAiB,QAAQ;AAAA,IAM/E;AAEA,QAAI,kBAAkB;AACpB,iBAAW,MAAM,qBAAqB,UAAU,GAAG,MAAM,CAAC;AAAA,IAC5D;AAAA,EASF,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,kBAAkB,YAAY,CAAC,MAAM;AACzC,QAAI,qBAAqB,SAAS;AAChC,YAAM,aAAa,qBAAqB,QAAQ,qBAAqB,SAAS,SAAS;AACvF,YAAM,cAAc,qBAAqB,QAAQ;AAEjD,UAAI,EAAE,QAAQ,cAAc;AAC1B,UAAE,eAAe;AACjB,YAAI,EAAE,WAAW,YAAY;AAC3B,YAAE,OAAO,YAAY,MAAM;AAAA,QAC7B,OAAO;AACL,sBAAY,MAAM;AAAA,QACpB;AAAA,MACF;AACA,UAAI,EAAE,QAAQ,aAAa;AACzB,UAAE,eAAe;AACjB,YAAI,EAAE,WAAW,aAAa;AAC5B,YAAE,OAAO,gBAAgB,MAAM;AAAA,QACjC,OAAO;AACL,qBAAW,MAAM;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AAAA,IACL;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  export * from "./DSToolbar";
4
3
  import { default as default2 } from "./DSToolbar";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/index.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/export */\nexport * from './DSToolbar';\n\nexport { default } from './DSToolbar';\n"],
5
- "mappings": ";AAAA;ACCA;AAEA;",
5
+ "mappings": "AAAA;ACCA;AAEA;",
6
6
  "names": []
7
7
  }
package/dist/esm/index.js CHANGED
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  export * from "./deprecated";
4
3
  import { default as default2 } from "./deprecated";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './deprecated';\nexport { default } from './deprecated';\nexport * from './DSToolbarV2';\nexport * from './DSToolbarItemV2';\nexport * from './DSToolbarSeparatorV2';\n"],
5
- "mappings": ";AAAA;ACAA;AACA;AACA;AACA;AACA;",
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { globalAttributesPropTypes, PropTypes } from "@elliemae/ds-utilities";
4
3
  const defaultItemProps = {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-utilities';\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"],
5
- "mappings": ";AAAA;ACAA;AAyBO,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,YACC,uGACF,EACC,aAAa,KAAK;AACvB;",
5
+ "mappings": "AAAA;ACAA;AAyBO,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,YACC,uGACF,EACC,aAAa,KAAK;AACvB;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { styled } from "@elliemae/ds-system";
4
3
  import Grid from "@elliemae/ds-grid";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\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' : '36px')};\n max-height: ${(props) => props.theme.space.xxl};\n\n padding: 0 ${(props) => props.theme.space.xxs};\n grid-auto-flow: column;\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"],
5
- "mappings": ";AAAA;ACAA;AACA;AAEO,MAAM,uBAAuB,OAAO,IAAI;AAAA,sBACzB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAE5C,CAAC,UAAW,MAAM,UAAU,SAAS;AAAA,gBACrC,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,eAE9B,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,gBAE5B,CAAC,UAAW,CAAC,MAAM,YAAY,SAAS;AAAA;AAGjD,MAAM,oBAAoB,OAAO,IAAI;AAErC,MAAM,kBAAkB,OAAO,IAAI;AAAA;AAAA;AAAA,sBAGpB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
5
+ "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,uBAAuB,OAAO,IAAI;AAAA,sBACzB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAE5C,CAAC,UAAW,MAAM,UAAU,SAAS;AAAA,gBACrC,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,eAE9B,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,gBAE5B,CAAC,UAAW,CAAC,MAAM,YAAY,SAAS;AAAA;AAGjD,MAAM,oBAAoB,OAAO,IAAI;AAErC,MAAM,kBAAkB,OAAO,IAAI;AAAA;AAAA;AAAA,sBAGpB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
6
6
  "names": []
7
7
  }
@@ -1,4 +1,3 @@
1
- "use strict";
2
1
  import * as React from "react";
3
2
  import { useCallback, useContext } from "react";
4
3
  import { DSToolbarV2Context } from "./DSToolbarV2Context";
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/useToolbarItemHandlers.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback, useContext } from 'react';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\n\nconst findInCircularList = (\n list: Element[],\n from: number,\n criteria: (item: Element) => boolean,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (criteria(list[i])) return i;\n }\n return from; // return same item\n};\n\nexport const useToolbarItemHandlers = (\n toolbarItemId: string,\n): {\n onKeyDown: React.KeyboardEventHandler;\n onFocus: React.FocusEventHandler;\n} => {\n const { toolbarUid, itemReferences, setActiveItem } = useContext(DSToolbarV2Context);\n\n const onFocus: React.FocusEventHandler = useCallback(() => {\n setActiveItem(toolbarItemId);\n }, [setActiveItem, toolbarItemId]);\n\n const onKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n const toolbarItems = [...document.querySelectorAll(`#${toolbarUid} .ds-toolbar-item`)];\n let nextToolbarItemIndex = -1;\n const toolbarItemIndex = toolbarItems.findIndex((domElem) => domElem.id === toolbarItemId);\n\n const criteria = (item: Element) => {\n const ref = itemReferences[item.id];\n\n return !ref.current.disabled;\n };\n\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n nextToolbarItemIndex = findInCircularList(\n toolbarItems,\n toolbarItemIndex,\n criteria,\n e.code === 'ArrowLeft' ? -1 : 1,\n );\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, onFocus };\n};\n"],
5
- "mappings": ";AAAA;ACAA;AACA;AAEA,MAAM,qBAAqB,CACzB,MACA,MACA,UACA,OAAO,MAEI;AACX,WACM,IAAK,QAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,IAAK,KAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,SAAS,KAAK,EAAE;AAAG,aAAO;AAAA,EAChC;AACA,SAAO;AACT;AAEO,MAAM,yBAAyB,CACpC,kBAIG;AACH,QAAM,EAAE,YAAY,gBAAgB,kBAAkB,WAAW,kBAAkB;AAEnF,QAAM,UAAmC,YAAY,MAAM;AACzD,kBAAc,aAAa;AAAA,EAC7B,GAAG,CAAC,eAAe,aAAa,CAAC;AAEjC,QAAM,YAAwC,YAC5C,CAAC,MAAM;AACL,UAAM,eAAe,CAAC,GAAG,SAAS,iBAAiB,IAAI,6BAA6B,CAAC;AACrF,QAAI,uBAAuB;AAC3B,UAAM,mBAAmB,aAAa,UAAU,CAAC,YAAY,QAAQ,OAAO,aAAa;AAEzF,UAAM,WAAW,CAAC,SAAkB;AAClC,YAAM,MAAM,eAAe,KAAK;AAEhC,aAAO,CAAC,IAAI,QAAQ;AAAA,IACtB;AAEA,QAAI,CAAC,aAAa,YAAY,EAAE,SAAS,EAAE,IAAI,GAAG;AAChD,6BAAuB,mBACrB,cACA,kBACA,UACA,EAAE,SAAS,cAAc,KAAK,CAChC;AAAA,IACF,WAAW,EAAE,SAAS,QAAQ;AAC5B,6BAAuB;AAAA,IACzB,WAAW,EAAE,SAAS,OAAO;AAC3B,6BAAuB,aAAa,SAAS;AAAA,IAC/C;AAEA,QAAI,wBAAwB,KAAK,uBAAuB,aAAa,QAAQ;AAC3E,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,MAAM,eAAe,aAAa,sBAAsB;AAC9D,UAAI,IAAI;AAAS,YAAI,QAAQ,MAAM;AAAA,IACrC;AAAA,EACF,GACA,CAAC,YAAY,eAAe,cAAc,CAC5C;AAEA,SAAO,EAAE,WAAW,QAAQ;AAC9B;",
5
+ "mappings": "AAAA;ACAA;AACA;AAEA,MAAM,qBAAqB,CACzB,MACA,MACA,UACA,OAAO,MAEI;AACX,WACM,IAAK,QAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,IAAK,KAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,SAAS,KAAK,EAAE;AAAG,aAAO;AAAA,EAChC;AACA,SAAO;AACT;AAEO,MAAM,yBAAyB,CACpC,kBAIG;AACH,QAAM,EAAE,YAAY,gBAAgB,kBAAkB,WAAW,kBAAkB;AAEnF,QAAM,UAAmC,YAAY,MAAM;AACzD,kBAAc,aAAa;AAAA,EAC7B,GAAG,CAAC,eAAe,aAAa,CAAC;AAEjC,QAAM,YAAwC,YAC5C,CAAC,MAAM;AACL,UAAM,eAAe,CAAC,GAAG,SAAS,iBAAiB,IAAI,6BAA6B,CAAC;AACrF,QAAI,uBAAuB;AAC3B,UAAM,mBAAmB,aAAa,UAAU,CAAC,YAAY,QAAQ,OAAO,aAAa;AAEzF,UAAM,WAAW,CAAC,SAAkB;AAClC,YAAM,MAAM,eAAe,KAAK;AAEhC,aAAO,CAAC,IAAI,QAAQ;AAAA,IACtB;AAEA,QAAI,CAAC,aAAa,YAAY,EAAE,SAAS,EAAE,IAAI,GAAG;AAChD,6BAAuB,mBACrB,cACA,kBACA,UACA,EAAE,SAAS,cAAc,KAAK,CAChC;AAAA,IACF,WAAW,EAAE,SAAS,QAAQ;AAC5B,6BAAuB;AAAA,IACzB,WAAW,EAAE,SAAS,OAAO;AAC3B,6BAAuB,aAAa,SAAS;AAAA,IAC/C;AAEA,QAAI,wBAAwB,KAAK,uBAAuB,aAAa,QAAQ;AAC3E,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,MAAM,eAAe,aAAa,sBAAsB;AAC9D,UAAI,IAAI;AAAS,YAAI,QAAQ,MAAM;AAAA,IACrC;AAAA,EACF,GACA,CAAC,YAAY,eAAe,cAAc,CAC5C;AAEA,SAAO,EAAE,WAAW,QAAQ;AAC9B;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-toolbar",
3
- "version": "3.3.1-rc.0",
3
+ "version": "3.3.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Toolbar",
6
6
  "files": [
@@ -87,14 +87,14 @@
87
87
  "indent": 4
88
88
  },
89
89
  "dependencies": {
90
- "@elliemae/ds-button": "3.3.1-rc.0",
91
- "@elliemae/ds-classnames": "3.3.1-rc.0",
92
- "@elliemae/ds-grid": "3.3.1-rc.0",
93
- "@elliemae/ds-icons": "3.3.1-rc.0",
94
- "@elliemae/ds-popper": "3.3.1-rc.0",
95
- "@elliemae/ds-shared": "3.3.1-rc.0",
96
- "@elliemae/ds-system": "3.3.1-rc.0",
97
- "@elliemae/ds-utilities": "3.3.1-rc.0",
90
+ "@elliemae/ds-button": "3.3.1",
91
+ "@elliemae/ds-classnames": "3.3.1",
92
+ "@elliemae/ds-grid": "3.3.1",
93
+ "@elliemae/ds-icons": "3.3.1",
94
+ "@elliemae/ds-popper": "3.3.1",
95
+ "@elliemae/ds-shared": "3.3.1",
96
+ "@elliemae/ds-system": "3.3.1",
97
+ "@elliemae/ds-utilities": "3.3.1",
98
98
  "prop-types": "~15.8.1",
99
99
  "uid": "2.0.0"
100
100
  },