@elliemae/ds-mini-toolbar 3.5.0-rc.4 → 3.5.0-rc.7
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.
- package/dist/cjs/Components/MiniToolbar.js +4 -1
- package/dist/cjs/Components/MiniToolbar.js.map +2 -2
- package/dist/cjs/Components/ToolbarShortcut.js +4 -1
- package/dist/cjs/Components/ToolbarShortcut.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/Button.js +4 -1
- package/dist/cjs/Components/outOfTheBox/Button.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/ComboBox.js +4 -1
- package/dist/cjs/Components/outOfTheBox/ComboBox.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/IconItem.js +4 -1
- package/dist/cjs/Components/outOfTheBox/IconItem.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/SearchBox.js +4 -1
- package/dist/cjs/Components/outOfTheBox/SearchBox.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/Separator.js +4 -1
- package/dist/cjs/Components/outOfTheBox/Separator.js.map +2 -2
- package/dist/cjs/Components/outOfTheBox/index.js +4 -1
- package/dist/cjs/Components/outOfTheBox/index.js.map +1 -1
- package/dist/cjs/hooks/useGenerateItems.js +82 -73
- package/dist/cjs/hooks/useGenerateItems.js.map +2 -2
- package/dist/cjs/index.d.js +4 -1
- package/dist/cjs/index.d.js.map +1 -1
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/propTypes.js +28 -9
- package/dist/cjs/propTypes.js.map +1 -1
- package/dist/cjs/styles.js +4 -1
- package/dist/cjs/styles.js.map +1 -1
- package/dist/esm/Components/MiniToolbar.js.map +2 -2
- package/dist/esm/Components/ToolbarShortcut.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/Button.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/ComboBox.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/IconItem.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/SearchBox.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/Separator.js.map +2 -2
- package/dist/esm/Components/outOfTheBox/index.js.map +1 -1
- package/dist/esm/hooks/useGenerateItems.js +78 -72
- package/dist/esm/hooks/useGenerateItems.js.map +2 -2
- package/dist/esm/index.d.js.map +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/propTypes.js +24 -8
- package/dist/esm/propTypes.js.map +1 -1
- package/dist/esm/styles.js.map +1 -1
- package/package.json +7 -7
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var MiniToolbar_exports = {};
|
|
23
26
|
__export(MiniToolbar_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/Components/MiniToolbar.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { StyledButton, Container } from '../styles';\nimport { miniToolbarProps } from '../propTypes';\nimport { useGenerateItems } from '../hooks/useGenerateItems';\nimport { MiniToolbarPropsT } from '../index.d';\n\nconst Elipsis = <MoreOptionsVert color={['brand-primary', '600']} size=\"m\" />;\n\nconst MiniToolbar = ({ items, overflowButtonProps }: MiniToolbarPropsT): React.ReactElement => {\n const [shortcutItems, dropdownMenuItems] = useGenerateItems(items);\n const [isDropdownMenuOpen, setIsDropdownMenuOpen] = useState<boolean>(false);\n\n const closeDropdownMenu = useCallback(() => setIsDropdownMenuOpen(false), []);\n const openDropdownMenu = useCallback(() => setIsDropdownMenuOpen(true), []);\n const openDropdownMenuKeyPress = useCallback((e) => {\n if (e.key === ' ') {\n setIsDropdownMenuOpen(true);\n }\n }, []);\n\n const { ariaLabel, style, buttonType = 'secondary' } = overflowButtonProps || {};\n\n return (\n <Container role=\"toolbar\" data-testid=\"ds-mini-toolbar\">\n {shortcutItems}\n <DSDropdownMenu\n data-testid=\"ds-mini-toolbar__dropdown-menu\"\n isOpen={isDropdownMenuOpen}\n onSelectMenuItem={closeDropdownMenu}\n onClickOutsideMenu={closeDropdownMenu}\n options={dropdownMenuItems}\n triggerComponent={\n <StyledButton\n aria-label={ariaLabel}\n data-testid=\"ds-mini-toolbar__elipsis\"\n size=\"m\"\n style={style}\n buttonType={buttonType}\n onClick={openDropdownMenu}\n onKeyPress={openDropdownMenuKeyPress}\n leftIcon={Elipsis}\n />\n }\n />\n </Container>\n );\n};\n\nMiniToolbar.propTypes = miniToolbarProps;\nMiniToolbar.displayName = 'MiniToolbar';\nconst MiniToolbarWithSchema = describe(MiniToolbar);\nMiniToolbarWithSchema.propTypes = miniToolbarProps;\n\nexport { MiniToolbar, MiniToolbarWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,0BAAyB;AACzB,6BAA+B;AAC/B,sBAAgC;AAChC,oBAAwC;AACxC,uBAAiC;AACjC,8BAAiC;AAGjC,MAAM,UAAU,6BAAAA,QAAA,cAAC;AAAA,EAAgB,OAAO,CAAC,iBAAiB,KAAK;AAAA,EAAG,MAAK;AAAA,CAAI;AAE3E,MAAM,cAAc,CAAC,EAAE,OAAO,oBAAoB,MAA6C;AAC7F,QAAM,CAAC,eAAe,iBAAiB,QAAI,0CAAiB,KAAK;AACjE,QAAM,CAAC,oBAAoB,qBAAqB,QAAI,uBAAkB,KAAK;AAE3E,QAAM,wBAAoB,0BAAY,MAAM,sBAAsB,KAAK,GAAG,CAAC,CAAC;AAC5E,QAAM,uBAAmB,0BAAY,MAAM,sBAAsB,IAAI,GAAG,CAAC,CAAC;AAC1E,QAAM,+BAA2B,0BAAY,CAAC,MAAM;AAClD,QAAI,EAAE,QAAQ,KAAK;AACjB,4BAAsB,IAAI;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,EAAE,WAAW,OAAO,aAAa,YAAY,IAAI,uBAAuB,CAAC;AAE/E,SACE,6BAAAA,QAAA,cAAC;AAAA,IAAU,MAAK;AAAA,IAAU,eAAY;AAAA,KACnC,eACD,6BAAAA,QAAA,cAAC;AAAA,IACC,eAAY;AAAA,IACZ,QAAQ;AAAA,IACR,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,SAAS;AAAA,IACT,kBACE,6BAAAA,QAAA,cAAC;AAAA,MACC,cAAY;AAAA,MACZ,eAAY;AAAA,MACZ,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,KACZ;AAAA,GAEJ,CACF;AAEJ;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,4BAAwB,8BAAS,WAAW;AAClD,sBAAsB,YAAY;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var ToolbarShortcut_exports = {};
|
|
23
26
|
__export(ToolbarShortcut_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/Components/ToolbarShortcut.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef, useEffect } from 'react';\nimport { Item } from '../styles';\nimport { ToolbarShortcutPropsT } from '../index.d';\n\nconst ToolbarShortcut = (props: ToolbarShortcutPropsT): React.ReactElement => {\n const { Component, shortcutProps, sharedProps, ContextualRegion, contextualRegionProps } = props;\n const leftRef = useRef<HTMLElement | null>(null);\n const rightRef = useRef<HTMLElement | null>(null);\n const timerLeft = useRef<ReturnType<typeof setInterval> | null>(null);\n const timerRight = useRef<ReturnType<typeof setInterval> | null>(null);\n\n const { position = 'left', isOpen = false } = contextualRegionProps || {};\n const { style } = shortcutProps || {};\n\n const mergedProps = {\n ...sharedProps,\n ...shortcutProps,\n };\n\n useEffect(() => {\n if (isOpen && leftRef.current) {\n timerLeft.current = setTimeout(() => leftRef.current.focus(), 200);\n }\n if (isOpen && rightRef.current) {\n timerRight.current = setTimeout(() => rightRef.current.focus(), 200);\n }\n\n return () => {\n clearTimeout(timerLeft.current);\n clearTimeout(timerRight.current);\n };\n }, [isOpen, leftRef, rightRef]);\n\n return (\n <>\n {isOpen && position === 'left' && (\n <Item>\n <ContextualRegion innerRef={leftRef} {...contextualRegionProps} />\n </Item>\n )}\n {Component && (\n <Item style={style}>\n <Component {...mergedProps} />\n </Item>\n )}\n {isOpen && position === 'right' && (\n <Item>\n <ContextualRegion innerRef={rightRef} {...contextualRegionProps} />\n </Item>\n )}\n </>\n );\n};\n\nexport { ToolbarShortcut };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,oBAAqB;AAGrB,MAAM,kBAAkB,CAAC,UAAqD;AAC5E,QAAM,EAAE,WAAW,eAAe,aAAa,kBAAkB,sBAAsB,IAAI;AAC3F,QAAM,cAAU,qBAA2B,IAAI;AAC/C,QAAM,eAAW,qBAA2B,IAAI;AAChD,QAAM,gBAAY,qBAA8C,IAAI;AACpE,QAAM,iBAAa,qBAA8C,IAAI;AAErE,QAAM,EAAE,WAAW,QAAQ,SAAS,MAAM,IAAI,yBAAyB,CAAC;AACxE,QAAM,EAAE,MAAM,IAAI,iBAAiB,CAAC;AAEpC,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,8BAAU,MAAM;AACd,QAAI,UAAU,QAAQ,SAAS;AAC7B,gBAAU,UAAU,WAAW,MAAM,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAAA,IACnE;AACA,QAAI,UAAU,SAAS,SAAS;AAC9B,iBAAW,UAAU,WAAW,MAAM,SAAS,QAAQ,MAAM,GAAG,GAAG;AAAA,IACrE;AAEA,WAAO,MAAM;AACX,mBAAa,UAAU,OAAO;AAC9B,mBAAa,WAAW,OAAO;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,QAAQ,SAAS,QAAQ,CAAC;AAE9B,SACE,6BAAAA,QAAA,2BAAAA,QAAA,gBACG,UAAU,aAAa,UACtB,6BAAAA,QAAA,cAAC,0BACC,6BAAAA,QAAA,cAAC;AAAA,IAAiB,UAAU;AAAA,IAAU,GAAG;AAAA,GAAuB,CAClE,GAED,aACC,6BAAAA,QAAA,cAAC;AAAA,IAAK;AAAA,KACJ,6BAAAA,QAAA,cAAC;AAAA,IAAW,GAAG;AAAA,GAAa,CAC9B,GAED,UAAU,aAAa,WACtB,6BAAAA,QAAA,cAAC,0BACC,6BAAAA,QAAA,cAAC;AAAA,IAAiB,UAAU;AAAA,IAAW,GAAG;AAAA,GAAuB,CACnE,CAEJ;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var Button_exports = {};
|
|
23
26
|
__export(Button_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/Button.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\n\nconst MiniToolbarButton = (props: Record<string, unknown>): React.ReactElement => (\n <DSButton {...props} aria-label={props.ariaLabel} data-testid=\"ds-mini-toolbar__shortcut\" />\n);\n\nexport { MiniToolbarButton };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,uBAAyB;AAEzB,MAAM,oBAAoB,CAAC,UACzB,6BAAAA,QAAA,cAAC;AAAA,EAAU,GAAG;AAAA,EAAO,cAAY,MAAM;AAAA,EAAW,eAAY;AAAA,CAA4B;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var ComboBox_exports = {};
|
|
23
26
|
__export(ComboBox_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/ComboBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { DSComboBox2 } from '@elliemae/ds-form';\n\nconst MiniToolbarComboBox = (props: Record<string, unknown>): React.ReactElement => <DSComboBox2 {...props} />;\n\nexport { MiniToolbarComboBox };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,qBAA4B;AAE5B,MAAM,sBAAsB,CAAC,UAAuD,6BAAAA,QAAA,cAAC;AAAA,EAAa,GAAG;AAAA,CAAO;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var IconItem_exports = {};
|
|
23
26
|
__export(IconItem_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/IconItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarIcon = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n const { Icon, size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n return (\n <StyledButton\n aria-label={ariaLabel}\n buttonType={buttonType}\n onClick={onClick}\n style={style}\n leftIcon={<Icon size={size} color={color} />}\n data-testid=\"ds-mini-toolbar__shortcut\"\n />\n );\n};\n\nexport { MiniToolbarIcon };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,oBAA6B;AAG7B,MAAM,kBAAkB,CAAC,UAAyD;AAChF,QAAM,EAAE,MAAM,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAEnF,SACE,6BAAAA,QAAA,cAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,6BAAAA,QAAA,cAAC;AAAA,MAAK;AAAA,MAAY;AAAA,KAAc;AAAA,IAC1C,eAAY;AAAA,GACd;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var SearchBox_exports = {};
|
|
23
26
|
__export(SearchBox_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/SearchBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { DSSearchBox } from '@elliemae/ds-form';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarSearchButton = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n const { size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n return (\n <StyledButton\n aria-label={ariaLabel}\n buttonType={buttonType}\n onClick={onClick}\n style={style}\n leftIcon={<Search size={size} color={color} />}\n data-testid=\"ds-mini-toolbar__shortcut\"\n />\n );\n};\n\nconst MiniToolbarSearchBox = (props: Record<string, unknown>): JSX.Element => (\n <DSSearchBox clearable showIcon={false} {...props} />\n);\n\nexport { MiniToolbarSearchButton, MiniToolbarSearchBox };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,sBAAuB;AACvB,qBAA4B;AAC5B,oBAA6B;AAG7B,MAAM,0BAA0B,CAAC,UAAyD;AACxF,QAAM,EAAE,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAE7E,SACE,6BAAAA,QAAA,cAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,6BAAAA,QAAA,cAAC;AAAA,MAAO;AAAA,MAAY;AAAA,KAAc;AAAA,IAC5C,eAAY;AAAA,GACd;AAEJ;AAEA,MAAM,uBAAuB,CAAC,UAC5B,6BAAAA,QAAA,cAAC;AAAA,EAAY,WAAS;AAAA,EAAC,UAAU;AAAA,EAAQ,GAAG;AAAA,CAAO;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var Separator_exports = {};
|
|
23
26
|
__export(Separator_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/Separator.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { Separator } from '../../styles';\n\nconst MiniToolbarSeparator = (): React.ReactElement => (\n <Separator data-testid=\"ds-mini-toolbar__separator\" />\n);\n\nexport { MiniToolbarSeparator };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,oBAA0B;AAE1B,MAAM,uBAAuB,MAC3B,6BAAAA,QAAA,cAAC;AAAA,EAAU,eAAY;AAAA,CAA6B;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var outOfTheBox_exports = {};
|
|
23
26
|
__export(outOfTheBox_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/Components/outOfTheBox/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export { MiniToolbarButton } from './Button';\nexport { MiniToolbarIcon } from './IconItem';\nexport { MiniToolbarSearchBox } from './SearchBox';\nexport { MiniToolbarSeparator } from './Separator';\nexport { MiniToolbarComboBox } from './ComboBox';\n\nexport const ICON_ITEM = 'ds-icon-item';\nexport const SEPARATOR = 'ds-separator';\nexport const BUTTON = 'ds-button';\nexport const SEARCH_BOX = 'ds-search-box';\nexport const COMBO_BOX = 'ds-combo-box';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAkC;AAClC,sBAAgC;AAChC,uBAAqC;AACrC,uBAAqC;AACrC,sBAAoC;AAE7B,MAAM,YAAY;AAClB,MAAM,YAAY;AAClB,MAAM,SAAS;AACf,MAAM,aAAa;AACnB,MAAM,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var useGenerateItems_exports = {};
|
|
23
26
|
__export(useGenerateItems_exports, {
|
|
@@ -33,82 +36,88 @@ var import_ToolbarShortcut = require("../Components/ToolbarShortcut");
|
|
|
33
36
|
var import_SearchBox = require("../Components/outOfTheBox/SearchBox");
|
|
34
37
|
const useGenerateItems = (items) => {
|
|
35
38
|
const instanceUID = (0, import_react.useMemo)(() => (0, import_uid.uid)(6), []);
|
|
36
|
-
const shortcutItems = (0, import_react.useMemo)(
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
if (
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
ContextualRegion = import_outOfTheBox.MiniToolbarSearchBox;
|
|
53
|
-
}
|
|
54
|
-
if (!ContextualRegion) {
|
|
55
|
-
ContextualRegion = contextualRegion;
|
|
56
|
-
}
|
|
57
|
-
if (!Component) {
|
|
58
|
-
Component = shortcutComponent;
|
|
59
|
-
}
|
|
60
|
-
return /* @__PURE__ */ import_react.default.createElement(import_ToolbarShortcut.ToolbarShortcut, {
|
|
61
|
-
key: `${instanceUID}-shortcut-${index}`,
|
|
62
|
-
Component,
|
|
63
|
-
shortcutProps,
|
|
64
|
-
sharedProps,
|
|
65
|
-
ContextualRegion,
|
|
66
|
-
contextualRegionProps
|
|
67
|
-
});
|
|
68
|
-
}), [instanceUID, items]);
|
|
69
|
-
const dropdownMenuItems = (0, import_react.useMemo)(() => items.map((item, index) => {
|
|
70
|
-
const { component, sharedProps, dropdownComponentProps } = item;
|
|
71
|
-
const dropdownItem = {};
|
|
72
|
-
const { Icon, color, label, onClick } = {
|
|
73
|
-
...sharedProps,
|
|
74
|
-
...dropdownComponentProps
|
|
75
|
-
};
|
|
76
|
-
if (component === import_outOfTheBox.SEPARATOR)
|
|
77
|
-
dropdownItem.type = "separator";
|
|
78
|
-
else {
|
|
79
|
-
dropdownItem.id = `${instanceUID}-dropdown-${index}`;
|
|
80
|
-
dropdownItem.onClick = () => onClick(item);
|
|
81
|
-
dropdownItem.label = label;
|
|
82
|
-
dropdownItem.onKeyDown = (e) => {
|
|
83
|
-
if (e.key === "Enter" || e.key === " ") {
|
|
84
|
-
onClick(item);
|
|
39
|
+
const shortcutItems = (0, import_react.useMemo)(
|
|
40
|
+
() => items.filter((item) => item.hasShortcut || item.component === import_outOfTheBox.SEARCH_BOX || item.contextualRegion).map((item, index) => {
|
|
41
|
+
const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } = item;
|
|
42
|
+
let Component;
|
|
43
|
+
let ContextualRegion;
|
|
44
|
+
if (component === import_outOfTheBox.SEPARATOR)
|
|
45
|
+
return /* @__PURE__ */ import_react.default.createElement(import_outOfTheBox.MiniToolbarSeparator, null);
|
|
46
|
+
if (component === import_outOfTheBox.BUTTON)
|
|
47
|
+
Component = import_outOfTheBox.MiniToolbarButton;
|
|
48
|
+
else if (component === import_outOfTheBox.ICON_ITEM)
|
|
49
|
+
Component = import_outOfTheBox.MiniToolbarIcon;
|
|
50
|
+
else if (component === import_outOfTheBox.COMBO_BOX)
|
|
51
|
+
Component = import_outOfTheBox.MiniToolbarComboBox;
|
|
52
|
+
else if (component === import_outOfTheBox.SEARCH_BOX) {
|
|
53
|
+
if (item.hasShortcut) {
|
|
54
|
+
Component = import_SearchBox.MiniToolbarSearchButton;
|
|
85
55
|
}
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
56
|
+
ContextualRegion = import_outOfTheBox.MiniToolbarSearchBox;
|
|
57
|
+
}
|
|
58
|
+
if (!ContextualRegion) {
|
|
59
|
+
ContextualRegion = contextualRegion;
|
|
60
|
+
}
|
|
61
|
+
if (!Component) {
|
|
62
|
+
Component = shortcutComponent;
|
|
63
|
+
}
|
|
64
|
+
return /* @__PURE__ */ import_react.default.createElement(import_ToolbarShortcut.ToolbarShortcut, {
|
|
65
|
+
key: `${instanceUID}-shortcut-${index}`,
|
|
66
|
+
Component,
|
|
67
|
+
shortcutProps,
|
|
68
|
+
sharedProps,
|
|
69
|
+
ContextualRegion,
|
|
70
|
+
contextualRegionProps
|
|
95
71
|
});
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
72
|
+
}),
|
|
73
|
+
[instanceUID, items]
|
|
74
|
+
);
|
|
75
|
+
const dropdownMenuItems = (0, import_react.useMemo)(
|
|
76
|
+
() => items.map((item, index) => {
|
|
77
|
+
const { component, sharedProps, dropdownComponentProps } = item;
|
|
78
|
+
const dropdownItem = {};
|
|
79
|
+
const { Icon, color, label, onClick } = {
|
|
80
|
+
...sharedProps,
|
|
81
|
+
...dropdownComponentProps
|
|
82
|
+
};
|
|
83
|
+
if (component === import_outOfTheBox.SEPARATOR)
|
|
84
|
+
dropdownItem.type = "separator";
|
|
85
|
+
else {
|
|
86
|
+
dropdownItem.id = `${instanceUID}-dropdown-${index}`;
|
|
87
|
+
dropdownItem.onClick = () => onClick(item);
|
|
88
|
+
dropdownItem.label = label;
|
|
89
|
+
dropdownItem.onKeyDown = (e) => {
|
|
90
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
91
|
+
onClick(item);
|
|
105
92
|
}
|
|
106
93
|
};
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
94
|
+
}
|
|
95
|
+
if (component === import_outOfTheBox.ICON_ITEM) {
|
|
96
|
+
dropdownItem.leftAddon = /* @__PURE__ */ import_react.default.createElement(Icon, {
|
|
97
|
+
color
|
|
98
|
+
});
|
|
99
|
+
} else if (component === import_outOfTheBox.SEARCH_BOX) {
|
|
100
|
+
dropdownItem.leftAddon = /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Search, {
|
|
101
|
+
color
|
|
102
|
+
});
|
|
103
|
+
} else if (component === import_outOfTheBox.COMBO_BOX) {
|
|
104
|
+
dropdownItem.type = "subMenu";
|
|
105
|
+
dropdownItem.label = label;
|
|
106
|
+
dropdownItem.subItems = sharedProps.options.map((option, index2) => {
|
|
107
|
+
option.id = `${instanceUID}-option-${index2}`;
|
|
108
|
+
option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);
|
|
109
|
+
option.onKeyDown = (e) => {
|
|
110
|
+
if (e.key === " " || e.key === "Enter") {
|
|
111
|
+
dropdownComponentProps.onSelectMenuItem(option);
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
return option;
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
return dropdownItem;
|
|
118
|
+
}),
|
|
119
|
+
[instanceUID, items]
|
|
120
|
+
);
|
|
112
121
|
return [shortcutItems, dropdownMenuItems];
|
|
113
122
|
};
|
|
114
123
|
//# sourceMappingURL=useGenerateItems.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useGenerateItems.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useMemo } from 'react';\nimport { uid } from 'uid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n ICON_ITEM,\n SEPARATOR,\n BUTTON,\n SEARCH_BOX,\n COMBO_BOX,\n MiniToolbarButton,\n MiniToolbarSeparator,\n MiniToolbarSearchBox,\n MiniToolbarIcon,\n MiniToolbarComboBox,\n} from '../Components/outOfTheBox';\nimport { ToolbarShortcut } from '../Components/ToolbarShortcut';\nimport { MiniToolbarSearchButton } from '../Components/outOfTheBox/SearchBox';\nimport { GeneratedDropdownItemT, MiniToolbarItemT } from '../index.d';\n\nconst useGenerateItems = (items: MiniToolbarItemT[]): [React.ReactElement[], GeneratedDropdownItemT[]] => {\n const instanceUID = useMemo(() => uid(6), []);\n\n const shortcutItems = useMemo(\n () =>\n items\n .filter((item) => item.hasShortcut || item.component === SEARCH_BOX || item.contextualRegion)\n .map((item, index) => {\n const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } =\n item;\n\n let Component;\n let ContextualRegion;\n\n if (component === SEPARATOR) return <MiniToolbarSeparator />;\n if (component === BUTTON) Component = MiniToolbarButton;\n else if (component === ICON_ITEM) Component = MiniToolbarIcon;\n else if (component === COMBO_BOX) Component = MiniToolbarComboBox;\n else if (component === SEARCH_BOX) {\n if (item.hasShortcut) {\n Component = MiniToolbarSearchButton;\n }\n ContextualRegion = MiniToolbarSearchBox;\n }\n if (!ContextualRegion) {\n ContextualRegion = contextualRegion;\n }\n if (!Component) {\n Component = shortcutComponent;\n }\n\n return (\n <ToolbarShortcut\n key={`${instanceUID}-shortcut-${index}`}\n Component={Component}\n shortcutProps={shortcutProps}\n sharedProps={sharedProps}\n ContextualRegion={ContextualRegion}\n contextualRegionProps={contextualRegionProps}\n />\n );\n }),\n [instanceUID, items],\n );\n\n const dropdownMenuItems = useMemo(\n () =>\n items.map((item, index) => {\n const { component, sharedProps, dropdownComponentProps } = item;\n const dropdownItem: GeneratedDropdownItemT = {};\n\n const { Icon, color, label, onClick } = {\n ...sharedProps,\n ...dropdownComponentProps,\n };\n\n if (component === SEPARATOR) dropdownItem.type = 'separator';\n else {\n dropdownItem.id = `${instanceUID}-dropdown-${index}`;\n dropdownItem.onClick = () => onClick(item);\n dropdownItem.label = label;\n dropdownItem.onKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n onClick(item);\n }\n };\n }\n\n if (component === ICON_ITEM) {\n dropdownItem.leftAddon = <Icon color={color} />;\n } else if (component === SEARCH_BOX) {\n dropdownItem.leftAddon = <Search color={color} />;\n } else if (component === COMBO_BOX) {\n dropdownItem.type = 'subMenu';\n dropdownItem.label = label;\n dropdownItem.subItems = sharedProps.options.map((option, index) => {\n option.id = `${instanceUID}-option-${index}`;\n option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);\n option.onKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n dropdownComponentProps.onSelectMenuItem(option);\n }\n };\n return option;\n });\n }\n\n return dropdownItem;\n }),\n [instanceUID, items],\n );\n\n return [shortcutItems, dropdownMenuItems];\n};\n\nexport { useGenerateItems };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA+B;AAC/B,iBAAoB;AACpB,sBAAuB;AACvB,yBAWO;AACP,6BAAgC;AAChC,uBAAwC;AAGxC,MAAM,mBAAmB,CAAC,UAAgF;AACxG,QAAM,kBAAc,sBAAQ,UAAM,gBAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,oBAAgB;AAAA,IACpB,MACE,MACG,OAAO,CAAC,SAAS,KAAK,eAAe,KAAK,cAAc,iCAAc,KAAK,gBAAgB,EAC3F,IAAI,CAAC,MAAM,UAAU;AACpB,YAAM,EAAE,WAAW,mBAAmB,eAAe,aAAa,kBAAkB,sBAAsB,IACxG;AAEF,UAAI;AACJ,UAAI;AAEJ,UAAI,cAAc;AAAW,eAAO,6BAAAA,QAAA,cAAC,6CAAqB;AAC1D,UAAI,cAAc;AAAQ,oBAAY;AAAA,eAC7B,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc,+BAAY;AACjC,YAAI,KAAK,aAAa;AACpB,sBAAY;AAAA,QACd;AACA,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,kBAAkB;AACrB,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,WAAW;AACd,oBAAY;AAAA,MACd;AAEA,aACE,6BAAAA,QAAA,cAAC;AAAA,QACC,KAAK,GAAG,wBAAwB;AAAA,QAChC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,OACF;AAAA,IAEJ,CAAC;AAAA,IACL,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,QAAM,wBAAoB;AAAA,IACxB,MACE,MAAM,IAAI,CAAC,MAAM,UAAU;AACzB,YAAM,EAAE,WAAW,aAAa,uBAAuB,IAAI;AAC3D,YAAM,eAAuC,CAAC;AAE9C,YAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,IAAI;AAAA,QACtC,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAEA,UAAI,cAAc;AAAW,qBAAa,OAAO;AAAA,WAC5C;AACH,qBAAa,KAAK,GAAG,wBAAwB;AAC7C,qBAAa,UAAU,MAAM,QAAQ,IAAI;AACzC,qBAAa,QAAQ;AACrB,qBAAa,YAAY,CAAC,MAA2B;AACnD,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,oBAAQ,IAAI;AAAA,UACd;AAAA,QACF;AAAA,MACF;AAEA,UAAI,cAAc,8BAAW;AAC3B,qBAAa,YAAY,6BAAAA,QAAA,cAAC;AAAA,UAAK;AAAA,SAAc;AAAA,MAC/C,WAAW,cAAc,+BAAY;AACnC,qBAAa,YAAY,6BAAAA,QAAA,cAAC;AAAA,UAAO;AAAA,SAAc;AAAA,MACjD,WAAW,cAAc,8BAAW;AAClC,qBAAa,OAAO;AACpB,qBAAa,QAAQ;AACrB,qBAAa,WAAW,YAAY,QAAQ,IAAI,CAAC,QAAQC,WAAU;AACjE,iBAAO,KAAK,GAAG,sBAAsBA;AACrC,iBAAO,UAAU,MAAM,uBAAuB,iBAAiB,MAAM;AACrE,iBAAO,YAAY,CAAC,MAA2B;AAC7C,gBAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,qCAAuB,iBAAiB,MAAM;AAAA,YAChD;AAAA,UACF;AACA,iBAAO;AAAA,QACT,CAAC;AAAA,MACH;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,IACH,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,SAAO,CAAC,eAAe,iBAAiB;AAC1C;",
|
|
6
|
+
"names": ["React", "index"]
|
|
7
7
|
}
|
package/dist/cjs/index.d.js
CHANGED
|
@@ -13,7 +13,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
13
13
|
}
|
|
14
14
|
return to;
|
|
15
15
|
};
|
|
16
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
16
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
17
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
18
|
+
mod
|
|
19
|
+
));
|
|
17
20
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
21
|
var index_d_exports = {};
|
|
19
22
|
module.exports = __toCommonJS(index_d_exports);
|
package/dist/cjs/index.d.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.d.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\n\ntype SvgIconSizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\ntype SvgIconColorType =\n | ['neutral', '900']\n | ['neutral', '500']\n | ['neutral', '0']\n | ['danger', '900']\n | ['warning', '600']\n | ['success', '900']\n | ['brand-primary', '600'];\n\ntype SharedProps = {\n options?: Record<string, unknown>[];\n onClick?: (item: MiniToolbarItemT) => void;\n Icon?: React.ComponentType<Record<string, unknown>>;\n label?: string;\n} & Record<string, unknown>;\n\ntype ShortcutProps = {\n style?: React.CSSProperties;\n} & Record<string, unknown>;\n\ntype ContextualRegionProps = {\n position?: 'left' | 'right';\n isOpen: boolean;\n} & Record<string, unknown>;\n\ntype DropdownComponentProps = {\n onClick?: (item: MiniToolbarItemT) => void;\n label?: string;\n Icon?: React.ComponentType<Record<string, unknown>>;\n color?: SvgIconColorType;\n onSelectMenuItem: (option: Record<string, unknown>) => void;\n} & Record<string, unknown>;\n\ntype OverflowButtonProps = {\n ariaLabel?: string;\n style?: React.CSSProperties;\n buttonType?: 'secondary' | 'text';\n};\ninterface DefaultIconItemProps {\n Icon: React.ComponentType<{ size: SvgIconSizeType; color: SvgIconColorType }>;\n size?: SvgIconSizeType;\n color?: SvgIconColorType;\n onClick?: (item: MiniToolbarItemT) => void;\n ariaLabel?: string;\n style?: React.CSSProperties;\n}\n\ntype MiniToolbarIconItemPropsT = DefaultIconItemProps & Record<string, unknown>;\n\ntype MiniToolbarButtonPropsT = { ariaLabel: string } & Record<string, unknown>;\n\ninterface MiniToolbarItemT {\n component: 'ds-button' | 'ds-icon-item' | 'ds-separator' | 'ds-search-box' | 'ds-combo-box' | React.ReactElement;\n hasShortcut?: boolean;\n shortcutComponent?: React.ReactElement;\n shortcutProps?: ShortcutProps;\n dropdownComponentProps?: DropdownComponentProps;\n sharedProps?: SharedProps;\n contextualRegion?: React.ReactElement;\n contextualRegionProps?: ContextualRegionProps;\n [key: string]: unknown;\n}\n\ninterface ToolbarShortcutPropsT {\n Component: React.ComponentType<Record<string, unknown>>;\n shortcutProps: ShortcutProps;\n sharedProps: SharedProps;\n ContextualRegion: React.ComponentType<Record<string, unknown>>;\n contextualRegionProps: ContextualRegionProps;\n}\n\ninterface MiniToolbarPropsT {\n items: MiniToolbarItemT[];\n overflowButtonProps?: OverflowButtonProps;\n}\n\ntype GeneratedDropdownItemT = {\n id?: string;\n label?: string;\n onClick?: (item: MiniToolbarItemT) => void;\n onKeyDown?: (e: React.KeyboardEvent) => void;\n leftAddon?: React.ReactElement;\n subItems?: Record<string, unknown>[];\n type?: 'separator' | 'subMenu';\n};\n\nexport {\n MiniToolbarIconItemPropsT,\n MiniToolbarButtonPropsT,\n MiniToolbarItemT,\n ToolbarShortcutPropsT,\n MiniToolbarPropsT,\n GeneratedDropdownItemT,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var src_exports = {};
|
|
23
26
|
__export(src_exports, {
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export { MiniToolbar, MiniToolbarWithSchema } from './Components/MiniToolbar';\nexport { ToolbarItemWithSchema } from './propTypes';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAmD;AACnD,uBAAsC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/propTypes.js
CHANGED
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var propTypes_exports = {};
|
|
23
26
|
__export(propTypes_exports, {
|
|
@@ -39,15 +42,29 @@ const toolbarItemProps = {
|
|
|
39
42
|
outOfTheBoxType,
|
|
40
43
|
import_ds_utilities.PropTypes.element
|
|
41
44
|
]).description("Main component").isRequired,
|
|
42
|
-
hasShortcut: import_ds_utilities.PropTypes.bool.description(
|
|
43
|
-
|
|
45
|
+
hasShortcut: import_ds_utilities.PropTypes.bool.description(
|
|
46
|
+
"Whether to include the component as a shortcut in the toolbar or not"
|
|
47
|
+
).defaultValue(false),
|
|
48
|
+
shortcutComponent: import_ds_utilities.PropTypes.element.description(
|
|
49
|
+
"Component to render as a shortcut in the toolbar"
|
|
50
|
+
),
|
|
44
51
|
shortcutProps: import_ds_utilities.PropTypes.object.description("Shortcut component props"),
|
|
45
|
-
dropdownComponentProps: import_ds_utilities.PropTypes.object.description(
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
52
|
+
dropdownComponentProps: import_ds_utilities.PropTypes.object.description(
|
|
53
|
+
"Dropdown component props"
|
|
54
|
+
),
|
|
55
|
+
sharedProps: import_ds_utilities.PropTypes.object.description(
|
|
56
|
+
"Props shared by shortcut component and dropdown component"
|
|
57
|
+
),
|
|
58
|
+
contextualRegion: import_ds_utilities.PropTypes.element.description(
|
|
59
|
+
"Component that can be rendered as an adjacent region to the shortcut component"
|
|
60
|
+
),
|
|
61
|
+
contextualRegionProps: import_ds_utilities.PropTypes.object.description(
|
|
62
|
+
"Contextual region component props"
|
|
63
|
+
)
|
|
49
64
|
};
|
|
50
|
-
const itemPropTypes = import_ds_utilities.PropTypes.shape(toolbarItemProps).description(
|
|
65
|
+
const itemPropTypes = import_ds_utilities.PropTypes.shape(toolbarItemProps).description(
|
|
66
|
+
"Items props"
|
|
67
|
+
);
|
|
51
68
|
const overflowButtonPropTypes = {
|
|
52
69
|
ariaLabel: import_ds_utilities.PropTypes.string,
|
|
53
70
|
buttonType: import_ds_utilities.PropTypes.oneOf(["secondary", "text"]),
|
|
@@ -55,7 +72,9 @@ const overflowButtonPropTypes = {
|
|
|
55
72
|
};
|
|
56
73
|
const miniToolbarProps = {
|
|
57
74
|
items: import_ds_utilities.PropTypes.arrayOf(itemPropTypes).description("Array of items").isRequired,
|
|
58
|
-
overflowButtonProps: import_ds_utilities.PropTypes.shape(overflowButtonPropTypes).description(
|
|
75
|
+
overflowButtonProps: import_ds_utilities.PropTypes.shape(overflowButtonPropTypes).description(
|
|
76
|
+
"Overflow button props"
|
|
77
|
+
)
|
|
59
78
|
};
|
|
60
79
|
const ToolbarItem = () => null;
|
|
61
80
|
ToolbarItem.displayName = "ToolbarItem";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/propTypes.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { PropTypes, describe } from '@elliemae/ds-utilities';\n\nconst outOfTheBoxType = PropTypes.oneOf([\n 'ds-button',\n 'ds-icon-item',\n 'ds-separator',\n 'ds-search-box',\n 'ds-combo-box',\n]).description('out-of-the-box toolbar components');\n\nconst toolbarItemProps = {\n component: PropTypes.oneOfType([\n outOfTheBoxType,\n PropTypes.element,\n ]).description('Main component').isRequired,\n hasShortcut: PropTypes.bool\n .description(\n 'Whether to include the component as a shortcut in the toolbar or not',\n )\n .defaultValue(false),\n shortcutComponent: PropTypes.element.description(\n 'Component to render as a shortcut in the toolbar',\n ),\n shortcutProps: PropTypes.object.description('Shortcut component props'),\n dropdownComponentProps: PropTypes.object.description(\n 'Dropdown component props',\n ),\n sharedProps: PropTypes.object.description(\n 'Props shared by shortcut component and dropdown component',\n ),\n contextualRegion: PropTypes.element.description(\n 'Component that can be rendered as an adjacent region to the shortcut component',\n ),\n contextualRegionProps: PropTypes.object.description(\n 'Contextual region component props',\n ),\n};\n\nconst itemPropTypes = PropTypes.shape(toolbarItemProps).description(\n 'Items props',\n);\n\nconst overflowButtonPropTypes = {\n ariaLabel: PropTypes.string,\n buttonType: PropTypes.oneOf(['secondary', 'text']),\n style: PropTypes.object,\n};\n\nconst miniToolbarProps = {\n items: PropTypes.arrayOf(itemPropTypes).description('Array of items')\n .isRequired,\n overflowButtonProps: PropTypes.shape(overflowButtonPropTypes).description(\n 'Overflow button props',\n ),\n};\n\nconst ToolbarItem = () => null;\nToolbarItem.displayName = 'ToolbarItem';\nconst ToolbarItemWithSchema = describe(ToolbarItem);\nToolbarItemWithSchema.propTypes = toolbarItemProps;\nexport { ToolbarItemWithSchema, miniToolbarProps };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAoC;AAEpC,MAAM,kBAAkB,8BAAU,MAAM;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC,EAAE,YAAY,mCAAmC;AAElD,MAAM,mBAAmB;AAAA,EACvB,WAAW,8BAAU,UAAU;AAAA,IAC7B;AAAA,IACA,8BAAU;AAAA,EACZ,CAAC,EAAE,YAAY,gBAAgB,EAAE;AAAA,EACjC,aAAa,8BAAU,KACpB;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,mBAAmB,8BAAU,QAAQ;AAAA,IACnC;AAAA,EACF;AAAA,EACA,eAAe,8BAAU,OAAO,YAAY,0BAA0B;AAAA,EACtE,wBAAwB,8BAAU,OAAO;AAAA,IACvC;AAAA,EACF;AAAA,EACA,aAAa,8BAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EACA,kBAAkB,8BAAU,QAAQ;AAAA,IAClC;AAAA,EACF;AAAA,EACA,uBAAuB,8BAAU,OAAO;AAAA,IACtC;AAAA,EACF;AACF;AAEA,MAAM,gBAAgB,8BAAU,MAAM,gBAAgB,EAAE;AAAA,EACtD;AACF;AAEA,MAAM,0BAA0B;AAAA,EAC9B,WAAW,8BAAU;AAAA,EACrB,YAAY,8BAAU,MAAM,CAAC,aAAa,MAAM,CAAC;AAAA,EACjD,OAAO,8BAAU;AACnB;AAEA,MAAM,mBAAmB;AAAA,EACvB,OAAO,8BAAU,QAAQ,aAAa,EAAE,YAAY,gBAAgB,EACjE;AAAA,EACH,qBAAqB,8BAAU,MAAM,uBAAuB,EAAE;AAAA,IAC5D;AAAA,EACF;AACF;AAEA,MAAM,cAAc,MAAM;AAC1B,YAAY,cAAc;AAC1B,MAAM,4BAAwB,8BAAS,WAAW;AAClD,sBAAsB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styles.js
CHANGED
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var styles_exports = {};
|
|
23
26
|
__export(styles_exports, {
|
package/dist/cjs/styles.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styles.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSButton } from '@elliemae/ds-button';\n\nconst Container = styled.ul`\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n padding: 0 6px;\n`;\n\nconst Separator = styled.span`\n height: 24px;\n width: 1px;\n margin: 6px;\n border-left: 1px solid #bbb;\n`;\n\nconst Item = styled.li`\n display: flex;\n margin: 6px;\n cursor: pointer;\n`;\n\nconst StyledButton = styled(DSButton)`\n &:not(:focus) {\n border-color: transparent;\n }\n`;\n\nexport { Container, Separator, Item, StyledButton };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAAyB;AAEzB,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQzB,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,OAAO,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMpB,MAAM,mBAAe,yBAAO,yBAAQ;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/Components/MiniToolbar.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useCallback } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { StyledButton, Container } from '../styles';\nimport { miniToolbarProps } from '../propTypes';\nimport { useGenerateItems } from '../hooks/useGenerateItems';\nimport { MiniToolbarPropsT } from '../index.d';\n\nconst Elipsis = <MoreOptionsVert color={['brand-primary', '600']} size=\"m\" />;\n\nconst MiniToolbar = ({ items, overflowButtonProps }: MiniToolbarPropsT): React.ReactElement => {\n const [shortcutItems, dropdownMenuItems] = useGenerateItems(items);\n const [isDropdownMenuOpen, setIsDropdownMenuOpen] = useState<boolean>(false);\n\n const closeDropdownMenu = useCallback(() => setIsDropdownMenuOpen(false), []);\n const openDropdownMenu = useCallback(() => setIsDropdownMenuOpen(true), []);\n const openDropdownMenuKeyPress = useCallback((e) => {\n if (e.key === ' ') {\n setIsDropdownMenuOpen(true);\n }\n }, []);\n\n const { ariaLabel, style, buttonType = 'secondary' } = overflowButtonProps || {};\n\n return (\n <Container role=\"toolbar\" data-testid=\"ds-mini-toolbar\">\n {shortcutItems}\n <DSDropdownMenu\n data-testid=\"ds-mini-toolbar__dropdown-menu\"\n isOpen={isDropdownMenuOpen}\n onSelectMenuItem={closeDropdownMenu}\n onClickOutsideMenu={closeDropdownMenu}\n options={dropdownMenuItems}\n triggerComponent={\n <StyledButton\n aria-label={ariaLabel}\n data-testid=\"ds-mini-toolbar__elipsis\"\n size=\"m\"\n style={style}\n buttonType={buttonType}\n onClick={openDropdownMenu}\n onKeyPress={openDropdownMenuKeyPress}\n leftIcon={Elipsis}\n />\n }\n />\n </Container>\n );\n};\n\nMiniToolbar.propTypes = miniToolbarProps;\nMiniToolbar.displayName = 'MiniToolbar';\nconst MiniToolbarWithSchema = describe(MiniToolbar);\nMiniToolbarWithSchema.propTypes = miniToolbarProps;\n\nexport { MiniToolbar, MiniToolbarWithSchema };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,UAAU,mBAAmB;AAC7C,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B,SAAS,uBAAuB;AAChC,SAAS,cAAc,iBAAiB;AACxC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAGjC,MAAM,UAAU,gBAAAA,OAAA,cAAC;AAAA,EAAgB,OAAO,CAAC,iBAAiB,KAAK;AAAA,EAAG,MAAK;AAAA,CAAI;AAE3E,MAAM,cAAc,CAAC,EAAE,OAAO,oBAAoB,MAA6C;AAC7F,QAAM,CAAC,eAAe,iBAAiB,IAAI,iBAAiB,KAAK;AACjE,QAAM,CAAC,oBAAoB,qBAAqB,IAAI,SAAkB,KAAK;AAE3E,QAAM,oBAAoB,YAAY,MAAM,sBAAsB,KAAK,GAAG,CAAC,CAAC;AAC5E,QAAM,mBAAmB,YAAY,MAAM,sBAAsB,IAAI,GAAG,CAAC,CAAC;AAC1E,QAAM,2BAA2B,YAAY,CAAC,MAAM;AAClD,QAAI,EAAE,QAAQ,KAAK;AACjB,4BAAsB,IAAI;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,EAAE,WAAW,OAAO,aAAa,YAAY,IAAI,uBAAuB,CAAC;AAE/E,SACE,gBAAAA,OAAA,cAAC;AAAA,IAAU,MAAK;AAAA,IAAU,eAAY;AAAA,KACnC,eACD,gBAAAA,OAAA,cAAC;AAAA,IACC,eAAY;AAAA,IACZ,QAAQ;AAAA,IACR,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,SAAS;AAAA,IACT,kBACE,gBAAAA,OAAA,cAAC;AAAA,MACC,cAAY;AAAA,MACZ,eAAY;AAAA,MACZ,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,KACZ;AAAA,GAEJ,CACF;AAEJ;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW;AAClD,sBAAsB,YAAY;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/Components/ToolbarShortcut.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useEffect } from 'react';\nimport { Item } from '../styles';\nimport { ToolbarShortcutPropsT } from '../index.d';\n\nconst ToolbarShortcut = (props: ToolbarShortcutPropsT): React.ReactElement => {\n const { Component, shortcutProps, sharedProps, ContextualRegion, contextualRegionProps } = props;\n const leftRef = useRef<HTMLElement | null>(null);\n const rightRef = useRef<HTMLElement | null>(null);\n const timerLeft = useRef<ReturnType<typeof setInterval> | null>(null);\n const timerRight = useRef<ReturnType<typeof setInterval> | null>(null);\n\n const { position = 'left', isOpen = false } = contextualRegionProps || {};\n const { style } = shortcutProps || {};\n\n const mergedProps = {\n ...sharedProps,\n ...shortcutProps,\n };\n\n useEffect(() => {\n if (isOpen && leftRef.current) {\n timerLeft.current = setTimeout(() => leftRef.current.focus(), 200);\n }\n if (isOpen && rightRef.current) {\n timerRight.current = setTimeout(() => rightRef.current.focus(), 200);\n }\n\n return () => {\n clearTimeout(timerLeft.current);\n clearTimeout(timerRight.current);\n };\n }, [isOpen, leftRef, rightRef]);\n\n return (\n <>\n {isOpen && position === 'left' && (\n <Item>\n <ContextualRegion innerRef={leftRef} {...contextualRegionProps} />\n </Item>\n )}\n {Component && (\n <Item style={style}>\n <Component {...mergedProps} />\n </Item>\n )}\n {isOpen && position === 'right' && (\n <Item>\n <ContextualRegion innerRef={rightRef} {...contextualRegionProps} />\n </Item>\n )}\n </>\n );\n};\n\nexport { ToolbarShortcut };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,QAAQ,iBAAiB;AACzC,SAAS,YAAY;AAGrB,MAAM,kBAAkB,CAAC,UAAqD;AAC5E,QAAM,EAAE,WAAW,eAAe,aAAa,kBAAkB,sBAAsB,IAAI;AAC3F,QAAM,UAAU,OAA2B,IAAI;AAC/C,QAAM,WAAW,OAA2B,IAAI;AAChD,QAAM,YAAY,OAA8C,IAAI;AACpE,QAAM,aAAa,OAA8C,IAAI;AAErE,QAAM,EAAE,WAAW,QAAQ,SAAS,MAAM,IAAI,yBAAyB,CAAC;AACxE,QAAM,EAAE,MAAM,IAAI,iBAAiB,CAAC;AAEpC,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAEA,YAAU,MAAM;AACd,QAAI,UAAU,QAAQ,SAAS;AAC7B,gBAAU,UAAU,WAAW,MAAM,QAAQ,QAAQ,MAAM,GAAG,GAAG;AAAA,IACnE;AACA,QAAI,UAAU,SAAS,SAAS;AAC9B,iBAAW,UAAU,WAAW,MAAM,SAAS,QAAQ,MAAM,GAAG,GAAG;AAAA,IACrE;AAEA,WAAO,MAAM;AACX,mBAAa,UAAU,OAAO;AAC9B,mBAAa,WAAW,OAAO;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,QAAQ,SAAS,QAAQ,CAAC;AAE9B,SACE,gBAAAA,OAAA,cAAAA,OAAA,gBACG,UAAU,aAAa,UACtB,gBAAAA,OAAA,cAAC,YACC,gBAAAA,OAAA,cAAC;AAAA,IAAiB,UAAU;AAAA,IAAU,GAAG;AAAA,GAAuB,CAClE,GAED,aACC,gBAAAA,OAAA,cAAC;AAAA,IAAK;AAAA,KACJ,gBAAAA,OAAA,cAAC;AAAA,IAAW,GAAG;AAAA,GAAa,CAC9B,GAED,UAAU,aAAa,WACtB,gBAAAA,OAAA,cAAC,YACC,gBAAAA,OAAA,cAAC;AAAA,IAAiB,UAAU;AAAA,IAAW,GAAG;AAAA,GAAuB,CACnE,CAEJ;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/Button.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\n\nconst MiniToolbarButton = (props: Record<string, unknown>): React.ReactElement => (\n <DSButton {...props} aria-label={props.ariaLabel} data-testid=\"ds-mini-toolbar__shortcut\" />\n);\n\nexport { MiniToolbarButton };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,gBAAgB;AAEzB,MAAM,oBAAoB,CAAC,UACzB,gBAAAA,OAAA,cAAC;AAAA,EAAU,GAAG;AAAA,EAAO,cAAY,MAAM;AAAA,EAAW,eAAY;AAAA,CAA4B;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/ComboBox.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSComboBox2 } from '@elliemae/ds-form';\n\nconst MiniToolbarComboBox = (props: Record<string, unknown>): React.ReactElement => <DSComboBox2 {...props} />;\n\nexport { MiniToolbarComboBox };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,mBAAmB;AAE5B,MAAM,sBAAsB,CAAC,UAAuD,gBAAAA,OAAA,cAAC;AAAA,EAAa,GAAG;AAAA,CAAO;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/IconItem.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarIcon = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n const { Icon, size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n return (\n <StyledButton\n aria-label={ariaLabel}\n buttonType={buttonType}\n onClick={onClick}\n style={style}\n leftIcon={<Icon size={size} color={color} />}\n data-testid=\"ds-mini-toolbar__shortcut\"\n />\n );\n};\n\nexport { MiniToolbarIcon };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,oBAAoB;AAG7B,MAAM,kBAAkB,CAAC,UAAyD;AAChF,QAAM,EAAE,MAAM,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAEnF,SACE,gBAAAA,OAAA,cAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,gBAAAA,OAAA,cAAC;AAAA,MAAK;AAAA,MAAY;AAAA,KAAc;AAAA,IAC1C,eAAY;AAAA,GACd;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/SearchBox.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { DSSearchBox } from '@elliemae/ds-form';\nimport { StyledButton } from '../../styles';\nimport { MiniToolbarIconItemPropsT } from '../../index.d';\n\nconst MiniToolbarSearchButton = (props: MiniToolbarIconItemPropsT): React.ReactElement => {\n const { size, color, onClick, ariaLabel, style, buttonType = 'secondary' } = props;\n\n return (\n <StyledButton\n aria-label={ariaLabel}\n buttonType={buttonType}\n onClick={onClick}\n style={style}\n leftIcon={<Search size={size} color={color} />}\n data-testid=\"ds-mini-toolbar__shortcut\"\n />\n );\n};\n\nconst MiniToolbarSearchBox = (props: Record<string, unknown>): JSX.Element => (\n <DSSearchBox clearable showIcon={false} {...props} />\n);\n\nexport { MiniToolbarSearchButton, MiniToolbarSearchBox };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAG7B,MAAM,0BAA0B,CAAC,UAAyD;AACxF,QAAM,EAAE,MAAM,OAAO,SAAS,WAAW,OAAO,aAAa,YAAY,IAAI;AAE7E,SACE,gBAAAA,OAAA,cAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,gBAAAA,OAAA,cAAC;AAAA,MAAO;AAAA,MAAY;AAAA,KAAc;AAAA,IAC5C,eAAY;AAAA,GACd;AAEJ;AAEA,MAAM,uBAAuB,CAAC,UAC5B,gBAAAA,OAAA,cAAC;AAAA,EAAY,WAAS;AAAA,EAAC,UAAU;AAAA,EAAQ,GAAG;AAAA,CAAO;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/Separator.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Separator } from '../../styles';\n\nconst MiniToolbarSeparator = (): React.ReactElement => (\n <Separator data-testid=\"ds-mini-toolbar__separator\" />\n);\n\nexport { MiniToolbarSeparator };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,iBAAiB;AAE1B,MAAM,uBAAuB,MAC3B,gBAAAA,OAAA,cAAC;AAAA,EAAU,eAAY;AAAA,CAA6B;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/Components/outOfTheBox/index.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { MiniToolbarButton } from './Button';\nexport { MiniToolbarIcon } from './IconItem';\nexport { MiniToolbarSearchBox } from './SearchBox';\nexport { MiniToolbarSeparator } from './Separator';\nexport { MiniToolbarComboBox } from './ComboBox';\n\nexport const ICON_ITEM = 'ds-icon-item';\nexport const SEPARATOR = 'ds-separator';\nexport const BUTTON = 'ds-button';\nexport const SEARCH_BOX = 'ds-search-box';\nexport const COMBO_BOX = 'ds-combo-box';\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AAE7B,MAAM,YAAY;AAClB,MAAM,YAAY;AAClB,MAAM,SAAS;AACf,MAAM,aAAa;AACnB,MAAM,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,82 +18,88 @@ import { ToolbarShortcut } from "../Components/ToolbarShortcut";
|
|
|
18
18
|
import { MiniToolbarSearchButton } from "../Components/outOfTheBox/SearchBox";
|
|
19
19
|
const useGenerateItems = (items) => {
|
|
20
20
|
const instanceUID = useMemo(() => uid(6), []);
|
|
21
|
-
const shortcutItems = useMemo(
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
if (
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
ContextualRegion = MiniToolbarSearchBox;
|
|
38
|
-
}
|
|
39
|
-
if (!ContextualRegion) {
|
|
40
|
-
ContextualRegion = contextualRegion;
|
|
41
|
-
}
|
|
42
|
-
if (!Component) {
|
|
43
|
-
Component = shortcutComponent;
|
|
44
|
-
}
|
|
45
|
-
return /* @__PURE__ */ React2.createElement(ToolbarShortcut, {
|
|
46
|
-
key: `${instanceUID}-shortcut-${index}`,
|
|
47
|
-
Component,
|
|
48
|
-
shortcutProps,
|
|
49
|
-
sharedProps,
|
|
50
|
-
ContextualRegion,
|
|
51
|
-
contextualRegionProps
|
|
52
|
-
});
|
|
53
|
-
}), [instanceUID, items]);
|
|
54
|
-
const dropdownMenuItems = useMemo(() => items.map((item, index) => {
|
|
55
|
-
const { component, sharedProps, dropdownComponentProps } = item;
|
|
56
|
-
const dropdownItem = {};
|
|
57
|
-
const { Icon, color, label, onClick } = {
|
|
58
|
-
...sharedProps,
|
|
59
|
-
...dropdownComponentProps
|
|
60
|
-
};
|
|
61
|
-
if (component === SEPARATOR)
|
|
62
|
-
dropdownItem.type = "separator";
|
|
63
|
-
else {
|
|
64
|
-
dropdownItem.id = `${instanceUID}-dropdown-${index}`;
|
|
65
|
-
dropdownItem.onClick = () => onClick(item);
|
|
66
|
-
dropdownItem.label = label;
|
|
67
|
-
dropdownItem.onKeyDown = (e) => {
|
|
68
|
-
if (e.key === "Enter" || e.key === " ") {
|
|
69
|
-
onClick(item);
|
|
21
|
+
const shortcutItems = useMemo(
|
|
22
|
+
() => items.filter((item) => item.hasShortcut || item.component === SEARCH_BOX || item.contextualRegion).map((item, index) => {
|
|
23
|
+
const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } = item;
|
|
24
|
+
let Component;
|
|
25
|
+
let ContextualRegion;
|
|
26
|
+
if (component === SEPARATOR)
|
|
27
|
+
return /* @__PURE__ */ React2.createElement(MiniToolbarSeparator, null);
|
|
28
|
+
if (component === BUTTON)
|
|
29
|
+
Component = MiniToolbarButton;
|
|
30
|
+
else if (component === ICON_ITEM)
|
|
31
|
+
Component = MiniToolbarIcon;
|
|
32
|
+
else if (component === COMBO_BOX)
|
|
33
|
+
Component = MiniToolbarComboBox;
|
|
34
|
+
else if (component === SEARCH_BOX) {
|
|
35
|
+
if (item.hasShortcut) {
|
|
36
|
+
Component = MiniToolbarSearchButton;
|
|
70
37
|
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
38
|
+
ContextualRegion = MiniToolbarSearchBox;
|
|
39
|
+
}
|
|
40
|
+
if (!ContextualRegion) {
|
|
41
|
+
ContextualRegion = contextualRegion;
|
|
42
|
+
}
|
|
43
|
+
if (!Component) {
|
|
44
|
+
Component = shortcutComponent;
|
|
45
|
+
}
|
|
46
|
+
return /* @__PURE__ */ React2.createElement(ToolbarShortcut, {
|
|
47
|
+
key: `${instanceUID}-shortcut-${index}`,
|
|
48
|
+
Component,
|
|
49
|
+
shortcutProps,
|
|
50
|
+
sharedProps,
|
|
51
|
+
ContextualRegion,
|
|
52
|
+
contextualRegionProps
|
|
80
53
|
});
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
54
|
+
}),
|
|
55
|
+
[instanceUID, items]
|
|
56
|
+
);
|
|
57
|
+
const dropdownMenuItems = useMemo(
|
|
58
|
+
() => items.map((item, index) => {
|
|
59
|
+
const { component, sharedProps, dropdownComponentProps } = item;
|
|
60
|
+
const dropdownItem = {};
|
|
61
|
+
const { Icon, color, label, onClick } = {
|
|
62
|
+
...sharedProps,
|
|
63
|
+
...dropdownComponentProps
|
|
64
|
+
};
|
|
65
|
+
if (component === SEPARATOR)
|
|
66
|
+
dropdownItem.type = "separator";
|
|
67
|
+
else {
|
|
68
|
+
dropdownItem.id = `${instanceUID}-dropdown-${index}`;
|
|
69
|
+
dropdownItem.onClick = () => onClick(item);
|
|
70
|
+
dropdownItem.label = label;
|
|
71
|
+
dropdownItem.onKeyDown = (e) => {
|
|
72
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
73
|
+
onClick(item);
|
|
90
74
|
}
|
|
91
75
|
};
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
76
|
+
}
|
|
77
|
+
if (component === ICON_ITEM) {
|
|
78
|
+
dropdownItem.leftAddon = /* @__PURE__ */ React2.createElement(Icon, {
|
|
79
|
+
color
|
|
80
|
+
});
|
|
81
|
+
} else if (component === SEARCH_BOX) {
|
|
82
|
+
dropdownItem.leftAddon = /* @__PURE__ */ React2.createElement(Search, {
|
|
83
|
+
color
|
|
84
|
+
});
|
|
85
|
+
} else if (component === COMBO_BOX) {
|
|
86
|
+
dropdownItem.type = "subMenu";
|
|
87
|
+
dropdownItem.label = label;
|
|
88
|
+
dropdownItem.subItems = sharedProps.options.map((option, index2) => {
|
|
89
|
+
option.id = `${instanceUID}-option-${index2}`;
|
|
90
|
+
option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);
|
|
91
|
+
option.onKeyDown = (e) => {
|
|
92
|
+
if (e.key === " " || e.key === "Enter") {
|
|
93
|
+
dropdownComponentProps.onSelectMenuItem(option);
|
|
94
|
+
}
|
|
95
|
+
};
|
|
96
|
+
return option;
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
return dropdownItem;
|
|
100
|
+
}),
|
|
101
|
+
[instanceUID, items]
|
|
102
|
+
);
|
|
97
103
|
return [shortcutItems, dropdownMenuItems];
|
|
98
104
|
};
|
|
99
105
|
export {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useGenerateItems.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { uid } from 'uid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n ICON_ITEM,\n SEPARATOR,\n BUTTON,\n SEARCH_BOX,\n COMBO_BOX,\n MiniToolbarButton,\n MiniToolbarSeparator,\n MiniToolbarSearchBox,\n MiniToolbarIcon,\n MiniToolbarComboBox,\n} from '../Components/outOfTheBox';\nimport { ToolbarShortcut } from '../Components/ToolbarShortcut';\nimport { MiniToolbarSearchButton } from '../Components/outOfTheBox/SearchBox';\nimport { GeneratedDropdownItemT, MiniToolbarItemT } from '../index.d';\n\nconst useGenerateItems = (items: MiniToolbarItemT[]): [React.ReactElement[], GeneratedDropdownItemT[]] => {\n const instanceUID = useMemo(() => uid(6), []);\n\n const shortcutItems = useMemo(\n () =>\n items\n .filter((item) => item.hasShortcut || item.component === SEARCH_BOX || item.contextualRegion)\n .map((item, index) => {\n const { component, shortcutComponent, shortcutProps, sharedProps, contextualRegion, contextualRegionProps } =\n item;\n\n let Component;\n let ContextualRegion;\n\n if (component === SEPARATOR) return <MiniToolbarSeparator />;\n if (component === BUTTON) Component = MiniToolbarButton;\n else if (component === ICON_ITEM) Component = MiniToolbarIcon;\n else if (component === COMBO_BOX) Component = MiniToolbarComboBox;\n else if (component === SEARCH_BOX) {\n if (item.hasShortcut) {\n Component = MiniToolbarSearchButton;\n }\n ContextualRegion = MiniToolbarSearchBox;\n }\n if (!ContextualRegion) {\n ContextualRegion = contextualRegion;\n }\n if (!Component) {\n Component = shortcutComponent;\n }\n\n return (\n <ToolbarShortcut\n key={`${instanceUID}-shortcut-${index}`}\n Component={Component}\n shortcutProps={shortcutProps}\n sharedProps={sharedProps}\n ContextualRegion={ContextualRegion}\n contextualRegionProps={contextualRegionProps}\n />\n );\n }),\n [instanceUID, items],\n );\n\n const dropdownMenuItems = useMemo(\n () =>\n items.map((item, index) => {\n const { component, sharedProps, dropdownComponentProps } = item;\n const dropdownItem: GeneratedDropdownItemT = {};\n\n const { Icon, color, label, onClick } = {\n ...sharedProps,\n ...dropdownComponentProps,\n };\n\n if (component === SEPARATOR) dropdownItem.type = 'separator';\n else {\n dropdownItem.id = `${instanceUID}-dropdown-${index}`;\n dropdownItem.onClick = () => onClick(item);\n dropdownItem.label = label;\n dropdownItem.onKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n onClick(item);\n }\n };\n }\n\n if (component === ICON_ITEM) {\n dropdownItem.leftAddon = <Icon color={color} />;\n } else if (component === SEARCH_BOX) {\n dropdownItem.leftAddon = <Search color={color} />;\n } else if (component === COMBO_BOX) {\n dropdownItem.type = 'subMenu';\n dropdownItem.label = label;\n dropdownItem.subItems = sharedProps.options.map((option, index) => {\n option.id = `${instanceUID}-option-${index}`;\n option.onClick = () => dropdownComponentProps.onSelectMenuItem(option);\n option.onKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n dropdownComponentProps.onSelectMenuItem(option);\n }\n };\n return option;\n });\n }\n\n return dropdownItem;\n }),\n [instanceUID, items],\n );\n\n return [shortcutItems, dropdownMenuItems];\n};\n\nexport { useGenerateItems };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,eAAe;AAC/B,SAAS,WAAW;AACpB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAGxC,MAAM,mBAAmB,CAAC,UAAgF;AACxG,QAAM,cAAc,QAAQ,MAAM,IAAI,CAAC,GAAG,CAAC,CAAC;AAE5C,QAAM,gBAAgB;AAAA,IACpB,MACE,MACG,OAAO,CAAC,SAAS,KAAK,eAAe,KAAK,cAAc,cAAc,KAAK,gBAAgB,EAC3F,IAAI,CAAC,MAAM,UAAU;AACpB,YAAM,EAAE,WAAW,mBAAmB,eAAe,aAAa,kBAAkB,sBAAsB,IACxG;AAEF,UAAI;AACJ,UAAI;AAEJ,UAAI,cAAc;AAAW,eAAO,gBAAAA,OAAA,cAAC,0BAAqB;AAC1D,UAAI,cAAc;AAAQ,oBAAY;AAAA,eAC7B,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc;AAAW,oBAAY;AAAA,eACrC,cAAc,YAAY;AACjC,YAAI,KAAK,aAAa;AACpB,sBAAY;AAAA,QACd;AACA,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,kBAAkB;AACrB,2BAAmB;AAAA,MACrB;AACA,UAAI,CAAC,WAAW;AACd,oBAAY;AAAA,MACd;AAEA,aACE,gBAAAA,OAAA,cAAC;AAAA,QACC,KAAK,GAAG,wBAAwB;AAAA,QAChC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,OACF;AAAA,IAEJ,CAAC;AAAA,IACL,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,QAAM,oBAAoB;AAAA,IACxB,MACE,MAAM,IAAI,CAAC,MAAM,UAAU;AACzB,YAAM,EAAE,WAAW,aAAa,uBAAuB,IAAI;AAC3D,YAAM,eAAuC,CAAC;AAE9C,YAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,IAAI;AAAA,QACtC,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAEA,UAAI,cAAc;AAAW,qBAAa,OAAO;AAAA,WAC5C;AACH,qBAAa,KAAK,GAAG,wBAAwB;AAC7C,qBAAa,UAAU,MAAM,QAAQ,IAAI;AACzC,qBAAa,QAAQ;AACrB,qBAAa,YAAY,CAAC,MAA2B;AACnD,cAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,oBAAQ,IAAI;AAAA,UACd;AAAA,QACF;AAAA,MACF;AAEA,UAAI,cAAc,WAAW;AAC3B,qBAAa,YAAY,gBAAAA,OAAA,cAAC;AAAA,UAAK;AAAA,SAAc;AAAA,MAC/C,WAAW,cAAc,YAAY;AACnC,qBAAa,YAAY,gBAAAA,OAAA,cAAC;AAAA,UAAO;AAAA,SAAc;AAAA,MACjD,WAAW,cAAc,WAAW;AAClC,qBAAa,OAAO;AACpB,qBAAa,QAAQ;AACrB,qBAAa,WAAW,YAAY,QAAQ,IAAI,CAAC,QAAQC,WAAU;AACjE,iBAAO,KAAK,GAAG,sBAAsBA;AACrC,iBAAO,UAAU,MAAM,uBAAuB,iBAAiB,MAAM;AACrE,iBAAO,YAAY,CAAC,MAA2B;AAC7C,gBAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,qCAAuB,iBAAiB,MAAM;AAAA,YAChD;AAAA,UACF;AACA,iBAAO;AAAA,QACT,CAAC;AAAA,MACH;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,IACH,CAAC,aAAa,KAAK;AAAA,EACrB;AAEA,SAAO,CAAC,eAAe,iBAAiB;AAC1C;",
|
|
6
|
+
"names": ["React", "index"]
|
|
7
7
|
}
|
package/dist/esm/index.d.js.map
CHANGED
package/dist/esm/index.js.map
CHANGED
|
@@ -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 { MiniToolbar, MiniToolbarWithSchema } from './Components/MiniToolbar';\nexport { ToolbarItemWithSchema } from './propTypes';\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,aAAa,6BAA6B;AACnD,SAAS,6BAA6B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/propTypes.js
CHANGED
|
@@ -12,15 +12,29 @@ const toolbarItemProps = {
|
|
|
12
12
|
outOfTheBoxType,
|
|
13
13
|
PropTypes.element
|
|
14
14
|
]).description("Main component").isRequired,
|
|
15
|
-
hasShortcut: PropTypes.bool.description(
|
|
16
|
-
|
|
15
|
+
hasShortcut: PropTypes.bool.description(
|
|
16
|
+
"Whether to include the component as a shortcut in the toolbar or not"
|
|
17
|
+
).defaultValue(false),
|
|
18
|
+
shortcutComponent: PropTypes.element.description(
|
|
19
|
+
"Component to render as a shortcut in the toolbar"
|
|
20
|
+
),
|
|
17
21
|
shortcutProps: PropTypes.object.description("Shortcut component props"),
|
|
18
|
-
dropdownComponentProps: PropTypes.object.description(
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
+
dropdownComponentProps: PropTypes.object.description(
|
|
23
|
+
"Dropdown component props"
|
|
24
|
+
),
|
|
25
|
+
sharedProps: PropTypes.object.description(
|
|
26
|
+
"Props shared by shortcut component and dropdown component"
|
|
27
|
+
),
|
|
28
|
+
contextualRegion: PropTypes.element.description(
|
|
29
|
+
"Component that can be rendered as an adjacent region to the shortcut component"
|
|
30
|
+
),
|
|
31
|
+
contextualRegionProps: PropTypes.object.description(
|
|
32
|
+
"Contextual region component props"
|
|
33
|
+
)
|
|
22
34
|
};
|
|
23
|
-
const itemPropTypes = PropTypes.shape(toolbarItemProps).description(
|
|
35
|
+
const itemPropTypes = PropTypes.shape(toolbarItemProps).description(
|
|
36
|
+
"Items props"
|
|
37
|
+
);
|
|
24
38
|
const overflowButtonPropTypes = {
|
|
25
39
|
ariaLabel: PropTypes.string,
|
|
26
40
|
buttonType: PropTypes.oneOf(["secondary", "text"]),
|
|
@@ -28,7 +42,9 @@ const overflowButtonPropTypes = {
|
|
|
28
42
|
};
|
|
29
43
|
const miniToolbarProps = {
|
|
30
44
|
items: PropTypes.arrayOf(itemPropTypes).description("Array of items").isRequired,
|
|
31
|
-
overflowButtonProps: PropTypes.shape(overflowButtonPropTypes).description(
|
|
45
|
+
overflowButtonProps: PropTypes.shape(overflowButtonPropTypes).description(
|
|
46
|
+
"Overflow button props"
|
|
47
|
+
)
|
|
32
48
|
};
|
|
33
49
|
const ToolbarItem = () => null;
|
|
34
50
|
ToolbarItem.displayName = "ToolbarItem";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/propTypes.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes, describe } from '@elliemae/ds-utilities';\n\nconst outOfTheBoxType = PropTypes.oneOf([\n 'ds-button',\n 'ds-icon-item',\n 'ds-separator',\n 'ds-search-box',\n 'ds-combo-box',\n]).description('out-of-the-box toolbar components');\n\nconst toolbarItemProps = {\n component: PropTypes.oneOfType([\n outOfTheBoxType,\n PropTypes.element,\n ]).description('Main component').isRequired,\n hasShortcut: PropTypes.bool\n .description(\n 'Whether to include the component as a shortcut in the toolbar or not',\n )\n .defaultValue(false),\n shortcutComponent: PropTypes.element.description(\n 'Component to render as a shortcut in the toolbar',\n ),\n shortcutProps: PropTypes.object.description('Shortcut component props'),\n dropdownComponentProps: PropTypes.object.description(\n 'Dropdown component props',\n ),\n sharedProps: PropTypes.object.description(\n 'Props shared by shortcut component and dropdown component',\n ),\n contextualRegion: PropTypes.element.description(\n 'Component that can be rendered as an adjacent region to the shortcut component',\n ),\n contextualRegionProps: PropTypes.object.description(\n 'Contextual region component props',\n ),\n};\n\nconst itemPropTypes = PropTypes.shape(toolbarItemProps).description(\n 'Items props',\n);\n\nconst overflowButtonPropTypes = {\n ariaLabel: PropTypes.string,\n buttonType: PropTypes.oneOf(['secondary', 'text']),\n style: PropTypes.object,\n};\n\nconst miniToolbarProps = {\n items: PropTypes.arrayOf(itemPropTypes).description('Array of items')\n .isRequired,\n overflowButtonProps: PropTypes.shape(overflowButtonPropTypes).description(\n 'Overflow button props',\n ),\n};\n\nconst ToolbarItem = () => null;\nToolbarItem.displayName = 'ToolbarItem';\nconst ToolbarItemWithSchema = describe(ToolbarItem);\nToolbarItemWithSchema.propTypes = toolbarItemProps;\nexport { ToolbarItemWithSchema, miniToolbarProps };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,gBAAgB;AAEpC,MAAM,kBAAkB,UAAU,MAAM;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC,EAAE,YAAY,mCAAmC;AAElD,MAAM,mBAAmB;AAAA,EACvB,WAAW,UAAU,UAAU;AAAA,IAC7B;AAAA,IACA,UAAU;AAAA,EACZ,CAAC,EAAE,YAAY,gBAAgB,EAAE;AAAA,EACjC,aAAa,UAAU,KACpB;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,mBAAmB,UAAU,QAAQ;AAAA,IACnC;AAAA,EACF;AAAA,EACA,eAAe,UAAU,OAAO,YAAY,0BAA0B;AAAA,EACtE,wBAAwB,UAAU,OAAO;AAAA,IACvC;AAAA,EACF;AAAA,EACA,aAAa,UAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EACA,kBAAkB,UAAU,QAAQ;AAAA,IAClC;AAAA,EACF;AAAA,EACA,uBAAuB,UAAU,OAAO;AAAA,IACtC;AAAA,EACF;AACF;AAEA,MAAM,gBAAgB,UAAU,MAAM,gBAAgB,EAAE;AAAA,EACtD;AACF;AAEA,MAAM,0BAA0B;AAAA,EAC9B,WAAW,UAAU;AAAA,EACrB,YAAY,UAAU,MAAM,CAAC,aAAa,MAAM,CAAC;AAAA,EACjD,OAAO,UAAU;AACnB;AAEA,MAAM,mBAAmB;AAAA,EACvB,OAAO,UAAU,QAAQ,aAAa,EAAE,YAAY,gBAAgB,EACjE;AAAA,EACH,qBAAqB,UAAU,MAAM,uBAAuB,EAAE;AAAA,IAC5D;AAAA,EACF;AACF;AAEA,MAAM,cAAc,MAAM;AAC1B,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW;AAClD,sBAAsB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styles.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styles.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSButton } from '@elliemae/ds-button';\n\nconst Container = styled.ul`\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n padding: 0 6px;\n`;\n\nconst Separator = styled.span`\n height: 24px;\n width: 1px;\n margin: 6px;\n border-left: 1px solid #bbb;\n`;\n\nconst Item = styled.li`\n display: flex;\n margin: 6px;\n cursor: pointer;\n`;\n\nconst StyledButton = styled(DSButton)`\n &:not(:focus) {\n border-color: transparent;\n }\n`;\n\nexport { Container, Separator, Item, StyledButton };\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,gBAAgB;AAEzB,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQzB,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAMpB,MAAM,eAAe,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-mini-toolbar",
|
|
3
|
-
"version": "3.5.0-rc.
|
|
3
|
+
"version": "3.5.0-rc.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - MiniToolbar",
|
|
6
6
|
"files": [
|
|
@@ -75,12 +75,12 @@
|
|
|
75
75
|
"indent": 4
|
|
76
76
|
},
|
|
77
77
|
"dependencies": {
|
|
78
|
-
"@elliemae/ds-button": "3.5.0-rc.
|
|
79
|
-
"@elliemae/ds-dropdownmenu": "3.5.0-rc.
|
|
80
|
-
"@elliemae/ds-form": "3.5.0-rc.
|
|
81
|
-
"@elliemae/ds-icons": "3.5.0-rc.
|
|
82
|
-
"@elliemae/ds-system": "3.5.0-rc.
|
|
83
|
-
"@elliemae/ds-utilities": "3.5.0-rc.
|
|
78
|
+
"@elliemae/ds-button": "3.5.0-rc.7",
|
|
79
|
+
"@elliemae/ds-dropdownmenu": "3.5.0-rc.7",
|
|
80
|
+
"@elliemae/ds-form": "3.5.0-rc.7",
|
|
81
|
+
"@elliemae/ds-icons": "3.5.0-rc.7",
|
|
82
|
+
"@elliemae/ds-system": "3.5.0-rc.7",
|
|
83
|
+
"@elliemae/ds-utilities": "3.5.0-rc.7",
|
|
84
84
|
"uid": "~2.0.0"
|
|
85
85
|
},
|
|
86
86
|
"devDependencies": {
|