@elliemae/ds-global-header 3.10.0-next.3 → 3.10.0-next.5

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.
@@ -66,15 +66,11 @@ const AppPicker = ({
66
66
  return actionRef ?? ref;
67
67
  }, [actionRef]);
68
68
  const focusTrigger = (0, import_react.useCallback)(() => internalTriggerRef.current?.focus(), []);
69
- const handleTriggerKeyDown = (0, import_react.useCallback)(
70
- (e) => {
71
- if (e.code === "Enter" || e.code === "Space" || e.code === "ArrowDown") {
72
- setIsOpen(true);
73
- setTimeout(() => internalActionRef.current.focusSelectedOrFirstAvailable());
74
- }
75
- },
76
- [internalActionRef]
77
- );
69
+ const handleTriggerKeyDown = (0, import_react.useCallback)((e) => {
70
+ if (e.code === "Enter" || e.code === "Space" || e.code === "ArrowDown") {
71
+ setIsOpen(true);
72
+ }
73
+ }, []);
78
74
  const handleAppPickerOnKeyDown = (0, import_react.useCallback)(
79
75
  (e) => {
80
76
  if (e.key === "Escape") {
@@ -87,9 +83,18 @@ const AppPicker = ({
87
83
  const handleOnClickOutside = (0, import_react.useCallback)(() => {
88
84
  setIsOpen(false);
89
85
  }, []);
90
- const handleOnClick = (0, import_react.useCallback)(() => {
91
- setIsOpen(true);
92
- }, []);
86
+ const handleOnClick = (0, import_react.useCallback)(
87
+ (e) => {
88
+ setIsOpen(true);
89
+ setTimeout(() => {
90
+ if (e.detail === 0)
91
+ internalActionRef.current.focusSelectedOrFirstAvailable();
92
+ else
93
+ internalActionRef.current.focusWrapper();
94
+ }, 10);
95
+ },
96
+ [internalActionRef]
97
+ );
93
98
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_app_picker.DSAppPicker, {
94
99
  apps,
95
100
  customApps,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../src/parts/Toolbar/outOfTheBox/AppPicker/AppPicker.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useState, useRef, useCallback, useMemo } 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 internalActionRef = useMemo(() => {\n const ref = React.createRef();\n ref.current = {};\n return actionRef ?? ref;\n }, [actionRef]);\n\n const focusTrigger = useCallback(() => internalTriggerRef.current?.focus(), []);\n\n const handleTriggerKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n if (e.code === 'Enter' || e.code === 'Space' || e.code === 'ArrowDown') {\n setIsOpen(true);\n setTimeout(() => internalActionRef.current.focusSelectedOrFirstAvailable());\n }\n },\n [internalActionRef],\n );\n\n const handleAppPickerOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n setIsOpen(false);\n schedule(focusTrigger);\n }\n },\n [schedule],\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={internalActionRef}\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": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA8D;AAC9D,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,wBAAoB,sBAAQ,MAAM;AACtC,UAAM,MAAM,aAAAA,QAAM,UAAU;AAC5B,QAAI,UAAU,CAAC;AACf,WAAO,aAAa;AAAA,EACtB,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,mBAAe,0BAAY,MAAM,mBAAmB,SAAS,MAAM,GAAG,CAAC,CAAC;AAE9E,QAAM,2BAAmD;AAAA,IACvD,CAAC,MAAM;AACL,UAAI,EAAE,SAAS,WAAW,EAAE,SAAS,WAAW,EAAE,SAAS,aAAa;AACtE,kBAAU,IAAI;AACd,mBAAW,MAAM,kBAAkB,QAAQ,8BAA8B,CAAC;AAAA,MAC5E;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,QAAM,+BAA2B;AAAA,IAC/B,CAAC,MAA2B;AAC1B,UAAI,EAAE,QAAQ,UAAU;AACtB,kBAAU,KAAK;AACf,iBAAS,YAAY;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,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,WAAW;AAAA,IACX,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;",
4
+ "sourcesContent": ["import React, { useState, useRef, useCallback, useMemo } 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 internalActionRef = useMemo(() => {\n const ref = React.createRef();\n ref.current = {};\n return actionRef ?? ref;\n }, [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 [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) internalActionRef.current.focusSelectedOrFirstAvailable();\n else internalActionRef.current.focusWrapper();\n }, 10);\n },\n [internalActionRef],\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={internalActionRef}\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": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA8D;AAC9D,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,wBAAoB,sBAAQ,MAAM;AACtC,UAAM,MAAM,aAAAA,QAAM,UAAU;AAC5B,QAAI,UAAU,CAAC;AACf,WAAO,aAAa;AAAA,EACtB,GAAG,CAAC,SAAS,CAAC;AAEd,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;AAAA,IAC/B,CAAC,MAA2B;AAC1B,UAAI,EAAE,QAAQ,UAAU;AACtB,kBAAU,KAAK;AACf,iBAAS,YAAY;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAyC;AAAA,IAC7C,CAAC,MAAM;AACL,gBAAU,IAAI;AACd,iBAAW,MAAM;AACf,YAAI,EAAE,WAAW;AAAG,4BAAkB,QAAQ,8BAA8B;AAAA;AACvE,4BAAkB,QAAQ,aAAa;AAAA,MAC9C,GAAG,EAAE;AAAA,IACP;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,SACE,4CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,iBAAiB;AAAA,IAC5B,WAAW;AAAA,IACX,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": ["React"]
7
7
  }
@@ -37,15 +37,11 @@ const AppPicker = ({
37
37
  return actionRef ?? ref;
38
38
  }, [actionRef]);
39
39
  const focusTrigger = useCallback(() => internalTriggerRef.current?.focus(), []);
40
- const handleTriggerKeyDown = useCallback(
41
- (e) => {
42
- if (e.code === "Enter" || e.code === "Space" || e.code === "ArrowDown") {
43
- setIsOpen(true);
44
- setTimeout(() => internalActionRef.current.focusSelectedOrFirstAvailable());
45
- }
46
- },
47
- [internalActionRef]
48
- );
40
+ const handleTriggerKeyDown = useCallback((e) => {
41
+ if (e.code === "Enter" || e.code === "Space" || e.code === "ArrowDown") {
42
+ setIsOpen(true);
43
+ }
44
+ }, []);
49
45
  const handleAppPickerOnKeyDown = useCallback(
50
46
  (e) => {
51
47
  if (e.key === "Escape") {
@@ -58,9 +54,18 @@ const AppPicker = ({
58
54
  const handleOnClickOutside = useCallback(() => {
59
55
  setIsOpen(false);
60
56
  }, []);
61
- const handleOnClick = useCallback(() => {
62
- setIsOpen(true);
63
- }, []);
57
+ const handleOnClick = useCallback(
58
+ (e) => {
59
+ setIsOpen(true);
60
+ setTimeout(() => {
61
+ if (e.detail === 0)
62
+ internalActionRef.current.focusSelectedOrFirstAvailable();
63
+ else
64
+ internalActionRef.current.focusWrapper();
65
+ }, 10);
66
+ },
67
+ [internalActionRef]
68
+ );
64
69
  return /* @__PURE__ */ jsx(DSAppPicker, {
65
70
  apps,
66
71
  customApps,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
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 React, { useState, useRef, useCallback, useMemo } 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 internalActionRef = useMemo(() => {\n const ref = React.createRef();\n ref.current = {};\n return actionRef ?? ref;\n }, [actionRef]);\n\n const focusTrigger = useCallback(() => internalTriggerRef.current?.focus(), []);\n\n const handleTriggerKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n if (e.code === 'Enter' || e.code === 'Space' || e.code === 'ArrowDown') {\n setIsOpen(true);\n setTimeout(() => internalActionRef.current.focusSelectedOrFirstAvailable());\n }\n },\n [internalActionRef],\n );\n\n const handleAppPickerOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === 'Escape') {\n setIsOpen(false);\n schedule(focusTrigger);\n }\n },\n [schedule],\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={internalActionRef}\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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,OAAOA,UAAS,UAAU,QAAQ,aAAa,eAAe;AAC9D,SAAS,mBAAmB;AAC5B,SAAS,WAAW,qBAAqB,8BAA8B;AACvE,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,gCAAgC;AAGlC,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AACL,MAA4D;AAC1D,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;AAExC,QAAM,oBAAoB,QAAQ,MAAM;AACtC,UAAM,MAAMA,OAAM,UAAU;AAC5B,QAAI,UAAU,CAAC;AACf,WAAO,aAAa;AAAA,EACtB,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,eAAe,YAAY,MAAM,mBAAmB,SAAS,MAAM,GAAG,CAAC,CAAC;AAE9E,QAAM,uBAAmD;AAAA,IACvD,CAAC,MAAM;AACL,UAAI,EAAE,SAAS,WAAW,EAAE,SAAS,WAAW,EAAE,SAAS,aAAa;AACtE,kBAAU,IAAI;AACd,mBAAW,MAAM,kBAAkB,QAAQ,8BAA8B,CAAC;AAAA,MAC5E;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,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,QAAQ;AAAA,EACX;AAEA,QAAM,uBAAuB,YAAY,MAAM;AAC7C,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC,YAAY,MAAM;AAC/D,cAAU,IAAI;AAAA,EAChB,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,iBAAiB;AAAA,IAC5B,WAAW;AAAA,IACX,gBAAgB,sBAAsB;AAAA,IACtC,eACE,sBACC,CAAC,EAAE,IAAI,MACN,oBAAC;AAAA,MACC,SAAS,kBAAkB;AAAA,MAC3B,WAAW;AAAA,MACX,KAAK,CAAC,cAAiC;AACrC,eAAO,SAAS;AAChB,kBAAU,oBAAoB,YAAY,GAAG,EAAE,SAAS;AAAA,MAC1D;AAAA,MACA,cAAY;AAAA,MACZ,eAAa,yBAAyB,QAAQ;AAAA,MAC9C,MAAK;AAAA,MACL,iBAAa;AAAA,MACb,iBAAe,cAAc;AAAA,MAC7B;AAAA,MACC,GAAG,oBAAoB,UAAU;AAAA,MAElC,8BAAC;AAAA,QAAW,OAAO;AAAA,QAAO,QAAQ;AAAA,OAAO;AAAA,KAC3C;AAAA,IAGJ,QAAQ,cAAc;AAAA,IACtB;AAAA,IACA;AAAA,GACF;AAEJ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useRef, useCallback, useMemo } 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 internalActionRef = useMemo(() => {\n const ref = React.createRef();\n ref.current = {};\n return actionRef ?? ref;\n }, [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 [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) internalActionRef.current.focusSelectedOrFirstAvailable();\n else internalActionRef.current.focusWrapper();\n }, 10);\n },\n [internalActionRef],\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={internalActionRef}\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,OAAOA,UAAS,UAAU,QAAQ,aAAa,eAAe;AAC9D,SAAS,mBAAmB;AAC5B,SAAS,WAAW,qBAAqB,8BAA8B;AACvE,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,gCAAgC;AAGlC,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AACL,MAA4D;AAC1D,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;AAExC,QAAM,oBAAoB,QAAQ,MAAM;AACtC,UAAM,MAAMA,OAAM,UAAU;AAC5B,QAAI,UAAU,CAAC;AACf,WAAO,aAAa;AAAA,EACtB,GAAG,CAAC,SAAS,CAAC;AAEd,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,QAAQ;AAAA,EACX;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;AAAG,4BAAkB,QAAQ,8BAA8B;AAAA;AACvE,4BAAkB,QAAQ,aAAa;AAAA,MAC9C,GAAG,EAAE;AAAA,IACP;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,SACE,oBAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,iBAAiB;AAAA,IAC5B,WAAW;AAAA,IACX,gBAAgB,sBAAsB;AAAA,IACtC,eACE,sBACC,CAAC,EAAE,IAAI,MACN,oBAAC;AAAA,MACC,SAAS,kBAAkB;AAAA,MAC3B,WAAW;AAAA,MACX,KAAK,CAAC,cAAiC;AACrC,eAAO,SAAS;AAChB,kBAAU,oBAAoB,YAAY,GAAG,EAAE,SAAS;AAAA,MAC1D;AAAA,MACA,cAAY;AAAA,MACZ,eAAa,yBAAyB,QAAQ;AAAA,MAC9C,MAAK;AAAA,MACL,iBAAa;AAAA,MACb,iBAAe,cAAc;AAAA,MAC7B;AAAA,MACC,GAAG,oBAAoB,UAAU;AAAA,MAElC,8BAAC;AAAA,QAAW,OAAO;AAAA,QAAO,QAAQ;AAAA,OAAO;AAAA,KAC3C;AAAA,IAGJ,QAAQ,cAAc;AAAA,IACtB;AAAA,IACA;AAAA,GACF;AAEJ;",
6
6
  "names": ["React"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-global-header",
3
- "version": "3.10.0-next.3",
3
+ "version": "3.10.0-next.5",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Global Header",
6
6
  "files": [
@@ -135,13 +135,13 @@
135
135
  "indent": 4
136
136
  },
137
137
  "dependencies": {
138
- "@elliemae/ds-app-picker": "3.10.0-next.3",
139
- "@elliemae/ds-form": "3.10.0-next.3",
140
- "@elliemae/ds-grid": "3.10.0-next.3",
141
- "@elliemae/ds-icons": "3.10.0-next.3",
142
- "@elliemae/ds-popperjs": "3.10.0-next.3",
143
- "@elliemae/ds-system": "3.10.0-next.3",
144
- "@elliemae/ds-utilities": "3.10.0-next.3",
138
+ "@elliemae/ds-app-picker": "3.10.0-next.5",
139
+ "@elliemae/ds-form": "3.10.0-next.5",
140
+ "@elliemae/ds-grid": "3.10.0-next.5",
141
+ "@elliemae/ds-icons": "3.10.0-next.5",
142
+ "@elliemae/ds-popperjs": "3.10.0-next.5",
143
+ "@elliemae/ds-system": "3.10.0-next.5",
144
+ "@elliemae/ds-utilities": "3.10.0-next.5",
145
145
  "uid": "~2.0.0"
146
146
  },
147
147
  "devDependencies": {