@chayns-components/core 5.3.12-alpha.0 → 5.4.5-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/accordion/Accordion.js +1 -1
- package/lib/cjs/components/accordion/Accordion.js.map +1 -1
- package/lib/cjs/components/accordion/Accordion.styles.js +1 -1
- package/lib/cjs/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/cjs/components/button/Button.styles.js +1 -8
- package/lib/cjs/components/button/Button.styles.js.map +1 -1
- package/lib/cjs/components/combobox/ComboBox.js +14 -5
- package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.js +50 -40
- package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.utils.js +27 -1
- package/lib/cjs/components/context-menu/ContextMenu.utils.js.map +1 -1
- package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js +3 -8
- package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -1
- package/lib/cjs/components/file-list/file-item/FileItem.js +29 -27
- package/lib/cjs/components/file-list/file-item/FileItem.js.map +1 -1
- package/lib/cjs/components/file-list/file-item/FileItem.styles.js +6 -0
- package/lib/cjs/components/file-list/file-item/FileItem.styles.js.map +1 -1
- package/lib/cjs/components/highlight-slider/HighlightSlider.js +6 -3
- package/lib/cjs/components/highlight-slider/HighlightSlider.js.map +1 -1
- package/lib/cjs/components/input/Input.js +2 -2
- package/lib/cjs/components/input/Input.js.map +1 -1
- package/lib/cjs/components/input/Input.styles.js +6 -1
- package/lib/cjs/components/input/Input.styles.js.map +1 -1
- package/lib/cjs/components/list/List.utils.js +108 -14
- package/lib/cjs/components/list/List.utils.js.map +1 -1
- package/lib/cjs/components/list/list-item/ListItem.js +27 -25
- package/lib/cjs/components/list/list-item/ListItem.js.map +1 -1
- package/lib/cjs/components/list/list-item/ListItem.styles.js +3 -5
- package/lib/cjs/components/list/list-item/ListItem.styles.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js +4 -35
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +1 -31
- package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +1 -29
- package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -29
- package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
- package/lib/cjs/components/mention-finder/MentionFinder.js +12 -3
- package/lib/cjs/components/mention-finder/MentionFinder.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.styles.js +6 -0
- package/lib/cjs/components/multi-action-button/MultiActionButton.styles.js.map +1 -1
- package/lib/cjs/components/search-box/SearchBox.js +15 -3
- package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
- package/lib/cjs/components/search-input/SearchInput.js +16 -2
- package/lib/cjs/components/search-input/SearchInput.js.map +1 -1
- package/lib/cjs/components/search-input/SearchInput.styles.js +1 -0
- package/lib/cjs/components/search-input/SearchInput.styles.js.map +1 -1
- package/lib/cjs/components/setup-wizard/SetupWizard.js +6 -3
- package/lib/cjs/components/setup-wizard/SetupWizard.js.map +1 -1
- package/lib/cjs/components/sharing-bar/SharingBar.js +1 -1
- package/lib/cjs/components/sharing-bar/SharingBar.js.map +1 -1
- package/lib/cjs/components/sharing-bar/SharingBar.styles.js +3 -2
- package/lib/cjs/components/sharing-bar/SharingBar.styles.js.map +1 -1
- package/lib/cjs/components/skeleton/base-skeleton/BaseSkeleton.styles.js +2 -0
- package/lib/cjs/components/skeleton/base-skeleton/BaseSkeleton.styles.js.map +1 -1
- package/lib/cjs/components/slider-button/SliderButton.styles.js +1 -5
- package/lib/cjs/components/slider-button/SliderButton.styles.js.map +1 -1
- package/lib/cjs/components/tag-input/TagInput.js +1 -0
- package/lib/cjs/components/tag-input/TagInput.js.map +1 -1
- package/lib/cjs/components/tag-input/TagInput.styles.js +0 -2
- package/lib/cjs/components/tag-input/TagInput.styles.js.map +1 -1
- package/lib/cjs/components/truncation/Truncation.styles.js +0 -1
- package/lib/cjs/components/truncation/Truncation.styles.js.map +1 -1
- package/lib/cjs/index.js +6 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/utils/keyboardFocusHighlighting.styles.js +2 -3
- package/lib/cjs/utils/keyboardFocusHighlighting.styles.js.map +1 -1
- package/lib/esm/components/accordion/Accordion.js +1 -1
- package/lib/esm/components/accordion/Accordion.js.map +1 -1
- package/lib/esm/components/accordion/Accordion.styles.js +1 -1
- package/lib/esm/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/esm/components/button/Button.styles.js +1 -8
- package/lib/esm/components/button/Button.styles.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.js +9 -1
- package/lib/esm/components/combobox/ComboBox.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.js +48 -39
- package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.utils.js +24 -0
- package/lib/esm/components/context-menu/ContextMenu.utils.js.map +1 -1
- package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js +3 -8
- package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -1
- package/lib/esm/components/file-list/file-item/FileItem.js +29 -27
- package/lib/esm/components/file-list/file-item/FileItem.js.map +1 -1
- package/lib/esm/components/file-list/file-item/FileItem.styles.js +7 -1
- package/lib/esm/components/file-list/file-item/FileItem.styles.js.map +1 -1
- package/lib/esm/components/highlight-slider/HighlightSlider.js +6 -3
- package/lib/esm/components/highlight-slider/HighlightSlider.js.map +1 -1
- package/lib/esm/components/input/Input.js +2 -2
- package/lib/esm/components/input/Input.js.map +1 -1
- package/lib/esm/components/input/Input.styles.js +6 -1
- package/lib/esm/components/input/Input.styles.js.map +1 -1
- package/lib/esm/components/list/List.utils.js +104 -13
- package/lib/esm/components/list/List.utils.js.map +1 -1
- package/lib/esm/components/list/list-item/ListItem.js +28 -26
- package/lib/esm/components/list/list-item/ListItem.js.map +1 -1
- package/lib/esm/components/list/list-item/ListItem.styles.js +3 -5
- package/lib/esm/components/list/list-item/ListItem.styles.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js +4 -35
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +2 -32
- package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +2 -30
- package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -29
- package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
- package/lib/esm/components/mention-finder/MentionFinder.js +9 -1
- package/lib/esm/components/mention-finder/MentionFinder.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.styles.js +6 -0
- package/lib/esm/components/multi-action-button/MultiActionButton.styles.js.map +1 -1
- package/lib/esm/components/search-box/SearchBox.js +12 -1
- package/lib/esm/components/search-box/SearchBox.js.map +1 -1
- package/lib/esm/components/search-input/SearchInput.js +15 -2
- package/lib/esm/components/search-input/SearchInput.js.map +1 -1
- package/lib/esm/components/search-input/SearchInput.styles.js +1 -0
- package/lib/esm/components/search-input/SearchInput.styles.js.map +1 -1
- package/lib/esm/components/setup-wizard/SetupWizard.js +6 -3
- package/lib/esm/components/setup-wizard/SetupWizard.js.map +1 -1
- package/lib/esm/components/sharing-bar/SharingBar.js +1 -1
- package/lib/esm/components/sharing-bar/SharingBar.js.map +1 -1
- package/lib/esm/components/sharing-bar/SharingBar.styles.js +3 -2
- package/lib/esm/components/sharing-bar/SharingBar.styles.js.map +1 -1
- package/lib/esm/components/skeleton/base-skeleton/BaseSkeleton.styles.js +2 -0
- package/lib/esm/components/skeleton/base-skeleton/BaseSkeleton.styles.js.map +1 -1
- package/lib/esm/components/slider-button/SliderButton.styles.js +1 -5
- package/lib/esm/components/slider-button/SliderButton.styles.js.map +1 -1
- package/lib/esm/components/tag-input/TagInput.js +1 -0
- package/lib/esm/components/tag-input/TagInput.js.map +1 -1
- package/lib/esm/components/tag-input/TagInput.styles.js +0 -2
- package/lib/esm/components/tag-input/TagInput.styles.js.map +1 -1
- package/lib/esm/components/truncation/Truncation.styles.js +0 -1
- package/lib/esm/components/truncation/Truncation.styles.js.map +1 -1
- package/lib/esm/index.js +1 -1
- package/lib/esm/index.js.map +1 -1
- package/lib/esm/utils/keyboardFocusHighlighting.styles.js +2 -3
- package/lib/esm/utils/keyboardFocusHighlighting.styles.js.map +1 -1
- package/lib/types/components/context-menu/ContextMenu.utils.d.ts +10 -0
- package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.d.ts +1 -1
- package/lib/types/components/list/List.utils.d.ts +23 -7
- package/lib/types/components/list/list-item/ListItem.d.ts +4 -0
- package/lib/types/components/list/list-item/list-item-head/ListItemHead.d.ts +0 -1
- package/lib/types/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.d.ts +0 -1
- package/lib/types/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.d.ts +0 -1
- package/lib/types/components/list/list-item/list-item-head/list-item-title/ListItemTitle.d.ts +0 -1
- package/lib/types/index.d.ts +1 -1
- package/package.json +3 -3
package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js
CHANGED
|
@@ -11,8 +11,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
|
|
|
11
11
|
const ListItemSubtitle = ({
|
|
12
12
|
rightElements,
|
|
13
13
|
subtitle,
|
|
14
|
-
isOpen
|
|
15
|
-
shouldAllowRightElementFocus = true
|
|
14
|
+
isOpen
|
|
16
15
|
}) => {
|
|
17
16
|
const bottomElementRef = (0, _react.useRef)(null);
|
|
18
17
|
const handlePreventClick = event => {
|
|
@@ -31,33 +30,6 @@ const ListItemSubtitle = ({
|
|
|
31
30
|
}
|
|
32
31
|
return false;
|
|
33
32
|
}, [bottomElement]);
|
|
34
|
-
(0, _react.useEffect)(() => {
|
|
35
|
-
const bottomElementWrapper = bottomElementRef.current;
|
|
36
|
-
if (!bottomElementWrapper) {
|
|
37
|
-
return;
|
|
38
|
-
}
|
|
39
|
-
const focusableElements = Array.from(bottomElementWrapper.querySelectorAll('a[href], button, input, select, textarea, [tabindex], [contenteditable="true"]'));
|
|
40
|
-
focusableElements.forEach(element => {
|
|
41
|
-
const currentElement = element;
|
|
42
|
-
const datasetKey = 'listItemRightElementOriginalTabIndex';
|
|
43
|
-
if (shouldAllowRightElementFocus) {
|
|
44
|
-
const originalTabIndex = currentElement.dataset[datasetKey];
|
|
45
|
-
if (typeof originalTabIndex === 'string') {
|
|
46
|
-
if (originalTabIndex === '') {
|
|
47
|
-
currentElement.removeAttribute('tabindex');
|
|
48
|
-
} else {
|
|
49
|
-
currentElement.setAttribute('tabindex', originalTabIndex);
|
|
50
|
-
}
|
|
51
|
-
delete currentElement.dataset[datasetKey];
|
|
52
|
-
}
|
|
53
|
-
} else {
|
|
54
|
-
if (typeof currentElement.dataset[datasetKey] !== 'string') {
|
|
55
|
-
currentElement.dataset[datasetKey] = currentElement.getAttribute('tabindex') ?? '';
|
|
56
|
-
}
|
|
57
|
-
currentElement.setAttribute('tabindex', '-1');
|
|
58
|
-
}
|
|
59
|
-
});
|
|
60
|
-
}, [bottomElement, shouldAllowRightElementFocus]);
|
|
61
33
|
return /*#__PURE__*/_react.default.createElement(_ListItemSubtitle.StyledListItemSubtitle, null, /*#__PURE__*/_react.default.createElement(_ListItemSubtitle.StyledListItemHeadSubtitleText, {
|
|
62
34
|
$isOpen: isOpen
|
|
63
35
|
}, subtitle), bottomElement && /*#__PURE__*/_react.default.createElement(_ListItemSubtitle.StyledListItemBottomRightElement, {
|
package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemSubtitle.js","names":["_react","_interopRequireWildcard","require","_ListItemSubtitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemSubtitle","rightElements","subtitle","isOpen","
|
|
1
|
+
{"version":3,"file":"ListItemSubtitle.js","names":["_react","_interopRequireWildcard","require","_ListItemSubtitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemSubtitle","rightElements","subtitle","isOpen","bottomElementRef","useRef","handlePreventClick","event","stopPropagation","preventDefault","bottomElement","useMemo","bottom","undefined","shouldPreventRightElementClick","getElementClickEvent","createElement","StyledListItemSubtitle","StyledListItemHeadSubtitleText","$isOpen","StyledListItemBottomRightElement","ref","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n StyledListItemHeadSubtitleText,\n StyledListItemSubtitle,\n StyledListItemBottomRightElement,\n} from './ListItemSubtitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemSubtitleProps = {\n rightElements?: IListItemRightElements;\n subtitle?: ReactNode;\n isOpen: boolean;\n};\n\nconst ListItemSubtitle: FC<ListItemSubtitleProps> = ({ rightElements, subtitle, isOpen }) => {\n const bottomElementRef = useRef<HTMLDivElement>(null);\n\n const handlePreventClick = (event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n const bottomElement = useMemo(() => {\n if (typeof rightElements === 'object' && rightElements && 'bottom' in rightElements) {\n return (rightElements as unknown as IListItemRightElement).bottom;\n }\n\n return undefined;\n }, [rightElements]);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (bottomElement) {\n return getElementClickEvent(bottomElement);\n }\n\n return false;\n }, [bottomElement]);\n\n return (\n <StyledListItemSubtitle>\n <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n {subtitle}\n </StyledListItemHeadSubtitleText>\n {bottomElement && (\n <StyledListItemBottomRightElement\n data-right-element=\"true\"\n ref={bottomElementRef}\n onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n >\n {bottomElement}\n </StyledListItemBottomRightElement>\n )}\n </StyledListItemSubtitle>\n );\n};\n\nListItemSubtitle.displayName = 'ListItemSubtitle';\n\nexport default ListItemSubtitle;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAD,OAAA;AAKA,IAAAE,UAAA,GAAAF,OAAA;AAAsE,SAAAD,wBAAAI,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAN,uBAAA,YAAAA,CAAAI,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAQtE,MAAMkB,gBAA2C,GAAGA,CAAC;EAAEC,aAAa;EAAEC,QAAQ;EAAEC;AAAO,CAAC,KAAK;EACzF,MAAMC,gBAAgB,GAAG,IAAAC,aAAM,EAAiB,IAAI,CAAC;EAErD,MAAMC,kBAAkB,GAAIC,KAAuB,IAAK;IACpDA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBD,KAAK,CAACE,cAAc,CAAC,CAAC;EAC1B,CAAC;EAED,MAAMC,aAAa,GAAG,IAAAC,cAAO,EAAC,MAAM;IAChC,IAAI,OAAOV,aAAa,KAAK,QAAQ,IAAIA,aAAa,IAAI,QAAQ,IAAIA,aAAa,EAAE;MACjF,OAAQA,aAAa,CAAsCW,MAAM;IACrE;IAEA,OAAOC,SAAS;EACpB,CAAC,EAAE,CAACZ,aAAa,CAAC,CAAC;EAEnB,MAAMa,8BAA8B,GAAG,IAAAH,cAAO,EAAC,MAAM;IACjD,IAAID,aAAa,EAAE;MACf,OAAO,IAAAK,+BAAoB,EAACL,aAAa,CAAC;IAC9C;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,oBACIlC,MAAA,CAAAe,OAAA,CAAAyB,aAAA,CAACrC,iBAAA,CAAAsC,sBAAsB,qBACnBzC,MAAA,CAAAe,OAAA,CAAAyB,aAAA,CAACrC,iBAAA,CAAAuC,8BAA8B;IAACC,OAAO,EAAEhB;EAAO,GAC3CD,QAC2B,CAAC,EAChCQ,aAAa,iBACVlC,MAAA,CAAAe,OAAA,CAAAyB,aAAA,CAACrC,iBAAA,CAAAyC,gCAAgC;IAC7B,sBAAmB,MAAM;IACzBC,GAAG,EAAEjB,gBAAiB;IACtBkB,OAAO,EAAER,8BAA8B,GAAGR,kBAAkB,GAAGO;EAAU,GAExEH,aAC6B,CAElB,CAAC;AAEjC,CAAC;AAEDV,gBAAgB,CAACuB,WAAW,GAAG,kBAAkB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAlC,OAAA,GAEnCS,gBAAgB","ignoreList":[]}
|
|
@@ -15,8 +15,7 @@ const ListItemTitle = ({
|
|
|
15
15
|
shouldShowMultilineTitle,
|
|
16
16
|
isOpen,
|
|
17
17
|
onResize,
|
|
18
|
-
onTitleWidthChange
|
|
19
|
-
shouldAllowRightElementFocus = true
|
|
18
|
+
onTitleWidthChange
|
|
20
19
|
}) => {
|
|
21
20
|
const titleWrapperRef = (0, _react.useRef)(null);
|
|
22
21
|
const wrapperRef = (0, _react.useRef)(null);
|
|
@@ -61,33 +60,6 @@ const ListItemTitle = ({
|
|
|
61
60
|
}
|
|
62
61
|
return false;
|
|
63
62
|
}, [topElement]);
|
|
64
|
-
(0, _react.useEffect)(() => {
|
|
65
|
-
const topElementWrapper = topElementWrapperRef.current;
|
|
66
|
-
if (!topElementWrapper) {
|
|
67
|
-
return;
|
|
68
|
-
}
|
|
69
|
-
const focusableElements = Array.from(topElementWrapper.querySelectorAll('a[href], button, input, select, textarea, [tabindex], [contenteditable="true"]'));
|
|
70
|
-
focusableElements.forEach(element => {
|
|
71
|
-
const currentElement = element;
|
|
72
|
-
const datasetKey = 'listItemRightElementOriginalTabIndex';
|
|
73
|
-
if (shouldAllowRightElementFocus) {
|
|
74
|
-
const originalTabIndex = currentElement.dataset[datasetKey];
|
|
75
|
-
if (typeof originalTabIndex === 'string') {
|
|
76
|
-
if (originalTabIndex === '') {
|
|
77
|
-
currentElement.removeAttribute('tabindex');
|
|
78
|
-
} else {
|
|
79
|
-
currentElement.setAttribute('tabindex', originalTabIndex);
|
|
80
|
-
}
|
|
81
|
-
delete currentElement.dataset[datasetKey];
|
|
82
|
-
}
|
|
83
|
-
} else {
|
|
84
|
-
if (typeof currentElement.dataset[datasetKey] !== 'string') {
|
|
85
|
-
currentElement.dataset[datasetKey] = currentElement.getAttribute('tabindex') ?? '';
|
|
86
|
-
}
|
|
87
|
-
currentElement.setAttribute('tabindex', '-1');
|
|
88
|
-
}
|
|
89
|
-
});
|
|
90
|
-
}, [shouldAllowRightElementFocus, topElement]);
|
|
91
63
|
return /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemTitle, {
|
|
92
64
|
ref: wrapperRef
|
|
93
65
|
}, /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemTitleLeftWrapper, null, /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemHeadTitleText, {
|
package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemTitle.js","names":["_react","_interopRequireWildcard","require","_ListItemTitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemTitle","rightElements","titleElement","title","shouldShowMultilineTitle","isOpen","onResize","onTitleWidthChange","shouldAllowRightElementFocus","titleWrapperRef","useRef","wrapperRef","elementWrapperRef","topElementWrapperRef","useEffect","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","_topElementWrapperRef","fullWidth","clientWidth","rightElementWidth","topElementWidth","width","handlePreventClick","event","stopPropagation","preventDefault","topElement","useMemo","top","shouldPreventRightElementClick","getElementClickEvent","topElementWrapper","focusableElements","Array","from","querySelectorAll","forEach","currentElement","datasetKey","originalTabIndex","dataset","removeAttribute","setAttribute","getAttribute","createElement","StyledListItemTitle","ref","StyledListItemTitleLeftWrapper","StyledListItemHeadTitleText","$isEllipsis","$shouldShowMultilineTitle","StyledListItemHeadTitleElement","StyledListItemTopRightElement","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-title/ListItemTitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledListItemTitle,\n StyledListItemTitleLeftWrapper,\n StyledListItemTopRightElement,\n} from './ListItemTitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemTitleProps = {\n rightElements?: IListItemRightElements;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldShowMultilineTitle: boolean;\n isOpen: boolean;\n onResize?: (entries: ResizeObserverEntry[]) => void;\n onTitleWidthChange: (width: number) => void;\n shouldAllowRightElementFocus?: boolean;\n};\n\nconst ListItemTitle: FC<ListItemTitleProps> = ({\n rightElements,\n titleElement,\n title,\n shouldShowMultilineTitle,\n isOpen,\n onResize,\n onTitleWidthChange,\n shouldAllowRightElementFocus = true,\n}) => {\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n const wrapperRef = useRef<HTMLDivElement>(null);\n const elementWrapperRef = useRef<HTMLDivElement>(null);\n const topElementWrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const element = titleWrapperRef?.current;\n if (!element || typeof onResize !== 'function') return undefined;\n\n const resizeObserver = new ResizeObserver(onResize);\n resizeObserver.observe(element);\n\n return () => resizeObserver.disconnect();\n }, [onResize]);\n\n useEffect(() => {\n if (wrapperRef.current && elementWrapperRef.current) {\n const fullWidth = wrapperRef.current.clientWidth;\n const rightElementWidth = elementWrapperRef.current.clientWidth;\n const topElementWidth = topElementWrapperRef.current?.clientWidth;\n\n let width = fullWidth;\n\n if (rightElementWidth > 0) {\n width -= rightElementWidth + 8;\n }\n\n if (topElementWidth) {\n width -= topElementWidth + 12;\n }\n\n onTitleWidthChange(width);\n }\n }, [onTitleWidthChange]);\n\n const handlePreventClick = (event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n const topElement = useMemo(() => {\n if (typeof rightElements === 'object' && rightElements && 'top' in rightElements) {\n return (rightElements as unknown as IListItemRightElement).top;\n }\n\n return undefined;\n }, [rightElements]);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (topElement) {\n return getElementClickEvent(topElement);\n }\n\n return false;\n }, [topElement]);\n\n useEffect(() => {\n const topElementWrapper = topElementWrapperRef.current;\n\n if (!topElementWrapper) {\n return;\n }\n\n const focusableElements = Array.from(\n topElementWrapper.querySelectorAll<HTMLElement>(\n 'a[href], button, input, select, textarea, [tabindex], [contenteditable=\"true\"]',\n ),\n );\n\n focusableElements.forEach((element) => {\n const currentElement = element;\n const datasetKey = 'listItemRightElementOriginalTabIndex';\n\n if (shouldAllowRightElementFocus) {\n const originalTabIndex = currentElement.dataset[datasetKey];\n\n if (typeof originalTabIndex === 'string') {\n if (originalTabIndex === '') {\n currentElement.removeAttribute('tabindex');\n } else {\n currentElement.setAttribute('tabindex', originalTabIndex);\n }\n\n delete currentElement.dataset[datasetKey];\n }\n } else {\n if (typeof currentElement.dataset[datasetKey] !== 'string') {\n currentElement.dataset[datasetKey] =\n currentElement.getAttribute('tabindex') ?? '';\n }\n\n currentElement.setAttribute('tabindex', '-1');\n }\n });\n }, [shouldAllowRightElementFocus, topElement]);\n\n return (\n <StyledListItemTitle ref={wrapperRef}>\n <StyledListItemTitleLeftWrapper>\n <StyledListItemHeadTitleText\n $isEllipsis={!isOpen}\n ref={titleWrapperRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n >\n {title}\n </StyledListItemHeadTitleText>\n <StyledListItemHeadTitleElement ref={elementWrapperRef}>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemTitleLeftWrapper>\n {topElement && (\n <StyledListItemTopRightElement\n data-right-element=\"true\"\n ref={topElementWrapperRef}\n onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n >\n {topElement}\n </StyledListItemTopRightElement>\n )}\n </StyledListItemTitle>\n );\n};\n\nListItemTitle.displayName = 'ListItemTitle';\n\nexport default ListItemTitle;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ListItemTitle.js","names":["_react","_interopRequireWildcard","require","_ListItemTitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemTitle","rightElements","titleElement","title","shouldShowMultilineTitle","isOpen","onResize","onTitleWidthChange","titleWrapperRef","useRef","wrapperRef","elementWrapperRef","topElementWrapperRef","useEffect","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","_topElementWrapperRef","fullWidth","clientWidth","rightElementWidth","topElementWidth","width","handlePreventClick","event","stopPropagation","preventDefault","topElement","useMemo","top","shouldPreventRightElementClick","getElementClickEvent","createElement","StyledListItemTitle","ref","StyledListItemTitleLeftWrapper","StyledListItemHeadTitleText","$isEllipsis","$shouldShowMultilineTitle","StyledListItemHeadTitleElement","StyledListItemTopRightElement","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-title/ListItemTitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n StyledListItemHeadTitleElement,\n StyledListItemHeadTitleText,\n StyledListItemTitle,\n StyledListItemTitleLeftWrapper,\n StyledListItemTopRightElement,\n} from './ListItemTitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemTitleProps = {\n rightElements?: IListItemRightElements;\n title: ReactNode;\n titleElement?: ReactNode;\n shouldShowMultilineTitle: boolean;\n isOpen: boolean;\n onResize?: (entries: ResizeObserverEntry[]) => void;\n onTitleWidthChange: (width: number) => void;\n};\n\nconst ListItemTitle: FC<ListItemTitleProps> = ({\n rightElements,\n titleElement,\n title,\n shouldShowMultilineTitle,\n isOpen,\n onResize,\n onTitleWidthChange,\n}) => {\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n const wrapperRef = useRef<HTMLDivElement>(null);\n const elementWrapperRef = useRef<HTMLDivElement>(null);\n const topElementWrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const element = titleWrapperRef?.current;\n if (!element || typeof onResize !== 'function') return undefined;\n\n const resizeObserver = new ResizeObserver(onResize);\n resizeObserver.observe(element);\n\n return () => resizeObserver.disconnect();\n }, [onResize]);\n\n useEffect(() => {\n if (wrapperRef.current && elementWrapperRef.current) {\n const fullWidth = wrapperRef.current.clientWidth;\n const rightElementWidth = elementWrapperRef.current.clientWidth;\n const topElementWidth = topElementWrapperRef.current?.clientWidth;\n\n let width = fullWidth;\n\n if (rightElementWidth > 0) {\n width -= rightElementWidth + 8;\n }\n\n if (topElementWidth) {\n width -= topElementWidth + 12;\n }\n\n onTitleWidthChange(width);\n }\n }, [onTitleWidthChange]);\n\n const handlePreventClick = (event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n const topElement = useMemo(() => {\n if (typeof rightElements === 'object' && rightElements && 'top' in rightElements) {\n return (rightElements as unknown as IListItemRightElement).top;\n }\n\n return undefined;\n }, [rightElements]);\n\n const shouldPreventRightElementClick = useMemo(() => {\n if (topElement) {\n return getElementClickEvent(topElement);\n }\n\n return false;\n }, [topElement]);\n\n return (\n <StyledListItemTitle ref={wrapperRef}>\n <StyledListItemTitleLeftWrapper>\n <StyledListItemHeadTitleText\n $isEllipsis={!isOpen}\n ref={titleWrapperRef}\n $shouldShowMultilineTitle={shouldShowMultilineTitle}\n >\n {title}\n </StyledListItemHeadTitleText>\n <StyledListItemHeadTitleElement ref={elementWrapperRef}>\n {titleElement}\n </StyledListItemHeadTitleElement>\n </StyledListItemTitleLeftWrapper>\n {topElement && (\n <StyledListItemTopRightElement\n data-right-element=\"true\"\n ref={topElementWrapperRef}\n onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n >\n {topElement}\n </StyledListItemTopRightElement>\n )}\n </StyledListItemTitle>\n );\n};\n\nListItemTitle.displayName = 'ListItemTitle';\n\nexport default ListItemTitle;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -67,6 +67,14 @@ const MentionFinder = ({
|
|
|
67
67
|
name
|
|
68
68
|
}) => id.toLowerCase().includes(searchString) || (info === null || info === void 0 ? void 0 : info.replace('chayns', '').toLowerCase().includes(searchString)) || name.toLowerCase().includes(searchString)) : members, [members, searchString]);
|
|
69
69
|
const shouldRenderPopup = shouldShowPopup && !!fullMatch && filteredMembers.length > 0;
|
|
70
|
+
const handleContainerBlur = (0, _react2.useCallback)(event => {
|
|
71
|
+
var _popupRef$current;
|
|
72
|
+
const nextFocusedElement = event.relatedTarget;
|
|
73
|
+
const currentContainer = event.currentTarget;
|
|
74
|
+
if (!nextFocusedElement || !currentContainer.contains(nextFocusedElement) && !((_popupRef$current = popupRef.current) !== null && _popupRef$current !== void 0 && _popupRef$current.contains(nextFocusedElement))) {
|
|
75
|
+
setShouldShowPopup(false);
|
|
76
|
+
}
|
|
77
|
+
}, []);
|
|
70
78
|
const handleKeyDown = (0, _react2.useCallback)(event => {
|
|
71
79
|
const targetElement = event.target;
|
|
72
80
|
if (isTextInputElement(targetElement)) {
|
|
@@ -322,12 +330,12 @@ const MentionFinder = ({
|
|
|
322
330
|
}));
|
|
323
331
|
}, [enableDragHandle, popupAlignment, dragOffset, dragProgress, isDraggingHandle, handleDragPointerDown, handleDragPointerMove, handleDragPointerUp, handleDragPointerCancel, handleDragTouchStart, handleDragTouchMove, handleDragTouchEnd, handleDragTouchCancel]);
|
|
324
332
|
(0, _react2.useEffect)(() => {
|
|
325
|
-
var _popupRef$
|
|
333
|
+
var _popupRef$current2;
|
|
326
334
|
if (!enableDragHandle || !shouldRenderPopup) {
|
|
327
335
|
setOverlayContainer(null);
|
|
328
336
|
return;
|
|
329
337
|
}
|
|
330
|
-
const container = (_popupRef$
|
|
338
|
+
const container = (_popupRef$current2 = popupRef.current) === null || _popupRef$current2 === void 0 ? void 0 : _popupRef$current2.closest(overlayContainerSelector ?? '.dialog-inner, .chayns-threads, .page-provider, .tapp');
|
|
331
339
|
if (container) {
|
|
332
340
|
setOverlayContainer(container);
|
|
333
341
|
return;
|
|
@@ -352,7 +360,8 @@ const MentionFinder = ({
|
|
|
352
360
|
onClick: handleOverlayClick
|
|
353
361
|
})), overlayContainer) : null;
|
|
354
362
|
return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, overlayPortal, /*#__PURE__*/_react2.default.createElement(_MentionFinder.StyledMentionFinder, {
|
|
355
|
-
className: "beta-chayns-mention-finder"
|
|
363
|
+
className: "beta-chayns-mention-finder",
|
|
364
|
+
onBlur: handleContainerBlur
|
|
356
365
|
}, /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
|
|
357
366
|
initial: false
|
|
358
367
|
}, shouldRenderPopup && /*#__PURE__*/_react2.default.createElement(_MentionFinder.StyledMotionMentionFinderPopup, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MentionFinder.js","names":["_react","require","_react2","_interopRequireWildcard","_reactDom","_mentionFinder","_MentionFinderItem","_interopRequireDefault","_MentionFinder","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DRAG_CLOSE_THRESHOLD_IN_PX","isTextInputElement","element","tagName","toLowerCase","type","isContentEditable","findTouchByIdentifier","touchList","identifier","length","touch","item","MentionFinder","inputValue","members","onSelect","popupAlignment","enableDragHandle","dragCloseThresholdInPx","overlayContainerSelector","activeMember","setActiveMember","useState","focusedIndex","setFocusedIndex","shouldShowPopup","setShouldShowPopup","popupRef","useRef","listRef","inputElementRef","dragStartYRef","hasTriggeredDragCloseRef","activePointerIdRef","activeTouchIdRef","isDraggingHandle","setIsDraggingHandle","dragOffset","setDragOffset","dragProgress","setDragProgress","overlayContainer","setOverlayContainer","fullMatch","searchString","useMemo","_regExpMatchArray$","regExpMatchArray","match","filteredMembers","filter","id","info","name","includes","replace","shouldRenderPopup","handleKeyDown","useCallback","event","targetElement","target","current","key","_listRef$current","preventDefault","children","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","window","requestAnimationFrame","_inputElementRef$curr","handleMemberClick","handleMemberHover","useEffect","isActiveMemberShown","some","items","map","createElement","isActive","onClick","onHover","activeElement","document","addEventListener","removeEventListener","closePopupViaDrag","handleOverlayClick","updateDragByClientY","clientY","closingDirectionMultiplier","MentionFinderPopupAlignment","Bottom","rawDelta","normalizedDelta","positiveDelta","Math","max","limitedDelta","min","handleDragPointerDown","pointerType","button","pointerId","currentTarget","setPointerCapture","handleDragPointerMove","hasClosed","releasePointerCapture","resetDragState","shouldClose","handleDragPointerUp","handleDragPointerCancel","handleDragTouchStart","touches","handleDragTouchMove","changedTouches","handleDragTouchEnd","handleDragTouchCancel","dragHandle","StyledMentionFinderDragHandle","$alignment","StyledMentionFinderDragHandleInner","$dragOffset","$dragProgress","$isDragging","onPointerDown","onPointerMove","onPointerUp","onPointerCancel","onTouchStart","onTouchMove","onTouchEnd","onTouchCancel","_popupRef$current","container","closest","body","overlayPortal","createPortal","AnimatePresence","initial","StyledMentionFinderOverlay","animate","opacity","exit","Fragment","StyledMentionFinder","className","StyledMotionMentionFinderPopup","ref","height","y","$popupAlignment","transition","duration","Top","StyledMentionFinderItemList","displayName","_default","exports"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n FC,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n PointerEvent,\n TouchList,\n TouchEvent,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport {\n StyledMentionFinder,\n StyledMentionFinderDragHandle,\n StyledMentionFinderDragHandleInner,\n StyledMentionFinderItemList,\n StyledMentionFinderOverlay,\n StyledMotionMentionFinderPopup,\n} from './MentionFinder.styles';\n\nexport type MentionMember = {\n id: string;\n info?: string;\n imageUrl: string;\n name: string;\n shouldShowRoundImage?: boolean;\n};\n\nexport type MentionFinderProps = {\n /**\n * The text from the input field\n */\n inputValue: string;\n /**\n * Members that can be selected\n */\n members: MentionMember[];\n /**\n * Function to be executed when a member is selected\n */\n onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n /**\n * Alignment of the popup\n */\n popupAlignment: MentionFinderPopupAlignment;\n /**\n * Enables the optional drag handle inside the popup\n */\n enableDragHandle?: boolean;\n /**\n * Threshold in pixels to drag to close the popup\n */\n dragCloseThresholdInPx?: number;\n /**\n * Selector for the container to render the overlay into (defaults to closest dialog, thread, page provider or tapp)\n */\n overlayContainerSelector?: string;\n};\n\nconst DRAG_CLOSE_THRESHOLD_IN_PX = 60;\n\nconst isTextInputElement = (\n element: HTMLElement | null,\n): element is HTMLInputElement | HTMLTextAreaElement => {\n if (!element) {\n return false;\n }\n\n const tagName = element.tagName.toLowerCase();\n\n return (\n (tagName === 'input' && (element as HTMLInputElement).type !== 'button') ||\n tagName === 'textarea' ||\n element.isContentEditable\n );\n};\n\nconst findTouchByIdentifier = (touchList: TouchList, identifier: number | null) => {\n if (identifier === null) {\n return null;\n }\n\n for (let i = 0; i < touchList.length; i += 1) {\n const touch = touchList.item(i);\n if (touch && touch.identifier === identifier) {\n return touch;\n }\n }\n\n return null;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n inputValue,\n members,\n onSelect,\n popupAlignment,\n enableDragHandle = false,\n dragCloseThresholdInPx = DRAG_CLOSE_THRESHOLD_IN_PX,\n overlayContainerSelector,\n}) => {\n const [activeMember, setActiveMember] = useState(members[0]);\n const [focusedIndex, setFocusedIndex] = useState(0);\n const [shouldShowPopup, setShouldShowPopup] = useState(true);\n\n const popupRef = useRef<HTMLDivElement>(null);\n const listRef = useRef<HTMLDivElement>(null);\n const inputElementRef = useRef<HTMLElement | null>(null);\n const dragStartYRef = useRef<number | null>(null);\n const hasTriggeredDragCloseRef = useRef(false);\n const activePointerIdRef = useRef<number | null>(null);\n const activeTouchIdRef = useRef<number | null>(null);\n\n const [isDraggingHandle, setIsDraggingHandle] = useState(false);\n const [dragOffset, setDragOffset] = useState(0);\n const [dragProgress, setDragProgress] = useState(0);\n const [overlayContainer, setOverlayContainer] = useState<Element | null>(null);\n\n const [fullMatch, searchString] = useMemo(() => {\n // eslint-disable-next-line no-irregular-whitespace\n const regExpMatchArray = inputValue.match(/@(?!\\s)([^\\s]*)/);\n\n return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n }, [inputValue]);\n\n const filteredMembers = useMemo(\n () =>\n searchString !== ''\n ? members.filter(\n ({ id, info, name }) =>\n id.toLowerCase().includes(searchString) ||\n info?.replace('chayns', '').toLowerCase().includes(searchString) ||\n name.toLowerCase().includes(searchString),\n )\n : members,\n [members, searchString],\n );\n\n const shouldRenderPopup = shouldShowPopup && !!fullMatch && filteredMembers.length > 0;\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n const targetElement = event.target as HTMLElement | null;\n\n if (isTextInputElement(targetElement)) {\n inputElementRef.current = targetElement;\n }\n\n if ((event.key === 'ArrowUp' || event.key === 'ArrowDown') && shouldRenderPopup) {\n event.preventDefault();\n\n const children = listRef.current?.children;\n\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex +\n (event.key === 'ArrowUp' ? -1 : 1) +\n children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const member = filteredMembers[newIndex];\n\n setActiveMember(member);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (event.key === 'Enter' && shouldRenderPopup) {\n event.preventDefault();\n event.stopPropagation();\n\n if (fullMatch && activeMember) {\n onSelect({ fullMatch, member: activeMember });\n }\n } else if (event.key === 'Escape' && shouldRenderPopup) {\n event.preventDefault();\n event.stopPropagation();\n setShouldShowPopup(false);\n\n window.requestAnimationFrame(() => {\n inputElementRef.current?.focus();\n });\n }\n },\n [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect, shouldRenderPopup],\n );\n\n const handleMemberClick = useCallback(\n (member: MentionMember) => {\n if (fullMatch) {\n onSelect({ fullMatch, member });\n }\n },\n [fullMatch, onSelect],\n );\n\n const handleMemberHover = useCallback((member: MentionMember) => {\n setActiveMember(member);\n }, []);\n\n useEffect(() => {\n if (filteredMembers.length > 0) {\n const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n if (!isActiveMemberShown) {\n setActiveMember(filteredMembers[0]);\n }\n }\n }, [activeMember?.id, filteredMembers]);\n\n const items = useMemo(\n () =>\n filteredMembers.map((member) => (\n <MentionFinderItem\n isActive={member.id === activeMember?.id}\n key={member.id}\n member={member}\n onClick={handleMemberClick}\n onHover={handleMemberHover}\n />\n )),\n [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n );\n\n useEffect(() => {\n setDragOffset(0);\n setDragProgress(0);\n hasTriggeredDragCloseRef.current = false;\n setShouldShowPopup(true);\n }, [inputValue]);\n\n useEffect(() => {\n if (!shouldRenderPopup) {\n return;\n }\n\n const activeElement = document.activeElement as HTMLElement | null;\n\n if (isTextInputElement(activeElement)) {\n inputElementRef.current = activeElement;\n }\n }, [shouldRenderPopup]);\n\n useEffect(() => {\n if (shouldShowPopup) {\n window.addEventListener('keydown', handleKeyDown, true);\n }\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown, true);\n };\n }, [handleKeyDown, shouldShowPopup]);\n\n const closePopupViaDrag = useCallback(() => {\n if (hasTriggeredDragCloseRef.current) {\n return;\n }\n hasTriggeredDragCloseRef.current = true;\n setDragOffset(0);\n setDragProgress(0);\n setShouldShowPopup(false);\n }, []);\n\n const handleOverlayClick = useCallback(() => {\n closePopupViaDrag();\n }, [closePopupViaDrag]);\n\n const updateDragByClientY = useCallback(\n (clientY: number) => {\n if (dragStartYRef.current === null) {\n return false;\n }\n\n const closingDirectionMultiplier =\n popupAlignment === MentionFinderPopupAlignment.Bottom ? -1 : 1;\n const rawDelta = clientY - dragStartYRef.current;\n const normalizedDelta = rawDelta * closingDirectionMultiplier;\n const positiveDelta = Math.max(0, normalizedDelta);\n const limitedDelta = Math.min(positiveDelta, dragCloseThresholdInPx);\n\n setDragOffset(limitedDelta * closingDirectionMultiplier);\n setDragProgress(Math.min(positiveDelta / dragCloseThresholdInPx, 1));\n\n if (positiveDelta >= dragCloseThresholdInPx) {\n dragStartYRef.current = null;\n setIsDraggingHandle(false);\n closePopupViaDrag();\n return true;\n }\n\n return false;\n },\n [closePopupViaDrag, dragCloseThresholdInPx, popupAlignment],\n );\n\n const handleDragPointerDown = useCallback((event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch') {\n return;\n }\n if (event.pointerType === 'mouse' && event.button !== 0) {\n return;\n }\n if (dragStartYRef.current !== null) {\n return;\n }\n activePointerIdRef.current = event.pointerId;\n dragStartYRef.current = event.clientY;\n hasTriggeredDragCloseRef.current = false;\n setDragOffset(0);\n setDragProgress(0);\n setIsDraggingHandle(true);\n event.currentTarget.setPointerCapture(event.pointerId);\n event.stopPropagation();\n }, []);\n\n const handleDragPointerMove = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n if (dragStartYRef.current === null) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const hasClosed = updateDragByClientY(event.clientY);\n\n if (hasClosed) {\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n }\n },\n [updateDragByClientY],\n );\n\n const resetDragState = useCallback(\n (shouldClose = false) => {\n dragStartYRef.current = null;\n setIsDraggingHandle(false);\n if (shouldClose) {\n closePopupViaDrag();\n } else {\n setDragOffset(0);\n setDragProgress(0);\n }\n },\n [closePopupViaDrag],\n );\n\n const handleDragPointerUp = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n event.stopPropagation();\n const shouldClose = dragProgress >= 1;\n resetDragState(shouldClose);\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n },\n [dragProgress, resetDragState],\n );\n\n const handleDragPointerCancel = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n event.stopPropagation();\n resetDragState();\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n },\n [resetDragState],\n );\n\n const handleDragTouchStart = useCallback((event: TouchEvent<HTMLDivElement>) => {\n if (event.touches.length === 0 || dragStartYRef.current !== null) {\n return;\n }\n\n const touch = event.touches[0];\n\n if (!touch) return;\n\n activeTouchIdRef.current = touch.identifier;\n dragStartYRef.current = touch.clientY;\n hasTriggeredDragCloseRef.current = false;\n setDragOffset(0);\n setDragProgress(0);\n setIsDraggingHandle(true);\n event.preventDefault();\n event.stopPropagation();\n }, []);\n\n const handleDragTouchMove = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (dragStartYRef.current === null || activeTouchIdRef.current === null) {\n return;\n }\n const touch =\n findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current) ??\n findTouchByIdentifier(event.touches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n const hasClosed = updateDragByClientY(touch.clientY);\n if (hasClosed) {\n activeTouchIdRef.current = null;\n }\n },\n [updateDragByClientY],\n );\n\n const handleDragTouchEnd = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (activeTouchIdRef.current === null) return;\n\n const touch = findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n activeTouchIdRef.current = null;\n const shouldClose = dragProgress >= 1;\n resetDragState(shouldClose);\n },\n [dragProgress, resetDragState],\n );\n\n const handleDragTouchCancel = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (activeTouchIdRef.current === null) return;\n\n const touch = findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n activeTouchIdRef.current = null;\n resetDragState();\n },\n [resetDragState],\n );\n\n const dragHandle = useMemo(() => {\n if (!enableDragHandle) {\n return null;\n }\n\n return (\n <StyledMentionFinderDragHandle $alignment={popupAlignment}>\n <StyledMentionFinderDragHandleInner\n $alignment={popupAlignment}\n $dragOffset={dragOffset}\n $dragProgress={dragProgress}\n $isDragging={isDraggingHandle}\n onPointerDown={handleDragPointerDown}\n onPointerMove={handleDragPointerMove}\n onPointerUp={handleDragPointerUp}\n onPointerCancel={handleDragPointerCancel}\n onTouchStart={handleDragTouchStart}\n onTouchMove={handleDragTouchMove}\n onTouchEnd={handleDragTouchEnd}\n onTouchCancel={handleDragTouchCancel}\n />\n </StyledMentionFinderDragHandle>\n );\n }, [\n enableDragHandle,\n popupAlignment,\n dragOffset,\n dragProgress,\n isDraggingHandle,\n handleDragPointerDown,\n handleDragPointerMove,\n handleDragPointerUp,\n handleDragPointerCancel,\n handleDragTouchStart,\n handleDragTouchMove,\n handleDragTouchEnd,\n handleDragTouchCancel,\n ]);\n\n useEffect(() => {\n if (!enableDragHandle || !shouldRenderPopup) {\n setOverlayContainer(null);\n return;\n }\n\n const container = popupRef.current?.closest(\n overlayContainerSelector ?? '.dialog-inner, .chayns-threads, .page-provider, .tapp',\n );\n\n if (container) {\n setOverlayContainer(container);\n return;\n }\n\n if (typeof document !== 'undefined') {\n setOverlayContainer(document.body);\n }\n }, [enableDragHandle, overlayContainerSelector, shouldRenderPopup]);\n\n const overlayPortal =\n overlayContainer && enableDragHandle\n ? createPortal(\n <AnimatePresence initial={false}>\n {shouldRenderPopup && (\n <StyledMentionFinderOverlay\n key=\"mention-finder-overlay\"\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n onClick={handleOverlayClick}\n />\n )}\n </AnimatePresence>,\n overlayContainer,\n )\n : null;\n\n return (\n <>\n {overlayPortal}\n <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n <AnimatePresence initial={false}>\n {shouldRenderPopup && (\n <StyledMotionMentionFinderPopup\n ref={popupRef}\n animate={{\n height: 'auto',\n opacity: 1,\n y: dragOffset,\n }}\n className=\"prevent-lose-focus\"\n exit={{ height: 0, opacity: 0 }}\n initial={{ height: 0, opacity: 0 }}\n $popupAlignment={popupAlignment}\n $isDragging={enableDragHandle}\n transition={{ duration: 0.15 }}\n tabIndex={0}\n >\n {enableDragHandle &&\n popupAlignment === MentionFinderPopupAlignment.Top &&\n dragHandle}\n <StyledMentionFinderItemList ref={listRef}>\n {items}\n </StyledMentionFinderItemList>\n {enableDragHandle &&\n popupAlignment === MentionFinderPopupAlignment.Bottom &&\n dragHandle}\n </StyledMotionMentionFinderPopup>\n )}\n </AnimatePresence>\n </StyledMentionFinder>\n </>\n );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAC,uBAAA,CAAAF,OAAA;AAWA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,cAAA,GAAAJ,OAAA;AACA,IAAAK,kBAAA,GAAAC,sBAAA,CAAAN,OAAA;AACA,IAAAO,cAAA,GAAAP,OAAA;AAOgC,SAAAM,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAV,uBAAA,YAAAA,CAAAM,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAyChC,MAAMgB,0BAA0B,GAAG,EAAE;AAErC,MAAMC,kBAAkB,GACpBC,OAA2B,IACyB;EACpD,IAAI,CAACA,OAAO,EAAE;IACV,OAAO,KAAK;EAChB;EAEA,MAAMC,OAAO,GAAGD,OAAO,CAACC,OAAO,CAACC,WAAW,CAAC,CAAC;EAE7C,OACKD,OAAO,KAAK,OAAO,IAAKD,OAAO,CAAsBG,IAAI,KAAK,QAAQ,IACvEF,OAAO,KAAK,UAAU,IACtBD,OAAO,CAACI,iBAAiB;AAEjC,CAAC;AAED,MAAMC,qBAAqB,GAAGA,CAACC,SAAoB,EAAEC,UAAyB,KAAK;EAC/E,IAAIA,UAAU,KAAK,IAAI,EAAE;IACrB,OAAO,IAAI;EACf;EAEA,KAAK,IAAIpB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGmB,SAAS,CAACE,MAAM,EAAErB,CAAC,IAAI,CAAC,EAAE;IAC1C,MAAMsB,KAAK,GAAGH,SAAS,CAACI,IAAI,CAACvB,CAAC,CAAC;IAC/B,IAAIsB,KAAK,IAAIA,KAAK,CAACF,UAAU,KAAKA,UAAU,EAAE;MAC1C,OAAOE,KAAK;IAChB;EACJ;EAEA,OAAO,IAAI;AACf,CAAC;AAED,MAAME,aAAqC,GAAGA,CAAC;EAC3CC,UAAU;EACVC,OAAO;EACPC,QAAQ;EACRC,cAAc;EACdC,gBAAgB,GAAG,KAAK;EACxBC,sBAAsB,GAAGnB,0BAA0B;EACnDoB;AACJ,CAAC,KAAK;EACF,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,gBAAQ,EAACR,OAAO,CAAC,CAAC,CAAC,CAAC;EAC5D,MAAM,CAACS,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAF,gBAAQ,EAAC,CAAC,CAAC;EACnD,MAAM,CAACG,eAAe,EAAEC,kBAAkB,CAAC,GAAG,IAAAJ,gBAAQ,EAAC,IAAI,CAAC;EAE5D,MAAMK,QAAQ,GAAG,IAAAC,cAAM,EAAiB,IAAI,CAAC;EAC7C,MAAMC,OAAO,GAAG,IAAAD,cAAM,EAAiB,IAAI,CAAC;EAC5C,MAAME,eAAe,GAAG,IAAAF,cAAM,EAAqB,IAAI,CAAC;EACxD,MAAMG,aAAa,GAAG,IAAAH,cAAM,EAAgB,IAAI,CAAC;EACjD,MAAMI,wBAAwB,GAAG,IAAAJ,cAAM,EAAC,KAAK,CAAC;EAC9C,MAAMK,kBAAkB,GAAG,IAAAL,cAAM,EAAgB,IAAI,CAAC;EACtD,MAAMM,gBAAgB,GAAG,IAAAN,cAAM,EAAgB,IAAI,CAAC;EAEpD,MAAM,CAACO,gBAAgB,EAAEC,mBAAmB,CAAC,GAAG,IAAAd,gBAAQ,EAAC,KAAK,CAAC;EAC/D,MAAM,CAACe,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAhB,gBAAQ,EAAC,CAAC,CAAC;EAC/C,MAAM,CAACiB,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAlB,gBAAQ,EAAC,CAAC,CAAC;EACnD,MAAM,CAACmB,gBAAgB,EAAEC,mBAAmB,CAAC,GAAG,IAAApB,gBAAQ,EAAiB,IAAI,CAAC;EAE9E,MAAM,CAACqB,SAAS,EAAEC,YAAY,CAAC,GAAG,IAAAC,eAAO,EAAC,MAAM;IAAA,IAAAC,kBAAA;IAC5C;IACA,MAAMC,gBAAgB,GAAGlC,UAAU,CAACmC,KAAK,CAAC,kBAAkB,CAAC;IAE7D,OAAO,CAACD,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAG,CAAC,CAAC,EAAE,CAAAA,gBAAgB,aAAhBA,gBAAgB,gBAAAD,kBAAA,GAAhBC,gBAAgB,CAAG,CAAC,CAAC,cAAAD,kBAAA,uBAArBA,kBAAA,CAAuB3C,WAAW,CAAC,CAAC,KAAI,EAAE,CAAC;EAC9E,CAAC,EAAE,CAACU,UAAU,CAAC,CAAC;EAEhB,MAAMoC,eAAe,GAAG,IAAAJ,eAAO,EAC3B,MACID,YAAY,KAAK,EAAE,GACb9B,OAAO,CAACoC,MAAM,CACV,CAAC;IAAEC,EAAE;IAAEC,IAAI;IAAEC;EAAK,CAAC,KACfF,EAAE,CAAChD,WAAW,CAAC,CAAC,CAACmD,QAAQ,CAACV,YAAY,CAAC,KACvCQ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAACpD,WAAW,CAAC,CAAC,CAACmD,QAAQ,CAACV,YAAY,CAAC,KAChES,IAAI,CAAClD,WAAW,CAAC,CAAC,CAACmD,QAAQ,CAACV,YAAY,CAChD,CAAC,GACD9B,OAAO,EACjB,CAACA,OAAO,EAAE8B,YAAY,CAC1B,CAAC;EAED,MAAMY,iBAAiB,GAAG/B,eAAe,IAAI,CAAC,CAACkB,SAAS,IAAIM,eAAe,CAACxC,MAAM,GAAG,CAAC;EAEtF,MAAMgD,aAAa,GAAG,IAAAC,mBAAW,EAC5BC,KAAoB,IAAK;IACtB,MAAMC,aAAa,GAAGD,KAAK,CAACE,MAA4B;IAExD,IAAI7D,kBAAkB,CAAC4D,aAAa,CAAC,EAAE;MACnC9B,eAAe,CAACgC,OAAO,GAAGF,aAAa;IAC3C;IAEA,IAAI,CAACD,KAAK,CAACI,GAAG,KAAK,SAAS,IAAIJ,KAAK,CAACI,GAAG,KAAK,WAAW,KAAKP,iBAAiB,EAAE;MAAA,IAAAQ,gBAAA;MAC7EL,KAAK,CAACM,cAAc,CAAC,CAAC;MAEtB,MAAMC,QAAQ,IAAAF,gBAAA,GAAGnC,OAAO,CAACiC,OAAO,cAAAE,gBAAA,uBAAfA,gBAAA,CAAiBE,QAAQ;MAE1C,IAAIA,QAAQ,IAAIA,QAAQ,CAACzD,MAAM,GAAG,CAAC,EAAE;QACjC,MAAM0D,QAAQ,GACV5C,YAAY,KAAK,IAAI,GACf,CAACA,YAAY,IACRoC,KAAK,CAACI,GAAG,KAAK,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAClCG,QAAQ,CAACzD,MAAM,IACnByD,QAAQ,CAACzD,MAAM,GACf,CAAC;QAEX,IAAIc,YAAY,KAAK,IAAI,EAAE;UACvB,MAAM6C,WAAW,GAAGF,QAAQ,CAAC3C,YAAY,CAAmB;UAC5D6C,WAAW,CAACC,QAAQ,GAAG,CAAC,CAAC;QAC7B;QAEA7C,eAAe,CAAC2C,QAAQ,CAAC;QAEzB,MAAMG,MAAM,GAAGrB,eAAe,CAACkB,QAAQ,CAAC;QAExC9C,eAAe,CAACiD,MAAM,CAAC;QAEvB,MAAMC,UAAU,GAAGL,QAAQ,CAACC,QAAQ,CAAmB;QACvDI,UAAU,CAACF,QAAQ,GAAG,CAAC;QACvBE,UAAU,CAACC,KAAK,CAAC,CAAC;MACtB;IACJ,CAAC,MAAM,IAAIb,KAAK,CAACI,GAAG,KAAK,OAAO,IAAIP,iBAAiB,EAAE;MACnDG,KAAK,CAACM,cAAc,CAAC,CAAC;MACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;MAEvB,IAAI9B,SAAS,IAAIvB,YAAY,EAAE;QAC3BL,QAAQ,CAAC;UAAE4B,SAAS;UAAE2B,MAAM,EAAElD;QAAa,CAAC,CAAC;MACjD;IACJ,CAAC,MAAM,IAAIuC,KAAK,CAACI,GAAG,KAAK,QAAQ,IAAIP,iBAAiB,EAAE;MACpDG,KAAK,CAACM,cAAc,CAAC,CAAC;MACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;MACvB/C,kBAAkB,CAAC,KAAK,CAAC;MAEzBgD,MAAM,CAACC,qBAAqB,CAAC,MAAM;QAAA,IAAAC,qBAAA;QAC/B,CAAAA,qBAAA,GAAA9C,eAAe,CAACgC,OAAO,cAAAc,qBAAA,eAAvBA,qBAAA,CAAyBJ,KAAK,CAAC,CAAC;MACpC,CAAC,CAAC;IACN;EACJ,CAAC,EACD,CAACpD,YAAY,EAAE6B,eAAe,EAAE1B,YAAY,EAAEoB,SAAS,EAAE5B,QAAQ,EAAEyC,iBAAiB,CACxF,CAAC;EAED,MAAMqB,iBAAiB,GAAG,IAAAnB,mBAAW,EAChCY,MAAqB,IAAK;IACvB,IAAI3B,SAAS,EAAE;MACX5B,QAAQ,CAAC;QAAE4B,SAAS;QAAE2B;MAAO,CAAC,CAAC;IACnC;EACJ,CAAC,EACD,CAAC3B,SAAS,EAAE5B,QAAQ,CACxB,CAAC;EAED,MAAM+D,iBAAiB,GAAG,IAAApB,mBAAW,EAAEY,MAAqB,IAAK;IAC7DjD,eAAe,CAACiD,MAAM,CAAC;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAS,iBAAS,EAAC,MAAM;IACZ,IAAI9B,eAAe,CAACxC,MAAM,GAAG,CAAC,EAAE;MAC5B,MAAMuE,mBAAmB,GAAG/B,eAAe,CAACgC,IAAI,CAAC,CAAC;QAAE9B;MAAG,CAAC,KAAKA,EAAE,MAAK/B,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAE+B,EAAE,EAAC;MAErF,IAAI,CAAC6B,mBAAmB,EAAE;QACtB3D,eAAe,CAAC4B,eAAe,CAAC,CAAC,CAAC,CAAC;MACvC;IACJ;EACJ,CAAC,EAAE,CAAC7B,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAE+B,EAAE,EAAEF,eAAe,CAAC,CAAC;EAEvC,MAAMiC,KAAK,GAAG,IAAArC,eAAO,EACjB,MACII,eAAe,CAACkC,GAAG,CAAEb,MAAM,iBACvBjG,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAAC3G,kBAAA,CAAAK,OAAiB;IACduG,QAAQ,EAAEf,MAAM,CAACnB,EAAE,MAAK/B,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAE+B,EAAE,CAAC;IACzCY,GAAG,EAAEO,MAAM,CAACnB,EAAG;IACfmB,MAAM,EAAEA,MAAO;IACfgB,OAAO,EAAET,iBAAkB;IAC3BU,OAAO,EAAET;EAAkB,CAC9B,CACJ,CAAC,EACN,CAAC1D,YAAY,EAAE6B,eAAe,EAAE4B,iBAAiB,EAAEC,iBAAiB,CACxE,CAAC;EAED,IAAAC,iBAAS,EAAC,MAAM;IACZzC,aAAa,CAAC,CAAC,CAAC;IAChBE,eAAe,CAAC,CAAC,CAAC;IAClBR,wBAAwB,CAAC8B,OAAO,GAAG,KAAK;IACxCpC,kBAAkB,CAAC,IAAI,CAAC;EAC5B,CAAC,EAAE,CAACb,UAAU,CAAC,CAAC;EAEhB,IAAAkE,iBAAS,EAAC,MAAM;IACZ,IAAI,CAACvB,iBAAiB,EAAE;MACpB;IACJ;IAEA,MAAMgC,aAAa,GAAGC,QAAQ,CAACD,aAAmC;IAElE,IAAIxF,kBAAkB,CAACwF,aAAa,CAAC,EAAE;MACnC1D,eAAe,CAACgC,OAAO,GAAG0B,aAAa;IAC3C;EACJ,CAAC,EAAE,CAAChC,iBAAiB,CAAC,CAAC;EAEvB,IAAAuB,iBAAS,EAAC,MAAM;IACZ,IAAItD,eAAe,EAAE;MACjBiD,MAAM,CAACgB,gBAAgB,CAAC,SAAS,EAAEjC,aAAa,EAAE,IAAI,CAAC;IAC3D;IAEA,OAAO,MAAM;MACTiB,MAAM,CAACiB,mBAAmB,CAAC,SAAS,EAAElC,aAAa,EAAE,IAAI,CAAC;IAC9D,CAAC;EACL,CAAC,EAAE,CAACA,aAAa,EAAEhC,eAAe,CAAC,CAAC;EAEpC,MAAMmE,iBAAiB,GAAG,IAAAlC,mBAAW,EAAC,MAAM;IACxC,IAAI1B,wBAAwB,CAAC8B,OAAO,EAAE;MAClC;IACJ;IACA9B,wBAAwB,CAAC8B,OAAO,GAAG,IAAI;IACvCxB,aAAa,CAAC,CAAC,CAAC;IAChBE,eAAe,CAAC,CAAC,CAAC;IAClBd,kBAAkB,CAAC,KAAK,CAAC;EAC7B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMmE,kBAAkB,GAAG,IAAAnC,mBAAW,EAAC,MAAM;IACzCkC,iBAAiB,CAAC,CAAC;EACvB,CAAC,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAEvB,MAAME,mBAAmB,GAAG,IAAApC,mBAAW,EAClCqC,OAAe,IAAK;IACjB,IAAIhE,aAAa,CAAC+B,OAAO,KAAK,IAAI,EAAE;MAChC,OAAO,KAAK;IAChB;IAEA,MAAMkC,0BAA0B,GAC5BhF,cAAc,KAAKiF,0CAA2B,CAACC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC;IAClE,MAAMC,QAAQ,GAAGJ,OAAO,GAAGhE,aAAa,CAAC+B,OAAO;IAChD,MAAMsC,eAAe,GAAGD,QAAQ,GAAGH,0BAA0B;IAC7D,MAAMK,aAAa,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,eAAe,CAAC;IAClD,MAAMI,YAAY,GAAGF,IAAI,CAACG,GAAG,CAACJ,aAAa,EAAEnF,sBAAsB,CAAC;IAEpEoB,aAAa,CAACkE,YAAY,GAAGR,0BAA0B,CAAC;IACxDxD,eAAe,CAAC8D,IAAI,CAACG,GAAG,CAACJ,aAAa,GAAGnF,sBAAsB,EAAE,CAAC,CAAC,CAAC;IAEpE,IAAImF,aAAa,IAAInF,sBAAsB,EAAE;MACzCa,aAAa,CAAC+B,OAAO,GAAG,IAAI;MAC5B1B,mBAAmB,CAAC,KAAK,CAAC;MAC1BwD,iBAAiB,CAAC,CAAC;MACnB,OAAO,IAAI;IACf;IAEA,OAAO,KAAK;EAChB,CAAC,EACD,CAACA,iBAAiB,EAAE1E,sBAAsB,EAAEF,cAAc,CAC9D,CAAC;EAED,MAAM0F,qBAAqB,GAAG,IAAAhD,mBAAW,EAAEC,KAAmC,IAAK;IAC/E,IAAIA,KAAK,CAACgD,WAAW,KAAK,OAAO,EAAE;MAC/B;IACJ;IACA,IAAIhD,KAAK,CAACgD,WAAW,KAAK,OAAO,IAAIhD,KAAK,CAACiD,MAAM,KAAK,CAAC,EAAE;MACrD;IACJ;IACA,IAAI7E,aAAa,CAAC+B,OAAO,KAAK,IAAI,EAAE;MAChC;IACJ;IACA7B,kBAAkB,CAAC6B,OAAO,GAAGH,KAAK,CAACkD,SAAS;IAC5C9E,aAAa,CAAC+B,OAAO,GAAGH,KAAK,CAACoC,OAAO;IACrC/D,wBAAwB,CAAC8B,OAAO,GAAG,KAAK;IACxCxB,aAAa,CAAC,CAAC,CAAC;IAChBE,eAAe,CAAC,CAAC,CAAC;IAClBJ,mBAAmB,CAAC,IAAI,CAAC;IACzBuB,KAAK,CAACmD,aAAa,CAACC,iBAAiB,CAACpD,KAAK,CAACkD,SAAS,CAAC;IACtDlD,KAAK,CAACc,eAAe,CAAC,CAAC;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMuC,qBAAqB,GAAG,IAAAtD,mBAAW,EACpCC,KAAmC,IAAK;IACrC,IAAIA,KAAK,CAACgD,WAAW,KAAK,OAAO,IAAI1E,kBAAkB,CAAC6B,OAAO,KAAKH,KAAK,CAACkD,SAAS,EAAE;MACjF;IACJ;IACA,IAAI9E,aAAa,CAAC+B,OAAO,KAAK,IAAI,EAAE;MAChC;IACJ;IAEAH,KAAK,CAACM,cAAc,CAAC,CAAC;IACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;IAEvB,MAAMwC,SAAS,GAAGnB,mBAAmB,CAACnC,KAAK,CAACoC,OAAO,CAAC;IAEpD,IAAIkB,SAAS,EAAE;MACXtD,KAAK,CAACmD,aAAa,CAACI,qBAAqB,CAACvD,KAAK,CAACkD,SAAS,CAAC;MAC1D5E,kBAAkB,CAAC6B,OAAO,GAAG,IAAI;IACrC;EACJ,CAAC,EACD,CAACgC,mBAAmB,CACxB,CAAC;EAED,MAAMqB,cAAc,GAAG,IAAAzD,mBAAW,EAC9B,CAAC0D,WAAW,GAAG,KAAK,KAAK;IACrBrF,aAAa,CAAC+B,OAAO,GAAG,IAAI;IAC5B1B,mBAAmB,CAAC,KAAK,CAAC;IAC1B,IAAIgF,WAAW,EAAE;MACbxB,iBAAiB,CAAC,CAAC;IACvB,CAAC,MAAM;MACHtD,aAAa,CAAC,CAAC,CAAC;MAChBE,eAAe,CAAC,CAAC,CAAC;IACtB;EACJ,CAAC,EACD,CAACoD,iBAAiB,CACtB,CAAC;EAED,MAAMyB,mBAAmB,GAAG,IAAA3D,mBAAW,EAClCC,KAAmC,IAAK;IACrC,IAAIA,KAAK,CAACgD,WAAW,KAAK,OAAO,IAAI1E,kBAAkB,CAAC6B,OAAO,KAAKH,KAAK,CAACkD,SAAS,EAAE;MACjF;IACJ;IACAlD,KAAK,CAACc,eAAe,CAAC,CAAC;IACvB,MAAM2C,WAAW,GAAG7E,YAAY,IAAI,CAAC;IACrC4E,cAAc,CAACC,WAAW,CAAC;IAC3BzD,KAAK,CAACmD,aAAa,CAACI,qBAAqB,CAACvD,KAAK,CAACkD,SAAS,CAAC;IAC1D5E,kBAAkB,CAAC6B,OAAO,GAAG,IAAI;EACrC,CAAC,EACD,CAACvB,YAAY,EAAE4E,cAAc,CACjC,CAAC;EAED,MAAMG,uBAAuB,GAAG,IAAA5D,mBAAW,EACtCC,KAAmC,IAAK;IACrC,IAAIA,KAAK,CAACgD,WAAW,KAAK,OAAO,IAAI1E,kBAAkB,CAAC6B,OAAO,KAAKH,KAAK,CAACkD,SAAS,EAAE;MACjF;IACJ;IACAlD,KAAK,CAACc,eAAe,CAAC,CAAC;IACvB0C,cAAc,CAAC,CAAC;IAChBxD,KAAK,CAACmD,aAAa,CAACI,qBAAqB,CAACvD,KAAK,CAACkD,SAAS,CAAC;IAC1D5E,kBAAkB,CAAC6B,OAAO,GAAG,IAAI;EACrC,CAAC,EACD,CAACqD,cAAc,CACnB,CAAC;EAED,MAAMI,oBAAoB,GAAG,IAAA7D,mBAAW,EAAEC,KAAiC,IAAK;IAC5E,IAAIA,KAAK,CAAC6D,OAAO,CAAC/G,MAAM,KAAK,CAAC,IAAIsB,aAAa,CAAC+B,OAAO,KAAK,IAAI,EAAE;MAC9D;IACJ;IAEA,MAAMpD,KAAK,GAAGiD,KAAK,CAAC6D,OAAO,CAAC,CAAC,CAAC;IAE9B,IAAI,CAAC9G,KAAK,EAAE;IAEZwB,gBAAgB,CAAC4B,OAAO,GAAGpD,KAAK,CAACF,UAAU;IAC3CuB,aAAa,CAAC+B,OAAO,GAAGpD,KAAK,CAACqF,OAAO;IACrC/D,wBAAwB,CAAC8B,OAAO,GAAG,KAAK;IACxCxB,aAAa,CAAC,CAAC,CAAC;IAChBE,eAAe,CAAC,CAAC,CAAC;IAClBJ,mBAAmB,CAAC,IAAI,CAAC;IACzBuB,KAAK,CAACM,cAAc,CAAC,CAAC;IACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMgD,mBAAmB,GAAG,IAAA/D,mBAAW,EAClCC,KAAiC,IAAK;IACnC,IAAI5B,aAAa,CAAC+B,OAAO,KAAK,IAAI,IAAI5B,gBAAgB,CAAC4B,OAAO,KAAK,IAAI,EAAE;MACrE;IACJ;IACA,MAAMpD,KAAK,GACPJ,qBAAqB,CAACqD,KAAK,CAAC+D,cAAc,EAAExF,gBAAgB,CAAC4B,OAAO,CAAC,IACrExD,qBAAqB,CAACqD,KAAK,CAAC6D,OAAO,EAAEtF,gBAAgB,CAAC4B,OAAO,CAAC;IAElE,IAAI,CAACpD,KAAK,EAAE;IAEZiD,KAAK,CAACM,cAAc,CAAC,CAAC;IACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;IACvB,MAAMwC,SAAS,GAAGnB,mBAAmB,CAACpF,KAAK,CAACqF,OAAO,CAAC;IACpD,IAAIkB,SAAS,EAAE;MACX/E,gBAAgB,CAAC4B,OAAO,GAAG,IAAI;IACnC;EACJ,CAAC,EACD,CAACgC,mBAAmB,CACxB,CAAC;EAED,MAAM6B,kBAAkB,GAAG,IAAAjE,mBAAW,EACjCC,KAAiC,IAAK;IACnC,IAAIzB,gBAAgB,CAAC4B,OAAO,KAAK,IAAI,EAAE;IAEvC,MAAMpD,KAAK,GAAGJ,qBAAqB,CAACqD,KAAK,CAAC+D,cAAc,EAAExF,gBAAgB,CAAC4B,OAAO,CAAC;IAEnF,IAAI,CAACpD,KAAK,EAAE;IAEZiD,KAAK,CAACM,cAAc,CAAC,CAAC;IACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;IACvBvC,gBAAgB,CAAC4B,OAAO,GAAG,IAAI;IAC/B,MAAMsD,WAAW,GAAG7E,YAAY,IAAI,CAAC;IACrC4E,cAAc,CAACC,WAAW,CAAC;EAC/B,CAAC,EACD,CAAC7E,YAAY,EAAE4E,cAAc,CACjC,CAAC;EAED,MAAMS,qBAAqB,GAAG,IAAAlE,mBAAW,EACpCC,KAAiC,IAAK;IACnC,IAAIzB,gBAAgB,CAAC4B,OAAO,KAAK,IAAI,EAAE;IAEvC,MAAMpD,KAAK,GAAGJ,qBAAqB,CAACqD,KAAK,CAAC+D,cAAc,EAAExF,gBAAgB,CAAC4B,OAAO,CAAC;IAEnF,IAAI,CAACpD,KAAK,EAAE;IAEZiD,KAAK,CAACM,cAAc,CAAC,CAAC;IACtBN,KAAK,CAACc,eAAe,CAAC,CAAC;IACvBvC,gBAAgB,CAAC4B,OAAO,GAAG,IAAI;IAC/BqD,cAAc,CAAC,CAAC;EACpB,CAAC,EACD,CAACA,cAAc,CACnB,CAAC;EAED,MAAMU,UAAU,GAAG,IAAAhF,eAAO,EAAC,MAAM;IAC7B,IAAI,CAAC5B,gBAAgB,EAAE;MACnB,OAAO,IAAI;IACf;IAEA,oBACI5C,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAAmJ,6BAA6B;MAACC,UAAU,EAAE/G;IAAe,gBACtD3C,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAAqJ,kCAAkC;MAC/BD,UAAU,EAAE/G,cAAe;MAC3BiH,WAAW,EAAE5F,UAAW;MACxB6F,aAAa,EAAE3F,YAAa;MAC5B4F,WAAW,EAAEhG,gBAAiB;MAC9BiG,aAAa,EAAE1B,qBAAsB;MACrC2B,aAAa,EAAErB,qBAAsB;MACrCsB,WAAW,EAAEjB,mBAAoB;MACjCkB,eAAe,EAAEjB,uBAAwB;MACzCkB,YAAY,EAAEjB,oBAAqB;MACnCkB,WAAW,EAAEhB,mBAAoB;MACjCiB,UAAU,EAAEf,kBAAmB;MAC/BgB,aAAa,EAAEf;IAAsB,CACxC,CAC0B,CAAC;EAExC,CAAC,EAAE,CACC3G,gBAAgB,EAChBD,cAAc,EACdqB,UAAU,EACVE,YAAY,EACZJ,gBAAgB,EAChBuE,qBAAqB,EACrBM,qBAAqB,EACrBK,mBAAmB,EACnBC,uBAAuB,EACvBC,oBAAoB,EACpBE,mBAAmB,EACnBE,kBAAkB,EAClBC,qBAAqB,CACxB,CAAC;EAEF,IAAA7C,iBAAS,EAAC,MAAM;IAAA,IAAA6D,iBAAA;IACZ,IAAI,CAAC3H,gBAAgB,IAAI,CAACuC,iBAAiB,EAAE;MACzCd,mBAAmB,CAAC,IAAI,CAAC;MACzB;IACJ;IAEA,MAAMmG,SAAS,IAAAD,iBAAA,GAAGjH,QAAQ,CAACmC,OAAO,cAAA8E,iBAAA,uBAAhBA,iBAAA,CAAkBE,OAAO,CACvC3H,wBAAwB,IAAI,uDAChC,CAAC;IAED,IAAI0H,SAAS,EAAE;MACXnG,mBAAmB,CAACmG,SAAS,CAAC;MAC9B;IACJ;IAEA,IAAI,OAAOpD,QAAQ,KAAK,WAAW,EAAE;MACjC/C,mBAAmB,CAAC+C,QAAQ,CAACsD,IAAI,CAAC;IACtC;EACJ,CAAC,EAAE,CAAC9H,gBAAgB,EAAEE,wBAAwB,EAAEqC,iBAAiB,CAAC,CAAC;EAEnE,MAAMwF,aAAa,GACfvG,gBAAgB,IAAIxB,gBAAgB,gBAC9B,IAAAgI,sBAAY,eACR5K,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACjH,MAAA,CAAA+K,eAAe;IAACC,OAAO,EAAE;EAAM,GAC3B3F,iBAAiB,iBACdnF,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAAyK,0BAA0B;IACvBrF,GAAG,EAAC,wBAAwB;IAC5BsF,OAAO,EAAE;MAAEC,OAAO,EAAE;IAAE,CAAE;IACxBC,IAAI,EAAE;MAAED,OAAO,EAAE;IAAE,CAAE;IACrBH,OAAO,EAAE;MAAEG,OAAO,EAAE;IAAE,CAAE;IACxBhE,OAAO,EAAEO;EAAmB,CAC/B,CAEQ,CAAC,EAClBpD,gBACJ,CAAC,GACD,IAAI;EAEd,oBACIpE,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAAA/G,OAAA,CAAAS,OAAA,CAAA0K,QAAA,QACKR,aAAa,eACd3K,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAA8K,mBAAmB;IAACC,SAAS,EAAC;EAA4B,gBACvDrL,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACjH,MAAA,CAAA+K,eAAe;IAACC,OAAO,EAAE;EAAM,GAC3B3F,iBAAiB,iBACdnF,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAAgL,8BAA8B;IAC3BC,GAAG,EAAEjI,QAAS;IACd0H,OAAO,EAAE;MACLQ,MAAM,EAAE,MAAM;MACdP,OAAO,EAAE,CAAC;MACVQ,CAAC,EAAEzH;IACP,CAAE;IACFqH,SAAS,EAAC,oBAAoB;IAC9BH,IAAI,EAAE;MAAEM,MAAM,EAAE,CAAC;MAAEP,OAAO,EAAE;IAAE,CAAE;IAChCH,OAAO,EAAE;MAAEU,MAAM,EAAE,CAAC;MAAEP,OAAO,EAAE;IAAE,CAAE;IACnCS,eAAe,EAAE/I,cAAe;IAChCmH,WAAW,EAAElH,gBAAiB;IAC9B+I,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAK,CAAE;IAC/B5F,QAAQ,EAAE;EAAE,GAEXpD,gBAAgB,IACbD,cAAc,KAAKiF,0CAA2B,CAACiE,GAAG,IAClDrC,UAAU,eACdxJ,OAAA,CAAAS,OAAA,CAAAsG,aAAA,CAACzG,cAAA,CAAAwL,2BAA2B;IAACP,GAAG,EAAE/H;EAAQ,GACrCqD,KACwB,CAAC,EAC7BjE,gBAAgB,IACbD,cAAc,KAAKiF,0CAA2B,CAACC,MAAM,IACrD2B,UACwB,CAEvB,CACA,CACvB,CAAC;AAEX,CAAC;AAEDjH,aAAa,CAACwJ,WAAW,GAAG,eAAe;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAxL,OAAA,GAE7B8B,aAAa","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"MentionFinder.js","names":["_react","require","_react2","_interopRequireWildcard","_reactDom","_mentionFinder","_MentionFinderItem","_interopRequireDefault","_MentionFinder","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DRAG_CLOSE_THRESHOLD_IN_PX","isTextInputElement","element","tagName","toLowerCase","type","isContentEditable","findTouchByIdentifier","touchList","identifier","length","touch","item","MentionFinder","inputValue","members","onSelect","popupAlignment","enableDragHandle","dragCloseThresholdInPx","overlayContainerSelector","activeMember","setActiveMember","useState","focusedIndex","setFocusedIndex","shouldShowPopup","setShouldShowPopup","popupRef","useRef","listRef","inputElementRef","dragStartYRef","hasTriggeredDragCloseRef","activePointerIdRef","activeTouchIdRef","isDraggingHandle","setIsDraggingHandle","dragOffset","setDragOffset","dragProgress","setDragProgress","overlayContainer","setOverlayContainer","fullMatch","searchString","useMemo","_regExpMatchArray$","regExpMatchArray","match","filteredMembers","filter","id","info","name","includes","replace","shouldRenderPopup","handleContainerBlur","useCallback","event","_popupRef$current","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","current","handleKeyDown","targetElement","target","key","_listRef$current","preventDefault","children","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","window","requestAnimationFrame","_inputElementRef$curr","handleMemberClick","handleMemberHover","useEffect","isActiveMemberShown","some","items","map","createElement","isActive","onClick","onHover","activeElement","document","addEventListener","removeEventListener","closePopupViaDrag","handleOverlayClick","updateDragByClientY","clientY","closingDirectionMultiplier","MentionFinderPopupAlignment","Bottom","rawDelta","normalizedDelta","positiveDelta","Math","max","limitedDelta","min","handleDragPointerDown","pointerType","button","pointerId","setPointerCapture","handleDragPointerMove","hasClosed","releasePointerCapture","resetDragState","shouldClose","handleDragPointerUp","handleDragPointerCancel","handleDragTouchStart","touches","handleDragTouchMove","changedTouches","handleDragTouchEnd","handleDragTouchCancel","dragHandle","StyledMentionFinderDragHandle","$alignment","StyledMentionFinderDragHandleInner","$dragOffset","$dragProgress","$isDragging","onPointerDown","onPointerMove","onPointerUp","onPointerCancel","onTouchStart","onTouchMove","onTouchEnd","onTouchCancel","_popupRef$current2","container","closest","body","overlayPortal","createPortal","AnimatePresence","initial","StyledMentionFinderOverlay","animate","opacity","exit","Fragment","StyledMentionFinder","className","onBlur","StyledMotionMentionFinderPopup","ref","height","y","$popupAlignment","transition","duration","Top","StyledMentionFinderItemList","displayName","_default","exports"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n FC,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n PointerEvent,\n TouchList,\n TouchEvent,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport {\n StyledMentionFinder,\n StyledMentionFinderDragHandle,\n StyledMentionFinderDragHandleInner,\n StyledMentionFinderItemList,\n StyledMentionFinderOverlay,\n StyledMotionMentionFinderPopup,\n} from './MentionFinder.styles';\n\nexport type MentionMember = {\n id: string;\n info?: string;\n imageUrl: string;\n name: string;\n shouldShowRoundImage?: boolean;\n};\n\nexport type MentionFinderProps = {\n /**\n * The text from the input field\n */\n inputValue: string;\n /**\n * Members that can be selected\n */\n members: MentionMember[];\n /**\n * Function to be executed when a member is selected\n */\n onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n /**\n * Alignment of the popup\n */\n popupAlignment: MentionFinderPopupAlignment;\n /**\n * Enables the optional drag handle inside the popup\n */\n enableDragHandle?: boolean;\n /**\n * Threshold in pixels to drag to close the popup\n */\n dragCloseThresholdInPx?: number;\n /**\n * Selector for the container to render the overlay into (defaults to closest dialog, thread, page provider or tapp)\n */\n overlayContainerSelector?: string;\n};\n\nconst DRAG_CLOSE_THRESHOLD_IN_PX = 60;\n\nconst isTextInputElement = (\n element: HTMLElement | null,\n): element is HTMLInputElement | HTMLTextAreaElement => {\n if (!element) {\n return false;\n }\n\n const tagName = element.tagName.toLowerCase();\n\n return (\n (tagName === 'input' && (element as HTMLInputElement).type !== 'button') ||\n tagName === 'textarea' ||\n element.isContentEditable\n );\n};\n\nconst findTouchByIdentifier = (touchList: TouchList, identifier: number | null) => {\n if (identifier === null) {\n return null;\n }\n\n for (let i = 0; i < touchList.length; i += 1) {\n const touch = touchList.item(i);\n if (touch && touch.identifier === identifier) {\n return touch;\n }\n }\n\n return null;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n inputValue,\n members,\n onSelect,\n popupAlignment,\n enableDragHandle = false,\n dragCloseThresholdInPx = DRAG_CLOSE_THRESHOLD_IN_PX,\n overlayContainerSelector,\n}) => {\n const [activeMember, setActiveMember] = useState(members[0]);\n const [focusedIndex, setFocusedIndex] = useState(0);\n const [shouldShowPopup, setShouldShowPopup] = useState(true);\n\n const popupRef = useRef<HTMLDivElement>(null);\n const listRef = useRef<HTMLDivElement>(null);\n const inputElementRef = useRef<HTMLElement | null>(null);\n const dragStartYRef = useRef<number | null>(null);\n const hasTriggeredDragCloseRef = useRef(false);\n const activePointerIdRef = useRef<number | null>(null);\n const activeTouchIdRef = useRef<number | null>(null);\n\n const [isDraggingHandle, setIsDraggingHandle] = useState(false);\n const [dragOffset, setDragOffset] = useState(0);\n const [dragProgress, setDragProgress] = useState(0);\n const [overlayContainer, setOverlayContainer] = useState<Element | null>(null);\n\n const [fullMatch, searchString] = useMemo(() => {\n // eslint-disable-next-line no-irregular-whitespace\n const regExpMatchArray = inputValue.match(/@(?!\\s)([^\\s]*)/);\n\n return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n }, [inputValue]);\n\n const filteredMembers = useMemo(\n () =>\n searchString !== ''\n ? members.filter(\n ({ id, info, name }) =>\n id.toLowerCase().includes(searchString) ||\n info?.replace('chayns', '').toLowerCase().includes(searchString) ||\n name.toLowerCase().includes(searchString),\n )\n : members,\n [members, searchString],\n );\n\n const shouldRenderPopup = shouldShowPopup && !!fullMatch && filteredMembers.length > 0;\n\n const handleContainerBlur = useCallback((event: React.FocusEvent<HTMLDivElement>) => {\n const nextFocusedElement = event.relatedTarget as Node | null;\n const currentContainer = event.currentTarget as HTMLElement;\n\n if (\n !nextFocusedElement ||\n (!currentContainer.contains(nextFocusedElement) &&\n !popupRef.current?.contains(nextFocusedElement))\n ) {\n setShouldShowPopup(false);\n }\n }, []);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n const targetElement = event.target as HTMLElement | null;\n\n if (isTextInputElement(targetElement)) {\n inputElementRef.current = targetElement;\n }\n\n if ((event.key === 'ArrowUp' || event.key === 'ArrowDown') && shouldRenderPopup) {\n event.preventDefault();\n\n const children = listRef.current?.children;\n\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex +\n (event.key === 'ArrowUp' ? -1 : 1) +\n children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const member = filteredMembers[newIndex];\n\n setActiveMember(member);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (event.key === 'Enter' && shouldRenderPopup) {\n event.preventDefault();\n event.stopPropagation();\n\n if (fullMatch && activeMember) {\n onSelect({ fullMatch, member: activeMember });\n }\n } else if (event.key === 'Escape' && shouldRenderPopup) {\n event.preventDefault();\n event.stopPropagation();\n setShouldShowPopup(false);\n\n window.requestAnimationFrame(() => {\n inputElementRef.current?.focus();\n });\n }\n },\n [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect, shouldRenderPopup],\n );\n\n const handleMemberClick = useCallback(\n (member: MentionMember) => {\n if (fullMatch) {\n onSelect({ fullMatch, member });\n }\n },\n [fullMatch, onSelect],\n );\n\n const handleMemberHover = useCallback((member: MentionMember) => {\n setActiveMember(member);\n }, []);\n\n useEffect(() => {\n if (filteredMembers.length > 0) {\n const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n if (!isActiveMemberShown) {\n setActiveMember(filteredMembers[0]);\n }\n }\n }, [activeMember?.id, filteredMembers]);\n\n const items = useMemo(\n () =>\n filteredMembers.map((member) => (\n <MentionFinderItem\n isActive={member.id === activeMember?.id}\n key={member.id}\n member={member}\n onClick={handleMemberClick}\n onHover={handleMemberHover}\n />\n )),\n [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n );\n\n useEffect(() => {\n setDragOffset(0);\n setDragProgress(0);\n hasTriggeredDragCloseRef.current = false;\n setShouldShowPopup(true);\n }, [inputValue]);\n\n useEffect(() => {\n if (!shouldRenderPopup) {\n return;\n }\n\n const activeElement = document.activeElement as HTMLElement | null;\n\n if (isTextInputElement(activeElement)) {\n inputElementRef.current = activeElement;\n }\n }, [shouldRenderPopup]);\n\n useEffect(() => {\n if (shouldShowPopup) {\n window.addEventListener('keydown', handleKeyDown, true);\n }\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown, true);\n };\n }, [handleKeyDown, shouldShowPopup]);\n\n const closePopupViaDrag = useCallback(() => {\n if (hasTriggeredDragCloseRef.current) {\n return;\n }\n hasTriggeredDragCloseRef.current = true;\n setDragOffset(0);\n setDragProgress(0);\n setShouldShowPopup(false);\n }, []);\n\n const handleOverlayClick = useCallback(() => {\n closePopupViaDrag();\n }, [closePopupViaDrag]);\n\n const updateDragByClientY = useCallback(\n (clientY: number) => {\n if (dragStartYRef.current === null) {\n return false;\n }\n\n const closingDirectionMultiplier =\n popupAlignment === MentionFinderPopupAlignment.Bottom ? -1 : 1;\n const rawDelta = clientY - dragStartYRef.current;\n const normalizedDelta = rawDelta * closingDirectionMultiplier;\n const positiveDelta = Math.max(0, normalizedDelta);\n const limitedDelta = Math.min(positiveDelta, dragCloseThresholdInPx);\n\n setDragOffset(limitedDelta * closingDirectionMultiplier);\n setDragProgress(Math.min(positiveDelta / dragCloseThresholdInPx, 1));\n\n if (positiveDelta >= dragCloseThresholdInPx) {\n dragStartYRef.current = null;\n setIsDraggingHandle(false);\n closePopupViaDrag();\n return true;\n }\n\n return false;\n },\n [closePopupViaDrag, dragCloseThresholdInPx, popupAlignment],\n );\n\n const handleDragPointerDown = useCallback((event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch') {\n return;\n }\n if (event.pointerType === 'mouse' && event.button !== 0) {\n return;\n }\n if (dragStartYRef.current !== null) {\n return;\n }\n activePointerIdRef.current = event.pointerId;\n dragStartYRef.current = event.clientY;\n hasTriggeredDragCloseRef.current = false;\n setDragOffset(0);\n setDragProgress(0);\n setIsDraggingHandle(true);\n event.currentTarget.setPointerCapture(event.pointerId);\n event.stopPropagation();\n }, []);\n\n const handleDragPointerMove = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n if (dragStartYRef.current === null) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const hasClosed = updateDragByClientY(event.clientY);\n\n if (hasClosed) {\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n }\n },\n [updateDragByClientY],\n );\n\n const resetDragState = useCallback(\n (shouldClose = false) => {\n dragStartYRef.current = null;\n setIsDraggingHandle(false);\n if (shouldClose) {\n closePopupViaDrag();\n } else {\n setDragOffset(0);\n setDragProgress(0);\n }\n },\n [closePopupViaDrag],\n );\n\n const handleDragPointerUp = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n event.stopPropagation();\n const shouldClose = dragProgress >= 1;\n resetDragState(shouldClose);\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n },\n [dragProgress, resetDragState],\n );\n\n const handleDragPointerCancel = useCallback(\n (event: PointerEvent<HTMLDivElement>) => {\n if (event.pointerType === 'touch' || activePointerIdRef.current !== event.pointerId) {\n return;\n }\n event.stopPropagation();\n resetDragState();\n event.currentTarget.releasePointerCapture(event.pointerId);\n activePointerIdRef.current = null;\n },\n [resetDragState],\n );\n\n const handleDragTouchStart = useCallback((event: TouchEvent<HTMLDivElement>) => {\n if (event.touches.length === 0 || dragStartYRef.current !== null) {\n return;\n }\n\n const touch = event.touches[0];\n\n if (!touch) return;\n\n activeTouchIdRef.current = touch.identifier;\n dragStartYRef.current = touch.clientY;\n hasTriggeredDragCloseRef.current = false;\n setDragOffset(0);\n setDragProgress(0);\n setIsDraggingHandle(true);\n event.preventDefault();\n event.stopPropagation();\n }, []);\n\n const handleDragTouchMove = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (dragStartYRef.current === null || activeTouchIdRef.current === null) {\n return;\n }\n const touch =\n findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current) ??\n findTouchByIdentifier(event.touches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n const hasClosed = updateDragByClientY(touch.clientY);\n if (hasClosed) {\n activeTouchIdRef.current = null;\n }\n },\n [updateDragByClientY],\n );\n\n const handleDragTouchEnd = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (activeTouchIdRef.current === null) return;\n\n const touch = findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n activeTouchIdRef.current = null;\n const shouldClose = dragProgress >= 1;\n resetDragState(shouldClose);\n },\n [dragProgress, resetDragState],\n );\n\n const handleDragTouchCancel = useCallback(\n (event: TouchEvent<HTMLDivElement>) => {\n if (activeTouchIdRef.current === null) return;\n\n const touch = findTouchByIdentifier(event.changedTouches, activeTouchIdRef.current);\n\n if (!touch) return;\n\n event.preventDefault();\n event.stopPropagation();\n activeTouchIdRef.current = null;\n resetDragState();\n },\n [resetDragState],\n );\n\n const dragHandle = useMemo(() => {\n if (!enableDragHandle) {\n return null;\n }\n\n return (\n <StyledMentionFinderDragHandle $alignment={popupAlignment}>\n <StyledMentionFinderDragHandleInner\n $alignment={popupAlignment}\n $dragOffset={dragOffset}\n $dragProgress={dragProgress}\n $isDragging={isDraggingHandle}\n onPointerDown={handleDragPointerDown}\n onPointerMove={handleDragPointerMove}\n onPointerUp={handleDragPointerUp}\n onPointerCancel={handleDragPointerCancel}\n onTouchStart={handleDragTouchStart}\n onTouchMove={handleDragTouchMove}\n onTouchEnd={handleDragTouchEnd}\n onTouchCancel={handleDragTouchCancel}\n />\n </StyledMentionFinderDragHandle>\n );\n }, [\n enableDragHandle,\n popupAlignment,\n dragOffset,\n dragProgress,\n isDraggingHandle,\n handleDragPointerDown,\n handleDragPointerMove,\n handleDragPointerUp,\n handleDragPointerCancel,\n handleDragTouchStart,\n handleDragTouchMove,\n handleDragTouchEnd,\n handleDragTouchCancel,\n ]);\n\n useEffect(() => {\n if (!enableDragHandle || !shouldRenderPopup) {\n setOverlayContainer(null);\n return;\n }\n\n const container = popupRef.current?.closest(\n overlayContainerSelector ?? '.dialog-inner, .chayns-threads, .page-provider, .tapp',\n );\n\n if (container) {\n setOverlayContainer(container);\n return;\n }\n\n if (typeof document !== 'undefined') {\n setOverlayContainer(document.body);\n }\n }, [enableDragHandle, overlayContainerSelector, shouldRenderPopup]);\n\n const overlayPortal =\n overlayContainer && enableDragHandle\n ? createPortal(\n <AnimatePresence initial={false}>\n {shouldRenderPopup && (\n <StyledMentionFinderOverlay\n key=\"mention-finder-overlay\"\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n onClick={handleOverlayClick}\n />\n )}\n </AnimatePresence>,\n overlayContainer,\n )\n : null;\n\n return (\n <>\n {overlayPortal}\n <StyledMentionFinder\n className=\"beta-chayns-mention-finder\"\n onBlur={handleContainerBlur}\n >\n <AnimatePresence initial={false}>\n {shouldRenderPopup && (\n <StyledMotionMentionFinderPopup\n ref={popupRef}\n animate={{\n height: 'auto',\n opacity: 1,\n y: dragOffset,\n }}\n className=\"prevent-lose-focus\"\n exit={{ height: 0, opacity: 0 }}\n initial={{ height: 0, opacity: 0 }}\n $popupAlignment={popupAlignment}\n $isDragging={enableDragHandle}\n transition={{ duration: 0.15 }}\n tabIndex={0}\n >\n {enableDragHandle &&\n popupAlignment === MentionFinderPopupAlignment.Top &&\n dragHandle}\n <StyledMentionFinderItemList ref={listRef}>\n {items}\n </StyledMentionFinderItemList>\n {enableDragHandle &&\n popupAlignment === MentionFinderPopupAlignment.Bottom &&\n dragHandle}\n </StyledMotionMentionFinderPopup>\n )}\n </AnimatePresence>\n </StyledMentionFinder>\n </>\n );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -16,6 +16,12 @@ const StyledMultiActionButton = exports.StyledMultiActionButton = (0, _styledCom
|
|
|
16
16
|
position: relative;
|
|
17
17
|
transition: width 0.2s ease;
|
|
18
18
|
width: fit-content;
|
|
19
|
+
|
|
20
|
+
/* Keep normal clipping, but let focus-ring paint outside while focused. */
|
|
21
|
+
&:focus-within {
|
|
22
|
+
overflow: visible;
|
|
23
|
+
z-index: 1;
|
|
24
|
+
}
|
|
19
25
|
`;
|
|
20
26
|
const StyledSeparator = exports.StyledSeparator = _styledComponents.default.span`
|
|
21
27
|
align-self: stretch;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiActionButton.styles.js","names":["_react","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledMultiActionButton","exports","styled","motion","div","StyledSeparator","span","$gapColor","theme","$isHidden"],"sources":["../../../../src/components/multi-action-button/MultiActionButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMultiActionButton = styled(motion.div)`\n align-items: stretch;\n display: inline-flex;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n position: relative;\n transition: width 0.2s ease;\n width: fit-content;\n`;\n\ntype StyledSeparatorProps = WithTheme<{\n $gapColor?: string;\n $isHidden?: boolean;\n}>;\n\nexport const StyledSeparator = styled.span<StyledSeparatorProps>`\n align-self: stretch;\n background: ${({ $gapColor, theme }) => $gapColor || theme?.['cw-body-background'] || '#fff'};\n flex: 0 0 ${({ $isHidden }) => ($isHidden ? 0 : 1)}px;\n opacity: ${({ $isHidden }) => ($isHidden ? 0 : 1)};\n overflow: hidden;\n transition:\n flex-basis 0.2s ease,\n opacity 0.2s ease,\n width 0.2s ease;\n width: ${({ $isHidden }) => ($isHidden ? 0 : 1)}px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGhC,MAAMG,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAG,IAAAE,yBAAM,EAACC,aAAM,CAACC,GAAG,CAAC;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOM,MAAMC,eAAe,GAAAJ,OAAA,CAAAI,eAAA,GAAGH,yBAAM,CAACI,IAA0B;AAChE;AACA,kBAAkB,CAAC;EAAEC,SAAS;EAAEC;AAAM,CAAC,KAAKD,SAAS,KAAIC,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAG,oBAAoB,CAAC,KAAI,MAAM;AAChG,gBAAgB,CAAC;EAAEC;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACtD,eAAe,CAAC;EAAEA;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACrD;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEA;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACnD,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"MultiActionButton.styles.js","names":["_react","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledMultiActionButton","exports","styled","motion","div","StyledSeparator","span","$gapColor","theme","$isHidden"],"sources":["../../../../src/components/multi-action-button/MultiActionButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMultiActionButton = styled(motion.div)`\n align-items: stretch;\n display: inline-flex;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n position: relative;\n transition: width 0.2s ease;\n width: fit-content;\n\n /* Keep normal clipping, but let focus-ring paint outside while focused. */\n &:focus-within {\n overflow: visible;\n z-index: 1;\n }\n`;\n\ntype StyledSeparatorProps = WithTheme<{\n $gapColor?: string;\n $isHidden?: boolean;\n}>;\n\nexport const StyledSeparator = styled.span<StyledSeparatorProps>`\n align-self: stretch;\n background: ${({ $gapColor, theme }) => $gapColor || theme?.['cw-body-background'] || '#fff'};\n flex: 0 0 ${({ $isHidden }) => ($isHidden ? 0 : 1)}px;\n opacity: ${({ $isHidden }) => ($isHidden ? 0 : 1)};\n overflow: hidden;\n transition:\n flex-basis 0.2s ease,\n opacity 0.2s ease,\n width 0.2s ease;\n width: ${({ $isHidden }) => ($isHidden ? 0 : 1)}px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGhC,MAAMG,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAG,IAAAE,yBAAM,EAACC,aAAM,CAACC,GAAG,CAAC;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOM,MAAMC,eAAe,GAAAJ,OAAA,CAAAI,eAAA,GAAGH,yBAAM,CAACI,IAA0B;AAChE;AACA,kBAAkB,CAAC;EAAEC,SAAS;EAAEC;AAAM,CAAC,KAAKD,SAAS,KAAIC,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAG,oBAAoB,CAAC,KAAI,MAAM;AAChG,gBAAgB,CAAC;EAAEC;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACtD,eAAe,CAAC;EAAEA;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACrD;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEA;AAAU,CAAC,KAAMA,SAAS,GAAG,CAAC,GAAG,CAAE;AACnD,CAAC","ignoreList":[]}
|
|
@@ -381,6 +381,17 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
381
381
|
(_tagInputRef$current = tagInputRef.current) === null || _tagInputRef$current === void 0 || _tagInputRef$current.blur();
|
|
382
382
|
return hasFocusRef.current && isTouch;
|
|
383
383
|
}, [isTouch]);
|
|
384
|
+
const handleContainerBlur = (0, _react.useCallback)(event => {
|
|
385
|
+
var _contentRef$current;
|
|
386
|
+
const nextFocusedElement = event.relatedTarget;
|
|
387
|
+
const currentContainer = event.currentTarget;
|
|
388
|
+
|
|
389
|
+
// Check if focus is moving outside the SearchBox container
|
|
390
|
+
// Also check the dropdown content (contentRef) since it's rendered in a portal
|
|
391
|
+
if (!nextFocusedElement || !currentContainer.contains(nextFocusedElement) && !((_contentRef$current = contentRef.current) !== null && _contentRef$current !== void 0 && _contentRef$current.contains(nextFocusedElement))) {
|
|
392
|
+
handleClose();
|
|
393
|
+
}
|
|
394
|
+
}, [handleClose]);
|
|
384
395
|
|
|
385
396
|
/**
|
|
386
397
|
* This function handles the item selection
|
|
@@ -457,11 +468,11 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
457
468
|
}, [hintText, matchingListsItems, shouldAddInputToList, inputToListValue, value, hasMultipleGroups, shouldShowRoundImage, handleSelect]);
|
|
458
469
|
(0, _react.useEffect)(() => {
|
|
459
470
|
const handleKeyDown = e => {
|
|
460
|
-
var _contentRef$
|
|
471
|
+
var _contentRef$current2, _childrenArray$find;
|
|
461
472
|
if (!shouldShowBody || matchingListsItems.length === 0) {
|
|
462
473
|
return;
|
|
463
474
|
}
|
|
464
|
-
const children = (_contentRef$
|
|
475
|
+
const children = (_contentRef$current2 = contentRef.current) === null || _contentRef$current2 === void 0 ? void 0 : _contentRef$current2.children;
|
|
465
476
|
if (!children) {
|
|
466
477
|
return;
|
|
467
478
|
}
|
|
@@ -549,7 +560,8 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
549
560
|
const shouldShowDropdown = shouldShowBody && (matchingListsItems.length !== 0 || !!hintText) && (value.trim() !== '' || shouldShowContentOnEmptyInput);
|
|
550
561
|
return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_SearchBox.StyledSearchBox, {
|
|
551
562
|
ref: boxRef,
|
|
552
|
-
key: `search-box-${uuid}
|
|
563
|
+
key: `search-box-${uuid}`,
|
|
564
|
+
onBlur: handleContainerBlur
|
|
553
565
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
554
566
|
id: `search_box_input${uuid}`
|
|
555
567
|
}, tagInputSettings ? /*#__PURE__*/_react.default.createElement(_TagInput.default, {
|