@elliemae/ds-global-header 3.70.0-next.7 → 3.70.0-next.71
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/DSGlobalHeader.js +16 -2
- package/dist/cjs/DSGlobalHeader.js.map +2 -2
- package/dist/cjs/DSGlobalHeaderContext.js.map +2 -2
- package/dist/cjs/config/useGlobalHeader.js +13 -2
- package/dist/cjs/config/useGlobalHeader.js.map +2 -2
- package/dist/cjs/constants/index.js +11 -5
- package/dist/cjs/constants/index.js.map +2 -2
- package/dist/cjs/index.js +3 -6
- package/dist/cjs/index.js.map +3 -3
- package/dist/cjs/package.json +1 -4
- package/dist/cjs/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js +33 -1
- package/dist/cjs/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js.map +2 -2
- package/dist/cjs/parts/Logo/GlobalHeaderLogo.js +16 -2
- package/dist/cjs/parts/Logo/GlobalHeaderLogo.js.map +2 -2
- package/dist/cjs/parts/Toolbar/GlobalHeaderToolbar.js +54 -16
- package/dist/cjs/parts/Toolbar/GlobalHeaderToolbar.js.map +2 -2
- package/dist/cjs/{utils/useCallbackAfterRender.js → parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTX.js} +7 -16
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTX.js.map +7 -0
- package/dist/cjs/{hooks/useOnClickOutside.js → parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTXRenderer.js} +13 -30
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTXRenderer.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPickerRenderer.js +53 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPickerRenderer.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/TriggerDefaultComponent.js +84 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/TriggerDefaultComponent.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/react-desc-prop-types.js +50 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/useAppPickerCTX.js +66 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/useAppPickerCTX.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js +118 -71
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js.map +3 -3
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js +27 -11
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/react-desc-prop-types.js +52 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js +23 -15
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/react-desc-prop-types.js +54 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js +28 -16
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggleSpinButton.js +61 -50
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggleSpinButton.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/react-desc-prop-types.js +58 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/useSearchToggle.js +33 -25
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/useSearchToggle.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/index.js +12 -4
- package/dist/cjs/parts/Toolbar/outOfTheBox/index.js.map +2 -2
- package/dist/cjs/parts/Toolbar/styles.js +6 -1
- package/dist/cjs/parts/Toolbar/styles.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/sharedTypes.js.map +1 -1
- package/dist/cjs/typescript-testing/typescript-global-header-toolbar-types.js +52 -0
- package/dist/cjs/typescript-testing/typescript-global-header-toolbar-types.js.map +2 -2
- package/dist/esm/DSGlobalHeader.js +16 -2
- package/dist/esm/DSGlobalHeader.js.map +2 -2
- package/dist/esm/DSGlobalHeaderContext.js.map +2 -2
- package/dist/esm/config/useGlobalHeader.js +13 -2
- package/dist/esm/config/useGlobalHeader.js.map +2 -2
- package/dist/esm/constants/index.js +11 -5
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/esm/index.js +3 -6
- package/dist/esm/index.js.map +3 -3
- package/dist/esm/package.json +1 -4
- package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js +34 -2
- package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js.map +2 -2
- package/dist/esm/parts/Logo/GlobalHeaderLogo.js +16 -2
- package/dist/esm/parts/Logo/GlobalHeaderLogo.js.map +2 -2
- package/dist/esm/parts/Toolbar/GlobalHeaderToolbar.js +55 -17
- package/dist/esm/parts/Toolbar/GlobalHeaderToolbar.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTX.js +8 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTX.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTXRenderer.js +13 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTXRenderer.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerRenderer.js +23 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPickerRenderer.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/TriggerDefaultComponent.js +54 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/TriggerDefaultComponent.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/react-desc-prop-types.js +20 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/react-desc-prop-types.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/useAppPickerCTX.js +36 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/useAppPickerCTX.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js +119 -72
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js +28 -12
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/react-desc-prop-types.js +22 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/react-desc-prop-types.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js +24 -16
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/react-desc-prop-types.js +24 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/react-desc-prop-types.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js +34 -17
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggleSpinButton.js +61 -50
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggleSpinButton.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/react-desc-prop-types.js +28 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/react-desc-prop-types.js.map +7 -0
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/useSearchToggle.js +33 -25
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/useSearchToggle.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/index.js +8 -3
- package/dist/esm/parts/Toolbar/outOfTheBox/index.js.map +2 -2
- package/dist/esm/parts/Toolbar/styles.js +6 -1
- package/dist/esm/parts/Toolbar/styles.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/typescript-testing/typescript-global-header-toolbar-types.js +52 -0
- package/dist/esm/typescript-testing/typescript-global-header-toolbar-types.js.map +2 -2
- package/dist/types/DSGlobalHeaderContext.d.ts +10 -2
- package/dist/types/config/useGlobalHeader.d.ts +3 -4
- package/dist/types/constants/index.d.ts +4 -3
- package/dist/types/index.d.ts +0 -2
- package/dist/types/parts/Breadcrumb/PureBreadcrumb.d.ts +1 -1
- package/dist/types/parts/Breadcrumb/styles.d.ts +1 -1
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTX.d.ts +4 -0
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/AppPickerCTXRenderer.d.ts +2 -0
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/AppPickerRenderer.d.ts +1 -0
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/TriggerDefaultComponent.d.ts +2 -0
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/react-desc-prop-types.d.ts +23 -0
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/useAppPickerCTX.d.ts +456 -0
- package/dist/types/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.d.ts +2 -2
- package/dist/types/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.d.ts +2 -2
- package/dist/types/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/react-desc-prop-types.d.ts +28 -0
- package/dist/types/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.d.ts +9 -1
- package/dist/types/parts/Toolbar/outOfTheBox/PopupMenu/react-desc-prop-types.d.ts +26 -0
- package/dist/types/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.d.ts +2 -2
- package/dist/types/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggleSpinButton.d.ts +3 -1
- package/dist/types/parts/Toolbar/outOfTheBox/SearchToggle/react-desc-prop-types.d.ts +26 -0
- package/dist/types/parts/Toolbar/outOfTheBox/SearchToggle/useSearchToggle.d.ts +2 -3
- package/dist/types/parts/Toolbar/outOfTheBox/index.d.ts +3 -3
- package/dist/types/parts/Toolbar/styles.d.ts +1 -0
- package/dist/types/react-desc-prop-types.d.ts +63 -72
- package/dist/types/sharedTypes.d.ts +16 -6
- package/package.json +20 -17
- package/dist/cjs/hooks/useOnClickOutside.js.map +0 -7
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js +0 -127
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js.map +0 -7
- package/dist/cjs/utils/useCallbackAfterRender.js.map +0 -7
- package/dist/esm/hooks/useOnClickOutside.js +0 -30
- package/dist/esm/hooks/useOnClickOutside.js.map +0 -7
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js +0 -97
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js.map +0 -7
- package/dist/esm/utils/useCallbackAfterRender.js +0 -17
- package/dist/esm/utils/useCallbackAfterRender.js.map +0 -7
- package/dist/types/hooks/useOnClickOutside.d.ts +0 -1
- package/dist/types/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.d.ts +0 -6
- package/dist/types/tests/GlobalHeader.a11y.test.d.ts +0 -1
- package/dist/types/tests/GlobalHeader.callback.test.d.ts +0 -1
- package/dist/types/tests/GlobalHeader.getOwnerProps.test.d.ts +0 -1
- package/dist/types/tests/GlobalHeader.keyboard.test.d.ts +0 -1
- package/dist/types/tests/GlobalHeader.setup.test.d.ts +0 -113
- package/dist/types/typescript-testing/typescript-global-header-breadcrumb-types.d.ts +0 -3
- package/dist/types/typescript-testing/typescript-global-header-deprecated.d.ts +0 -1
- package/dist/types/typescript-testing/typescript-global-header-toolbar-types.d.ts +0 -3
- package/dist/types/typescript-testing/typescript-global-header-valid.d.ts +0 -1
- package/dist/types/utils/useCallbackAfterRender.d.ts +0 -3
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useOnClickOutside.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useEffect } from 'react';\n\nexport function useOnClickOutside<T extends Node>(ref: T | null, cb: (event: Event) => void): void {\n const cbRef = React.useRef(cb);\n\n useEffect(() => {\n cbRef.current = cb;\n }, [cb]);\n\n useEffect(() => {\n if (!ref) {\n return () => {};\n }\n\n const listener = (event: MouseEvent | TouchEvent) => {\n const target = event.target as Node | null;\n if (!target) return;\n\n if (ref.contains(target)) return;\n\n cbRef.current(event);\n };\n\n document.addEventListener('mousedown', listener, true);\n document.addEventListener('touchstart', listener, true);\n\n return () => {\n document.removeEventListener('mousedown', listener, true);\n document.removeEventListener('touchstart', listener, true);\n };\n }, [ref]);\n}\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,iBAAiB;AAE1B,SAAS,kBAAkC,KAAe,IAAkC;AACjG,QAAM,QAAQA,OAAM,OAAO,EAAE;AAE7B,YAAU,MAAM;AACd,UAAM,UAAU;AAAA,EAClB,GAAG,CAAC,EAAE,CAAC;AAEP,YAAU,MAAM;AACd,QAAI,CAAC,KAAK;AACR,aAAO,MAAM;AAAA,MAAC;AAAA,IAChB;AAEA,UAAM,WAAW,CAAC,UAAmC;AACnD,YAAM,SAAS,MAAM;AACrB,UAAI,CAAC,OAAQ;AAEb,UAAI,IAAI,SAAS,MAAM,EAAG;AAE1B,YAAM,QAAQ,KAAK;AAAA,IACrB;AAEA,aAAS,iBAAiB,aAAa,UAAU,IAAI;AACrD,aAAS,iBAAiB,cAAc,UAAU,IAAI;AAEtD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,UAAU,IAAI;AACxD,eAAS,oBAAoB,cAAc,UAAU,IAAI;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACV;",
|
|
6
|
-
"names": ["React"]
|
|
7
|
-
}
|
|
@@ -1,97 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { DSAppPicker } from "@elliemae/ds-app-picker";
|
|
4
|
-
import { MenuPicker } from "@elliemae/ds-icons";
|
|
5
|
-
import { getGlobalAttributes } from "@elliemae/ds-props-helpers";
|
|
6
|
-
import { mergeRefs } from "@elliemae/ds-system";
|
|
7
|
-
import { useCallback, useRef, useState } from "react";
|
|
8
|
-
import { GLOBAL_HEADER_DATA_TESTID } from "../../../../constants/index.js";
|
|
9
|
-
import { useCallbackAfterRender } from "../../../../utils/useCallbackAfterRender.js";
|
|
10
|
-
import { StyledButton } from "../../../styles.js";
|
|
11
|
-
const AppPicker = ({ label, setRef, componentProps, ...otherProps }) => {
|
|
12
|
-
const [isOpen, setIsOpen] = useState(false);
|
|
13
|
-
const internalTriggerRef = useRef(null);
|
|
14
|
-
const {
|
|
15
|
-
apps,
|
|
16
|
-
icon,
|
|
17
|
-
customApps,
|
|
18
|
-
sectionTitle,
|
|
19
|
-
customSectionTitle,
|
|
20
|
-
actionRef,
|
|
21
|
-
isOpen: userIsOpen,
|
|
22
|
-
onKeyDown: userOnKeyDown,
|
|
23
|
-
onClickOutside: userOnClickOutside,
|
|
24
|
-
renderTrigger: userRenderTrigger,
|
|
25
|
-
onClose,
|
|
26
|
-
triggerRef,
|
|
27
|
-
triggerOnClick
|
|
28
|
-
} = componentProps;
|
|
29
|
-
const schedule = useCallbackAfterRender();
|
|
30
|
-
const focusTrigger = useCallback(() => internalTriggerRef.current?.focus(), []);
|
|
31
|
-
const handleTriggerKeyDown = useCallback((e) => {
|
|
32
|
-
if (e.code === "Enter" || e.code === "Space" || e.code === "ArrowDown") {
|
|
33
|
-
setIsOpen(true);
|
|
34
|
-
}
|
|
35
|
-
}, []);
|
|
36
|
-
const handleAppPickerOnKeyDown = useCallback(
|
|
37
|
-
(e) => {
|
|
38
|
-
if (e.key === "Escape") {
|
|
39
|
-
setIsOpen(false);
|
|
40
|
-
schedule(focusTrigger);
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
[focusTrigger, schedule]
|
|
44
|
-
);
|
|
45
|
-
const handleOnClickOutside = useCallback(() => {
|
|
46
|
-
setIsOpen(false);
|
|
47
|
-
}, []);
|
|
48
|
-
const handleOnClick = useCallback(
|
|
49
|
-
(e) => {
|
|
50
|
-
setIsOpen(true);
|
|
51
|
-
setTimeout(() => {
|
|
52
|
-
if (e.detail === 0) actionRef?.current?.focusSelectedOrFirstAvailable?.();
|
|
53
|
-
else actionRef?.current?.focusWrapper();
|
|
54
|
-
}, 10);
|
|
55
|
-
},
|
|
56
|
-
[actionRef]
|
|
57
|
-
);
|
|
58
|
-
const TriggerDefaultComponent = ({ ref }) => /* @__PURE__ */ jsx(
|
|
59
|
-
StyledButton,
|
|
60
|
-
{
|
|
61
|
-
onClick: triggerOnClick ?? handleOnClick,
|
|
62
|
-
onKeyDown: handleTriggerKeyDown,
|
|
63
|
-
innerRef: (buttonRef) => {
|
|
64
|
-
setRef(buttonRef);
|
|
65
|
-
mergeRefs(internalTriggerRef, triggerRef, ref)(buttonRef);
|
|
66
|
-
},
|
|
67
|
-
"aria-label": label,
|
|
68
|
-
"data-testid": GLOBAL_HEADER_DATA_TESTID.MENUBAR_ITEM_BUTTON,
|
|
69
|
-
"aria-haspopup": true,
|
|
70
|
-
"aria-expanded": userIsOpen ?? isOpen,
|
|
71
|
-
...getGlobalAttributes(otherProps),
|
|
72
|
-
type: "button",
|
|
73
|
-
children: /* @__PURE__ */ jsx(MenuPicker, { width: 20.73, height: 20.73 })
|
|
74
|
-
}
|
|
75
|
-
);
|
|
76
|
-
return /* @__PURE__ */ jsx(
|
|
77
|
-
DSAppPicker,
|
|
78
|
-
{
|
|
79
|
-
apps,
|
|
80
|
-
customApps,
|
|
81
|
-
sectionTitle,
|
|
82
|
-
customSectionTitle,
|
|
83
|
-
icon,
|
|
84
|
-
onKeyDown: userOnKeyDown ?? handleAppPickerOnKeyDown,
|
|
85
|
-
actionRef,
|
|
86
|
-
onClickOutside: userOnClickOutside ?? handleOnClickOutside,
|
|
87
|
-
renderTrigger: userRenderTrigger || TriggerDefaultComponent,
|
|
88
|
-
isOpen: userIsOpen ?? isOpen,
|
|
89
|
-
onClose,
|
|
90
|
-
triggerRef
|
|
91
|
-
}
|
|
92
|
-
);
|
|
93
|
-
};
|
|
94
|
-
export {
|
|
95
|
-
AppPicker
|
|
96
|
-
};
|
|
97
|
-
//# sourceMappingURL=AppPicker.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../../src/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSAppPicker } from '@elliemae/ds-app-picker';\nimport { MenuPicker } from '@elliemae/ds-icons';\nimport { getGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useRef, useState } from 'react';\nimport { GLOBAL_HEADER_DATA_TESTID } from '../../../../constants/index.js';\nimport type { DSGlobalHeaderT } from '../../../../react-desc-prop-types.js';\nimport { useCallbackAfterRender } from '../../../../utils/useCallbackAfterRender.js';\nimport { StyledButton } from '../../../styles.js';\n\ntype AppPickerOutOfTheBoxProps =\n // what comes from\n // the prop toolbar (array)\n // specifically only if the type is 'ds-app-picker' so they give us the correct interface\n DSGlobalHeaderT.AppPickerProps & {\n // this interface is an addition that comes from our own implementation\n // GlobalHeaderToolbar -> useGlobalHeaderToolbar\n // is handling focus management for the user when using our out of the box\n setRef: (ref: HTMLElement) => void;\n };\n\nexport const AppPicker = ({ label, setRef, componentProps, ...otherProps }: AppPickerOutOfTheBoxProps): JSX.Element => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const internalTriggerRef = useRef<HTMLButtonElement>(null);\n\n const {\n apps,\n icon,\n customApps,\n sectionTitle,\n customSectionTitle,\n actionRef,\n isOpen: userIsOpen,\n onKeyDown: userOnKeyDown,\n onClickOutside: userOnClickOutside,\n renderTrigger: userRenderTrigger,\n onClose,\n triggerRef,\n triggerOnClick,\n } = componentProps;\n\n const schedule = useCallbackAfterRender();\n\n // const appPickerRef = useRef(null);\n // const internalActionRef = useMemo(() => actionRef ?? appPickerRef, [actionRef]);\n\n const focusTrigger = useCallback(() => internalTriggerRef.current?.focus(), []);\n\n const handleTriggerKeyDown: React.KeyboardEventHandler = useCallback((e) => {\n if (e.code === 'Enter' || e.code === 'Space' || e.code === 'ArrowDown') {\n setIsOpen(true);\n }\n }, []);\n\n const handleAppPickerOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n setIsOpen(false);\n schedule(focusTrigger);\n }\n },\n [focusTrigger, schedule],\n );\n\n const handleOnClickOutside = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const handleOnClick: React.MouseEventHandler = useCallback(\n (e) => {\n setIsOpen(true);\n setTimeout(() => {\n if (e.detail === 0) actionRef?.current?.focusSelectedOrFirstAvailable?.();\n else actionRef?.current?.focusWrapper();\n }, 10);\n },\n [actionRef],\n );\n\n // eslint-disable-next-line react/no-unstable-nested-components\n const TriggerDefaultComponent = ({ ref }: { ref: React.MutableRefObject<HTMLButtonElement> }) => (\n <StyledButton\n onClick={triggerOnClick ?? handleOnClick}\n onKeyDown={handleTriggerKeyDown}\n innerRef={(buttonRef: HTMLButtonElement) => {\n setRef(buttonRef);\n mergeRefs(internalTriggerRef, triggerRef, ref)(buttonRef);\n }}\n aria-label={label}\n data-testid={GLOBAL_HEADER_DATA_TESTID.MENUBAR_ITEM_BUTTON}\n aria-haspopup\n aria-expanded={userIsOpen ?? isOpen}\n {...getGlobalAttributes(otherProps)}\n type=\"button\"\n >\n <MenuPicker width={20.73} height={20.73} />\n </StyledButton>\n );\n\n return (\n <DSAppPicker\n apps={apps}\n customApps={customApps}\n sectionTitle={sectionTitle}\n customSectionTitle={customSectionTitle}\n icon={icon}\n onKeyDown={userOnKeyDown ?? handleAppPickerOnKeyDown}\n actionRef={actionRef}\n onClickOutside={userOnClickOutside ?? handleOnClickOutside}\n renderTrigger={userRenderTrigger || TriggerDefaultComponent}\n isOpen={userIsOpen ?? isOpen}\n onClose={onClose}\n triggerRef={triggerRef}\n />\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC+FjB;AA/FN,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,2BAA2B;AACpC,SAAS,iBAAiB;AAC1B,SAAgB,aAAa,QAAQ,gBAAgB;AACrD,SAAS,iCAAiC;AAE1C,SAAS,8BAA8B;AACvC,SAAS,oBAAoB;AAatB,MAAM,YAAY,CAAC,EAAE,OAAO,QAAQ,gBAAgB,GAAG,WAAW,MAA8C;AACrH,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAkB,KAAK;AACnD,QAAM,qBAAqB,OAA0B,IAAI;AAEzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,WAAW,uBAAuB;AAKxC,QAAM,eAAe,YAAY,MAAM,mBAAmB,SAAS,MAAM,GAAG,CAAC,CAAC;AAE9E,QAAM,uBAAmD,YAAY,CAAC,MAAM;AAC1E,QAAI,EAAE,SAAS,WAAW,EAAE,SAAS,WAAW,EAAE,SAAS,aAAa;AACtE,gBAAU,IAAI;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAA2B;AAC1B,UAAI,EAAE,QAAQ,UAAU;AACtB,kBAAU,KAAK;AACf,iBAAS,YAAY;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,cAAc,QAAQ;AAAA,EACzB;AAEA,QAAM,uBAAuB,YAAY,MAAM;AAC7C,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC;AAAA,IAC7C,CAAC,MAAM;AACL,gBAAU,IAAI;AACd,iBAAW,MAAM;AACf,YAAI,EAAE,WAAW,EAAG,YAAW,SAAS,gCAAgC;AAAA,YACnE,YAAW,SAAS,aAAa;AAAA,MACxC,GAAG,EAAE;AAAA,IACP;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAGA,QAAM,0BAA0B,CAAC,EAAE,IAAI,MACrC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,kBAAkB;AAAA,MAC3B,WAAW;AAAA,MACX,UAAU,CAAC,cAAiC;AAC1C,eAAO,SAAS;AAChB,kBAAU,oBAAoB,YAAY,GAAG,EAAE,SAAS;AAAA,MAC1D;AAAA,MACA,cAAY;AAAA,MACZ,eAAa,0BAA0B;AAAA,MACvC,iBAAa;AAAA,MACb,iBAAe,cAAc;AAAA,MAC5B,GAAG,oBAAoB,UAAU;AAAA,MAClC,MAAK;AAAA,MAEL,8BAAC,cAAW,OAAO,OAAO,QAAQ,OAAO;AAAA;AAAA,EAC3C;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,iBAAiB;AAAA,MAC5B;AAAA,MACA,gBAAgB,sBAAsB;AAAA,MACtC,eAAe,qBAAqB;AAAA,MACpC,QAAQ,cAAc;AAAA,MACtB;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { useRef, useLayoutEffect, useMemo, useEffect } from "react";
|
|
3
|
-
const useCallbackAfterRender = (isLayout = false) => {
|
|
4
|
-
const lastRun = useRef(null);
|
|
5
|
-
const effect = useMemo(() => isLayout ? useLayoutEffect : useEffect, [isLayout]);
|
|
6
|
-
effect(() => {
|
|
7
|
-
lastRun.current?.();
|
|
8
|
-
lastRun.current = null;
|
|
9
|
-
});
|
|
10
|
-
return (callback) => {
|
|
11
|
-
lastRun.current = callback;
|
|
12
|
-
};
|
|
13
|
-
};
|
|
14
|
-
export {
|
|
15
|
-
useCallbackAfterRender
|
|
16
|
-
};
|
|
17
|
-
//# sourceMappingURL=useCallbackAfterRender.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/useCallbackAfterRender.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useRef, useLayoutEffect, useMemo, useEffect } from 'react';\n\ntype Callback = (callback: () => void) => void;\n\n// Inspired in https://github.com/ryuuji3/react-hooks/blob/4b183d61c30abf17efeab2240f8ff652a5dbb8e2/packages/use-callback-after-render/src/hooks/useCallbackAfterRender.ts\nexport const useCallbackAfterRender = (isLayout = false): Callback => {\n const lastRun = useRef<(() => void) | null>(null);\n\n const effect = useMemo(() => (isLayout ? useLayoutEffect : useEffect), [isLayout]);\n\n effect(() => {\n lastRun.current?.();\n lastRun.current = null;\n });\n\n return (callback) => {\n lastRun.current = callback; // schedule callback after render\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,iBAAiB,SAAS,iBAAiB;AAKrD,MAAM,yBAAyB,CAAC,WAAW,UAAoB;AACpE,QAAM,UAAU,OAA4B,IAAI;AAEhD,QAAM,SAAS,QAAQ,MAAO,WAAW,kBAAkB,WAAY,CAAC,QAAQ,CAAC;AAEjF,SAAO,MAAM;AACX,YAAQ,UAAU;AAClB,YAAQ,UAAU;AAAA,EACpB,CAAC;AAED,SAAO,CAAC,aAAa;AACnB,YAAQ,UAAU;AAAA,EACpB;AACF;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function useOnClickOutside<T extends Node>(ref: T | null, cb: (event: Event) => void): void;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import type { DSGlobalHeaderT } from '../../../../react-desc-prop-types.js';
|
|
2
|
-
type AppPickerOutOfTheBoxProps = DSGlobalHeaderT.AppPickerProps & {
|
|
3
|
-
setRef: (ref: HTMLElement) => void;
|
|
4
|
-
};
|
|
5
|
-
export declare const AppPicker: ({ label, setRef, componentProps, ...otherProps }: AppPickerOutOfTheBoxProps) => JSX.Element;
|
|
6
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
export const appPickerMenuItemCb: jest.Mock<null, [], any>;
|
|
2
|
-
export const popupMenuItemCb: jest.Mock<null, [], any>;
|
|
3
|
-
export const menubarItemCb: jest.Mock<null, [], any>;
|
|
4
|
-
export const breadcrumbItemCb: jest.Mock<null, [], any>;
|
|
5
|
-
export function useToolbar(): {
|
|
6
|
-
toolbar: ({
|
|
7
|
-
id: string;
|
|
8
|
-
type: string;
|
|
9
|
-
label: string;
|
|
10
|
-
componentProps: {
|
|
11
|
-
options: ({
|
|
12
|
-
type: string;
|
|
13
|
-
Content: () => import("react/jsx-runtime").JSX.Element;
|
|
14
|
-
label?: undefined;
|
|
15
|
-
onClick?: undefined;
|
|
16
|
-
} | {
|
|
17
|
-
type: string;
|
|
18
|
-
Content?: undefined;
|
|
19
|
-
label?: undefined;
|
|
20
|
-
onClick?: undefined;
|
|
21
|
-
} | {
|
|
22
|
-
label: string;
|
|
23
|
-
onClick: () => null;
|
|
24
|
-
type?: undefined;
|
|
25
|
-
Content?: undefined;
|
|
26
|
-
})[];
|
|
27
|
-
closeOnClick: boolean;
|
|
28
|
-
};
|
|
29
|
-
Icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
30
|
-
onClick: jest.Mock<null, [], any>;
|
|
31
|
-
} | {
|
|
32
|
-
id: string;
|
|
33
|
-
type: string;
|
|
34
|
-
label: string;
|
|
35
|
-
componentProps: {
|
|
36
|
-
options: ({
|
|
37
|
-
label: string;
|
|
38
|
-
onClick: () => null;
|
|
39
|
-
type?: undefined;
|
|
40
|
-
'data-separator'?: undefined;
|
|
41
|
-
} | {
|
|
42
|
-
type: string;
|
|
43
|
-
'data-separator': boolean;
|
|
44
|
-
label?: undefined;
|
|
45
|
-
onClick?: undefined;
|
|
46
|
-
})[];
|
|
47
|
-
closeOnClick: boolean;
|
|
48
|
-
};
|
|
49
|
-
Icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
50
|
-
onClick: () => null;
|
|
51
|
-
} | {
|
|
52
|
-
id: string;
|
|
53
|
-
type: string;
|
|
54
|
-
label: string;
|
|
55
|
-
componentProps: {
|
|
56
|
-
sectionTitle: string;
|
|
57
|
-
apps: ({
|
|
58
|
-
id: number;
|
|
59
|
-
label: string;
|
|
60
|
-
icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
61
|
-
onClick: (a: any, item: any) => void;
|
|
62
|
-
selected: boolean;
|
|
63
|
-
disabled?: undefined;
|
|
64
|
-
} | {
|
|
65
|
-
id: number;
|
|
66
|
-
label: string;
|
|
67
|
-
icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
68
|
-
onClick: (a: any, item: any) => void;
|
|
69
|
-
disabled: boolean;
|
|
70
|
-
selected: boolean;
|
|
71
|
-
})[];
|
|
72
|
-
customSectionTitle: string;
|
|
73
|
-
customApps: {
|
|
74
|
-
id: number;
|
|
75
|
-
label: string;
|
|
76
|
-
icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
77
|
-
onClick: (a: any, item: any) => void;
|
|
78
|
-
selected: boolean;
|
|
79
|
-
}[];
|
|
80
|
-
};
|
|
81
|
-
} | {
|
|
82
|
-
type: string;
|
|
83
|
-
id: string;
|
|
84
|
-
componentProps: {
|
|
85
|
-
value: string;
|
|
86
|
-
onNext: () => void;
|
|
87
|
-
onPrevious: () => void;
|
|
88
|
-
onBlur: () => void;
|
|
89
|
-
onClear: () => void;
|
|
90
|
-
currentResultIndex: number;
|
|
91
|
-
onChange: (v: any) => void;
|
|
92
|
-
totalResults: number;
|
|
93
|
-
};
|
|
94
|
-
label: string;
|
|
95
|
-
Icon?: undefined;
|
|
96
|
-
onClick?: undefined;
|
|
97
|
-
} | {
|
|
98
|
-
id: string;
|
|
99
|
-
Icon: (rest: import("@elliemae/ds-icons").SvgIconT.Props) => import("react/jsx-runtime").JSX.Element;
|
|
100
|
-
label: string;
|
|
101
|
-
onClick: () => void;
|
|
102
|
-
type?: undefined;
|
|
103
|
-
componentProps?: undefined;
|
|
104
|
-
})[];
|
|
105
|
-
resultIndexes: never[];
|
|
106
|
-
selected: number;
|
|
107
|
-
};
|
|
108
|
-
export function useBreadcrumb(): {
|
|
109
|
-
label: string;
|
|
110
|
-
hasNext: boolean;
|
|
111
|
-
isSelected: boolean;
|
|
112
|
-
onClick: () => void;
|
|
113
|
-
}[];
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|