@elliemae/ds-form-combobox 3.49.4 → 3.49.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -32,7 +32,10 @@ __export(Container_exports, {
|
|
|
32
32
|
});
|
|
33
33
|
module.exports = __toCommonJS(Container_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
|
-
var import_jsx_runtime =
|
|
35
|
+
var import_jsx_runtime = (
|
|
36
|
+
// eslint-disable-next-line react/jsx-no-useless-fragment
|
|
37
|
+
require("react/jsx-runtime")
|
|
38
|
+
);
|
|
36
39
|
var import_react = __toESM(require("react"));
|
|
37
40
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
41
|
var import_ds_system = require("@elliemae/ds-system");
|
|
@@ -77,9 +80,10 @@ const Container = () => {
|
|
|
77
80
|
zIndex: correctZIndex,
|
|
78
81
|
customOffset: [0, 5],
|
|
79
82
|
handleCloseMenu,
|
|
80
|
-
portalDOMContainer: document.body
|
|
83
|
+
portalDOMContainer: document.body,
|
|
84
|
+
externallyControlledIsOpen: menuState
|
|
81
85
|
}),
|
|
82
|
-
[startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu]
|
|
86
|
+
[startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu, menuState]
|
|
83
87
|
);
|
|
84
88
|
const { refs, floatingStyles, context } = (0, import_ds_floating_context.useFloatingContext)(config);
|
|
85
89
|
const comboboxRef = (0, import_ds_system.mergeRefs)(setReferenceElement, refs.setReference);
|
|
@@ -87,38 +91,30 @@ const Container = () => {
|
|
|
87
91
|
setMenuState(false, "blur");
|
|
88
92
|
}, [setMenuState]);
|
|
89
93
|
(0, import_useClickOutside.useOnClickOutside)(referenceElement, hideTooltip, refs.floating);
|
|
90
|
-
return (
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledPopperWrapper, { tabIndex: -1, onMouseDown: handleMouseDown, applyAriaDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_list.MenuList, {}) })
|
|
116
|
-
}
|
|
117
|
-
) : null
|
|
118
|
-
] }) : null
|
|
119
|
-
]
|
|
120
|
-
}
|
|
121
|
-
) })
|
|
122
|
-
);
|
|
94
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
95
|
+
import_styled.StyledContainer,
|
|
96
|
+
{
|
|
97
|
+
"data-testid": dataTestId ?? import_ComboboxDataTestids.ComboboxDataTestid.CONTAINER,
|
|
98
|
+
innerRef: comboboxRef,
|
|
99
|
+
className,
|
|
100
|
+
applyAriaDisabled,
|
|
101
|
+
...xStyledProps,
|
|
102
|
+
children: [
|
|
103
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LiveRegion.LiveRegion, {}),
|
|
104
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_controls.Controls, {}),
|
|
105
|
+
menuState && inline ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_list.MenuList, {}) : null,
|
|
106
|
+
menuState && !inline && referenceElement ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
107
|
+
import_ds_floating_context.FloatingWrapper,
|
|
108
|
+
{
|
|
109
|
+
innerRef: refs.setFloating,
|
|
110
|
+
floatingStyles,
|
|
111
|
+
isOpen: menuState,
|
|
112
|
+
context,
|
|
113
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledPopperWrapper, { tabIndex: -1, onMouseDown: handleMouseDown, applyAriaDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu_list.MenuList, {}) })
|
|
114
|
+
}
|
|
115
|
+
) : null
|
|
116
|
+
]
|
|
117
|
+
}
|
|
118
|
+
) });
|
|
123
119
|
};
|
|
124
120
|
//# sourceMappingURL=Container.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/container/Container.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\nimport React, { useCallback, useMemo, useEffect, useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport { useFloatingContext, FloatingWrapper, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport ComboBoxContext from '../../ComboBoxCTX.js';\nimport { StyledContainer, StyledPopperWrapper } from './styled.js';\nimport { Controls } from '../controls/index.js';\nimport { MenuList } from '../menu-list/index.js';\nimport { ComboboxDataTestid } from '../../ComboboxDataTestids.js';\nimport { LiveRegion } from '../LiveRegion.js';\nimport { useOnClickOutside } from '../../config/useClickOutside.js';\n\nexport const Container = (): JSX.Element => {\n const [referenceElement, setReferenceElement] = React.useState<HTMLElement | null>(null);\n const { props, internalRef, setMenuState, menuState } = useContext(ComboBoxContext);\n\n const { inline, startPlacementPreference, placementOrderPreference, applyAriaDisabled } = props;\n const globalAttributes = useGetGlobalAttributes(props) as ReturnType<typeof useGetGlobalAttributes> & {\n 'data-testid'?: string;\n };\n const { zIndex, ...xStyledProps } = useGetXstyledProps(props);\n\n const correctZIndex = zIndex ? parseInt(zIndex as string, 10) : undefined;\n // Removing possible collisionable props\n const { className, 'data-testid': dataTestId } = globalAttributes;\n const handleMouseDown = useCallback((e: React.MouseEvent) => {\n e.preventDefault();\n }, []);\n\n const handleCloseMenu = useCallback(() => {\n setMenuState(false, 'blur');\n if (internalRef?.current) internalRef.current.blur();\n }, [internalRef, setMenuState]);\n\n useEffect(() => {\n const closeMenuOnWindowBlur = () => {\n if (menuState) setMenuState(false, 'blur');\n };\n\n window.addEventListener('blur', closeMenuOnWindowBlur);\n\n return () => {\n window.removeEventListener('blur', closeMenuOnWindowBlur);\n };\n }, [menuState, setMenuState]);\n\n const config = useMemo(\n () => ({\n placement: 'bottom' as DSHookFloatingContextT.PopperPlacementsT,\n withoutAnimation: true,\n startPlacementPreference,\n placementOrderPreference,\n zIndex: correctZIndex,\n customOffset: [0, 5] as [number, number],\n handleCloseMenu,\n portalDOMContainer: document.body,\n }),\n [startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu],\n );\n\n const { refs, floatingStyles, context } = useFloatingContext(config);\n\n const comboboxRef = mergeRefs(setReferenceElement, refs.setReference);\n\n const hideTooltip = useCallback(() => {\n setMenuState(false, 'blur');\n }, [setMenuState]);\n\n useOnClickOutside(referenceElement, hideTooltip, refs.floating);\n\n return (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n <StyledContainer\n data-testid={dataTestId ?? ComboboxDataTestid.CONTAINER}\n innerRef={comboboxRef}\n className={className}\n applyAriaDisabled={applyAriaDisabled}\n {...xStyledProps}\n >\n <LiveRegion />\n\n {inline ?
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\nimport React, { useCallback, useMemo, useEffect, useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport { useFloatingContext, FloatingWrapper, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport ComboBoxContext from '../../ComboBoxCTX.js';\nimport { StyledContainer, StyledPopperWrapper } from './styled.js';\nimport { Controls } from '../controls/index.js';\nimport { MenuList } from '../menu-list/index.js';\nimport { ComboboxDataTestid } from '../../ComboboxDataTestids.js';\nimport { LiveRegion } from '../LiveRegion.js';\nimport { useOnClickOutside } from '../../config/useClickOutside.js';\n\nexport const Container = (): JSX.Element => {\n const [referenceElement, setReferenceElement] = React.useState<HTMLElement | null>(null);\n const { props, internalRef, setMenuState, menuState } = useContext(ComboBoxContext);\n\n const { inline, startPlacementPreference, placementOrderPreference, applyAriaDisabled } = props;\n const globalAttributes = useGetGlobalAttributes(props) as ReturnType<typeof useGetGlobalAttributes> & {\n 'data-testid'?: string;\n };\n const { zIndex, ...xStyledProps } = useGetXstyledProps(props);\n\n const correctZIndex = zIndex ? parseInt(zIndex as string, 10) : undefined;\n // Removing possible collisionable props\n const { className, 'data-testid': dataTestId } = globalAttributes;\n const handleMouseDown = useCallback((e: React.MouseEvent) => {\n e.preventDefault();\n }, []);\n\n const handleCloseMenu = useCallback(() => {\n setMenuState(false, 'blur');\n if (internalRef?.current) internalRef.current.blur();\n }, [internalRef, setMenuState]);\n\n useEffect(() => {\n const closeMenuOnWindowBlur = () => {\n if (menuState) setMenuState(false, 'blur');\n };\n\n window.addEventListener('blur', closeMenuOnWindowBlur);\n\n return () => {\n window.removeEventListener('blur', closeMenuOnWindowBlur);\n };\n }, [menuState, setMenuState]);\n\n const config = useMemo(\n () => ({\n placement: 'bottom' as DSHookFloatingContextT.PopperPlacementsT,\n withoutAnimation: true,\n startPlacementPreference,\n placementOrderPreference,\n zIndex: correctZIndex,\n customOffset: [0, 5] as [number, number],\n handleCloseMenu,\n portalDOMContainer: document.body,\n externallyControlledIsOpen: menuState,\n }),\n [startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu, menuState],\n );\n\n const { refs, floatingStyles, context } = useFloatingContext(config);\n\n const comboboxRef = mergeRefs(setReferenceElement, refs.setReference);\n\n const hideTooltip = useCallback(() => {\n setMenuState(false, 'blur');\n }, [setMenuState]);\n\n useOnClickOutside(referenceElement, hideTooltip, refs.floating);\n\n return (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n <StyledContainer\n data-testid={dataTestId ?? ComboboxDataTestid.CONTAINER}\n innerRef={comboboxRef}\n className={className}\n applyAriaDisabled={applyAriaDisabled}\n {...xStyledProps}\n >\n <LiveRegion />\n <Controls />\n\n {menuState && inline ? <MenuList /> : null}\n {menuState && !inline && referenceElement ? (\n <FloatingWrapper\n innerRef={refs.setFloating}\n floatingStyles={floatingStyles}\n isOpen={menuState}\n context={context}\n >\n <StyledPopperWrapper tabIndex={-1} onMouseDown={handleMouseDown} applyAriaDisabled={applyAriaDisabled}>\n <MenuList />\n </StyledPopperWrapper>\n </FloatingWrapper>\n ) : null}\n </StyledContainer>\n </>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0EnB;AAAA;AAAA;AAAA;AAzEJ,mBAAmE;AACnE,8BAA2D;AAC3D,uBAA0B;AAC1B,iCAAiF;AACjF,yBAA4B;AAC5B,oBAAqD;AACrD,sBAAyB;AACzB,uBAAyB;AACzB,iCAAmC;AACnC,wBAA2B;AAC3B,6BAAkC;AAE3B,MAAM,YAAY,MAAmB;AAC1C,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,aAAAA,QAAM,SAA6B,IAAI;AACvF,QAAM,EAAE,OAAO,aAAa,cAAc,UAAU,QAAI,yBAAW,mBAAAC,OAAe;AAElF,QAAM,EAAE,QAAQ,0BAA0B,0BAA0B,kBAAkB,IAAI;AAC1F,QAAM,uBAAmB,gDAAuB,KAAK;AAGrD,QAAM,EAAE,QAAQ,GAAG,aAAa,QAAI,4CAAmB,KAAK;AAE5D,QAAM,gBAAgB,SAAS,SAAS,QAAkB,EAAE,IAAI;AAEhE,QAAM,EAAE,WAAW,eAAe,WAAW,IAAI;AACjD,QAAM,sBAAkB,0BAAY,CAAC,MAAwB;AAC3D,MAAE,eAAe;AAAA,EACnB,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAkB,0BAAY,MAAM;AACxC,iBAAa,OAAO,MAAM;AAC1B,QAAI,aAAa,QAAS,aAAY,QAAQ,KAAK;AAAA,EACrD,GAAG,CAAC,aAAa,YAAY,CAAC;AAE9B,8BAAU,MAAM;AACd,UAAM,wBAAwB,MAAM;AAClC,UAAI,UAAW,cAAa,OAAO,MAAM;AAAA,IAC3C;AAEA,WAAO,iBAAiB,QAAQ,qBAAqB;AAErD,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,qBAAqB;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,WAAW,YAAY,CAAC;AAE5B,QAAM,aAAS;AAAA,IACb,OAAO;AAAA,MACL,WAAW;AAAA,MACX,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,cAAc,CAAC,GAAG,CAAC;AAAA,MACnB;AAAA,MACA,oBAAoB,SAAS;AAAA,MAC7B,4BAA4B;AAAA,IAC9B;AAAA,IACA,CAAC,0BAA0B,0BAA0B,eAAe,iBAAiB,SAAS;AAAA,EAChG;AAEA,QAAM,EAAE,MAAM,gBAAgB,QAAQ,QAAI,+CAAmB,MAAM;AAEnE,QAAM,kBAAc,4BAAU,qBAAqB,KAAK,YAAY;AAEpE,QAAM,kBAAc,0BAAY,MAAM;AACpC,iBAAa,OAAO,MAAM;AAAA,EAC5B,GAAG,CAAC,YAAY,CAAC;AAEjB,gDAAkB,kBAAkB,aAAa,KAAK,QAAQ;AAE9D,SAEE,2EACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,cAAc,8CAAmB;AAAA,MAC9C,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,oDAAC,gCAAW;AAAA,QACZ,4CAAC,4BAAS;AAAA,QAET,aAAa,SAAS,4CAAC,6BAAS,IAAK;AAAA,QACrC,aAAa,CAAC,UAAU,mBACvB;AAAA,UAAC;AAAA;AAAA,YACC,UAAU,KAAK;AAAA,YACf;AAAA,YACA,QAAQ;AAAA,YACR;AAAA,YAEA,sDAAC,qCAAoB,UAAU,IAAI,aAAa,iBAAiB,mBAC/D,sDAAC,6BAAS,GACZ;AAAA;AAAA,QACF,IACE;AAAA;AAAA;AAAA,EACN,GACF;AAEJ;",
|
|
6
6
|
"names": ["React", "ComboBoxContext"]
|
|
7
7
|
}
|
|
@@ -44,9 +44,10 @@ const Container = () => {
|
|
|
44
44
|
zIndex: correctZIndex,
|
|
45
45
|
customOffset: [0, 5],
|
|
46
46
|
handleCloseMenu,
|
|
47
|
-
portalDOMContainer: document.body
|
|
47
|
+
portalDOMContainer: document.body,
|
|
48
|
+
externallyControlledIsOpen: menuState
|
|
48
49
|
}),
|
|
49
|
-
[startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu]
|
|
50
|
+
[startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu, menuState]
|
|
50
51
|
);
|
|
51
52
|
const { refs, floatingStyles, context } = useFloatingContext(config);
|
|
52
53
|
const comboboxRef = mergeRefs(setReferenceElement, refs.setReference);
|
|
@@ -66,23 +67,18 @@ const Container = () => {
|
|
|
66
67
|
...xStyledProps,
|
|
67
68
|
children: [
|
|
68
69
|
/* @__PURE__ */ jsx(LiveRegion, {}),
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
context,
|
|
82
|
-
children: /* @__PURE__ */ jsx(StyledPopperWrapper, { tabIndex: -1, onMouseDown: handleMouseDown, applyAriaDisabled, children: /* @__PURE__ */ jsx(MenuList, {}) })
|
|
83
|
-
}
|
|
84
|
-
) : null
|
|
85
|
-
] }) : null
|
|
70
|
+
/* @__PURE__ */ jsx(Controls, {}),
|
|
71
|
+
menuState && inline ? /* @__PURE__ */ jsx(MenuList, {}) : null,
|
|
72
|
+
menuState && !inline && referenceElement ? /* @__PURE__ */ jsx(
|
|
73
|
+
FloatingWrapper,
|
|
74
|
+
{
|
|
75
|
+
innerRef: refs.setFloating,
|
|
76
|
+
floatingStyles,
|
|
77
|
+
isOpen: menuState,
|
|
78
|
+
context,
|
|
79
|
+
children: /* @__PURE__ */ jsx(StyledPopperWrapper, { tabIndex: -1, onMouseDown: handleMouseDown, applyAriaDisabled, children: /* @__PURE__ */ jsx(MenuList, {}) })
|
|
80
|
+
}
|
|
81
|
+
) : null
|
|
86
82
|
]
|
|
87
83
|
}
|
|
88
84
|
) })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/container/Container.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React, { useCallback, useMemo, useEffect, useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport { useFloatingContext, FloatingWrapper, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport ComboBoxContext from '../../ComboBoxCTX.js';\nimport { StyledContainer, StyledPopperWrapper } from './styled.js';\nimport { Controls } from '../controls/index.js';\nimport { MenuList } from '../menu-list/index.js';\nimport { ComboboxDataTestid } from '../../ComboboxDataTestids.js';\nimport { LiveRegion } from '../LiveRegion.js';\nimport { useOnClickOutside } from '../../config/useClickOutside.js';\n\nexport const Container = (): JSX.Element => {\n const [referenceElement, setReferenceElement] = React.useState<HTMLElement | null>(null);\n const { props, internalRef, setMenuState, menuState } = useContext(ComboBoxContext);\n\n const { inline, startPlacementPreference, placementOrderPreference, applyAriaDisabled } = props;\n const globalAttributes = useGetGlobalAttributes(props) as ReturnType<typeof useGetGlobalAttributes> & {\n 'data-testid'?: string;\n };\n const { zIndex, ...xStyledProps } = useGetXstyledProps(props);\n\n const correctZIndex = zIndex ? parseInt(zIndex as string, 10) : undefined;\n // Removing possible collisionable props\n const { className, 'data-testid': dataTestId } = globalAttributes;\n const handleMouseDown = useCallback((e: React.MouseEvent) => {\n e.preventDefault();\n }, []);\n\n const handleCloseMenu = useCallback(() => {\n setMenuState(false, 'blur');\n if (internalRef?.current) internalRef.current.blur();\n }, [internalRef, setMenuState]);\n\n useEffect(() => {\n const closeMenuOnWindowBlur = () => {\n if (menuState) setMenuState(false, 'blur');\n };\n\n window.addEventListener('blur', closeMenuOnWindowBlur);\n\n return () => {\n window.removeEventListener('blur', closeMenuOnWindowBlur);\n };\n }, [menuState, setMenuState]);\n\n const config = useMemo(\n () => ({\n placement: 'bottom' as DSHookFloatingContextT.PopperPlacementsT,\n withoutAnimation: true,\n startPlacementPreference,\n placementOrderPreference,\n zIndex: correctZIndex,\n customOffset: [0, 5] as [number, number],\n handleCloseMenu,\n portalDOMContainer: document.body,\n }),\n [startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu],\n );\n\n const { refs, floatingStyles, context } = useFloatingContext(config);\n\n const comboboxRef = mergeRefs(setReferenceElement, refs.setReference);\n\n const hideTooltip = useCallback(() => {\n setMenuState(false, 'blur');\n }, [setMenuState]);\n\n useOnClickOutside(referenceElement, hideTooltip, refs.floating);\n\n return (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n <StyledContainer\n data-testid={dataTestId ?? ComboboxDataTestid.CONTAINER}\n innerRef={comboboxRef}\n className={className}\n applyAriaDisabled={applyAriaDisabled}\n {...xStyledProps}\n >\n <LiveRegion />\n\n {inline ?
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React, { useCallback, useMemo, useEffect, useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport { useFloatingContext, FloatingWrapper, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport ComboBoxContext from '../../ComboBoxCTX.js';\nimport { StyledContainer, StyledPopperWrapper } from './styled.js';\nimport { Controls } from '../controls/index.js';\nimport { MenuList } from '../menu-list/index.js';\nimport { ComboboxDataTestid } from '../../ComboboxDataTestids.js';\nimport { LiveRegion } from '../LiveRegion.js';\nimport { useOnClickOutside } from '../../config/useClickOutside.js';\n\nexport const Container = (): JSX.Element => {\n const [referenceElement, setReferenceElement] = React.useState<HTMLElement | null>(null);\n const { props, internalRef, setMenuState, menuState } = useContext(ComboBoxContext);\n\n const { inline, startPlacementPreference, placementOrderPreference, applyAriaDisabled } = props;\n const globalAttributes = useGetGlobalAttributes(props) as ReturnType<typeof useGetGlobalAttributes> & {\n 'data-testid'?: string;\n };\n const { zIndex, ...xStyledProps } = useGetXstyledProps(props);\n\n const correctZIndex = zIndex ? parseInt(zIndex as string, 10) : undefined;\n // Removing possible collisionable props\n const { className, 'data-testid': dataTestId } = globalAttributes;\n const handleMouseDown = useCallback((e: React.MouseEvent) => {\n e.preventDefault();\n }, []);\n\n const handleCloseMenu = useCallback(() => {\n setMenuState(false, 'blur');\n if (internalRef?.current) internalRef.current.blur();\n }, [internalRef, setMenuState]);\n\n useEffect(() => {\n const closeMenuOnWindowBlur = () => {\n if (menuState) setMenuState(false, 'blur');\n };\n\n window.addEventListener('blur', closeMenuOnWindowBlur);\n\n return () => {\n window.removeEventListener('blur', closeMenuOnWindowBlur);\n };\n }, [menuState, setMenuState]);\n\n const config = useMemo(\n () => ({\n placement: 'bottom' as DSHookFloatingContextT.PopperPlacementsT,\n withoutAnimation: true,\n startPlacementPreference,\n placementOrderPreference,\n zIndex: correctZIndex,\n customOffset: [0, 5] as [number, number],\n handleCloseMenu,\n portalDOMContainer: document.body,\n externallyControlledIsOpen: menuState,\n }),\n [startPlacementPreference, placementOrderPreference, correctZIndex, handleCloseMenu, menuState],\n );\n\n const { refs, floatingStyles, context } = useFloatingContext(config);\n\n const comboboxRef = mergeRefs(setReferenceElement, refs.setReference);\n\n const hideTooltip = useCallback(() => {\n setMenuState(false, 'blur');\n }, [setMenuState]);\n\n useOnClickOutside(referenceElement, hideTooltip, refs.floating);\n\n return (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n <StyledContainer\n data-testid={dataTestId ?? ComboboxDataTestid.CONTAINER}\n innerRef={comboboxRef}\n className={className}\n applyAriaDisabled={applyAriaDisabled}\n {...xStyledProps}\n >\n <LiveRegion />\n <Controls />\n\n {menuState && inline ? <MenuList /> : null}\n {menuState && !inline && referenceElement ? (\n <FloatingWrapper\n innerRef={refs.setFloating}\n floatingStyles={floatingStyles}\n isOpen={menuState}\n context={context}\n >\n <StyledPopperWrapper tabIndex={-1} onMouseDown={handleMouseDown} applyAriaDisabled={applyAriaDisabled}>\n <MenuList />\n </StyledPopperWrapper>\n </FloatingWrapper>\n ) : null}\n </StyledContainer>\n </>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0EnB,mBAQI,KAPF,YADF;AAzEJ,OAAOA,UAAS,aAAa,SAAS,WAAW,kBAAkB;AACnE,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB,uBAAoD;AACjF,OAAO,qBAAqB;AAC5B,SAAS,iBAAiB,2BAA2B;AACrD,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAE3B,MAAM,YAAY,MAAmB;AAC1C,QAAM,CAAC,kBAAkB,mBAAmB,IAAIA,OAAM,SAA6B,IAAI;AACvF,QAAM,EAAE,OAAO,aAAa,cAAc,UAAU,IAAI,WAAW,eAAe;AAElF,QAAM,EAAE,QAAQ,0BAA0B,0BAA0B,kBAAkB,IAAI;AAC1F,QAAM,mBAAmB,uBAAuB,KAAK;AAGrD,QAAM,EAAE,QAAQ,GAAG,aAAa,IAAI,mBAAmB,KAAK;AAE5D,QAAM,gBAAgB,SAAS,SAAS,QAAkB,EAAE,IAAI;AAEhE,QAAM,EAAE,WAAW,eAAe,WAAW,IAAI;AACjD,QAAM,kBAAkB,YAAY,CAAC,MAAwB;AAC3D,MAAE,eAAe;AAAA,EACnB,GAAG,CAAC,CAAC;AAEL,QAAM,kBAAkB,YAAY,MAAM;AACxC,iBAAa,OAAO,MAAM;AAC1B,QAAI,aAAa,QAAS,aAAY,QAAQ,KAAK;AAAA,EACrD,GAAG,CAAC,aAAa,YAAY,CAAC;AAE9B,YAAU,MAAM;AACd,UAAM,wBAAwB,MAAM;AAClC,UAAI,UAAW,cAAa,OAAO,MAAM;AAAA,IAC3C;AAEA,WAAO,iBAAiB,QAAQ,qBAAqB;AAErD,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,qBAAqB;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,WAAW,YAAY,CAAC;AAE5B,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,MACL,WAAW;AAAA,MACX,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,cAAc,CAAC,GAAG,CAAC;AAAA,MACnB;AAAA,MACA,oBAAoB,SAAS;AAAA,MAC7B,4BAA4B;AAAA,IAC9B;AAAA,IACA,CAAC,0BAA0B,0BAA0B,eAAe,iBAAiB,SAAS;AAAA,EAChG;AAEA,QAAM,EAAE,MAAM,gBAAgB,QAAQ,IAAI,mBAAmB,MAAM;AAEnE,QAAM,cAAc,UAAU,qBAAqB,KAAK,YAAY;AAEpE,QAAM,cAAc,YAAY,MAAM;AACpC,iBAAa,OAAO,MAAM;AAAA,EAC5B,GAAG,CAAC,YAAY,CAAC;AAEjB,oBAAkB,kBAAkB,aAAa,KAAK,QAAQ;AAE9D;AAAA;AAAA,IAEE,gCACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa,cAAc,mBAAmB;AAAA,QAC9C,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QAEJ;AAAA,8BAAC,cAAW;AAAA,UACZ,oBAAC,YAAS;AAAA,UAET,aAAa,SAAS,oBAAC,YAAS,IAAK;AAAA,UACrC,aAAa,CAAC,UAAU,mBACvB;AAAA,YAAC;AAAA;AAAA,cACC,UAAU,KAAK;AAAA,cACf;AAAA,cACA,QAAQ;AAAA,cACR;AAAA,cAEA,8BAAC,uBAAoB,UAAU,IAAI,aAAa,iBAAiB,mBAC/D,8BAAC,YAAS,GACZ;AAAA;AAAA,UACF,IACE;AAAA;AAAA;AAAA,IACN,GACF;AAAA;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-form-combobox",
|
|
3
|
-
"version": "3.49.
|
|
3
|
+
"version": "3.49.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Controlled Form Combobox",
|
|
6
6
|
"files": [
|
|
@@ -38,17 +38,17 @@
|
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"react-virtual": "~2.10.4",
|
|
40
40
|
"uid": "~2.0.1",
|
|
41
|
-
"@elliemae/ds-
|
|
42
|
-
"@elliemae/ds-
|
|
43
|
-
"@elliemae/ds-
|
|
44
|
-
"@elliemae/ds-
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-
|
|
47
|
-
"@elliemae/ds-icons": "3.49.
|
|
48
|
-
"@elliemae/ds-
|
|
49
|
-
"@elliemae/ds-
|
|
50
|
-
"@elliemae/ds-
|
|
51
|
-
"@elliemae/ds-
|
|
41
|
+
"@elliemae/ds-circular-progress-indicator": "3.49.5",
|
|
42
|
+
"@elliemae/ds-grid": "3.49.5",
|
|
43
|
+
"@elliemae/ds-button-v2": "3.49.5",
|
|
44
|
+
"@elliemae/ds-floating-context": "3.49.5",
|
|
45
|
+
"@elliemae/ds-menu-items": "3.49.5",
|
|
46
|
+
"@elliemae/ds-form-checkbox": "3.49.5",
|
|
47
|
+
"@elliemae/ds-icons": "3.49.5",
|
|
48
|
+
"@elliemae/ds-truncated-tooltip-text": "3.49.5",
|
|
49
|
+
"@elliemae/ds-pills-v2": "3.49.5",
|
|
50
|
+
"@elliemae/ds-props-helpers": "3.49.5",
|
|
51
|
+
"@elliemae/ds-system": "3.49.5"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
@@ -57,8 +57,8 @@
|
|
|
57
57
|
"jest-cli": "~29.7.0",
|
|
58
58
|
"styled-components": "~5.3.9",
|
|
59
59
|
"styled-system": "~5.1.5",
|
|
60
|
-
"@elliemae/ds-
|
|
61
|
-
"@elliemae/ds-
|
|
60
|
+
"@elliemae/ds-monorepo-devops": "3.49.5",
|
|
61
|
+
"@elliemae/ds-form-helpers-mask-hooks": "3.49.5"
|
|
62
62
|
},
|
|
63
63
|
"peerDependencies": {
|
|
64
64
|
"@elliemae/pui-theme": "~2.10.0",
|