@elliemae/ds-global-header 2.3.1 → 3.0.0-alpha.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.
Files changed (182) hide show
  1. package/dist/cjs/GlobalHeader.js +57 -0
  2. package/dist/cjs/GlobalHeader.js.map +7 -0
  3. package/dist/cjs/GlobalHeaderContainer.js +41 -0
  4. package/dist/cjs/GlobalHeaderContainer.js.map +7 -0
  5. package/dist/cjs/GlobalHeaderContext.js +46 -0
  6. package/dist/cjs/GlobalHeaderContext.js.map +7 -0
  7. package/dist/cjs/GlobalHeaderTypes.js +27 -0
  8. package/dist/cjs/GlobalHeaderTypes.js.map +7 -0
  9. package/dist/cjs/components/Breadcrumb/GlobalHeaderBreadcrumb.js +110 -0
  10. package/dist/cjs/components/Breadcrumb/GlobalHeaderBreadcrumb.js.map +7 -0
  11. package/dist/cjs/components/Breadcrumb/PureBreadcrumb.js +79 -0
  12. package/dist/cjs/components/Breadcrumb/PureBreadcrumb.js.map +7 -0
  13. package/dist/cjs/components/Breadcrumb/styles.js +83 -0
  14. package/dist/cjs/components/Breadcrumb/styles.js.map +7 -0
  15. package/dist/cjs/components/Title/GlobalHeaderTitle.js +48 -0
  16. package/dist/cjs/components/Title/GlobalHeaderTitle.js.map +7 -0
  17. package/dist/cjs/components/Toolbar/GlobalHeaderToolbar.js +49 -0
  18. package/dist/cjs/components/Toolbar/GlobalHeaderToolbar.js.map +7 -0
  19. package/dist/cjs/components/Toolbar/ToolbarItems.js +122 -0
  20. package/dist/cjs/components/Toolbar/ToolbarItems.js.map +7 -0
  21. package/dist/cjs/components/Toolbar/styles.js +61 -0
  22. package/dist/cjs/components/Toolbar/styles.js.map +7 -0
  23. package/dist/cjs/config/useGetPropsWithDefaults.js +54 -0
  24. package/dist/cjs/config/useGetPropsWithDefaults.js.map +7 -0
  25. package/dist/cjs/config/useGlobalHeader.js +53 -0
  26. package/dist/cjs/config/useGlobalHeader.js.map +7 -0
  27. package/dist/cjs/config/useValidateProps.js +109 -0
  28. package/dist/cjs/config/useValidateProps.js.map +7 -0
  29. package/dist/cjs/config/validateHelpers.js +111 -0
  30. package/dist/cjs/config/validateHelpers.js.map +7 -0
  31. package/dist/cjs/defaultProps.js +41 -0
  32. package/dist/cjs/defaultProps.js.map +7 -0
  33. package/dist/cjs/index.js +36 -0
  34. package/dist/cjs/index.js.map +7 -0
  35. package/dist/cjs/outOfTheBox/AppPicker/AppPicker.js +139 -0
  36. package/dist/cjs/outOfTheBox/AppPicker/AppPicker.js.map +7 -0
  37. package/dist/cjs/outOfTheBox/PopupMenu/PopupMenu.js +122 -0
  38. package/dist/cjs/outOfTheBox/PopupMenu/PopupMenu.js.map +7 -0
  39. package/dist/cjs/outOfTheBox/PopupMenu/PopupMenuContent.js +97 -0
  40. package/dist/cjs/outOfTheBox/PopupMenu/PopupMenuContent.js.map +7 -0
  41. package/dist/cjs/outOfTheBox/PopupMenu/styles.js +67 -0
  42. package/dist/cjs/outOfTheBox/PopupMenu/styles.js.map +7 -0
  43. package/dist/cjs/outOfTheBox/SearchToggle/SearchToggle.js +134 -0
  44. package/dist/cjs/outOfTheBox/SearchToggle/SearchToggle.js.map +7 -0
  45. package/dist/cjs/outOfTheBox/SearchToggle/styles.js +82 -0
  46. package/dist/cjs/outOfTheBox/SearchToggle/styles.js.map +7 -0
  47. package/dist/cjs/outOfTheBox/index.js +30 -0
  48. package/dist/cjs/outOfTheBox/index.js.map +7 -0
  49. package/dist/cjs/propTypes.js +56 -0
  50. package/dist/cjs/propTypes.js.map +7 -0
  51. package/dist/cjs/styles.js +43 -0
  52. package/dist/cjs/styles.js.map +7 -0
  53. package/dist/esm/GlobalHeader.js +28 -0
  54. package/dist/esm/GlobalHeader.js.map +7 -0
  55. package/dist/esm/GlobalHeaderContainer.js +12 -0
  56. package/dist/esm/GlobalHeaderContainer.js.map +7 -0
  57. package/dist/esm/GlobalHeaderContext.js +17 -0
  58. package/dist/esm/GlobalHeaderContext.js.map +7 -0
  59. package/dist/esm/GlobalHeaderTypes.js +2 -0
  60. package/dist/esm/GlobalHeaderTypes.js.map +7 -0
  61. package/dist/esm/components/Breadcrumb/GlobalHeaderBreadcrumb.js +83 -0
  62. package/dist/esm/components/Breadcrumb/GlobalHeaderBreadcrumb.js.map +7 -0
  63. package/dist/esm/components/Breadcrumb/PureBreadcrumb.js +52 -0
  64. package/dist/esm/components/Breadcrumb/PureBreadcrumb.js.map +7 -0
  65. package/dist/esm/components/Breadcrumb/styles.js +54 -0
  66. package/dist/esm/components/Breadcrumb/styles.js.map +7 -0
  67. package/dist/esm/components/Title/GlobalHeaderTitle.js +19 -0
  68. package/dist/esm/components/Title/GlobalHeaderTitle.js.map +7 -0
  69. package/dist/esm/components/Toolbar/GlobalHeaderToolbar.js +20 -0
  70. package/dist/esm/components/Toolbar/GlobalHeaderToolbar.js.map +7 -0
  71. package/dist/esm/components/Toolbar/ToolbarItems.js +95 -0
  72. package/dist/esm/components/Toolbar/ToolbarItems.js.map +7 -0
  73. package/dist/esm/components/Toolbar/styles.js +32 -0
  74. package/dist/esm/components/Toolbar/styles.js.map +7 -0
  75. package/dist/esm/config/useGetPropsWithDefaults.js +27 -0
  76. package/dist/esm/config/useGetPropsWithDefaults.js.map +7 -0
  77. package/dist/esm/config/useGlobalHeader.js +24 -0
  78. package/dist/esm/config/useGlobalHeader.js.map +7 -0
  79. package/dist/esm/config/useValidateProps.js +88 -0
  80. package/dist/esm/config/useValidateProps.js.map +7 -0
  81. package/dist/esm/config/validateHelpers.js +82 -0
  82. package/dist/esm/config/validateHelpers.js.map +7 -0
  83. package/{esm → dist/esm}/defaultProps.js +5 -3
  84. package/dist/esm/defaultProps.js.map +7 -0
  85. package/dist/esm/index.js +7 -0
  86. package/dist/esm/index.js.map +7 -0
  87. package/dist/esm/outOfTheBox/AppPicker/AppPicker.js +112 -0
  88. package/dist/esm/outOfTheBox/AppPicker/AppPicker.js.map +7 -0
  89. package/dist/esm/outOfTheBox/PopupMenu/PopupMenu.js +95 -0
  90. package/dist/esm/outOfTheBox/PopupMenu/PopupMenu.js.map +7 -0
  91. package/dist/esm/outOfTheBox/PopupMenu/PopupMenuContent.js +70 -0
  92. package/dist/esm/outOfTheBox/PopupMenu/PopupMenuContent.js.map +7 -0
  93. package/dist/esm/outOfTheBox/PopupMenu/styles.js +38 -0
  94. package/dist/esm/outOfTheBox/PopupMenu/styles.js.map +7 -0
  95. package/dist/esm/outOfTheBox/SearchToggle/SearchToggle.js +107 -0
  96. package/dist/esm/outOfTheBox/SearchToggle/SearchToggle.js.map +7 -0
  97. package/dist/esm/outOfTheBox/SearchToggle/styles.js +53 -0
  98. package/dist/esm/outOfTheBox/SearchToggle/styles.js.map +7 -0
  99. package/dist/esm/outOfTheBox/index.js +5 -0
  100. package/dist/esm/outOfTheBox/index.js.map +7 -0
  101. package/dist/esm/propTypes.js +27 -0
  102. package/dist/esm/propTypes.js.map +7 -0
  103. package/dist/esm/styles.js +14 -0
  104. package/dist/esm/styles.js.map +7 -0
  105. package/package.json +82 -73
  106. package/cjs/GlobalHeader.js +0 -37
  107. package/cjs/GlobalHeaderContainer.js +0 -24
  108. package/cjs/GlobalHeaderContext.js +0 -20
  109. package/cjs/GlobalHeaderTypes.js +0 -2
  110. package/cjs/components/Breadcrumb/GlobalHeaderBreadcrumb.js +0 -85
  111. package/cjs/components/Breadcrumb/PureBreadcrumb.js +0 -60
  112. package/cjs/components/Breadcrumb/styles.js +0 -59
  113. package/cjs/components/Title/GlobalHeaderTitle.js +0 -29
  114. package/cjs/components/Toolbar/GlobalHeaderToolbar.js +0 -30
  115. package/cjs/components/Toolbar/ToolbarItems.js +0 -107
  116. package/cjs/components/Toolbar/styles.js +0 -25
  117. package/cjs/config/useGetPropsWithDefaults.js +0 -31
  118. package/cjs/config/useGlobalHeader.js +0 -39
  119. package/cjs/config/useValidateProps.js +0 -92
  120. package/cjs/config/validateHelpers.js +0 -57
  121. package/cjs/defaultProps.js +0 -14
  122. package/cjs/index.js +0 -11
  123. package/cjs/outOfTheBox/AppPicker/AppPicker.js +0 -117
  124. package/cjs/outOfTheBox/PopupMenu/PopupMenu.js +0 -101
  125. package/cjs/outOfTheBox/PopupMenu/PopupMenuContent.js +0 -96
  126. package/cjs/outOfTheBox/PopupMenu/styles.js +0 -32
  127. package/cjs/outOfTheBox/SearchToggle/SearchToggle.js +0 -113
  128. package/cjs/outOfTheBox/SearchToggle/styles.js +0 -15
  129. package/cjs/outOfTheBox/index.js +0 -13
  130. package/cjs/propTypes.js +0 -29
  131. package/cjs/styles.js +0 -21
  132. package/esm/GlobalHeader.js +0 -28
  133. package/esm/GlobalHeaderContainer.js +0 -16
  134. package/esm/GlobalHeaderContext.js +0 -16
  135. package/esm/GlobalHeaderTypes.js +0 -1
  136. package/esm/components/Breadcrumb/GlobalHeaderBreadcrumb.js +0 -75
  137. package/esm/components/Breadcrumb/PureBreadcrumb.js +0 -49
  138. package/esm/components/Breadcrumb/styles.js +0 -48
  139. package/esm/components/Title/GlobalHeaderTitle.js +0 -21
  140. package/esm/components/Toolbar/GlobalHeaderToolbar.js +0 -22
  141. package/esm/components/Toolbar/ToolbarItems.js +0 -97
  142. package/esm/components/Toolbar/styles.js +0 -17
  143. package/esm/config/useGetPropsWithDefaults.js +0 -23
  144. package/esm/config/useGlobalHeader.js +0 -31
  145. package/esm/config/useValidateProps.js +0 -88
  146. package/esm/config/validateHelpers.js +0 -44
  147. package/esm/index.js +0 -1
  148. package/esm/outOfTheBox/AppPicker/AppPicker.js +0 -107
  149. package/esm/outOfTheBox/PopupMenu/PopupMenu.js +0 -91
  150. package/esm/outOfTheBox/PopupMenu/PopupMenuContent.js +0 -86
  151. package/esm/outOfTheBox/PopupMenu/styles.js +0 -21
  152. package/esm/outOfTheBox/SearchToggle/SearchToggle.js +0 -103
  153. package/esm/outOfTheBox/SearchToggle/styles.js +0 -7
  154. package/esm/outOfTheBox/index.js +0 -3
  155. package/esm/propTypes.js +0 -23
  156. package/esm/styles.js +0 -13
  157. package/types/GlobalHeader.d.ts +0 -39
  158. package/types/GlobalHeaderContainer.d.ts +0 -3
  159. package/types/GlobalHeaderContext.d.ts +0 -3
  160. package/types/GlobalHeaderTypes.d.ts +0 -85
  161. package/types/components/Breadcrumb/GlobalHeaderBreadcrumb.d.ts +0 -2
  162. package/types/components/Breadcrumb/PureBreadcrumb.d.ts +0 -3
  163. package/types/components/Breadcrumb/styles.d.ts +0 -5
  164. package/types/components/Title/GlobalHeaderTitle.d.ts +0 -2
  165. package/types/components/Toolbar/GlobalHeaderToolbar.d.ts +0 -2
  166. package/types/components/Toolbar/ToolbarItems.d.ts +0 -2
  167. package/types/components/Toolbar/styles.d.ts +0 -1
  168. package/types/config/useGetPropsWithDefaults.d.ts +0 -2
  169. package/types/config/useGlobalHeader.d.ts +0 -2
  170. package/types/config/useValidateProps.d.ts +0 -2
  171. package/types/config/validateHelpers.d.ts +0 -27
  172. package/types/defaultProps.d.ts +0 -2
  173. package/types/index.d.ts +0 -2
  174. package/types/outOfTheBox/AppPicker/AppPicker.d.ts +0 -8
  175. package/types/outOfTheBox/PopupMenu/PopupMenu.d.ts +0 -3
  176. package/types/outOfTheBox/PopupMenu/PopupMenuContent.d.ts +0 -3
  177. package/types/outOfTheBox/PopupMenu/styles.d.ts +0 -4
  178. package/types/outOfTheBox/SearchToggle/SearchToggle.d.ts +0 -3
  179. package/types/outOfTheBox/SearchToggle/styles.d.ts +0 -1
  180. package/types/outOfTheBox/index.d.ts +0 -3
  181. package/types/propTypes.d.ts +0 -29
  182. package/types/styles.d.ts +0 -2
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/defaultProps.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { GlobalHeaderPropsT } from './GlobalHeaderTypes';\n\nconst emptyComp = () => null;\n\nexport const defaultProps: GlobalHeaderPropsT = {\n breadcrumb: [],\n toolbar: [],\n LogoWithBrand: emptyComp,\n Logo: emptyComp,\n};\n"],
5
+ "mappings": "AAAA;ACEA,MAAM,YAAY,MAAM;AAEjB,MAAM,eAAmC;AAAA,EAC9C,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,eAAe;AAAA,EACf,MAAM;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,7 @@
1
+ import * as React from "react";
2
+ export * from "./GlobalHeader";
3
+ import { GlobalHeader } from "./GlobalHeader";
4
+ export {
5
+ GlobalHeader as default
6
+ };
7
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './GlobalHeader';\nexport { GlobalHeader as default } from './GlobalHeader';\n"],
5
+ "mappings": "AAAA;ACAA;AACA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,112 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
4
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
+ var __spreadValues = (a, b) => {
7
+ for (var prop in b || (b = {}))
8
+ if (__hasOwnProp.call(b, prop))
9
+ __defNormalProp(a, prop, b[prop]);
10
+ if (__getOwnPropSymbols)
11
+ for (var prop of __getOwnPropSymbols(b)) {
12
+ if (__propIsEnum.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ }
15
+ return a;
16
+ };
17
+ var __objRest = (source, exclude) => {
18
+ var target = {};
19
+ for (var prop in source)
20
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
21
+ target[prop] = source[prop];
22
+ if (source != null && __getOwnPropSymbols)
23
+ for (var prop of __getOwnPropSymbols(source)) {
24
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
25
+ target[prop] = source[prop];
26
+ }
27
+ return target;
28
+ };
29
+ import * as React from "react";
30
+ import React2, { useState, useRef, useCallback, useMemo } from "react";
31
+ import { DSAppPicker } from "@elliemae/ds-app-picker";
32
+ import { mergeRefs } from "@elliemae/ds-utilities";
33
+ import { MenuPicker } from "@elliemae/ds-icons";
34
+ import { getDataProps } from "@elliemae/ds-props-helpers";
35
+ import { Button } from "../../components/Toolbar/styles";
36
+ const AppPicker = (_a) => {
37
+ var _b = _a, {
38
+ label,
39
+ id,
40
+ componentProps
41
+ } = _b, otherProps = __objRest(_b, [
42
+ "label",
43
+ "id",
44
+ "componentProps"
45
+ ]);
46
+ const [isOpen, setIsOpen] = useState(false);
47
+ const buttonRef = useRef(null);
48
+ const {
49
+ apps,
50
+ icon,
51
+ customApps,
52
+ sectionTitle,
53
+ customSectionTitle,
54
+ actionRef,
55
+ isOpen: userIsOpen,
56
+ onKeyDown: userOnKeyDown,
57
+ onClickOutside: userOnClickOutside,
58
+ renderTrigger: userRenderTrigger,
59
+ onClose,
60
+ triggerRef,
61
+ triggerOnClick
62
+ } = componentProps;
63
+ const handleTriggerKeyDown = useCallback((e) => {
64
+ if (e.code === "Enter" || e.code === "Space") {
65
+ setIsOpen(true);
66
+ }
67
+ }, []);
68
+ const handleAppPickerOnKeyDown = useCallback((e) => {
69
+ if (e.code === "Escape") {
70
+ setIsOpen(false);
71
+ buttonRef?.current?.focus();
72
+ }
73
+ }, []);
74
+ const handleOnClickOutside = useCallback(() => {
75
+ setIsOpen(false);
76
+ }, []);
77
+ const handleOnClick = useCallback(() => {
78
+ setIsOpen(true);
79
+ }, []);
80
+ const renderTrigger = useMemo(() => ({ ref }) => /* @__PURE__ */ React2.createElement("div", {
81
+ ref
82
+ }, /* @__PURE__ */ React2.createElement(Button, __spreadValues({
83
+ onClick: triggerOnClick ?? handleOnClick,
84
+ onKeyDown: handleTriggerKeyDown,
85
+ ref: mergeRefs(buttonRef, triggerRef),
86
+ title: label,
87
+ "data-testid": "gh-toolbar-item",
88
+ id
89
+ }, getDataProps(otherProps)), /* @__PURE__ */ React2.createElement(MenuPicker, {
90
+ fill: "#FFF",
91
+ width: 20.73,
92
+ height: 20.73
93
+ }))), [triggerOnClick, handleOnClick, handleTriggerKeyDown, triggerRef, label, id, otherProps]);
94
+ return /* @__PURE__ */ React2.createElement(DSAppPicker, {
95
+ apps,
96
+ customApps,
97
+ sectionTitle,
98
+ customSectionTitle,
99
+ icon,
100
+ onKeyDown: userOnKeyDown ?? handleAppPickerOnKeyDown,
101
+ actionRef,
102
+ onClickOutside: userOnClickOutside ?? handleOnClickOutside,
103
+ renderTrigger: userRenderTrigger ?? renderTrigger,
104
+ isOpen: userIsOpen ?? isOpen,
105
+ onClose,
106
+ triggerRef
107
+ });
108
+ };
109
+ export {
110
+ AppPicker
111
+ };
112
+ //# sourceMappingURL=AppPicker.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/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 } from '@elliemae/ds-utilities';\nimport { MenuPicker } from '@elliemae/ds-icons';\nimport { getDataProps } from '@elliemae/ds-props-helpers';\nimport { Button } from '../../components/Toolbar/styles';\n\ntype AppPickerProps = React.ComponentProps<typeof DSAppPicker>;\n\nexport const AppPicker = ({\n label,\n id,\n componentProps,\n ...otherProps\n}: AppPickerProps & {\n label: string;\n triggerOnClick?: React.MouseEventHandler;\n}): JSX.Element => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const buttonRef = 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 handleTriggerKeyDown: React.KeyboardEventHandler = useCallback((e) => {\n if (e.code === 'Enter' || e.code === 'Space') {\n setIsOpen(true);\n }\n }, []);\n\n const handleAppPickerOnKeyDown: AppPickerProps['onKeyDown'] = useCallback((e) => {\n if (e.code === 'Escape') {\n setIsOpen(false);\n buttonRef?.current?.focus();\n }\n }, []);\n\n const handleOnClickOutside: AppPickerProps['onClickOutside'] = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const handleOnClick: React.MouseEventHandler = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n const renderTrigger: AppPickerProps['renderTrigger'] = useMemo(\n () =>\n ({ ref }) =>\n (\n <div ref={ref}>\n <Button\n onClick={triggerOnClick ?? handleOnClick}\n onKeyDown={handleTriggerKeyDown}\n ref={mergeRefs(buttonRef, triggerRef)}\n title={label}\n data-testid=\"gh-toolbar-item\"\n id={id}\n {...getDataProps(otherProps)}\n >\n <MenuPicker fill=\"#FFF\" width={20.73} height={20.73} />\n </Button>\n </div>\n ),\n [triggerOnClick, handleOnClick, handleTriggerKeyDown, triggerRef, label, id, otherProps],\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 ?? renderTrigger}\n isOpen={userIsOpen ?? isOpen}\n onClose={onClose}\n triggerRef={triggerRef}\n />\n );\n};\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAIO,MAAM,YAAY,CAAC,OAQP;AARO,eACxB;AAAA;AAAA,IACA;AAAA,IACA;AAAA,MAHwB,IAIrB,uBAJqB,IAIrB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAMA,QAAM,CAAC,QAAQ,aAAa,SAAkB;AAC9C,QAAM,YAAY,OAA0B;AAE5C,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,MACE;AAEJ,QAAM,uBAAmD,YAAY,CAAC,MAAM;AAC1E,QAAI,EAAE,SAAS,WAAW,EAAE,SAAS,SAAS;AAC5C,gBAAU;AAAA;AAAA,KAEX;AAEH,QAAM,2BAAwD,YAAY,CAAC,MAAM;AAC/E,QAAI,EAAE,SAAS,UAAU;AACvB,gBAAU;AACV,iBAAW,SAAS;AAAA;AAAA,KAErB;AAEH,QAAM,uBAAyD,YAAY,MAAM;AAC/E,cAAU;AAAA,KACT;AAEH,QAAM,gBAAyC,YAAY,MAAM;AAC/D,cAAU;AAAA,KACT;AAEH,QAAM,gBAAiD,QACrD,MACE,CAAC,EAAE,UAEC,qCAAC,OAAD;AAAA,IAAK;AAAA,KACH,qCAAC,QAAD;AAAA,IACE,SAAS,kBAAkB;AAAA,IAC3B,WAAW;AAAA,IACX,KAAK,UAAU,WAAW;AAAA,IAC1B,OAAO;AAAA,IACP,eAAY;AAAA,IACZ;AAAA,KACI,aAAa,cAEjB,qCAAC,YAAD;AAAA,IAAY,MAAK;AAAA,IAAO,OAAO;AAAA,IAAO,QAAQ;AAAA,QAIxD,CAAC,gBAAgB,eAAe,sBAAsB,YAAY,OAAO,IAAI;AAG/E,SACE,qCAAC,aAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,iBAAiB;AAAA,IAC5B;AAAA,IACA,gBAAgB,sBAAsB;AAAA,IACtC,eAAe,qBAAqB;AAAA,IACpC,QAAQ,cAAc;AAAA,IACtB;AAAA,IACA;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,95 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
4
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
+ var __spreadValues = (a, b) => {
7
+ for (var prop in b || (b = {}))
8
+ if (__hasOwnProp.call(b, prop))
9
+ __defNormalProp(a, prop, b[prop]);
10
+ if (__getOwnPropSymbols)
11
+ for (var prop of __getOwnPropSymbols(b)) {
12
+ if (__propIsEnum.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ }
15
+ return a;
16
+ };
17
+ var __objRest = (source, exclude) => {
18
+ var target = {};
19
+ for (var prop in source)
20
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
21
+ target[prop] = source[prop];
22
+ if (source != null && __getOwnPropSymbols)
23
+ for (var prop of __getOwnPropSymbols(source)) {
24
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
25
+ target[prop] = source[prop];
26
+ }
27
+ return target;
28
+ };
29
+ import * as React from "react";
30
+ import React2, { useState, useCallback, useMemo } from "react";
31
+ import { DSPopperJS } from "@elliemae/ds-popperjs";
32
+ import { PopupMenuContent } from "./PopupMenuContent";
33
+ import { Button } from "../../components/Toolbar/styles";
34
+ import { getDataProps } from "@elliemae/ds-props-helpers";
35
+ const PopupMenu = (_a) => {
36
+ var _b = _a, { Icon, title, onClick, id, componentProps } = _b, otherProps = __objRest(_b, ["Icon", "title", "onClick", "id", "componentProps"]);
37
+ const [isOpen, setIsOpen] = useState(false);
38
+ const [buttonRef, setButtonRef] = useState(null);
39
+ const {
40
+ onClickOutside = () => null,
41
+ onKeyPress,
42
+ popupOnKeyPress,
43
+ isOpen: userIsOpen,
44
+ options,
45
+ closeOnClick
46
+ } = componentProps;
47
+ const handleKeyPress = useCallback((e) => {
48
+ if (e.code === "Enter" || e.code === "Space") {
49
+ setIsOpen(true);
50
+ }
51
+ if (onKeyPress)
52
+ onKeyPress(e);
53
+ }, [onKeyPress]);
54
+ const handleOnClose = useCallback(() => {
55
+ if (userIsOpen === void 0) {
56
+ setIsOpen(false);
57
+ }
58
+ buttonRef?.focus();
59
+ }, [buttonRef, userIsOpen]);
60
+ const handleTriggerOnClick = useCallback((e) => {
61
+ if (userIsOpen === void 0)
62
+ setIsOpen(true);
63
+ onClick(e);
64
+ }, [onClick, userIsOpen]);
65
+ const handleItemClick = useCallback(() => {
66
+ if (closeOnClick && userIsOpen === void 0)
67
+ handleOnClose();
68
+ }, [closeOnClick, handleOnClose, userIsOpen]);
69
+ const content = useMemo(() => /* @__PURE__ */ React2.createElement(PopupMenuContent, {
70
+ options,
71
+ onItemClick: handleItemClick,
72
+ onClose: handleOnClose,
73
+ popupOnKeyPress
74
+ }), [options, handleItemClick, handleOnClose, popupOnKeyPress]);
75
+ return /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(Button, __spreadValues({
76
+ onClick: handleTriggerOnClick,
77
+ onKeyPress: handleKeyPress,
78
+ title,
79
+ ref: setButtonRef,
80
+ "data-testid": "gh-toolbar-item",
81
+ id
82
+ }, getDataProps(otherProps)), Icon && /* @__PURE__ */ React2.createElement(Icon, {
83
+ fill: "#FFF",
84
+ size: "m"
85
+ })), /* @__PURE__ */ React2.createElement(DSPopperJS, {
86
+ referenceElement: buttonRef,
87
+ showPopover: userIsOpen ?? isOpen,
88
+ closeContextMenu: handleOnClose,
89
+ onClickOutside
90
+ }, content));
91
+ };
92
+ export {
93
+ PopupMenu
94
+ };
95
+ //# sourceMappingURL=PopupMenu.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/PopupMenu/PopupMenu.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useCallback, useMemo } from 'react';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { PopupMenuContent } from './PopupMenuContent';\nimport { Button } from '../../components/Toolbar/styles';\nimport { getDataProps } from '@elliemae/ds-props-helpers';\nimport type { PopupPropsT as Props } from '../../GlobalHeaderTypes';\n\nexport const PopupMenu = ({ Icon, title, onClick, id, componentProps, ...otherProps }: Props): JSX.Element => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const [buttonRef, setButtonRef] = useState<HTMLButtonElement | null>(null);\n\n const {\n onClickOutside = () => null,\n onKeyPress,\n popupOnKeyPress,\n isOpen: userIsOpen,\n options,\n closeOnClick,\n } = componentProps;\n\n const handleKeyPress = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.code === 'Enter' || e.code === 'Space') {\n setIsOpen(true);\n }\n if (onKeyPress) onKeyPress(e);\n },\n [onKeyPress],\n );\n\n const handleOnClose = useCallback(() => {\n if (userIsOpen === undefined) {\n setIsOpen(false);\n }\n buttonRef?.focus();\n }, [buttonRef, userIsOpen]);\n\n const handleTriggerOnClick = useCallback(\n (e) => {\n if (userIsOpen === undefined) setIsOpen(true);\n onClick(e);\n },\n [onClick, userIsOpen],\n );\n\n const handleItemClick = useCallback(() => {\n if (closeOnClick && userIsOpen === undefined) handleOnClose();\n }, [closeOnClick, handleOnClose, userIsOpen]);\n\n const content = useMemo(\n () => (\n <PopupMenuContent\n options={options}\n onItemClick={handleItemClick}\n onClose={handleOnClose}\n popupOnKeyPress={popupOnKeyPress}\n />\n ),\n [options, handleItemClick, handleOnClose, popupOnKeyPress],\n );\n\n return (\n <div>\n <Button\n onClick={handleTriggerOnClick}\n onKeyPress={handleKeyPress}\n title={title}\n ref={setButtonRef}\n data-testid=\"gh-toolbar-item\"\n id={id}\n {...getDataProps(otherProps)}\n >\n {Icon && <Icon fill=\"#FFF\" size=\"m\" />}\n </Button>\n <DSPopperJS\n referenceElement={buttonRef}\n showPopover={userIsOpen ?? isOpen}\n closeContextMenu={handleOnClose}\n onClickOutside={onClickOutside}\n >\n {content}\n </DSPopperJS>\n </div>\n );\n};\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AAGO,MAAM,YAAY,CAAC,OAAoF;AAApF,eAAE,QAAM,OAAO,SAAS,IAAI,mBAA5B,IAA+C,uBAA/C,IAA+C,CAA7C,QAAM,SAAO,WAAS,MAAI;AACpD,QAAM,CAAC,QAAQ,aAAa,SAAkB;AAC9C,QAAM,CAAC,WAAW,gBAAgB,SAAmC;AAErE,QAAM;AAAA,IACJ,iBAAiB,MAAM;AAAA,IACvB;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,MACE;AAEJ,QAAM,iBAAiB,YACrB,CAAC,MAA2B;AAC1B,QAAI,EAAE,SAAS,WAAW,EAAE,SAAS,SAAS;AAC5C,gBAAU;AAAA;AAEZ,QAAI;AAAY,iBAAW;AAAA,KAE7B,CAAC;AAGH,QAAM,gBAAgB,YAAY,MAAM;AACtC,QAAI,eAAe,QAAW;AAC5B,gBAAU;AAAA;AAEZ,eAAW;AAAA,KACV,CAAC,WAAW;AAEf,QAAM,uBAAuB,YAC3B,CAAC,MAAM;AACL,QAAI,eAAe;AAAW,gBAAU;AACxC,YAAQ;AAAA,KAEV,CAAC,SAAS;AAGZ,QAAM,kBAAkB,YAAY,MAAM;AACxC,QAAI,gBAAgB,eAAe;AAAW;AAAA,KAC7C,CAAC,cAAc,eAAe;AAEjC,QAAM,UAAU,QACd,MACE,qCAAC,kBAAD;AAAA,IACE;AAAA,IACA,aAAa;AAAA,IACb,SAAS;AAAA,IACT;AAAA,MAGJ,CAAC,SAAS,iBAAiB,eAAe;AAG5C,SACE,qCAAC,OAAD,MACE,qCAAC,QAAD;AAAA,IACE,SAAS;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA,KAAK;AAAA,IACL,eAAY;AAAA,IACZ;AAAA,KACI,aAAa,cAEhB,QAAQ,qCAAC,MAAD;AAAA,IAAM,MAAK;AAAA,IAAO,MAAK;AAAA,OAElC,qCAAC,YAAD;AAAA,IACE,kBAAkB;AAAA,IAClB,aAAa,cAAc;AAAA,IAC3B,kBAAkB;AAAA,IAClB;AAAA,KAEC;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,70 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
4
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
+ var __spreadValues = (a, b) => {
7
+ for (var prop in b || (b = {}))
8
+ if (__hasOwnProp.call(b, prop))
9
+ __defNormalProp(a, prop, b[prop]);
10
+ if (__getOwnPropSymbols)
11
+ for (var prop of __getOwnPropSymbols(b)) {
12
+ if (__propIsEnum.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ }
15
+ return a;
16
+ };
17
+ import * as React from "react";
18
+ import React2, { useRef, useEffect, useMemo, useContext } from "react";
19
+ import { getAriaProps, getDataProps } from "@elliemae/ds-props-helpers";
20
+ import { Separator, ItemWrapper, Label, List } from "./styles";
21
+ import { GlobalHeaderContext } from "../../GlobalHeaderContext";
22
+ const PopupMenuContent = React2.memo(({ options, onItemClick, onClose, popupOnKeyPress }) => {
23
+ const { instanceUID } = useContext(GlobalHeaderContext);
24
+ const menuRef = useRef(null);
25
+ useEffect(() => {
26
+ menuRef.current?.firstChild?.focus();
27
+ }, []);
28
+ const content = useMemo(() => options.map((option) => {
29
+ const { type, Icon, label = "", onClick, Content, id } = option;
30
+ const ariaAndDataProps = __spreadValues(__spreadValues({}, getAriaProps(option)), getDataProps(option));
31
+ const handleClick = (e) => {
32
+ onItemClick(e);
33
+ if (onClick)
34
+ onClick(e);
35
+ };
36
+ const handleKeyDown = (e) => {
37
+ if (e.code === "Escape")
38
+ onClose();
39
+ if (popupOnKeyPress)
40
+ popupOnKeyPress(e);
41
+ };
42
+ switch (type) {
43
+ case "separator":
44
+ return /* @__PURE__ */ React2.createElement(Separator, __spreadValues({
45
+ key: `${instanceUID}-separator-${label}`
46
+ }, ariaAndDataProps));
47
+ case "custom":
48
+ return /* @__PURE__ */ React2.createElement(ItemWrapper, __spreadValues({
49
+ onClick: handleClick,
50
+ onKeyDown: handleKeyDown,
51
+ key: `${instanceUID}-popup-${label}`,
52
+ id
53
+ }, ariaAndDataProps), Content && /* @__PURE__ */ React2.createElement(Content, null));
54
+ default:
55
+ return /* @__PURE__ */ React2.createElement(ItemWrapper, __spreadValues({
56
+ onClick: handleClick,
57
+ onKeyDown: handleKeyDown,
58
+ key: `${instanceUID}-popup-${label}`,
59
+ id
60
+ }, ariaAndDataProps), Icon && /* @__PURE__ */ React2.createElement(Icon, null), Label && /* @__PURE__ */ React2.createElement(Label, null, label));
61
+ }
62
+ }), [options, onItemClick, onClose, popupOnKeyPress, instanceUID]);
63
+ return /* @__PURE__ */ React2.createElement(List, {
64
+ ref: menuRef
65
+ }, content);
66
+ });
67
+ export {
68
+ PopupMenuContent
69
+ };
70
+ //# sourceMappingURL=PopupMenuContent.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/PopupMenu/PopupMenuContent.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useEffect, useMemo, useContext } from 'react';\nimport { getAriaProps, getDataProps } from '@elliemae/ds-props-helpers';\nimport { Separator, ItemWrapper, Label, List } from './styles';\nimport type { PopupMenuContentPropsT as Props } from '../../GlobalHeaderTypes';\nimport { GlobalHeaderContext } from '../../GlobalHeaderContext';\n\nexport const PopupMenuContent = React.memo(({ options, onItemClick, onClose, popupOnKeyPress }: Props): JSX.Element => {\n const { instanceUID } = useContext(GlobalHeaderContext);\n\n const menuRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n (menuRef.current?.firstChild as HTMLButtonElement)?.focus();\n }, []);\n\n const content = useMemo(\n () =>\n options.map((option) => {\n const { type, Icon, label = '', onClick, Content, id } = option;\n\n const ariaAndDataProps = {\n ...getAriaProps(option),\n ...getDataProps(option),\n };\n\n const handleClick = (e: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onItemClick(e);\n if (onClick) onClick(e);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.code === 'Escape') onClose();\n if (popupOnKeyPress) popupOnKeyPress(e);\n };\n\n switch (type) {\n case 'separator':\n return <Separator key={`${instanceUID}-separator-${label}`} {...ariaAndDataProps} />;\n case 'custom':\n return (\n <ItemWrapper\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n key={`${instanceUID}-popup-${label}`}\n id={id}\n {...ariaAndDataProps}\n >\n {Content && <Content />}\n </ItemWrapper>\n );\n default:\n return (\n <ItemWrapper\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n key={`${instanceUID}-popup-${label}`}\n id={id}\n {...ariaAndDataProps}\n >\n {Icon && <Icon />}\n {Label && <Label>{label}</Label>}\n </ItemWrapper>\n );\n }\n }),\n [options, onItemClick, onClose, popupOnKeyPress, instanceUID],\n );\n return <List ref={menuRef}>{content}</List>;\n});\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AAEA;AAEO,MAAM,mBAAmB,OAAM,KAAK,CAAC,EAAE,SAAS,aAAa,SAAS,sBAA0C;AACrH,QAAM,EAAE,gBAAgB,WAAW;AAEnC,QAAM,UAAU,OAAuB;AAEvC,YAAU,MAAM;AACd,IAAC,QAAQ,SAAS,YAAkC;AAAA,KACnD;AAEH,QAAM,UAAU,QACd,MACE,QAAQ,IAAI,CAAC,WAAW;AACtB,UAAM,EAAE,MAAM,MAAM,QAAQ,IAAI,SAAS,SAAS,OAAO;AAEzD,UAAM,mBAAmB,kCACpB,aAAa,UACb,aAAa;AAGlB,UAAM,cAAc,CAAC,MAAiD;AACpE,kBAAY;AACZ,UAAI;AAAS,gBAAQ;AAAA;AAGvB,UAAM,gBAAgB,CAAC,MAA2B;AAChD,UAAI,EAAE,SAAS;AAAU;AACzB,UAAI;AAAiB,wBAAgB;AAAA;AAGvC,YAAQ;AAAA,WACD;AACH,eAAO,qCAAC,WAAD;AAAA,UAAW,KAAK,GAAG,yBAAyB;AAAA,WAAa;AAAA,WAC7D;AACH,eACE,qCAAC,aAAD;AAAA,UACE,SAAS;AAAA,UACT,WAAW;AAAA,UACX,KAAK,GAAG,qBAAqB;AAAA,UAC7B;AAAA,WACI,mBAEH,WAAW,qCAAC,SAAD;AAAA;AAIhB,eACE,qCAAC,aAAD;AAAA,UACE,SAAS;AAAA,UACT,WAAW;AAAA,UACX,KAAK,GAAG,qBAAqB;AAAA,UAC7B;AAAA,WACI,mBAEH,QAAQ,qCAAC,MAAD,OACR,SAAS,qCAAC,OAAD,MAAQ;AAAA;AAAA,MAK9B,CAAC,SAAS,aAAa,SAAS,iBAAiB;AAEnD,SAAO,qCAAC,MAAD;AAAA,IAAM,KAAK;AAAA,KAAU;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,38 @@
1
+ import * as React from "react";
2
+ import styled from "styled-components";
3
+ const List = styled.div`
4
+ padding: 5px 0px;
5
+ background: white;
6
+ `;
7
+ const ItemWrapper = styled.button`
8
+ display: flex;
9
+ align-items: center;
10
+ justify-content: center;
11
+ width: 100%;
12
+ padding: 0 20px;
13
+ cursor: pointer;
14
+ border: 1px solid transparent;
15
+ background-color: transparent;
16
+ outline: none;
17
+ :hover,
18
+ :focus {
19
+ border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};
20
+ }
21
+ `;
22
+ const Label = styled.p`
23
+ width: 100%;
24
+ font-size: 14px;
25
+ margin: 10px;
26
+ `;
27
+ const Separator = styled.div`
28
+ width: 100%;
29
+ border: none;
30
+ border-bottom: 1px solid #ccc;
31
+ `;
32
+ export {
33
+ ItemWrapper,
34
+ Label,
35
+ List,
36
+ Separator
37
+ };
38
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/PopupMenu/styles.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\n\nexport const List = styled.div`\n padding: 5px 0px;\n background: white;\n`;\n\nexport const ItemWrapper = styled.button`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: 0 20px;\n cursor: pointer;\n border: 1px solid transparent;\n background-color: transparent;\n outline: none;\n :hover,\n :focus {\n border: ${({ theme }) => `1px solid ${theme.colors.brand[600]}`};\n }\n`;\n\nexport const Label = styled.p`\n width: 100%;\n font-size: 14px;\n margin: 10px;\n`;\n\nexport const Separator = styled.div`\n width: 100%;\n border: none;\n border-bottom: 1px solid #ccc;\n`;\n"],
5
+ "mappings": "AAAA;ACAA;AAEO,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAKpB,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAYpB,CAAC,EAAE,YAAY,aAAa,MAAM,OAAO,MAAM;AAAA;AAAA;AAItD,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAMrB,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,107 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
4
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
+ var __spreadValues = (a, b) => {
7
+ for (var prop in b || (b = {}))
8
+ if (__hasOwnProp.call(b, prop))
9
+ __defNormalProp(a, prop, b[prop]);
10
+ if (__getOwnPropSymbols)
11
+ for (var prop of __getOwnPropSymbols(b)) {
12
+ if (__propIsEnum.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ }
15
+ return a;
16
+ };
17
+ var __objRest = (source, exclude) => {
18
+ var target = {};
19
+ for (var prop in source)
20
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
21
+ target[prop] = source[prop];
22
+ if (source != null && __getOwnPropSymbols)
23
+ for (var prop of __getOwnPropSymbols(source)) {
24
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
25
+ target[prop] = source[prop];
26
+ }
27
+ return target;
28
+ };
29
+ import * as React from "react";
30
+ import React2, { useState, useCallback, useRef } from "react";
31
+ import { Search } from "@elliemae/ds-icons";
32
+ import { getDataProps } from "@elliemae/ds-props-helpers";
33
+ import { DSIconColors } from "@elliemae/ds-icon";
34
+ import { DSNavSearchBox } from "@elliemae/ds-form";
35
+ import { StyledNavSearchBoxContainer } from "./styles";
36
+ import { Button } from "../../components/Toolbar/styles";
37
+ const SearchToggle = (_a) => {
38
+ var _b = _a, { id, componentProps } = _b, otherProps = __objRest(_b, ["id", "componentProps"]);
39
+ const [isOpen, setIsOpen] = useState(false);
40
+ const inputRef = useRef(null);
41
+ const triggerRef = useRef(null);
42
+ const containerRef = useRef(null);
43
+ const {
44
+ onNext,
45
+ onPrevious,
46
+ currentResultIndex,
47
+ totalResults,
48
+ placeholder,
49
+ value,
50
+ onChange,
51
+ onBlur,
52
+ onClear,
53
+ isOpen: userIsOpen,
54
+ onKeyDown,
55
+ onClick
56
+ } = componentProps;
57
+ const handleOnClick = useCallback((e) => {
58
+ if (userIsOpen === void 0)
59
+ setIsOpen(true);
60
+ if (onClick)
61
+ onClick(e);
62
+ }, [onClick, userIsOpen]);
63
+ const handleOnKeyDown = useCallback((e) => {
64
+ if (userIsOpen === void 0) {
65
+ if (e.code === "Escape") {
66
+ setIsOpen(false);
67
+ setTimeout(() => triggerRef.current?.focus());
68
+ }
69
+ }
70
+ if (onKeyDown)
71
+ onKeyDown(e);
72
+ }, [onKeyDown, userIsOpen]);
73
+ const handleOnBlur = useCallback(() => {
74
+ setTimeout(() => {
75
+ const contains = containerRef.current?.contains(document.activeElement);
76
+ if (value === "" && !contains)
77
+ setIsOpen(false);
78
+ });
79
+ }, [value]);
80
+ return userIsOpen || isOpen ? /* @__PURE__ */ React2.createElement(StyledNavSearchBoxContainer, {
81
+ onKeyDown: handleOnKeyDown,
82
+ ref: containerRef,
83
+ onBlur: handleOnBlur
84
+ }, /* @__PURE__ */ React2.createElement(DSNavSearchBox, {
85
+ onNext,
86
+ onPrevious,
87
+ currentResultIndex,
88
+ totalResults,
89
+ onClear,
90
+ placeholder,
91
+ onChange,
92
+ value,
93
+ onBlur,
94
+ innerRef: inputRef,
95
+ autoFocus: true
96
+ })) : /* @__PURE__ */ React2.createElement(Button, __spreadValues({
97
+ onClick: handleOnClick,
98
+ ref: triggerRef,
99
+ id
100
+ }, getDataProps(otherProps)), /* @__PURE__ */ React2.createElement(Search, {
101
+ color: DSIconColors.WHITE
102
+ }));
103
+ };
104
+ export {
105
+ SearchToggle
106
+ };
107
+ //# sourceMappingURL=SearchToggle.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/SearchToggle/SearchToggle.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useCallback, useRef } from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { getDataProps } from '@elliemae/ds-props-helpers';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { DSNavSearchBox } from '@elliemae/ds-form';\nimport { StyledNavSearchBoxContainer } from './styles';\nimport { Button } from '../../components/Toolbar/styles';\nimport type { SearchTogglePropsT } from '../../GlobalHeaderTypes';\n\nexport const SearchToggle = ({ id, componentProps, ...otherProps }: SearchTogglePropsT): JSX.Element => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const inputRef = useRef<HTMLInputElement | null>(null);\n const triggerRef = useRef<HTMLButtonElement | null>(null);\n const containerRef = useRef<HTMLDivElement | null>(null);\n\n const {\n onNext,\n onPrevious,\n currentResultIndex,\n totalResults,\n placeholder,\n value,\n onChange,\n onBlur,\n onClear,\n isOpen: userIsOpen,\n onKeyDown,\n onClick,\n } = componentProps;\n\n const handleOnClick = useCallback(\n (e) => {\n if (userIsOpen === undefined) setIsOpen(true);\n if (onClick) onClick(e);\n },\n [onClick, userIsOpen],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (userIsOpen === undefined) {\n if (e.code === 'Escape') {\n setIsOpen(false);\n setTimeout(() => triggerRef.current?.focus());\n }\n }\n if (onKeyDown) onKeyDown(e);\n },\n [onKeyDown, userIsOpen],\n );\n\n const handleOnBlur = useCallback(() => {\n setTimeout(() => {\n const contains = containerRef.current?.contains(document.activeElement);\n if (value === '' && !contains) setIsOpen(false);\n });\n }, [value]);\n\n return userIsOpen || isOpen ? (\n <StyledNavSearchBoxContainer onKeyDown={handleOnKeyDown} ref={containerRef} onBlur={handleOnBlur}>\n <DSNavSearchBox\n onNext={onNext}\n onPrevious={onPrevious}\n currentResultIndex={currentResultIndex}\n totalResults={totalResults}\n onClear={onClear}\n placeholder={placeholder}\n onChange={onChange}\n value={value}\n onBlur={onBlur}\n innerRef={inputRef}\n autoFocus\n />\n </StyledNavSearchBoxContainer>\n ) : (\n <Button onClick={handleOnClick} ref={triggerRef} id={id} {...getDataProps(otherProps)}>\n <Search color={DSIconColors.WHITE} />\n </Button>\n );\n};\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGO,MAAM,eAAe,CAAC,OAA2E;AAA3E,eAAE,MAAI,mBAAN,IAAyB,uBAAzB,IAAyB,CAAvB,MAAI;AACjC,QAAM,CAAC,QAAQ,aAAa,SAAkB;AAC9C,QAAM,WAAW,OAAgC;AACjD,QAAM,aAAa,OAAiC;AACpD,QAAM,eAAe,OAA8B;AAEnD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,MACE;AAEJ,QAAM,gBAAgB,YACpB,CAAC,MAAM;AACL,QAAI,eAAe;AAAW,gBAAU;AACxC,QAAI;AAAS,cAAQ;AAAA,KAEvB,CAAC,SAAS;AAGZ,QAAM,kBAAkB,YACtB,CAAC,MAA2B;AAC1B,QAAI,eAAe,QAAW;AAC5B,UAAI,EAAE,SAAS,UAAU;AACvB,kBAAU;AACV,mBAAW,MAAM,WAAW,SAAS;AAAA;AAAA;AAGzC,QAAI;AAAW,gBAAU;AAAA,KAE3B,CAAC,WAAW;AAGd,QAAM,eAAe,YAAY,MAAM;AACrC,eAAW,MAAM;AACf,YAAM,WAAW,aAAa,SAAS,SAAS,SAAS;AACzD,UAAI,UAAU,MAAM,CAAC;AAAU,kBAAU;AAAA;AAAA,KAE1C,CAAC;AAEJ,SAAO,cAAc,SACnB,qCAAC,6BAAD;AAAA,IAA6B,WAAW;AAAA,IAAiB,KAAK;AAAA,IAAc,QAAQ;AAAA,KAClF,qCAAC,gBAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,WAAS;AAAA,QAIb,qCAAC,QAAD;AAAA,IAAQ,SAAS;AAAA,IAAe,KAAK;AAAA,IAAY;AAAA,KAAY,aAAa,cACxE,qCAAC,QAAD;AAAA,IAAQ,OAAO,aAAa;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,53 @@
1
+ import * as React from "react";
2
+ import styled from "styled-components";
3
+ const StyledNavSearchBoxContainer = styled.div`
4
+ background: white;
5
+ position: relative;
6
+
7
+ min-width: 260px;
8
+
9
+ & .em-ds-button {
10
+ margin-right: 2px;
11
+ height: 24px;
12
+ width: 24px;
13
+ }
14
+
15
+ & .em-ds-input {
16
+ border: none;
17
+ outline: none;
18
+ box-shadow: none;
19
+ }
20
+
21
+ & .em-ds-input:focus {
22
+ border: none;
23
+ box-shadow: none;
24
+ }
25
+
26
+ & .em-ds-input.em-ds-input--clearable:hover {
27
+ border: none;
28
+ outline: none;
29
+ box-shadow: none;
30
+ }
31
+
32
+ & .em-ds-input-addon-wrapper {
33
+ box-shadow: none;
34
+ }
35
+
36
+ & .em-ds-input-addon-wrapper:hover {
37
+ outline: none;
38
+ }
39
+
40
+ & .em-ds-input-addon-wrapper__addon:hover {
41
+ outline: none;
42
+ }
43
+
44
+ & .em-ds-input:not(.floating-label-input-controller):hover:active {
45
+ border: none;
46
+ outline: none;
47
+ box-shadow: none;
48
+ }
49
+ `;
50
+ export {
51
+ StyledNavSearchBoxContainer
52
+ };
53
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/outOfTheBox/SearchToggle/styles.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\n\nexport const StyledNavSearchBoxContainer = styled.div`\n background: white;\n position: relative;\n\n min-width: 260px;\n\n & .em-ds-button {\n margin-right: 2px;\n height: 24px;\n width: 24px;\n }\n\n & .em-ds-input {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input:focus {\n border: none;\n box-shadow: none;\n }\n\n & .em-ds-input.em-ds-input--clearable:hover {\n border: none;\n outline: none;\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper {\n box-shadow: none;\n }\n\n & .em-ds-input-addon-wrapper:hover {\n outline: none;\n }\n\n & .em-ds-input-addon-wrapper__addon:hover {\n outline: none;\n }\n\n & .em-ds-input:not(.floating-label-input-controller):hover:active {\n border: none;\n outline: none;\n box-shadow: none;\n }\n`;\n"],
5
+ "mappings": "AAAA;ACAA;AAEO,MAAM,8BAA8B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,5 @@
1
+ import * as React from "react";
2
+ export * from "./AppPicker/AppPicker";
3
+ export * from "./PopupMenu/PopupMenu";
4
+ export * from "./SearchToggle/SearchToggle";
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/outOfTheBox/index.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './AppPicker/AppPicker';\nexport * from './PopupMenu/PopupMenu';\nexport * from './SearchToggle/SearchToggle';\n"],
5
+ "mappings": "AAAA;ACAA;AACA;AACA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,27 @@
1
+ import * as React from "react";
2
+ import { PropTypes } from "react-desc";
3
+ const breadcrumbItem = PropTypes.shape({
4
+ label: PropTypes.string.description("breadrcrumb item label"),
5
+ hasNext: PropTypes.bool.description("whether the item has a child or not"),
6
+ isSelected: PropTypes.bool.description("whether the item is selected or not"),
7
+ onClick: PropTypes.func.description("Callback executed on click")
8
+ });
9
+ const toolbarItem = PropTypes.shape({
10
+ label: PropTypes.string.description("title tag description"),
11
+ type: PropTypes.oneOf(["ds-app-picker", "ds-popup-menu", "ds-search-toggle", "custom"]).description("use to select one of the out-of-the-box types of items"),
12
+ componentProps: PropTypes.object.description("props of out-of-the-box component"),
13
+ Icon: PropTypes.func.description("Icon to display"),
14
+ onClick: PropTypes.func.description("Callback executed on click")
15
+ });
16
+ const globalHeaderProps = {
17
+ Logo: PropTypes.func.description("Global Header Logo to render. Logo and LogoWithBrand are going to swap during window resizing."),
18
+ LogoWithBrand: PropTypes.func.description("Global Header Logo With Brand title to render. Logo and LogoWithBrand are going to swap during window resizing."),
19
+ breadcrumb: PropTypes.arrayOf(breadcrumbItem).description("Breadcrumb items to display. max 3 levels"),
20
+ toolbar: PropTypes.arrayOf(toolbarItem).description("Toolbar items")
21
+ };
22
+ export {
23
+ breadcrumbItem,
24
+ globalHeaderProps,
25
+ toolbarItem
26
+ };
27
+ //# sourceMappingURL=propTypes.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/propTypes.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from 'react-desc';\n\nexport const breadcrumbItem = PropTypes.shape({\n label: PropTypes.string.description('breadrcrumb item label'),\n hasNext: PropTypes.bool.description('whether the item has a child or not'),\n isSelected: PropTypes.bool.description('whether the item is selected or not'),\n onClick: PropTypes.func.description('Callback executed on click'),\n});\n\nexport const toolbarItem = PropTypes.shape({\n label: PropTypes.string.description('title tag description'),\n type: PropTypes.oneOf(['ds-app-picker', 'ds-popup-menu', 'ds-search-toggle', 'custom']).description(\n 'use to select one of the out-of-the-box types of items',\n ),\n componentProps: PropTypes.object.description('props of out-of-the-box component'),\n Icon: PropTypes.func.description('Icon to display'),\n onClick: PropTypes.func.description('Callback executed on click'),\n});\n\nexport const globalHeaderProps = {\n Logo: PropTypes.func.description(\n 'Global Header Logo to render. Logo and LogoWithBrand are going to swap during window resizing.',\n ),\n LogoWithBrand: PropTypes.func.description(\n 'Global Header Logo With Brand title to render. Logo and LogoWithBrand are going to swap during window resizing.',\n ),\n breadcrumb: PropTypes.arrayOf(breadcrumbItem).description('Breadcrumb items to display. max 3 levels'),\n toolbar: PropTypes.arrayOf(toolbarItem).description('Toolbar items'),\n};\n"],
5
+ "mappings": "AAAA;ACAA;AAEO,MAAM,iBAAiB,UAAU,MAAM;AAAA,EAC5C,OAAO,UAAU,OAAO,YAAY;AAAA,EACpC,SAAS,UAAU,KAAK,YAAY;AAAA,EACpC,YAAY,UAAU,KAAK,YAAY;AAAA,EACvC,SAAS,UAAU,KAAK,YAAY;AAAA;AAG/B,MAAM,cAAc,UAAU,MAAM;AAAA,EACzC,OAAO,UAAU,OAAO,YAAY;AAAA,EACpC,MAAM,UAAU,MAAM,CAAC,iBAAiB,iBAAiB,oBAAoB,WAAW,YACtF;AAAA,EAEF,gBAAgB,UAAU,OAAO,YAAY;AAAA,EAC7C,MAAM,UAAU,KAAK,YAAY;AAAA,EACjC,SAAS,UAAU,KAAK,YAAY;AAAA;AAG/B,MAAM,oBAAoB;AAAA,EAC/B,MAAM,UAAU,KAAK,YACnB;AAAA,EAEF,eAAe,UAAU,KAAK,YAC5B;AAAA,EAEF,YAAY,UAAU,QAAQ,gBAAgB,YAAY;AAAA,EAC1D,SAAS,UAAU,QAAQ,aAAa,YAAY;AAAA;",
6
+ "names": []
7
+ }