@elliemae/ds-global-header 3.4.2 → 3.4.3
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 -7
- package/dist/cjs/DSGlobalHeader.js.map +2 -2
- package/dist/cjs/DSGlobalHeaderContext.js +4 -1
- package/dist/cjs/DSGlobalHeaderContext.js.map +1 -1
- package/dist/cjs/config/useGlobalHeader.js +18 -9
- package/dist/cjs/config/useGlobalHeader.js.map +2 -2
- package/dist/cjs/config/useValidateProps.js +4 -1
- package/dist/cjs/config/useValidateProps.js.map +1 -1
- package/dist/cjs/config/validateHelpers.js +24 -11
- package/dist/cjs/config/validateHelpers.js.map +1 -1
- package/dist/cjs/exported-related/DSGlobalHeaderDatatestid.js +4 -1
- package/dist/cjs/exported-related/DSGlobalHeaderDatatestid.js.map +1 -1
- package/dist/cjs/exported-related/index.js +4 -1
- package/dist/cjs/exported-related/index.js.map +1 -1
- package/dist/cjs/exported-related/theming.js +4 -1
- package/dist/cjs/exported-related/theming.js.map +1 -1
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/parts/Breadcrumb/GlobalHeaderBreadcrumb.js +35 -27
- package/dist/cjs/parts/Breadcrumb/GlobalHeaderBreadcrumb.js.map +1 -1
- package/dist/cjs/parts/Breadcrumb/PureBreadcrumb.js +40 -28
- package/dist/cjs/parts/Breadcrumb/PureBreadcrumb.js.map +2 -2
- package/dist/cjs/parts/Breadcrumb/styles.js +4 -1
- package/dist/cjs/parts/Breadcrumb/styles.js.map +1 -1
- package/dist/cjs/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js +12 -6
- package/dist/cjs/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js.map +1 -1
- package/dist/cjs/parts/GlobalHeaderContainer.js +9 -5
- package/dist/cjs/parts/GlobalHeaderContainer.js.map +1 -1
- package/dist/cjs/parts/Logo/GlobalHeaderLogo.js +13 -5
- package/dist/cjs/parts/Logo/GlobalHeaderLogo.js.map +1 -1
- package/dist/cjs/parts/Logo/styles.js +4 -1
- package/dist/cjs/parts/Logo/styles.js.map +1 -1
- package/dist/cjs/parts/Toolbar/GlobalHeaderToolbar.js +90 -83
- package/dist/cjs/parts/Toolbar/GlobalHeaderToolbar.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js +14 -9
- package/dist/cjs/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js.map +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js +58 -41
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js.map +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js +80 -68
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js +4 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js.map +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js +26 -20
- package/dist/cjs/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js.map +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js +60 -42
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js.map +2 -2
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/styles.js +4 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/SearchToggle/styles.js.map +1 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/index.js +4 -1
- package/dist/cjs/parts/Toolbar/outOfTheBox/index.js.map +1 -1
- package/dist/cjs/parts/Toolbar/styles.js +4 -1
- package/dist/cjs/parts/Toolbar/styles.js.map +1 -1
- package/dist/cjs/parts/Toolbar/useGlobalHeaderToolbar.js +15 -9
- package/dist/cjs/parts/Toolbar/useGlobalHeaderToolbar.js.map +1 -1
- package/dist/cjs/parts/styles.js +4 -1
- package/dist/cjs/parts/styles.js.map +1 -1
- package/dist/cjs/react-desc-prop-types.js +10 -3
- package/dist/cjs/react-desc-prop-types.js.map +1 -1
- package/dist/cjs/sharedTypes.js +4 -1
- package/dist/cjs/sharedTypes.js.map +1 -1
- package/dist/esm/DSGlobalHeader.js +12 -6
- package/dist/esm/DSGlobalHeader.js.map +1 -1
- package/dist/esm/DSGlobalHeaderContext.js.map +1 -1
- package/dist/esm/config/useGlobalHeader.js +14 -8
- package/dist/esm/config/useGlobalHeader.js.map +2 -2
- package/dist/esm/config/useValidateProps.js.map +1 -1
- package/dist/esm/config/validateHelpers.js +20 -10
- package/dist/esm/config/validateHelpers.js.map +1 -1
- package/dist/esm/exported-related/DSGlobalHeaderDatatestid.js.map +1 -1
- package/dist/esm/exported-related/index.js.map +1 -1
- package/dist/esm/exported-related/theming.js.map +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/parts/Breadcrumb/GlobalHeaderBreadcrumb.js +31 -26
- package/dist/esm/parts/Breadcrumb/GlobalHeaderBreadcrumb.js.map +1 -1
- package/dist/esm/parts/Breadcrumb/PureBreadcrumb.js +36 -27
- package/dist/esm/parts/Breadcrumb/PureBreadcrumb.js.map +2 -2
- package/dist/esm/parts/Breadcrumb/styles.js.map +1 -1
- package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js +8 -5
- package/dist/esm/parts/Breadcrumb/useGlobalHeaderBreadcrumb.js.map +1 -1
- package/dist/esm/parts/GlobalHeaderContainer.js +5 -4
- package/dist/esm/parts/GlobalHeaderContainer.js.map +1 -1
- package/dist/esm/parts/Logo/GlobalHeaderLogo.js +9 -4
- package/dist/esm/parts/Logo/GlobalHeaderLogo.js.map +1 -1
- package/dist/esm/parts/Logo/styles.js.map +1 -1
- package/dist/esm/parts/Toolbar/GlobalHeaderToolbar.js +86 -82
- package/dist/esm/parts/Toolbar/GlobalHeaderToolbar.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js +10 -8
- package/dist/esm/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js +54 -40
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/PopupMenu.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js +76 -67
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/PopupMenuContent.js.map +2 -2
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/styles.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js +22 -19
- package/dist/esm/parts/Toolbar/outOfTheBox/PopupMenu/menuContent/usePopupMenuContent.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js +56 -41
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/SearchToggle.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/SearchToggle/styles.js.map +1 -1
- package/dist/esm/parts/Toolbar/outOfTheBox/index.js.map +1 -1
- package/dist/esm/parts/Toolbar/styles.js.map +1 -1
- package/dist/esm/parts/Toolbar/useGlobalHeaderToolbar.js +11 -8
- package/dist/esm/parts/Toolbar/useGlobalHeaderToolbar.js.map +1 -1
- package/dist/esm/parts/styles.js.map +1 -1
- package/dist/esm/react-desc-prop-types.js +6 -2
- package/dist/esm/react-desc-prop-types.js.map +1 -1
- package/dist/esm/sharedTypes.js.map +1 -1
- package/package.json +8 -8
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Breadcrumb/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallRight } from '@elliemae/ds-icons';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\ninterface PipeT {\n showIconOnly: boolean;\n}\n\ninterface ChevronT {\n size: string;\n}\n\ninterface LabelT {\n isSelected: boolean;\n isOnlyItem: boolean;\n}\n\nexport const StyledBreadcrumbContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CONTAINER,\n})``;\n\nexport const StyledBreadcrumbList = styled('ul', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.LIST,\n})`\n display: grid;\n grid-auto-flow: column;\n min-width: fit-content;\n align-items: center;\n margin: 0;\n padding: 0;\n height: 100%;\n`;\n\nexport const StyledPipe = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.PIPE,\n})<PipeT>`\n margin: 0 7px 0 0;\n border-left: ${({ theme, showIconOnly }) => (showIconOnly ? 'none' : `1px solid ${theme.colors.neutral['000']}`)};\n height: 20px;\n`;\n\nexport const StyledChevron = styled(ChevronSmallRight, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.CHEVRON,\n})<ChevronT>`\n fill: ${({ theme }) => theme.colors.neutral['000']};\n`;\n\nexport const StyledBreadcrumbItem = styled('li', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM,\n})`\n display: flex;\n align-items: center;\n height: 40px;\n`;\n\nexport const StyledLink = styled('a', { name: DSGlobalHeaderName, slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK })`\n width: fit-content;\n height: 40px;\n display: grid;\n place-items: center;\n margin: 0;\n padding: 0;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n cursor: pointer;\n position: relative;\n &:focus {\n :before {\n content: '';\n position: absolute;\n z-index: 2;\n top: 2px;\n left: -5px;\n width: calc(100% + 10px);\n height: calc(100% - 4px);\n border: 2px solid ${({ theme }) => theme.colors.neutral['000']};\n border-radius: 4px;\n }\n }\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.BREADCRUMB.ITEM_LINK_LABEL,\n})<LabelT>`\n color: ${({ theme }) => theme.colors.neutral['000']};\n ${({ theme, isSelected }) =>\n `-webkit-text-stroke: 0.4px ${isSelected ? theme.colors.neutral['000'] : 'transparent'}`};\n font-size: 16px;\n line-height: 1;\n text-transform: uppercase;\n border-bottom: ${({ theme, isSelected, isOnlyItem }) =>\n `2px solid ${isSelected && !isOnlyItem ? theme.colors.neutral['000'] : 'transparent'}`};\n margin: 3px 5px 0 5px;\n :hover {\n ${({ theme }) => `-webkit-text-stroke: 0.4px ${theme.colors.neutral['000']}`};\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAuB;AACvB,qBAAqB;AACrB,sBAAkC;AAClC,qBAAwD;AAejD,MAAM,gCAA4B,yBAAO,qBAAM;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAEM,MAAM,2BAAuB,yBAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUM,MAAM,iBAAa,yBAAO,QAAQ;AAAA,EACvC,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA,iBAEgB,CAAC,EAAE,OAAO,aAAa,MAAO,eAAe,SAAS,aAAa,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlG,MAAM,oBAAgB,yBAAO,mCAAmB;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA,UACS,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGvC,MAAM,2BAAuB,yBAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,iBAAa,yBAAO,KAAK,EAAE,MAAM,mCAAoB,MAAM,mCAAoB,WAAW,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAqBxF,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAMvD,MAAM,kBAAc,yBAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,mCAAoB,WAAW;AACvC,CAAC;AAAA,WACU,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC3C,CAAC,EAAE,OAAO,WAAW,MACrB,+BAA+B,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA;AAAA,mBAI3D,CAAC,EAAE,OAAO,YAAY,WAAW,MAChD,aAAa,cAAc,CAAC,aAAa,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA;AAAA,MAGrE,CAAC,EAAE,MAAM,MAAM,8BAA8B,MAAM,OAAO,QAAQ;AAAA;AAAA;",
|
|
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 useGlobalHeaderBreadcrumb_exports = {};
|
|
23
26
|
__export(useGlobalHeaderBreadcrumb_exports, {
|
|
@@ -50,11 +53,14 @@ const useGlobalHeaderBreadcrumb = () => {
|
|
|
50
53
|
window.addEventListener("resize", evaluateShowIconOnly);
|
|
51
54
|
return () => window.removeEventListener("resize", evaluateShowIconOnly);
|
|
52
55
|
}, [breakpointRef, flexRegionRef, setShowIconOnly]);
|
|
53
|
-
const handleOnKeyDown = (0, import_react.useCallback)(
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
56
|
+
const handleOnKeyDown = (0, import_react.useCallback)(
|
|
57
|
+
(onClick) => (e) => {
|
|
58
|
+
if (e.key === " " || e.key === "Enter") {
|
|
59
|
+
onClick();
|
|
60
|
+
}
|
|
61
|
+
},
|
|
62
|
+
[]
|
|
63
|
+
);
|
|
58
64
|
return {
|
|
59
65
|
breadcrumb,
|
|
60
66
|
showIconOnly,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Breadcrumb/useGlobalHeaderBreadcrumb.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useEffect, useRef, useContext, useCallback } from 'react';\nimport { DSGlobalHeaderContext } from '../../DSGlobalHeaderContext';\nimport type { DSGlobalHeaderInternalsT } from '../../sharedTypes';\n\ninterface UseGlobalHeaderBreadcrumbReturnT {\n breadcrumb: DSGlobalHeaderInternalsT.BreadcrumbItem[];\n showIconOnly: boolean;\n flexRegionRef: React.MutableRefObject<HTMLDivElement | null>;\n handleOnKeyDown: (onClick: (event?: React.MouseEvent) => void) => (event: React.KeyboardEvent) => void;\n instanceUID: string;\n}\n\nexport const useGlobalHeaderBreadcrumb = (): UseGlobalHeaderBreadcrumbReturnT => {\n const {\n props: { breadcrumb },\n instanceUID,\n showIconOnly,\n setShowIconOnly,\n } = useContext(DSGlobalHeaderContext);\n\n const breakpointRef = useRef<number | null>(null);\n const flexRegionRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const evaluateShowIconOnly = () => {\n if (flexRegionRef.current && flexRegionRef.current.offsetWidth <= 0 && !breakpointRef.current) {\n setShowIconOnly(true);\n breakpointRef.current = window.innerWidth;\n } else if (breakpointRef.current && window.innerWidth >= breakpointRef.current) {\n setShowIconOnly(false);\n breakpointRef.current = null;\n }\n };\n\n evaluateShowIconOnly();\n\n window.addEventListener('resize', evaluateShowIconOnly);\n return () => window.removeEventListener('resize', evaluateShowIconOnly);\n }, [breakpointRef, flexRegionRef, setShowIconOnly]);\n\n const handleOnKeyDown = useCallback(\n (onClick: (event?: React.MouseEvent) => void) => (e: React.KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n onClick();\n }\n },\n [],\n );\n\n return {\n breadcrumb,\n showIconOnly,\n flexRegionRef,\n handleOnKeyDown,\n instanceUID,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkE;AAClE,mCAAsC;AAW/B,MAAM,4BAA4B,MAAwC;AAC/E,QAAM;AAAA,IACJ,OAAO,EAAE,WAAW;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kDAAqB;AAEpC,QAAM,oBAAgB,qBAAsB,IAAI;AAChD,QAAM,oBAAgB,qBAAuB,IAAI;AAEjD,8BAAU,MAAM;AACd,UAAM,uBAAuB,MAAM;AACjC,UAAI,cAAc,WAAW,cAAc,QAAQ,eAAe,KAAK,CAAC,cAAc,SAAS;AAC7F,wBAAgB,IAAI;AACpB,sBAAc,UAAU,OAAO;AAAA,MACjC,WAAW,cAAc,WAAW,OAAO,cAAc,cAAc,SAAS;AAC9E,wBAAgB,KAAK;AACrB,sBAAc,UAAU;AAAA,MAC1B;AAAA,IACF;AAEA,yBAAqB;AAErB,WAAO,iBAAiB,UAAU,oBAAoB;AACtD,WAAO,MAAM,OAAO,oBAAoB,UAAU,oBAAoB;AAAA,EACxE,GAAG,CAAC,eAAe,eAAe,eAAe,CAAC;AAElD,QAAM,sBAAkB;AAAA,IACtB,CAAC,YAAgD,CAAC,MAA2B;AAC3E,UAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACtC,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
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 GlobalHeaderContainer_exports = {};
|
|
23
26
|
__export(GlobalHeaderContainer_exports, {
|
|
@@ -25,7 +28,7 @@ __export(GlobalHeaderContainer_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(GlobalHeaderContainer_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
32
|
var import_styles = require("./styles");
|
|
30
33
|
const GlobalHeaderContainer = ({
|
|
31
34
|
xstyledAttrs,
|
|
@@ -33,13 +36,14 @@ const GlobalHeaderContainer = ({
|
|
|
33
36
|
bg,
|
|
34
37
|
backgroundColor,
|
|
35
38
|
children
|
|
36
|
-
}) => /* @__PURE__ */
|
|
39
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, {
|
|
37
40
|
forwardedAs: "header",
|
|
38
41
|
"data-testid": "ds-global-header",
|
|
39
42
|
cols: ["auto", "1fr", "auto"],
|
|
40
43
|
bg,
|
|
41
44
|
backgroundColor,
|
|
42
45
|
...globalAttrs,
|
|
43
|
-
...xstyledAttrs
|
|
44
|
-
|
|
46
|
+
...xstyledAttrs,
|
|
47
|
+
children
|
|
48
|
+
});
|
|
45
49
|
//# sourceMappingURL=GlobalHeaderContainer.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/GlobalHeaderContainer.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { Container } from './styles';\n\ninterface GlobalHeaderContainerT {\n xstyledAttrs: Record<string, unknown>;\n globalAttrs: Record<string, unknown>;\n backgroundColor?: string;\n bg?: string;\n children: React.ReactNode;\n}\n\nexport const GlobalHeaderContainer = ({\n xstyledAttrs,\n globalAttrs,\n bg,\n backgroundColor,\n children,\n}: GlobalHeaderContainerT): JSX.Element => (\n <Container\n forwardedAs=\"header\"\n data-testid=\"ds-global-header\"\n cols={['auto', '1fr', 'auto']}\n bg={bg}\n backgroundColor={backgroundColor}\n {...globalAttrs}\n {...xstyledAttrs}\n >\n {children}\n </Container>\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,oBAA0B;AAUnB,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE,4CAAC;AAAA,EACC,aAAY;AAAA,EACZ,eAAY;AAAA,EACZ,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,EAC5B;AAAA,EACA;AAAA,EACC,GAAG;AAAA,EACH,GAAG;AAAA,EAEH;AAAA,CACH;",
|
|
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 GlobalHeaderLogo_exports = {};
|
|
23
26
|
__export(GlobalHeaderLogo_exports, {
|
|
@@ -25,7 +28,8 @@ __export(GlobalHeaderLogo_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(GlobalHeaderLogo_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_DSGlobalHeaderContext = require("../../DSGlobalHeaderContext");
|
|
30
34
|
var import_styles = require("./styles");
|
|
31
35
|
var import_exported_related = require("../../exported-related");
|
|
@@ -34,11 +38,15 @@ const GlobalHeaderLogo = () => {
|
|
|
34
38
|
props: { Logo, LogoWithBrand },
|
|
35
39
|
showIconOnly
|
|
36
40
|
} = (0, import_react.useContext)(import_DSGlobalHeaderContext.DSGlobalHeaderContext);
|
|
37
|
-
return /* @__PURE__ */
|
|
41
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledLogoContainer, {
|
|
38
42
|
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.LOGO.CONTAINER,
|
|
39
43
|
alignItems: "center",
|
|
40
44
|
pr: showIconOnly ? "0px" : "36px",
|
|
41
|
-
cols: showIconOnly ? ["auto"] : ["auto", "1fr"]
|
|
42
|
-
|
|
45
|
+
cols: showIconOnly ? ["auto"] : ["auto", "1fr"],
|
|
46
|
+
children: [
|
|
47
|
+
Logo && showIconOnly && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Logo, {}),
|
|
48
|
+
LogoWithBrand && !showIconOnly && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LogoWithBrand, {})
|
|
49
|
+
]
|
|
50
|
+
});
|
|
43
51
|
};
|
|
44
52
|
//# sourceMappingURL=GlobalHeaderLogo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Logo/GlobalHeaderLogo.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext } from 'react';\nimport { DSGlobalHeaderContext } from '../../DSGlobalHeaderContext';\nimport { StyledLogoContainer } from './styles';\nimport { DSGlobalHeaderDatatestid } from '../../exported-related';\n\nexport const GlobalHeaderLogo = (): JSX.Element => {\n const {\n props: { Logo, LogoWithBrand },\n showIconOnly,\n } = useContext(DSGlobalHeaderContext);\n\n return (\n <StyledLogoContainer\n data-testid={DSGlobalHeaderDatatestid.LOGO.CONTAINER}\n alignItems=\"center\"\n pr={showIconOnly ? '0px' : '36px'}\n cols={showIconOnly ? ['auto'] : ['auto', '1fr']}\n >\n {Logo && showIconOnly && <Logo />}\n {LogoWithBrand && !showIconOnly && <LogoWithBrand />}\n </StyledLogoContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkC;AAClC,mCAAsC;AACtC,oBAAoC;AACpC,8BAAyC;AAElC,MAAM,mBAAmB,MAAmB;AACjD,QAAM;AAAA,IACJ,OAAO,EAAE,MAAM,cAAc;AAAA,IAC7B;AAAA,EACF,QAAI,yBAAW,kDAAqB;AAEpC,SACE,6CAAC;AAAA,IACC,eAAa,iDAAyB,KAAK;AAAA,IAC3C,YAAW;AAAA,IACX,IAAI,eAAe,QAAQ;AAAA,IAC3B,MAAM,eAAe,CAAC,MAAM,IAAI,CAAC,QAAQ,KAAK;AAAA,IAE7C;AAAA,cAAQ,gBAAgB,4CAAC,QAAK;AAAA,MAC9B,iBAAiB,CAAC,gBAAgB,4CAAC,iBAAc;AAAA;AAAA,GACpD;AAEJ;",
|
|
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 styles_exports = {};
|
|
23
26
|
__export(styles_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Logo/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSGlobalHeaderName, DSGlobalHeaderSlots } from '../../exported-related/theming';\n\nexport const StyledLogoContainer = styled(Grid, {\n name: DSGlobalHeaderName,\n slot: DSGlobalHeaderSlots.LOGO.CONTAINER,\n})``;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AACrB,qBAAwD;AAEjD,MAAM,0BAAsB,yBAAO,qBAAM;AAAA,EAC9C,MAAM;AAAA,EACN,MAAM,mCAAoB,KAAK;AACjC,CAAC;",
|
|
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 GlobalHeaderToolbar_exports = {};
|
|
23
26
|
__export(GlobalHeaderToolbar_exports, {
|
|
@@ -25,7 +28,8 @@ __export(GlobalHeaderToolbar_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(GlobalHeaderToolbar_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
30
34
|
var import_styles = require("./styles");
|
|
31
35
|
var import_outOfTheBox = require("./outOfTheBox");
|
|
@@ -40,91 +44,94 @@ const GlobalHeaderToolbar = () => {
|
|
|
40
44
|
globalHeaderToolbarGrid
|
|
41
45
|
} = (0, import_react.useContext)(import_DSGlobalHeaderContext.DSGlobalHeaderContext);
|
|
42
46
|
const { listRef, setRef, keyboardNavigation } = (0, import_useGlobalHeaderToolbar.useGlobalHeaderToolbar)();
|
|
43
|
-
return /* @__PURE__ */
|
|
44
|
-
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.CONTAINER
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
Icon,
|
|
58
|
-
type,
|
|
59
|
-
onClick,
|
|
60
|
-
onKeyPress,
|
|
61
|
-
CustomComponent,
|
|
62
|
-
label,
|
|
63
|
-
id = "",
|
|
64
|
-
componentProps = {},
|
|
65
|
-
...otherProps
|
|
66
|
-
} = item;
|
|
67
|
-
switch (type) {
|
|
68
|
-
case "ds-popup-menu":
|
|
69
|
-
return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledToolbarItem, {
|
|
70
|
-
key: `${instanceUID}-ds-toolbar-item-${label}`,
|
|
71
|
-
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM
|
|
72
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_outOfTheBox.PopupMenu, {
|
|
73
|
-
title: label,
|
|
47
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledMenubarContainer, {
|
|
48
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.CONTAINER,
|
|
49
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledList, {
|
|
50
|
+
height: "100%",
|
|
51
|
+
alignItems: "center",
|
|
52
|
+
justifyContent: "center",
|
|
53
|
+
gutter: "xxs",
|
|
54
|
+
cols: globalHeaderToolbarGrid,
|
|
55
|
+
role: "menubar",
|
|
56
|
+
onKeyDown: keyboardNavigation,
|
|
57
|
+
ref: listRef,
|
|
58
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.LIST,
|
|
59
|
+
children: toolbar.map((item, index) => {
|
|
60
|
+
const {
|
|
74
61
|
Icon,
|
|
62
|
+
type,
|
|
75
63
|
onClick,
|
|
76
64
|
onKeyPress,
|
|
77
|
-
|
|
78
|
-
id,
|
|
79
|
-
componentProps,
|
|
80
|
-
...otherProps
|
|
81
|
-
}));
|
|
82
|
-
case "ds-app-picker":
|
|
83
|
-
return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledToolbarItem, {
|
|
84
|
-
key: `${instanceUID}-ds-toolbar-item-${label}`,
|
|
85
|
-
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM
|
|
86
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_outOfTheBox.AppPicker, {
|
|
65
|
+
CustomComponent,
|
|
87
66
|
label,
|
|
88
|
-
id,
|
|
89
|
-
|
|
90
|
-
componentProps,
|
|
91
|
-
...otherProps
|
|
92
|
-
}));
|
|
93
|
-
case "ds-search-toggle":
|
|
94
|
-
return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledToolbarItem, {
|
|
95
|
-
key: `${instanceUID}-ds-toolbar-item-${label}`,
|
|
96
|
-
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM
|
|
97
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_outOfTheBox.SearchToggle, {
|
|
98
|
-
id,
|
|
99
|
-
setRef: setRef(index),
|
|
100
|
-
componentProps,
|
|
67
|
+
id = "",
|
|
68
|
+
componentProps = {},
|
|
101
69
|
...otherProps
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
70
|
+
} = item;
|
|
71
|
+
switch (type) {
|
|
72
|
+
case "ds-popup-menu":
|
|
73
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledToolbarItem, {
|
|
74
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM,
|
|
75
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outOfTheBox.PopupMenu, {
|
|
76
|
+
title: label,
|
|
77
|
+
Icon,
|
|
78
|
+
onClick,
|
|
79
|
+
onKeyPress,
|
|
80
|
+
setRef: setRef(index),
|
|
81
|
+
id,
|
|
82
|
+
componentProps,
|
|
83
|
+
...otherProps
|
|
84
|
+
})
|
|
85
|
+
}, `${instanceUID}-ds-toolbar-item-${label}`);
|
|
86
|
+
case "ds-app-picker":
|
|
87
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledToolbarItem, {
|
|
88
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM,
|
|
89
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outOfTheBox.AppPicker, {
|
|
90
|
+
label,
|
|
91
|
+
id,
|
|
92
|
+
setRef: setRef(index),
|
|
93
|
+
componentProps,
|
|
94
|
+
...otherProps
|
|
95
|
+
})
|
|
96
|
+
}, `${instanceUID}-ds-toolbar-item-${label}`);
|
|
97
|
+
case "ds-search-toggle":
|
|
98
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledToolbarItem, {
|
|
99
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM,
|
|
100
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outOfTheBox.SearchToggle, {
|
|
101
|
+
id,
|
|
102
|
+
setRef: setRef(index),
|
|
103
|
+
componentProps,
|
|
104
|
+
...otherProps
|
|
105
|
+
})
|
|
106
|
+
}, `${instanceUID}-ds-toolbar-item-${label}`);
|
|
107
|
+
case "custom":
|
|
108
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledToolbarItem, {
|
|
109
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM,
|
|
110
|
+
children: CustomComponent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CustomComponent, {
|
|
111
|
+
item,
|
|
112
|
+
role: "menuitem",
|
|
113
|
+
setRef: setRef(index)
|
|
114
|
+
})
|
|
115
|
+
}, `${instanceUID}-ds-toolbar-item-${label}`);
|
|
116
|
+
default:
|
|
117
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledToolbarItem, {
|
|
118
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM,
|
|
119
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles2.StyledButton, {
|
|
120
|
+
onClick,
|
|
121
|
+
title: label,
|
|
122
|
+
"data-testid": import_exported_related.DSGlobalHeaderDatatestid.MENUBAR.ITEM_BUTTON,
|
|
123
|
+
id,
|
|
124
|
+
role: "menuitem",
|
|
125
|
+
ref: setRef(index),
|
|
126
|
+
...(0, import_ds_utilities.getGlobalAttributes)(otherProps),
|
|
127
|
+
children: Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {
|
|
128
|
+
size: "m"
|
|
129
|
+
})
|
|
130
|
+
})
|
|
131
|
+
}, `${instanceUID}-ds-toolbar-item-${label}`);
|
|
132
|
+
}
|
|
133
|
+
})
|
|
134
|
+
})
|
|
135
|
+
});
|
|
129
136
|
};
|
|
130
137
|
//# sourceMappingURL=GlobalHeaderToolbar.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Toolbar/GlobalHeaderToolbar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext } from 'react';\nimport { getGlobalAttributes } from '@elliemae/ds-utilities';\nimport { StyledList, StyledMenubarContainer, StyledToolbarItem } from './styles';\nimport { AppPicker, PopupMenu, SearchToggle } from './outOfTheBox';\nimport { StyledButton } from '../styles';\nimport { DSGlobalHeaderContext } from '../../DSGlobalHeaderContext';\nimport { DSGlobalHeaderDatatestid } from '../../exported-related';\nimport { useGlobalHeaderToolbar } from './useGlobalHeaderToolbar';\nimport type { DSGlobalHeaderInternalsT } from '../../sharedTypes';\n\nexport const GlobalHeaderToolbar = (): JSX.Element => {\n const {\n props: { toolbar },\n instanceUID,\n globalHeaderToolbarGrid,\n } = useContext(DSGlobalHeaderContext);\n\n const { listRef, setRef, keyboardNavigation } = useGlobalHeaderToolbar();\n\n return (\n <StyledMenubarContainer data-testid={DSGlobalHeaderDatatestid.MENUBAR.CONTAINER}>\n <StyledList\n height=\"100%\"\n alignItems=\"center\"\n justifyContent=\"center\"\n gutter=\"xxs\"\n cols={globalHeaderToolbarGrid}\n role=\"menubar\"\n onKeyDown={keyboardNavigation}\n ref={listRef}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.LIST}\n >\n {toolbar.map((item, index) => {\n const {\n Icon,\n type,\n onClick,\n onKeyPress,\n CustomComponent,\n label,\n id = '',\n componentProps = {},\n ...otherProps\n } = item;\n\n switch (type) {\n case 'ds-popup-menu':\n return (\n <StyledToolbarItem\n key={`${instanceUID}-ds-toolbar-item-${label}`}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM}\n >\n <PopupMenu\n title={label}\n Icon={Icon}\n onClick={onClick}\n onKeyPress={onKeyPress}\n setRef={setRef(index)}\n id={id}\n componentProps={componentProps as DSGlobalHeaderInternalsT.PopupMenuComponentProps}\n {...otherProps}\n />\n </StyledToolbarItem>\n );\n case 'ds-app-picker':\n return (\n <StyledToolbarItem\n key={`${instanceUID}-ds-toolbar-item-${label}`}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM}\n >\n <AppPicker\n label={label}\n id={id}\n setRef={setRef(index)}\n componentProps={componentProps as DSGlobalHeaderInternalsT.AppPickerComponentProps}\n {...otherProps}\n />\n </StyledToolbarItem>\n );\n case 'ds-search-toggle':\n return (\n <StyledToolbarItem\n key={`${instanceUID}-ds-toolbar-item-${label}`}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM}\n >\n <SearchToggle\n id={id}\n setRef={setRef(index)}\n componentProps={componentProps as DSGlobalHeaderInternalsT.ToggleSearchComponentProps}\n {...otherProps}\n />\n </StyledToolbarItem>\n );\n case 'custom':\n return (\n <StyledToolbarItem\n key={`${instanceUID}-ds-toolbar-item-${label}`}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM}\n >\n {CustomComponent && <CustomComponent item={item} role=\"menuitem\" setRef={setRef(index)} />}\n </StyledToolbarItem>\n );\n\n default:\n return (\n <StyledToolbarItem\n key={`${instanceUID}-ds-toolbar-item-${label}`}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM}\n >\n <StyledButton\n onClick={onClick}\n title={label}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM_BUTTON}\n id={id}\n role=\"menuitem\"\n ref={setRef(index)}\n {...getGlobalAttributes(otherProps)}\n >\n {Icon && <Icon size=\"m\" />}\n </StyledButton>\n </StyledToolbarItem>\n );\n }\n })}\n </StyledList>\n </StyledMenubarContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkC;AAClC,0BAAoC;AACpC,oBAAsE;AACtE,yBAAmD;AACnD,IAAAA,iBAA6B;AAC7B,mCAAsC;AACtC,8BAAyC;AACzC,oCAAuC;AAGhC,MAAM,sBAAsB,MAAmB;AACpD,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,IACjB;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kDAAqB;AAEpC,QAAM,EAAE,SAAS,QAAQ,mBAAmB,QAAI,sDAAuB;AAEvE,SACE,4CAAC;AAAA,IAAuB,eAAa,iDAAyB,QAAQ;AAAA,IACpE,sDAAC;AAAA,MACC,QAAO;AAAA,MACP,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,QAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAK;AAAA,MACL,WAAW;AAAA,MACX,KAAK;AAAA,MACL,eAAa,iDAAyB,QAAQ;AAAA,MAE7C,kBAAQ,IAAI,CAAC,MAAM,UAAU;AAC5B,cAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,KAAK;AAAA,UACL,iBAAiB,CAAC;AAAA,aACf;AAAA,QACL,IAAI;AAEJ,gBAAQ;AAAA,eACD;AACH,mBACE,4CAAC;AAAA,cAEC,eAAa,iDAAyB,QAAQ;AAAA,cAE9C,sDAAC;AAAA,gBACC,OAAO;AAAA,gBACP;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,QAAQ,OAAO,KAAK;AAAA,gBACpB;AAAA,gBACA;AAAA,gBACC,GAAG;AAAA,eACN;AAAA,eAZK,GAAG,+BAA+B,OAazC;AAAA,eAEC;AACH,mBACE,4CAAC;AAAA,cAEC,eAAa,iDAAyB,QAAQ;AAAA,cAE9C,sDAAC;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA,QAAQ,OAAO,KAAK;AAAA,gBACpB;AAAA,gBACC,GAAG;AAAA,eACN;AAAA,eATK,GAAG,+BAA+B,OAUzC;AAAA,eAEC;AACH,mBACE,4CAAC;AAAA,cAEC,eAAa,iDAAyB,QAAQ;AAAA,cAE9C,sDAAC;AAAA,gBACC;AAAA,gBACA,QAAQ,OAAO,KAAK;AAAA,gBACpB;AAAA,gBACC,GAAG;AAAA,eACN;AAAA,eARK,GAAG,+BAA+B,OASzC;AAAA,eAEC;AACH,mBACE,4CAAC;AAAA,cAEC,eAAa,iDAAyB,QAAQ;AAAA,cAE7C,6BAAmB,4CAAC;AAAA,gBAAgB;AAAA,gBAAY,MAAK;AAAA,gBAAW,QAAQ,OAAO,KAAK;AAAA,eAAG;AAAA,eAHnF,GAAG,+BAA+B,OAIzC;AAAA;AAIF,mBACE,4CAAC;AAAA,cAEC,eAAa,iDAAyB,QAAQ;AAAA,cAE9C,sDAAC;AAAA,gBACC;AAAA,gBACA,OAAO;AAAA,gBACP,eAAa,iDAAyB,QAAQ;AAAA,gBAC9C;AAAA,gBACA,MAAK;AAAA,gBACL,KAAK,OAAO,KAAK;AAAA,gBAChB,OAAG,yCAAoB,UAAU;AAAA,gBAEjC,kBAAQ,4CAAC;AAAA,kBAAK,MAAK;AAAA,iBAAI;AAAA,eAC1B;AAAA,eAbK,GAAG,+BAA+B,OAczC;AAAA;AAAA,MAGR,CAAC;AAAA,KACH;AAAA,GACF;AAEJ;",
|
|
6
|
+
"names": ["import_styles"]
|
|
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 AppPicker_exports = {};
|
|
23
26
|
__export(AppPicker_exports, {
|
|
@@ -25,7 +28,8 @@ __export(AppPicker_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(AppPicker_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_app_picker = require("@elliemae/ds-app-picker");
|
|
30
34
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
31
35
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
@@ -74,7 +78,7 @@ const AppPicker = ({
|
|
|
74
78
|
const handleOnClick = (0, import_react.useCallback)(() => {
|
|
75
79
|
setIsOpen(true);
|
|
76
80
|
}, []);
|
|
77
|
-
return /* @__PURE__ */
|
|
81
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_app_picker.DSAppPicker, {
|
|
78
82
|
apps,
|
|
79
83
|
customApps,
|
|
80
84
|
sectionTitle,
|
|
@@ -83,7 +87,7 @@ const AppPicker = ({
|
|
|
83
87
|
onKeyDown: userOnKeyDown ?? handleAppPickerOnKeyDown,
|
|
84
88
|
actionRef,
|
|
85
89
|
onClickOutside: userOnClickOutside ?? handleOnClickOutside,
|
|
86
|
-
renderTrigger: userRenderTrigger || (({ ref }) => /* @__PURE__ */
|
|
90
|
+
renderTrigger: userRenderTrigger || (({ ref }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledButton, {
|
|
87
91
|
onClick: triggerOnClick ?? handleOnClick,
|
|
88
92
|
onKeyDown: handleTriggerKeyDown,
|
|
89
93
|
ref: (buttonRef) => {
|
|
@@ -96,11 +100,12 @@ const AppPicker = ({
|
|
|
96
100
|
"aria-haspopup": true,
|
|
97
101
|
"aria-expanded": userIsOpen ?? isOpen,
|
|
98
102
|
id,
|
|
99
|
-
...(0, import_ds_utilities.getGlobalAttributes)(otherProps)
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
103
|
+
...(0, import_ds_utilities.getGlobalAttributes)(otherProps),
|
|
104
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MenuPicker, {
|
|
105
|
+
width: 20.73,
|
|
106
|
+
height: 20.73
|
|
107
|
+
})
|
|
108
|
+
})),
|
|
104
109
|
isOpen: userIsOpen ?? isOpen,
|
|
105
110
|
onClose,
|
|
106
111
|
triggerRef
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useState, useRef, useCallback } from 'react';\nimport { DSAppPicker } from '@elliemae/ds-app-picker';\nimport { mergeRefs, getGlobalAttributes, useCallbackAfterRender } from '@elliemae/ds-utilities';\nimport { MenuPicker } from '@elliemae/ds-icons';\nimport { StyledButton } from '../../../styles';\nimport { DSGlobalHeaderDatatestid } from '../../../../exported-related';\nimport type { DSGlobalHeaderInternalsT } from '../../../../sharedTypes';\n\nexport const AppPicker = ({\n label,\n id,\n setRef,\n componentProps,\n ...otherProps\n}: DSGlobalHeaderInternalsT.AppPickerProps): 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 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((e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n setIsOpen(false);\n schedule(focusTrigger);\n }\n }, []);\n\n const handleOnClickOutside = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const handleOnClick: React.MouseEventHandler = useCallback(() => {\n setIsOpen(true);\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={\n userRenderTrigger ||\n (({ ref }: { ref: React.MutableRefObject<HTMLButtonElement> }) => (\n <StyledButton\n onClick={triggerOnClick ?? handleOnClick}\n onKeyDown={handleTriggerKeyDown}\n ref={(buttonRef: HTMLButtonElement) => {\n setRef(buttonRef);\n mergeRefs(internalTriggerRef, triggerRef, ref)(buttonRef);\n }}\n aria-label={label}\n data-testid={DSGlobalHeaderDatatestid.MENUBAR.ITEM_BUTTON}\n role=\"menuitem\"\n aria-haspopup\n aria-expanded={userIsOpen ?? isOpen}\n id={id}\n {...getGlobalAttributes(otherProps)}\n >\n <MenuPicker width={20.73} height={20.73} />\n </StyledButton>\n ))\n }\n isOpen={userIsOpen ?? isOpen}\n onClose={onClose}\n triggerRef={triggerRef}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAqD;AACrD,2BAA4B;AAC5B,0BAAuE;AACvE,sBAA2B;AAC3B,oBAA6B;AAC7B,8BAAyC;AAGlC,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AACL,MAA4D;AAC1D,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAkB,KAAK;AACnD,QAAM,yBAAqB,qBAA0B,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,eAAW,4CAAuB;AAExC,QAAM,mBAAe,0BAAY,MAAM,mBAAmB,SAAS,MAAM,GAAG,CAAC,CAAC;AAE9E,QAAM,2BAAmD,0BAAY,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,+BAA2B,0BAAY,CAAC,MAA2B;AACvE,QAAI,EAAE,QAAQ,UAAU;AACtB,gBAAU,KAAK;AACf,eAAS,YAAY;AAAA,IACvB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAyC,0BAAY,MAAM;AAC/D,cAAU,IAAI;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,SACE,4CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,iBAAiB;AAAA,IAC5B;AAAA,IACA,gBAAgB,sBAAsB;AAAA,IACtC,eACE,sBACC,CAAC,EAAE,IAAI,MACN,4CAAC;AAAA,MACC,SAAS,kBAAkB;AAAA,MAC3B,WAAW;AAAA,MACX,KAAK,CAAC,cAAiC;AACrC,eAAO,SAAS;AAChB,2CAAU,oBAAoB,YAAY,GAAG,EAAE,SAAS;AAAA,MAC1D;AAAA,MACA,cAAY;AAAA,MACZ,eAAa,iDAAyB,QAAQ;AAAA,MAC9C,MAAK;AAAA,MACL,iBAAa;AAAA,MACb,iBAAe,cAAc;AAAA,MAC7B;AAAA,MACC,OAAG,yCAAoB,UAAU;AAAA,MAElC,sDAAC;AAAA,QAAW,OAAO;AAAA,QAAO,QAAQ;AAAA,OAAO;AAAA,KAC3C;AAAA,IAGJ,QAAQ,cAAc;AAAA,IACtB;AAAA,IACA;AAAA,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|