@elliemae/ds-app-picker 3.70.0-next.3 → 3.70.0-next.30

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 (94) hide show
  1. package/dist/cjs/DSAppPicker.js +59 -132
  2. package/dist/cjs/DSAppPicker.js.map +3 -3
  3. package/dist/cjs/{utils.js → DSAppPickerCTX.js} +26 -23
  4. package/dist/cjs/DSAppPickerCTX.js.map +7 -0
  5. package/dist/cjs/config/useAppPicker.js +3 -3
  6. package/dist/cjs/config/useAppPicker.js.map +3 -3
  7. package/dist/cjs/config/useAppPickerBehavior.js +156 -0
  8. package/dist/cjs/config/useAppPickerBehavior.js.map +7 -0
  9. package/dist/cjs/config/useFocusTracker.js +115 -0
  10. package/dist/cjs/config/useFocusTracker.js.map +7 -0
  11. package/dist/cjs/config/useValidateProps.js +45 -0
  12. package/dist/cjs/config/useValidateProps.js.map +7 -0
  13. package/dist/cjs/constants/index.js +8 -1
  14. package/dist/cjs/constants/index.js.map +2 -2
  15. package/dist/cjs/index.js.map +1 -1
  16. package/dist/cjs/parts/AppPanel.js +159 -0
  17. package/dist/cjs/parts/AppPanel.js.map +7 -0
  18. package/dist/cjs/parts/AppPickerItem.js +102 -0
  19. package/dist/cjs/parts/AppPickerItem.js.map +7 -0
  20. package/dist/cjs/parts/AppSection.js +68 -0
  21. package/dist/cjs/parts/AppSection.js.map +7 -0
  22. package/dist/cjs/parts/Trigger.js +62 -0
  23. package/dist/cjs/parts/Trigger.js.map +7 -0
  24. package/dist/cjs/{styles.js → parts/style.js} +21 -9
  25. package/dist/cjs/parts/style.js.map +7 -0
  26. package/dist/cjs/react-desc-prop-types.js +6 -7
  27. package/dist/cjs/react-desc-prop-types.js.map +2 -2
  28. package/dist/cjs/typescript-testing/typescript-app-picker-valid.js +5 -0
  29. package/dist/cjs/typescript-testing/typescript-app-picker-valid.js.map +2 -2
  30. package/dist/esm/DSAppPicker.js +62 -135
  31. package/dist/esm/DSAppPicker.js.map +2 -2
  32. package/dist/esm/DSAppPickerCTX.js +28 -0
  33. package/dist/esm/DSAppPickerCTX.js.map +7 -0
  34. package/dist/esm/config/useAppPicker.js +4 -5
  35. package/dist/esm/config/useAppPicker.js.map +3 -3
  36. package/dist/esm/config/useAppPickerBehavior.js +126 -0
  37. package/dist/esm/config/useAppPickerBehavior.js.map +7 -0
  38. package/dist/esm/config/useFocusTracker.js +85 -0
  39. package/dist/esm/config/useFocusTracker.js.map +7 -0
  40. package/dist/esm/config/useValidateProps.js +15 -0
  41. package/dist/esm/config/useValidateProps.js.map +7 -0
  42. package/dist/esm/constants/index.js +8 -1
  43. package/dist/esm/constants/index.js.map +2 -2
  44. package/dist/esm/index.js.map +1 -1
  45. package/dist/esm/parts/AppPanel.js +129 -0
  46. package/dist/esm/parts/AppPanel.js.map +7 -0
  47. package/dist/esm/parts/AppPickerItem.js +72 -0
  48. package/dist/esm/parts/AppPickerItem.js.map +7 -0
  49. package/dist/esm/parts/AppSection.js +38 -0
  50. package/dist/esm/parts/AppSection.js.map +7 -0
  51. package/dist/esm/parts/Trigger.js +32 -0
  52. package/dist/esm/parts/Trigger.js.map +7 -0
  53. package/dist/esm/{styles.js → parts/style.js} +18 -6
  54. package/dist/esm/parts/style.js.map +7 -0
  55. package/dist/esm/react-desc-prop-types.js +12 -8
  56. package/dist/esm/react-desc-prop-types.js.map +2 -2
  57. package/dist/esm/typescript-testing/typescript-app-picker-valid.js +5 -0
  58. package/dist/esm/typescript-testing/typescript-app-picker-valid.js.map +2 -2
  59. package/dist/types/DSAppPicker.d.ts +0 -1
  60. package/dist/types/DSAppPickerCTX.d.ts +17 -0
  61. package/dist/types/config/useAppPicker.d.ts +5 -5
  62. package/dist/types/config/useAppPickerBehavior.d.ts +39 -0
  63. package/dist/types/config/useFocusTracker.d.ts +15 -0
  64. package/dist/types/config/useValidateProps.d.ts +3 -0
  65. package/dist/types/constants/index.d.ts +14 -7
  66. package/dist/types/parts/AppPanel.d.ts +9 -0
  67. package/dist/types/parts/AppPickerItem.d.ts +14 -0
  68. package/dist/types/parts/AppSection.d.ts +17 -0
  69. package/dist/types/parts/Trigger.d.ts +15 -0
  70. package/dist/types/{styles.d.ts → parts/style.d.ts} +3 -4
  71. package/dist/types/react-desc-prop-types.d.ts +21 -8
  72. package/dist/types/tests/app-picker.get-owner-props-arguments-18354.test.d.ts +1 -0
  73. package/dist/types/tests/app-picker.proptype-schema.test.d.ts +1 -0
  74. package/dist/types/tests/app-picker.pui-18354.test.d.ts +1 -0
  75. package/dist/types/tests/playwright/DSAppPicker.slot-contracts-dynamic.test.playwright.d.ts +1 -0
  76. package/dist/types/tests/playwright/DSAppPickerSlotContractRenderer.d.ts +1 -0
  77. package/package.json +16 -14
  78. package/dist/cjs/AppPickerImpl.js +0 -204
  79. package/dist/cjs/AppPickerImpl.js.map +0 -7
  80. package/dist/cjs/hooks/useKeepTrackButtons.js +0 -69
  81. package/dist/cjs/hooks/useKeepTrackButtons.js.map +0 -7
  82. package/dist/cjs/styles.js.map +0 -7
  83. package/dist/cjs/utils.js.map +0 -7
  84. package/dist/esm/AppPickerImpl.js +0 -174
  85. package/dist/esm/AppPickerImpl.js.map +0 -7
  86. package/dist/esm/hooks/useKeepTrackButtons.js +0 -39
  87. package/dist/esm/hooks/useKeepTrackButtons.js.map +0 -7
  88. package/dist/esm/styles.js.map +0 -7
  89. package/dist/esm/utils.js +0 -25
  90. package/dist/esm/utils.js.map +0 -7
  91. package/dist/types/AppPickerImpl.d.ts +0 -11
  92. package/dist/types/hooks/useKeepTrackButtons.d.ts +0 -13
  93. package/dist/types/utils.d.ts +0 -14
  94. /package/dist/types/tests/{app-picker.get-owner-props.test.d.ts → app-picker.api.test.d.ts} +0 -0
@@ -29,155 +29,82 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
29
29
  var DSAppPicker_exports = {};
30
30
  __export(DSAppPicker_exports, {
31
31
  AppPickerWithSchema: () => AppPickerWithSchema,
32
- DSAppPicker: () => DSAppPicker,
33
- default: () => DSAppPicker_default
32
+ DSAppPicker: () => DSAppPicker
34
33
  });
35
34
  module.exports = __toCommonJS(DSAppPicker_exports);
36
35
  var React = __toESM(require("react"));
37
36
  var import_jsx_runtime = require("react/jsx-runtime");
38
- var import_react = require("react");
39
- var import_ds_button_v2 = require("@elliemae/ds-button-v2");
40
- var import_ds_system = require("@elliemae/ds-system");
41
37
  var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
42
- var import_ds_legacy_popover = require("@elliemae/ds-legacy-popover");
43
- var import_AppPickerImpl = __toESM(require("./AppPickerImpl.js"));
38
+ var import_ds_floating_context = require("@elliemae/ds-floating-context");
39
+ var import_AppPanel = require("./parts/AppPanel.js");
44
40
  var import_react_desc_prop_types = require("./react-desc-prop-types.js");
45
41
  var import_constants = require("./constants/index.js");
46
42
  var import_useAppPicker = require("./config/useAppPicker.js");
47
- const StyledButton = (0, import_ds_system.styled)(import_ds_button_v2.DSButtonV2, { name: import_constants.DSAppPickerName, slot: import_constants.DSAppPickerSlots.BUTTON })``;
43
+ var import_useAppPickerBehavior = require("./config/useAppPickerBehavior.js");
44
+ var import_DSAppPickerCTX = require("./DSAppPickerCTX.js");
45
+ var import_style = require("./parts/style.js");
46
+ var import_Trigger = require("./parts/Trigger.js");
48
47
  const DSAppPicker = (props) => {
49
- const { propsWithDefault, ownerPropsConfig } = (0, import_useAppPicker.useAppPicker)(props);
50
- const { getOwnerProps, getOwnerPropsArguments } = ownerPropsConfig;
48
+ const appPickerConfig = (0, import_useAppPicker.useAppPicker)(props);
51
49
  const {
52
- apps,
53
- customApps,
54
- sectionTitle,
55
- customSectionTitle,
56
- icon: Icon,
50
+ Icon,
57
51
  renderTrigger,
58
- isOpen,
59
- onClose,
60
- actionRef,
61
- onKeyDown,
62
- onClick,
63
- onClickOutside,
64
- triggerRef
65
- } = propsWithDefault;
66
- const [open, setOpen] = (0, import_react.useState)(false);
67
- const [isOverflow, setIsOverflow] = (0, import_react.useState)(false);
68
- const wrapperRef = (0, import_react.useRef)(null);
69
- const defaultTriggerRef = (0, import_react.useRef)(null);
70
- const wasOpenedByKeyboardRef = (0, import_react.useRef)(false);
71
- (0, import_react.useEffect)(() => {
72
- if (actionRef && actionRef.current) {
73
- actionRef.current.focusToIndex = (index) => {
74
- if (wrapperRef.current) {
75
- const parent = wrapperRef.current;
76
- const buttons = [...parent.querySelectorAll("button")];
77
- buttons[index].focus();
78
- }
79
- };
80
- actionRef.current.focusWrapper = () => {
81
- wrapperRef.current?.focus();
82
- };
83
- }
84
- }, [actionRef, apps, customApps]);
85
- (0, import_react.useEffect)(() => {
86
- setTimeout(() => {
87
- if (wrapperRef.current) {
88
- const { scrollHeight, clientHeight } = wrapperRef.current;
89
- if (scrollHeight > clientHeight) return setIsOverflow(true);
90
- }
91
- return setIsOverflow(false);
92
- });
93
- }, [isOpen, open]);
94
- const handleOnClose = (0, import_react.useCallback)(() => {
95
- setOpen(false);
96
- onClose?.();
97
- }, [onClose]);
98
- const handleOnClickOutside = (e) => {
99
- setOpen(false);
100
- onClose?.();
101
- onClickOutside?.(e);
102
- };
103
- const AppPickerContent = (0, import_react.useCallback)(
104
- () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
105
- import_AppPickerImpl.default,
52
+ resolvedIsOpen,
53
+ floatingStyles,
54
+ arrowStyles,
55
+ floatingContext,
56
+ ownerPropsConfig,
57
+ defaultTriggerRef,
58
+ triggerRef,
59
+ wasOpenedByKeyboardRef,
60
+ handleClose,
61
+ handleTriggerRef,
62
+ handleTriggerClick,
63
+ floatingInnerRef,
64
+ focusTracker
65
+ } = (0, import_useAppPickerBehavior.useAppPickerBehavior)(appPickerConfig);
66
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_DSAppPickerCTX.DSAppPickerContext.Provider, { value: focusTracker, children: [
67
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
68
+ import_Trigger.Trigger,
106
69
  {
107
- ...getOwnerProps(),
108
- ...getOwnerPropsArguments(),
109
- apps,
110
- customApps,
111
- sectionTitle,
112
- customSectionTitle,
113
- close: handleOnClose,
114
- wrapperRef,
115
- onKeyDown,
116
- triggerRef: triggerRef || defaultTriggerRef,
117
- actionRef,
118
- triggerIsInternal: !renderTrigger,
119
- wasOpenedByKeyboardRef,
120
- isOverflow
70
+ Icon,
71
+ isOpen: resolvedIsOpen,
72
+ setRef: handleTriggerRef,
73
+ ownerProps: ownerPropsConfig,
74
+ onClick: handleTriggerClick,
75
+ renderTrigger
121
76
  }
122
77
  ),
123
- [
124
- actionRef,
125
- apps,
126
- customApps,
127
- customSectionTitle,
128
- handleOnClose,
129
- isOverflow,
130
- onKeyDown,
131
- renderTrigger,
132
- sectionTitle,
133
- triggerRef,
134
- getOwnerProps,
135
- getOwnerPropsArguments
136
- ]
137
- );
138
- const RenderTrigger = (0, import_react.useMemo)(
139
- () => renderTrigger || (({ ref }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
140
- StyledButton,
78
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
79
+ import_style.StyledAppPickerFloating,
141
80
  {
142
- "data-testid": "app-picker__button",
143
- id: "app-picker__button",
144
- buttonType: "icon",
145
- "aria-haspopup": "true",
146
- "aria-expanded": isOpen ?? open,
147
- "aria-label": "Application picker",
148
- innerRef: (0, import_ds_system.mergeRefs)(ref, triggerRef || defaultTriggerRef),
149
- onClick: (e) => {
150
- wasOpenedByKeyboardRef.current = e.detail === 0;
151
- onClick?.(e);
152
- setOpen(true);
153
- },
154
- getOwnerProps,
155
- getOwnerPropsArguments,
156
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {})
157
- }
158
- )),
159
- [Icon, getOwnerProps, getOwnerPropsArguments, isOpen, onClick, open, renderTrigger, triggerRef]
160
- );
161
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
162
- import_ds_legacy_popover.DSPopover,
163
- {
164
- content: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AppPickerContent, {}),
165
- isOpen: typeof isOpen === "boolean" ? isOpen : open,
166
- onClickOutside: handleOnClickOutside,
167
- placement: "bottom",
168
- interactionType: "click",
169
- renderTrigger: RenderTrigger,
170
- showArrow: true,
171
- style: {
172
- padding: "0",
173
- maxWidth: "1000px",
174
- width: "fit-content"
81
+ innerRef: floatingInnerRef,
82
+ isOpen: resolvedIsOpen,
83
+ floatingStyles,
84
+ context: floatingContext,
85
+ getOwnerProps: ownerPropsConfig.getOwnerProps,
86
+ getOwnerPropsArguments: ownerPropsConfig.getOwnerPropsArguments,
87
+ children: [
88
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
89
+ import_AppPanel.AppPanel,
90
+ {
91
+ ...appPickerConfig.propsWithDefault,
92
+ ownerPropsConfig,
93
+ globalAttributes: appPickerConfig.globalAttributes,
94
+ xstyledProps: appPickerConfig.xstyledProps,
95
+ close: handleClose,
96
+ triggerRef: triggerRef || defaultTriggerRef,
97
+ triggerIsInternal: !renderTrigger,
98
+ wasOpenedByKeyboardRef
99
+ }
100
+ ),
101
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_floating_context.PopoverArrow, { ...arrowStyles })
102
+ ]
175
103
  }
176
- }
177
- );
104
+ )
105
+ ] });
178
106
  };
179
107
  DSAppPicker.displayName = import_constants.DSAppPickerName;
180
108
  const AppPickerWithSchema = (0, import_ds_props_helpers.describe)(DSAppPicker);
181
- AppPickerWithSchema.propTypes = import_react_desc_prop_types.DSAppPickerPropTypes;
182
- var DSAppPicker_default = DSAppPicker;
109
+ AppPickerWithSchema.propTypes = import_react_desc_prop_types.DSAppPickerPropTypesSchema;
183
110
  //# sourceMappingURL=DSAppPicker.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSAppPicker.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useState, useEffect, useMemo, useRef, useCallback } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { mergeRefs, styled } from '@elliemae/ds-system';\nimport { describe } from '@elliemae/ds-props-helpers';\n\nimport { DSPopover } from '@elliemae/ds-legacy-popover';\nimport AppPickerImpl from './AppPickerImpl.js';\nimport type { DSAppPickerT } from './react-desc-prop-types.js';\nimport { DSAppPickerPropTypes } from './react-desc-prop-types.js';\nimport { DSAppPickerName, DSAppPickerSlots } from './constants/index.js';\nimport { useAppPicker } from './config/useAppPicker.js';\n\nconst StyledButton = styled(DSButtonV2, { name: DSAppPickerName, slot: DSAppPickerSlots.BUTTON })``;\nconst DSAppPicker: React.ComponentType<DSAppPickerT.Props> = (props) => {\n const { propsWithDefault, ownerPropsConfig } = useAppPicker(props);\n\n const { getOwnerProps, getOwnerPropsArguments } = ownerPropsConfig;\n\n const {\n apps,\n customApps,\n sectionTitle,\n customSectionTitle,\n icon: Icon,\n renderTrigger,\n isOpen,\n onClose,\n actionRef,\n onKeyDown,\n onClick,\n onClickOutside,\n triggerRef,\n } = propsWithDefault;\n\n const [open, setOpen] = useState(false);\n const [isOverflow, setIsOverflow] = useState(false);\n const wrapperRef = useRef<HTMLDivElement>(null);\n const defaultTriggerRef = useRef(null);\n const wasOpenedByKeyboardRef = useRef(false);\n\n useEffect(() => {\n if (actionRef && actionRef.current) {\n actionRef.current.focusToIndex = (index: number) => {\n if (wrapperRef.current) {\n const parent = wrapperRef.current;\n const buttons = [...parent.querySelectorAll('button')];\n buttons[index].focus();\n }\n };\n actionRef.current.focusWrapper = () => {\n wrapperRef.current?.focus();\n };\n }\n }, [actionRef, apps, customApps]);\n\n useEffect(() => {\n setTimeout(() => {\n if (wrapperRef.current) {\n const { scrollHeight, clientHeight } = wrapperRef.current;\n if (scrollHeight > clientHeight) return setIsOverflow(true);\n }\n return setIsOverflow(false);\n });\n }, [isOpen, open]);\n\n const handleOnClose = useCallback(() => {\n setOpen(false);\n onClose?.();\n }, [onClose]);\n\n const handleOnClickOutside = (e: React.MouseEvent) => {\n setOpen(false);\n onClose?.();\n onClickOutside?.(e);\n };\n\n const AppPickerContent = useCallback(\n () => (\n <AppPickerImpl\n {...getOwnerProps()}\n {...getOwnerPropsArguments()}\n apps={apps}\n customApps={customApps}\n sectionTitle={sectionTitle}\n customSectionTitle={customSectionTitle}\n close={handleOnClose}\n wrapperRef={wrapperRef}\n onKeyDown={onKeyDown}\n triggerRef={triggerRef || defaultTriggerRef}\n actionRef={actionRef}\n triggerIsInternal={!renderTrigger}\n wasOpenedByKeyboardRef={wasOpenedByKeyboardRef}\n isOverflow={isOverflow}\n />\n ),\n [\n actionRef,\n apps,\n customApps,\n customSectionTitle,\n handleOnClose,\n isOverflow,\n onKeyDown,\n renderTrigger,\n sectionTitle,\n triggerRef,\n getOwnerProps,\n getOwnerPropsArguments,\n ],\n );\n\n const RenderTrigger = useMemo(\n () =>\n renderTrigger ||\n (({ ref }: { ref: React.RefObject<HTMLButtonElement> }) => (\n <StyledButton\n data-testid=\"app-picker__button\"\n id=\"app-picker__button\"\n buttonType=\"icon\"\n aria-haspopup=\"true\"\n aria-expanded={isOpen ?? open}\n aria-label=\"Application picker\"\n innerRef={mergeRefs(ref, triggerRef || defaultTriggerRef)}\n onClick={(e: React.MouseEvent | React.KeyboardEvent) => {\n wasOpenedByKeyboardRef.current = e.detail === 0;\n onClick?.(e);\n setOpen(true);\n }}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Icon />\n </StyledButton>\n )),\n [Icon, getOwnerProps, getOwnerPropsArguments, isOpen, onClick, open, renderTrigger, triggerRef],\n );\n\n return (\n <DSPopover\n content={<AppPickerContent />}\n isOpen={typeof isOpen === 'boolean' ? isOpen : open}\n onClickOutside={handleOnClickOutside}\n placement=\"bottom\"\n interactionType=\"click\"\n renderTrigger={RenderTrigger}\n showArrow\n style={{\n padding: '0',\n maxWidth: '1000px',\n width: 'fit-content',\n }}\n />\n );\n};\n\nDSAppPicker.displayName = DSAppPickerName;\nconst AppPickerWithSchema = describe(DSAppPicker);\nAppPickerWithSchema.propTypes = DSAppPickerPropTypes;\n\nexport { DSAppPicker, AppPickerWithSchema };\nexport default DSAppPicker;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8EjB;AA9EN,mBAAyE;AACzE,0BAA2B;AAC3B,uBAAkC;AAClC,8BAAyB;AAEzB,+BAA0B;AAC1B,2BAA0B;AAE1B,mCAAqC;AACrC,uBAAkD;AAClD,0BAA6B;AAE7B,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,OAAO,CAAC;AAChG,MAAM,cAAuD,CAAC,UAAU;AACtE,QAAM,EAAE,kBAAkB,iBAAiB,QAAI,kCAAa,KAAK;AAEjE,QAAM,EAAE,eAAe,uBAAuB,IAAI;AAElD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,KAAK;AACtC,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,iBAAa,qBAAuB,IAAI;AAC9C,QAAM,wBAAoB,qBAAO,IAAI;AACrC,QAAM,6BAAyB,qBAAO,KAAK;AAE3C,8BAAU,MAAM;AACd,QAAI,aAAa,UAAU,SAAS;AAClC,gBAAU,QAAQ,eAAe,CAAC,UAAkB;AAClD,YAAI,WAAW,SAAS;AACtB,gBAAM,SAAS,WAAW;AAC1B,gBAAM,UAAU,CAAC,GAAG,OAAO,iBAAiB,QAAQ,CAAC;AACrD,kBAAQ,KAAK,EAAE,MAAM;AAAA,QACvB;AAAA,MACF;AACA,gBAAU,QAAQ,eAAe,MAAM;AACrC,mBAAW,SAAS,MAAM;AAAA,MAC5B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,MAAM,UAAU,CAAC;AAEhC,8BAAU,MAAM;AACd,eAAW,MAAM;AACf,UAAI,WAAW,SAAS;AACtB,cAAM,EAAE,cAAc,aAAa,IAAI,WAAW;AAClD,YAAI,eAAe,aAAc,QAAO,cAAc,IAAI;AAAA,MAC5D;AACA,aAAO,cAAc,KAAK;AAAA,IAC5B,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,IAAI,CAAC;AAEjB,QAAM,oBAAgB,0BAAY,MAAM;AACtC,YAAQ,KAAK;AACb,cAAU;AAAA,EACZ,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,uBAAuB,CAAC,MAAwB;AACpD,YAAQ,KAAK;AACb,cAAU;AACV,qBAAiB,CAAC;AAAA,EACpB;AAEA,QAAM,uBAAmB;AAAA,IACvB,MACE;AAAA,MAAC,qBAAAA;AAAA,MAAA;AAAA,QACE,GAAG,cAAc;AAAA,QACjB,GAAG,uBAAuB;AAAA,QAC3B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA,YAAY,cAAc;AAAA,QAC1B;AAAA,QACA,mBAAmB,CAAC;AAAA,QACpB;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAAgB;AAAA,IACpB,MACE,kBACC,CAAC,EAAE,IAAI,MACN;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACZ,IAAG;AAAA,QACH,YAAW;AAAA,QACX,iBAAc;AAAA,QACd,iBAAe,UAAU;AAAA,QACzB,cAAW;AAAA,QACX,cAAU,4BAAU,KAAK,cAAc,iBAAiB;AAAA,QACxD,SAAS,CAAC,MAA8C;AACtD,iCAAuB,UAAU,EAAE,WAAW;AAC9C,oBAAU,CAAC;AACX,kBAAQ,IAAI;AAAA,QACd;AAAA,QACA;AAAA,QACA;AAAA,QAEA,sDAAC,QAAK;AAAA;AAAA,IACR;AAAA,IAEJ,CAAC,MAAM,eAAe,wBAAwB,QAAQ,SAAS,MAAM,eAAe,UAAU;AAAA,EAChG;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,4CAAC,oBAAiB;AAAA,MAC3B,QAAQ,OAAO,WAAW,YAAY,SAAS;AAAA,MAC/C,gBAAgB;AAAA,MAChB,WAAU;AAAA,MACV,iBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,WAAS;AAAA,MACT,OAAO;AAAA,QACL,SAAS;AAAA,QACT,UAAU;AAAA,QACV,OAAO;AAAA,MACT;AAAA;AAAA,EACF;AAEJ;AAEA,YAAY,cAAc;AAC1B,MAAM,0BAAsB,kCAAS,WAAW;AAChD,oBAAoB,YAAY;AAGhC,IAAO,sBAAQ;",
6
- "names": ["AppPickerImpl"]
4
+ "sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PopoverArrow } from '@elliemae/ds-floating-context';\nimport { AppPanel } from './parts/AppPanel.js';\nimport type { DSAppPickerT } from './react-desc-prop-types.js';\nimport { DSAppPickerPropTypesSchema } from './react-desc-prop-types.js';\nimport { DSAppPickerName } from './constants/index.js';\nimport { useAppPicker } from './config/useAppPicker.js';\nimport { useAppPickerBehavior } from './config/useAppPickerBehavior.js';\nimport { DSAppPickerContext } from './DSAppPickerCTX.js';\nimport { StyledAppPickerFloating } from './parts/style.js';\nimport { Trigger } from './parts/Trigger.js';\n\nconst DSAppPicker: React.ComponentType<DSAppPickerT.Props> = (props) => {\n const appPickerConfig = useAppPicker(props);\n const {\n Icon,\n renderTrigger,\n resolvedIsOpen,\n floatingStyles,\n arrowStyles,\n floatingContext,\n ownerPropsConfig,\n defaultTriggerRef,\n triggerRef,\n wasOpenedByKeyboardRef,\n handleClose,\n handleTriggerRef,\n handleTriggerClick,\n floatingInnerRef,\n focusTracker,\n } = useAppPickerBehavior(appPickerConfig);\n\n return (\n <DSAppPickerContext.Provider value={focusTracker}>\n <Trigger\n Icon={Icon}\n isOpen={resolvedIsOpen}\n setRef={handleTriggerRef}\n ownerProps={ownerPropsConfig}\n onClick={handleTriggerClick}\n renderTrigger={renderTrigger}\n />\n <StyledAppPickerFloating\n innerRef={floatingInnerRef}\n isOpen={resolvedIsOpen}\n floatingStyles={floatingStyles}\n context={floatingContext}\n getOwnerProps={ownerPropsConfig.getOwnerProps}\n getOwnerPropsArguments={ownerPropsConfig.getOwnerPropsArguments}\n >\n <AppPanel\n {...appPickerConfig.propsWithDefault}\n ownerPropsConfig={ownerPropsConfig}\n globalAttributes={appPickerConfig.globalAttributes}\n xstyledProps={appPickerConfig.xstyledProps}\n close={handleClose}\n triggerRef={triggerRef || defaultTriggerRef}\n triggerIsInternal={!renderTrigger}\n wasOpenedByKeyboardRef={wasOpenedByKeyboardRef}\n />\n <PopoverArrow {...arrowStyles} />\n </StyledAppPickerFloating>\n </DSAppPickerContext.Provider>\n );\n};\n\nDSAppPicker.displayName = DSAppPickerName;\nconst AppPickerWithSchema = describe(DSAppPicker);\nAppPickerWithSchema.propTypes = DSAppPickerPropTypesSchema;\n\nexport { DSAppPicker, AppPickerWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmCjB;AAlCN,8BAAyB;AACzB,iCAA6B;AAC7B,sBAAyB;AAEzB,mCAA2C;AAC3C,uBAAgC;AAChC,0BAA6B;AAC7B,kCAAqC;AACrC,4BAAmC;AACnC,mBAAwC;AACxC,qBAAwB;AAExB,MAAM,cAAuD,CAAC,UAAU;AACtE,QAAM,sBAAkB,kCAAa,KAAK;AAC1C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,kDAAqB,eAAe;AAExC,SACE,6CAAC,yCAAmB,UAAnB,EAA4B,OAAO,cAClC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,YAAY;AAAA,QACZ,SAAS;AAAA,QACT;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR;AAAA,QACA,SAAS;AAAA,QACT,eAAe,iBAAiB;AAAA,QAChC,wBAAwB,iBAAiB;AAAA,QAEzC;AAAA;AAAA,YAAC;AAAA;AAAA,cACE,GAAG,gBAAgB;AAAA,cACpB;AAAA,cACA,kBAAkB,gBAAgB;AAAA,cAClC,cAAc,gBAAgB;AAAA,cAC9B,OAAO;AAAA,cACP,YAAY,cAAc;AAAA,cAC1B,mBAAmB,CAAC;AAAA,cACpB;AAAA;AAAA,UACF;AAAA,UACA,4CAAC,2CAAc,GAAG,aAAa;AAAA;AAAA;AAAA,IACjC;AAAA,KACF;AAEJ;AAEA,YAAY,cAAc;AAC1B,MAAM,0BAAsB,kCAAS,WAAW;AAChD,oBAAoB,YAAY;",
6
+ "names": []
7
7
  }
@@ -26,30 +26,33 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
26
26
  mod
27
27
  ));
28
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var utils_exports = {};
30
- __export(utils_exports, {
31
- focusSelectedOrFirstAvailable: () => focusSelectedOrFirstAvailable,
32
- keys: () => keys
29
+ var DSAppPickerCTX_exports = {};
30
+ __export(DSAppPickerCTX_exports, {
31
+ DSAppPickerContext: () => DSAppPickerContext
33
32
  });
34
- module.exports = __toCommonJS(utils_exports);
33
+ module.exports = __toCommonJS(DSAppPickerCTX_exports);
35
34
  var React = __toESM(require("react"));
36
- const keys = {
37
- LEFT: "ArrowLeft",
38
- UP: "ArrowUp",
39
- RIGHT: "ArrowRight",
40
- DOWN: "ArrowDown",
41
- ENTER: "Enter",
42
- SPACE: "",
43
- TAB: "Tab",
44
- ESC: "Escape",
45
- HOME: "Home",
46
- END: "End"
47
- };
48
- const focusSelectedOrFirstAvailable = (wrapperRef, allFocusableButtonsRef, selectedButtonRef) => {
49
- if (selectedButtonRef.current !== null) {
50
- wrapperRef?.current?.querySelectorAll("button")[selectedButtonRef.current].focus();
51
- } else {
52
- allFocusableButtonsRef?.[0]?.focus();
35
+ var import_react = require("react");
36
+ const defaultFocusContext = {
37
+ focusRegion: "",
38
+ firstFocusableRef: { current: null },
39
+ lastFocusableRef: { current: null },
40
+ registerChip: () => {
41
+ },
42
+ trackFocusChip: () => {
43
+ },
44
+ trackFocusRegionReset: () => {
45
+ },
46
+ trackFocusTrigger: () => {
47
+ },
48
+ trackFocusPanel: () => {
49
+ },
50
+ trackFocusSelectedItem: () => {
51
+ },
52
+ trackFocusFirstItem: () => {
53
+ },
54
+ trackFocusItemAtIndex: () => {
53
55
  }
54
56
  };
55
- //# sourceMappingURL=utils.js.map
57
+ const DSAppPickerContext = (0, import_react.createContext)(defaultFocusContext);
58
+ //# sourceMappingURL=DSAppPickerCTX.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/DSAppPickerCTX.ts", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React, { createContext } from 'react';\nimport type { useFocusTracker } from './config/useFocusTracker.js';\n\nexport type AppPickerFocusCTX = ReturnType<typeof useFocusTracker>;\n\nconst defaultFocusContext: AppPickerFocusCTX = {\n focusRegion: '',\n firstFocusableRef: { current: null } as React.MutableRefObject<HTMLElement | null>,\n lastFocusableRef: { current: null } as React.MutableRefObject<HTMLElement | null>,\n registerChip: () => {},\n trackFocusChip: () => {},\n trackFocusRegionReset: () => {},\n trackFocusTrigger: () => {},\n trackFocusPanel: () => {},\n trackFocusSelectedItem: () => {},\n trackFocusFirstItem: () => {},\n trackFocusItemAtIndex: () => {},\n};\n\n/** Focus tracker context for chip-level focus management inside DSAppPicker. */\nexport const DSAppPickerContext = createContext<AppPickerFocusCTX>(defaultFocusContext);\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqC;AAKrC,MAAM,sBAAyC;AAAA,EAC7C,aAAa;AAAA,EACb,mBAAmB,EAAE,SAAS,KAAK;AAAA,EACnC,kBAAkB,EAAE,SAAS,KAAK;AAAA,EAClC,cAAc,MAAM;AAAA,EAAC;AAAA,EACrB,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,uBAAuB,MAAM;AAAA,EAAC;AAAA,EAC9B,mBAAmB,MAAM;AAAA,EAAC;AAAA,EAC1B,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,wBAAwB,MAAM;AAAA,EAAC;AAAA,EAC/B,qBAAqB,MAAM;AAAA,EAAC;AAAA,EAC5B,uBAAuB,MAAM;AAAA,EAAC;AAChC;AAGO,MAAM,yBAAqB,4BAAiC,mBAAmB;",
6
+ "names": []
7
+ }
@@ -35,11 +35,11 @@ var React = __toESM(require("react"));
35
35
  var import_react = __toESM(require("react"));
36
36
  var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
37
37
  var import_react_desc_prop_types = require("../react-desc-prop-types.js");
38
- var import_constants = require("../constants/index.js");
38
+ var import_useValidateProps = require("./useValidateProps.js");
39
39
  const useAppPicker = (props) => {
40
40
  const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
41
- (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.DSAppPickerPropTypes, import_constants.DSAppPickerName);
42
- const ownerPropsConfig = (0, import_ds_props_helpers.useOwnerProps)(propsWithDefault, { ...props });
41
+ (0, import_useValidateProps.useValidateProps)(propsWithDefault, import_react_desc_prop_types.DSAppPickerPropTypesSchema);
42
+ const ownerPropsConfig = (0, import_ds_props_helpers.useOwnerProps)(propsWithDefault, propsWithDefault);
43
43
  const globalAttributes = (0, import_ds_props_helpers.getGlobalAttributes)(props);
44
44
  const xstyledProps = (0, import_ds_props_helpers.getXstyledProps)(props);
45
45
  return import_react.default.useMemo(
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/config/useAppPicker.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useOwnerProps,\n useValidateTypescriptPropTypes,\n getGlobalAttributes,\n getXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT, defaultProps, DSAppPickerPropTypes } from '../react-desc-prop-types.js';\nimport { DSAppPickerName } from '../constants/index.js';\n\nexport const useAppPicker = (props: DSAppPickerT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSAppPickerT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, DSAppPickerPropTypes, DSAppPickerName);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const ownerPropsConfig = useOwnerProps(propsWithDefault, { ...props });\n\n const globalAttributes = getGlobalAttributes<DSAppPickerT.Props>(props);\n const xstyledProps = getXstyledProps<DSAppPickerT.Props>(props);\n return React.useMemo(\n () => ({\n propsWithDefault,\n ownerPropsConfig,\n globalAttributes,\n xstyledProps,\n }),\n [propsWithDefault, ownerPropsConfig, globalAttributes, xstyledProps],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,8BAMO;AACP,mCAAsE;AACtE,uBAAgC;AAEzB,MAAM,eAAe,CAAC,UAA8B;AAIzD,QAAM,uBAAmB,sDAAyD,OAAO,yCAAY;AACrG,8DAA+B,kBAAkB,mDAAsB,gCAAe;AAItF,QAAM,uBAAmB,uCAAc,kBAAkB,EAAE,GAAG,MAAM,CAAC;AAErE,QAAM,uBAAmB,6CAAwC,KAAK;AACtE,QAAM,mBAAe,yCAAoC,KAAK;AAC9D,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,kBAAkB,kBAAkB,YAAY;AAAA,EACrE;AACF;",
3
+ "sources": ["../../../src/config/useAppPicker.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useOwnerProps,\n getGlobalAttributes,\n getXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT, defaultProps, DSAppPickerPropTypesSchema } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useAppPicker = (props: DSAppPickerT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSAppPickerT.InternalProps>(props, defaultProps);\n useValidateProps(propsWithDefault, DSAppPickerPropTypesSchema);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n // Use propsWithDefault (stable, deep-comparison memoized) instead of { ...props }\n // to prevent getOwnerPropsArguments from creating a new object reference every render.\n const ownerPropsConfig = useOwnerProps(propsWithDefault, propsWithDefault);\n\n const globalAttributes = getGlobalAttributes<DSAppPickerT.Props>(props);\n const xstyledProps = getXstyledProps<DSAppPickerT.Props>(props);\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n ownerPropsConfig,\n globalAttributes,\n xstyledProps,\n }),\n [propsWithDefault, ownerPropsConfig, globalAttributes, xstyledProps],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,8BAKO;AACP,mCAA4E;AAC5E,8BAAiC;AAE1B,MAAM,eAAe,CAAC,UAA8B;AAIzD,QAAM,uBAAmB,sDAAyD,OAAO,yCAAY;AACrG,gDAAiB,kBAAkB,uDAA0B;AAM7D,QAAM,uBAAmB,uCAAc,kBAAkB,gBAAgB;AAEzE,QAAM,uBAAmB,6CAAwC,KAAK;AACtE,QAAM,mBAAe,yCAAoC,KAAK;AAE9D,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,kBAAkB,kBAAkB,YAAY;AAAA,EACrE;AACF;",
6
6
  "names": ["React"]
7
7
  }
@@ -0,0 +1,156 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var useAppPickerBehavior_exports = {};
30
+ __export(useAppPickerBehavior_exports, {
31
+ useAppPickerBehavior: () => useAppPickerBehavior
32
+ });
33
+ module.exports = __toCommonJS(useAppPickerBehavior_exports);
34
+ var React = __toESM(require("react"));
35
+ var import_react = require("react");
36
+ var import_ds_floating_context = require("@elliemae/ds-floating-context");
37
+ var import_useFocusTracker = require("./useFocusTracker.js");
38
+ const useAppPickerBehavior = (appPickerConfig) => {
39
+ const { propsWithDefault, ownerPropsConfig } = appPickerConfig;
40
+ const {
41
+ apps,
42
+ customApps,
43
+ icon: Icon,
44
+ renderTrigger,
45
+ isOpen,
46
+ onClose,
47
+ actionRef,
48
+ onClick,
49
+ onClickOutside,
50
+ triggerRef
51
+ } = propsWithDefault;
52
+ const focusTracker = (0, import_useFocusTracker.useFocusTracker)();
53
+ const { trackFocusSelectedItem, trackFocusItemAtIndex, trackFocusPanel } = focusTracker;
54
+ const [open, setOpen] = (0, import_react.useState)(false);
55
+ const defaultTriggerRef = (0, import_react.useRef)(null);
56
+ const wasOpenedByKeyboardRef = (0, import_react.useRef)(false);
57
+ const appsRef = (0, import_react.useRef)(apps);
58
+ appsRef.current = apps;
59
+ const customAppsRef = (0, import_react.useRef)(customApps);
60
+ customAppsRef.current = customApps;
61
+ const resolvedIsOpen = typeof isOpen === "boolean" ? isOpen : open;
62
+ const handleClose = (0, import_react.useCallback)(() => {
63
+ setOpen(false);
64
+ onClose?.();
65
+ }, [onClose]);
66
+ const handleClickOutside = (0, import_react.useCallback)(
67
+ (e) => {
68
+ setOpen(false);
69
+ onClose?.();
70
+ onClickOutside?.(e);
71
+ },
72
+ [onClose, onClickOutside]
73
+ );
74
+ const {
75
+ refs: floatingRefs,
76
+ floatingStyles,
77
+ arrowStyles,
78
+ context: floatingContext
79
+ } = (0, import_ds_floating_context.useFloatingContext)({
80
+ placement: "bottom",
81
+ // Arrow tip is ~6.1px above the panel top (arrowPlacementBase16 ≈ 17.5px, tip at 11.4px from box top).
82
+ // 4px spec gap → 4 + 6.1 ≈ 10px offset.
83
+ customOffset: [0, 10],
84
+ externallyControlledIsOpen: resolvedIsOpen,
85
+ withoutAnimation: true,
86
+ onClickOutside: handleClickOutside
87
+ });
88
+ const handleTriggerRef = (0, import_react.useCallback)(
89
+ (node) => {
90
+ defaultTriggerRef.current = node;
91
+ floatingRefs.setReference(node);
92
+ if (triggerRef) {
93
+ triggerRef.current = node;
94
+ }
95
+ },
96
+ [floatingRefs, triggerRef]
97
+ );
98
+ const handleActionRef = (0, import_react.useCallback)(
99
+ (node) => {
100
+ if (node && actionRef?.current) {
101
+ actionRef.current.focusToIndex = (index) => {
102
+ trackFocusItemAtIndex(appsRef.current, customAppsRef.current, index);
103
+ };
104
+ actionRef.current.focusWrapper = () => {
105
+ trackFocusPanel();
106
+ };
107
+ actionRef.current.focusSelectedOrFirstAvailable = () => {
108
+ trackFocusSelectedItem(appsRef.current, customAppsRef.current);
109
+ };
110
+ }
111
+ },
112
+ [actionRef, trackFocusItemAtIndex, trackFocusPanel, trackFocusSelectedItem]
113
+ );
114
+ const floatingInnerRef = (0, import_react.useCallback)(
115
+ (node) => {
116
+ floatingRefs.setFloating(node);
117
+ handleActionRef(node);
118
+ },
119
+ [floatingRefs.setFloating, handleActionRef]
120
+ );
121
+ (0, import_react.useEffect)(() => {
122
+ if (resolvedIsOpen && wasOpenedByKeyboardRef.current) {
123
+ trackFocusSelectedItem(apps, customApps);
124
+ }
125
+ }, [resolvedIsOpen, trackFocusSelectedItem, apps, customApps]);
126
+ const handleTriggerClick = (0, import_react.useCallback)(
127
+ (e) => {
128
+ wasOpenedByKeyboardRef.current = e.detail === 0;
129
+ onClick?.(e);
130
+ setOpen((prev) => !prev);
131
+ },
132
+ [onClick]
133
+ );
134
+ return {
135
+ // For rendering
136
+ Icon,
137
+ renderTrigger,
138
+ resolvedIsOpen,
139
+ floatingStyles,
140
+ arrowStyles,
141
+ floatingContext,
142
+ ownerPropsConfig,
143
+ // Refs
144
+ defaultTriggerRef,
145
+ triggerRef,
146
+ wasOpenedByKeyboardRef,
147
+ // Handlers
148
+ handleClose,
149
+ handleTriggerRef,
150
+ handleTriggerClick,
151
+ floatingInnerRef,
152
+ // Context value
153
+ focusTracker
154
+ };
155
+ };
156
+ //# sourceMappingURL=useAppPickerBehavior.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/config/useAppPickerBehavior.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable max-statements */\nimport type React from 'react';\nimport { useState, useRef, useCallback, useEffect } from 'react';\nimport { useFloatingContext } from '@elliemae/ds-floating-context';\nimport { useFocusTracker } from './useFocusTracker.js';\nimport type { useAppPicker } from './useAppPicker.js';\n\nexport const useAppPickerBehavior = (appPickerConfig: ReturnType<typeof useAppPicker>) => {\n const { propsWithDefault, ownerPropsConfig } = appPickerConfig;\n const {\n apps,\n customApps,\n icon: Icon,\n renderTrigger,\n isOpen,\n onClose,\n actionRef,\n onClick,\n onClickOutside,\n triggerRef,\n } = propsWithDefault;\n\n const focusTracker = useFocusTracker();\n const { trackFocusSelectedItem, trackFocusItemAtIndex, trackFocusPanel } = focusTracker;\n\n const [open, setOpen] = useState(false);\n const defaultTriggerRef = useRef<HTMLButtonElement>(null);\n const wasOpenedByKeyboardRef = useRef(false);\n\n // Stable refs for actionRef methods \u2014 closed over by the callback below so they are\n // always current without causing the ref callback to regenerate on every data change.\n const appsRef = useRef(apps);\n appsRef.current = apps;\n const customAppsRef = useRef(customApps);\n customAppsRef.current = customApps;\n\n const resolvedIsOpen = typeof isOpen === 'boolean' ? isOpen : open;\n\n const handleClose = useCallback(() => {\n setOpen(false);\n onClose?.();\n }, [onClose]);\n\n const handleClickOutside = useCallback(\n (e: MouseEvent | TouchEvent) => {\n setOpen(false);\n onClose?.();\n onClickOutside?.(e as MouseEvent);\n },\n [onClose, onClickOutside],\n );\n\n const {\n refs: floatingRefs,\n floatingStyles,\n arrowStyles,\n context: floatingContext,\n } = useFloatingContext({\n placement: 'bottom',\n // Arrow tip is ~6.1px above the panel top (arrowPlacementBase16 \u2248 17.5px, tip at 11.4px from box top).\n // 4px spec gap \u2192 4 + 6.1 \u2248 10px offset.\n customOffset: [0, 10],\n externallyControlledIsOpen: resolvedIsOpen,\n withoutAnimation: true,\n onClickOutside: handleClickOutside,\n });\n\n const handleTriggerRef = useCallback<React.RefCallback<HTMLButtonElement>>(\n (node) => {\n (defaultTriggerRef as React.MutableRefObject<HTMLButtonElement | null>).current = node;\n floatingRefs.setReference(node);\n if (triggerRef) {\n (triggerRef as React.MutableRefObject<HTMLButtonElement | null>).current = node;\n }\n },\n [floatingRefs, triggerRef],\n );\n\n // Ref callback on StyledAppPickerFloating: fires on mount with the panel node, populating\n // actionRef methods. All focus operations go through the tracker \u2014 no DOM queries.\n const handleActionRef = useCallback<React.RefCallback<HTMLDivElement>>(\n (node) => {\n if (node && actionRef?.current) {\n actionRef.current.focusToIndex = (index: number) => {\n trackFocusItemAtIndex(appsRef.current, customAppsRef.current, index);\n };\n actionRef.current.focusWrapper = () => {\n trackFocusPanel();\n };\n actionRef.current.focusSelectedOrFirstAvailable = () => {\n trackFocusSelectedItem(appsRef.current, customAppsRef.current);\n };\n }\n },\n [actionRef, trackFocusItemAtIndex, trackFocusPanel, trackFocusSelectedItem],\n );\n\n const floatingInnerRef = useCallback<React.RefCallback<HTMLDivElement>>(\n (node) => {\n (floatingRefs.setFloating as React.RefCallback<HTMLDivElement>)(node);\n handleActionRef(node);\n },\n [floatingRefs.setFloating, handleActionRef],\n );\n\n // When panel opens via keyboard, seed the focus tracker so the correct chip gets focus\n // via its innerRef callback. Non-keyboard paths are handled by AppPanel on mount.\n useEffect(() => {\n if (resolvedIsOpen && wasOpenedByKeyboardRef.current) {\n trackFocusSelectedItem(apps, customApps);\n }\n }, [resolvedIsOpen, trackFocusSelectedItem, apps, customApps]);\n\n const handleTriggerClick = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n wasOpenedByKeyboardRef.current = (e as React.MouseEvent).detail === 0;\n onClick?.(e);\n setOpen((prev) => !prev);\n },\n [onClick],\n );\n\n return {\n // For rendering\n Icon,\n renderTrigger,\n resolvedIsOpen,\n floatingStyles,\n arrowStyles,\n floatingContext,\n ownerPropsConfig,\n // Refs\n defaultTriggerRef,\n triggerRef,\n wasOpenedByKeyboardRef,\n // Handlers\n handleClose,\n handleTriggerRef,\n handleTriggerClick,\n floatingInnerRef,\n // Context value\n focusTracker,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }