@bigbinary/neeto-molecules 3.9.17 → 3.10.1
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/README.md +1 -0
- package/dist/FinderModal.js +245 -0
- package/dist/FinderModal.js.map +1 -0
- package/dist/cjs/FinderModal.js +247 -0
- package/dist/cjs/FinderModal.js.map +1 -0
- package/package.json +1 -1
- package/src/translations/en.json +5 -0
- package/types/FinderModal.d.ts +65 -0
package/README.md
CHANGED
|
@@ -37,6 +37,7 @@ https://neeto-molecules.neeto.com/
|
|
|
37
37
|
- [EmojiReactions](./docs/components/EmojiReactions.md)
|
|
38
38
|
- [ErrorPage](./docs/components/ErrorPage.md)
|
|
39
39
|
- [FileUpload](./docs/components/FileUpload.md)
|
|
40
|
+
- [FinderModal](./docs/components/FinderModal.md)
|
|
40
41
|
- [FloatingActionMenu](./docs/components/FloatingActionMenu.md)
|
|
41
42
|
- [GoogleFontPicker](./docs/components/GoogleFontPicker.md)
|
|
42
43
|
- [Header](./docs/components/Header.md)
|
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
3
|
+
import { useRef } from 'react';
|
|
4
|
+
import { isNotPresent, humanize, noop } from '@bigbinary/neeto-cist';
|
|
5
|
+
import useHotkeys from '@bigbinary/neeto-hotkeys';
|
|
6
|
+
import Modal from '@bigbinary/neetoui/Modal';
|
|
7
|
+
import Typography from '@bigbinary/neetoui/Typography';
|
|
8
|
+
import { Link as Link$1 } from 'react-router-dom';
|
|
9
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
|
+
import Down from '@bigbinary/neeto-icons/Down';
|
|
11
|
+
import Up from '@bigbinary/neeto-icons/Up';
|
|
12
|
+
import { prop } from 'ramda';
|
|
13
|
+
import { useTranslation } from 'react-i18next';
|
|
14
|
+
import { withT } from '@bigbinary/neeto-commons-frontend/react-utils';
|
|
15
|
+
import Button from '@bigbinary/neetoui/Button';
|
|
16
|
+
import Spinner from '@bigbinary/neetoui/Spinner';
|
|
17
|
+
import Search from './Search.js';
|
|
18
|
+
import '@babel/runtime/helpers/slicedToArray';
|
|
19
|
+
import '@bigbinary/neeto-commons-frontend/react-utils/useFuncDebounce';
|
|
20
|
+
import '@bigbinary/neeto-commons-frontend/react-utils/useQueryParams';
|
|
21
|
+
import '@bigbinary/neeto-commons-frontend/react-utils/useUpdateEffect';
|
|
22
|
+
import '@bigbinary/neeto-commons-frontend/utils/general';
|
|
23
|
+
import '@bigbinary/neeto-icons/Search';
|
|
24
|
+
import '@bigbinary/neetoui/Input';
|
|
25
|
+
import './inject-css-DmrvuTKK.js';
|
|
26
|
+
import '@bigbinary/neeto-commons-frontend/utils';
|
|
27
|
+
|
|
28
|
+
var _excluded$1 = ["to", "children"];
|
|
29
|
+
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
30
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
31
|
+
var Link = function Link(_ref) {
|
|
32
|
+
var to = _ref.to,
|
|
33
|
+
children = _ref.children,
|
|
34
|
+
rest = _objectWithoutProperties(_ref, _excluded$1);
|
|
35
|
+
var url = new URL(to);
|
|
36
|
+
url.host = "";
|
|
37
|
+
return /*#__PURE__*/jsx(Link$1, _objectSpread$1(_objectSpread$1({}, rest), {}, {
|
|
38
|
+
to: url.pathname,
|
|
39
|
+
children: children
|
|
40
|
+
}));
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
var minMax = function minMax(number) {
|
|
44
|
+
var max = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Number.POSITIVE_INFINITY;
|
|
45
|
+
var min = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
46
|
+
return Math.min(max, Math.max(min, number));
|
|
47
|
+
};
|
|
48
|
+
var htmlToText = function htmlToText(html) {
|
|
49
|
+
var tmp = document.createElement("div");
|
|
50
|
+
tmp.innerHTML = html;
|
|
51
|
+
return tmp.textContent || tmp.innerText || "";
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
var ModalBody = function ModalBody(_ref) {
|
|
55
|
+
var containerRef = _ref.containerRef,
|
|
56
|
+
data = _ref.data,
|
|
57
|
+
iconComponentMap = _ref.iconComponentMap,
|
|
58
|
+
onClose = _ref.onClose;
|
|
59
|
+
return /*#__PURE__*/jsx(Modal.Body, {
|
|
60
|
+
className: "h-96 overflow-y-auto px-4 py-6",
|
|
61
|
+
children: /*#__PURE__*/jsx("div", {
|
|
62
|
+
className: "space-y-4",
|
|
63
|
+
ref: containerRef,
|
|
64
|
+
children: Object.keys(data).map(function (key) {
|
|
65
|
+
if (isNotPresent(data[key])) return null;
|
|
66
|
+
return /*#__PURE__*/jsxs("div", {
|
|
67
|
+
className: "w-full",
|
|
68
|
+
children: [/*#__PURE__*/jsx(Typography, {
|
|
69
|
+
className: "neeto-ui-text-gray-700 mb-2",
|
|
70
|
+
style: "h6",
|
|
71
|
+
textTransform: "uppercase",
|
|
72
|
+
children: humanize(key)
|
|
73
|
+
}), /*#__PURE__*/jsx("div", {
|
|
74
|
+
className: "w-full",
|
|
75
|
+
children: data[key].map(function (item) {
|
|
76
|
+
var _ref2, _item$content;
|
|
77
|
+
var Icon = iconComponentMap[key] || iconComponentMap["default"];
|
|
78
|
+
return /*#__PURE__*/jsxs(Link, {
|
|
79
|
+
className: "neeto-molecules-search-result-item hover:neeto-ui-bg-gray-100 focus:neeto-ui-bg-gray-100 neeto-ui-rounded flex w-full cursor-pointer items-center gap-2 p-2 text-xs",
|
|
80
|
+
to: item.url,
|
|
81
|
+
onClick: onClose,
|
|
82
|
+
children: [/*#__PURE__*/jsx(Icon, {
|
|
83
|
+
className: "neeto-ui-text-gray-600 min-w-fit",
|
|
84
|
+
size: 16
|
|
85
|
+
}), /*#__PURE__*/jsx(Typography, {
|
|
86
|
+
className: "neeto-ui-text-gray-800 line-clamp-1",
|
|
87
|
+
component: "span",
|
|
88
|
+
style: "body3",
|
|
89
|
+
children: htmlToText((_ref2 = (_item$content = item.content) !== null && _item$content !== void 0 ? _item$content : item.body) !== null && _ref2 !== void 0 ? _ref2 : item.name)
|
|
90
|
+
})]
|
|
91
|
+
}, item.id);
|
|
92
|
+
})
|
|
93
|
+
})]
|
|
94
|
+
}, key);
|
|
95
|
+
})
|
|
96
|
+
})
|
|
97
|
+
});
|
|
98
|
+
};
|
|
99
|
+
|
|
100
|
+
var ModalFooter = function ModalFooter(_ref) {
|
|
101
|
+
var enableAdvancedSearch = _ref.enableAdvancedSearch;
|
|
102
|
+
var _useTranslation = useTranslation(),
|
|
103
|
+
t = _useTranslation.t;
|
|
104
|
+
var shortcuts = [{
|
|
105
|
+
label: t("neetoMolecules.finderModal.advancedSearch"),
|
|
106
|
+
keys: ["Cmd/Ctrl", "Return"],
|
|
107
|
+
isVisible: enableAdvancedSearch
|
|
108
|
+
}, {
|
|
109
|
+
label: t("neetoMolecules.common.actions.open"),
|
|
110
|
+
keys: ["Return"],
|
|
111
|
+
isVisible: true
|
|
112
|
+
}, {
|
|
113
|
+
label: t("neetoMolecules.common.actions.move"),
|
|
114
|
+
keys: [/*#__PURE__*/jsx(Up, {
|
|
115
|
+
className: "neeto-ui-text-gray-800",
|
|
116
|
+
size: 12
|
|
117
|
+
}, "up"), /*#__PURE__*/jsx(Down, {
|
|
118
|
+
className: "neeto-ui-text-gray-800",
|
|
119
|
+
size: 12
|
|
120
|
+
}, "down")],
|
|
121
|
+
isVisible: true
|
|
122
|
+
}, {
|
|
123
|
+
label: t("neetoMolecules.common.actions.close"),
|
|
124
|
+
keys: ["Esc"],
|
|
125
|
+
isVisible: true
|
|
126
|
+
}];
|
|
127
|
+
return /*#__PURE__*/jsx(Modal.Footer, {
|
|
128
|
+
className: "neeto-ui-border-gray-300 border-t px-4 py-2",
|
|
129
|
+
children: /*#__PURE__*/jsx("div", {
|
|
130
|
+
className: "neeto-ui-text-xxs flex items-center justify-end gap-4",
|
|
131
|
+
children: shortcuts.filter(prop("isVisible")).map(function (_ref2, index) {
|
|
132
|
+
var label = _ref2.label,
|
|
133
|
+
keys = _ref2.keys;
|
|
134
|
+
return /*#__PURE__*/jsxs("div", {
|
|
135
|
+
className: "flex items-center gap-1",
|
|
136
|
+
children: [/*#__PURE__*/jsx(Typography, {
|
|
137
|
+
component: "span",
|
|
138
|
+
style: "nano",
|
|
139
|
+
children: label
|
|
140
|
+
}), keys.map(function (key, index) {
|
|
141
|
+
return /*#__PURE__*/jsx(Typography, {
|
|
142
|
+
className: "neeto-ui-bg-gray-200 neeto-ui-rounded-sm p-1",
|
|
143
|
+
component: "span",
|
|
144
|
+
style: "nano",
|
|
145
|
+
children: key
|
|
146
|
+
}, index);
|
|
147
|
+
})]
|
|
148
|
+
}, index);
|
|
149
|
+
})
|
|
150
|
+
})
|
|
151
|
+
});
|
|
152
|
+
};
|
|
153
|
+
|
|
154
|
+
var ModalHeader = withT(function (_ref) {
|
|
155
|
+
var t = _ref.t,
|
|
156
|
+
enableAdvancedSearch = _ref.enableAdvancedSearch,
|
|
157
|
+
loading = _ref.loading,
|
|
158
|
+
onSearch = _ref.onSearch,
|
|
159
|
+
onGoToAdvanced = _ref.onGoToAdvanced;
|
|
160
|
+
return /*#__PURE__*/jsx(Modal.Header, {
|
|
161
|
+
className: "border-b px-0 py-0",
|
|
162
|
+
children: /*#__PURE__*/jsx(Search, {
|
|
163
|
+
onSearch: onSearch,
|
|
164
|
+
nakedInput: true,
|
|
165
|
+
autoComplete: "off",
|
|
166
|
+
className: "px-4 py-1.5",
|
|
167
|
+
name: "term",
|
|
168
|
+
placeholder: t("neetoMolecules.common.actions.search"),
|
|
169
|
+
suffix: /*#__PURE__*/jsxs("div", {
|
|
170
|
+
className: "flex items-center gap-x-2 px-2",
|
|
171
|
+
children: [/*#__PURE__*/jsx("div", {
|
|
172
|
+
className: "h-3 w-3",
|
|
173
|
+
children: loading && /*#__PURE__*/jsx(Spinner, {
|
|
174
|
+
size: "small"
|
|
175
|
+
})
|
|
176
|
+
}), enableAdvancedSearch && /*#__PURE__*/jsx(Button, {
|
|
177
|
+
className: "ml-2 whitespace-nowrap",
|
|
178
|
+
label: t("neetoMolecules.finderModal.advancedSearch"),
|
|
179
|
+
size: "small",
|
|
180
|
+
style: "secondary",
|
|
181
|
+
onClick: onGoToAdvanced
|
|
182
|
+
})]
|
|
183
|
+
})
|
|
184
|
+
})
|
|
185
|
+
});
|
|
186
|
+
});
|
|
187
|
+
|
|
188
|
+
var _excluded = ["enableAdvancedSearch", "data", "iconComponentMap", "isFetching", "isOpen", "setSearchTerm", "onClose", "onGoToAdvanced"];
|
|
189
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
190
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
191
|
+
var FinderModal = function FinderModal(_ref) {
|
|
192
|
+
var _ref$enableAdvancedSe = _ref.enableAdvancedSearch,
|
|
193
|
+
enableAdvancedSearch = _ref$enableAdvancedSe === void 0 ? true : _ref$enableAdvancedSe,
|
|
194
|
+
data = _ref.data,
|
|
195
|
+
iconComponentMap = _ref.iconComponentMap,
|
|
196
|
+
isFetching = _ref.isFetching,
|
|
197
|
+
isOpen = _ref.isOpen,
|
|
198
|
+
setSearchTerm = _ref.setSearchTerm,
|
|
199
|
+
onClose = _ref.onClose,
|
|
200
|
+
_ref$onGoToAdvanced = _ref.onGoToAdvanced,
|
|
201
|
+
onGoToAdvanced = _ref$onGoToAdvanced === void 0 ? noop : _ref$onGoToAdvanced,
|
|
202
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
203
|
+
var containerRef = useRef();
|
|
204
|
+
var mutables = useRef({
|
|
205
|
+
focusIndex: -1
|
|
206
|
+
}).current;
|
|
207
|
+
var onFocusChange = function onFocusChange(offset) {
|
|
208
|
+
var container = containerRef.current;
|
|
209
|
+
var nodes = container.querySelectorAll("a.neeto-molecules-search-result-item");
|
|
210
|
+
mutables.focusIndex = minMax(mutables.focusIndex + offset, nodes.length - 1);
|
|
211
|
+
nodes[mutables.focusIndex].focus();
|
|
212
|
+
};
|
|
213
|
+
useHotkeys(["up", "down"], function (event) {
|
|
214
|
+
event.preventDefault();
|
|
215
|
+
if (event.code === "ArrowUp") onFocusChange(-1);else if (event.code === "ArrowDown") onFocusChange(1);
|
|
216
|
+
}, {
|
|
217
|
+
mode: "global"
|
|
218
|
+
});
|
|
219
|
+
useHotkeys(["ctrl+enter", "command+enter"], onGoToAdvanced, {
|
|
220
|
+
mode: "global",
|
|
221
|
+
enabled: enableAdvancedSearch
|
|
222
|
+
});
|
|
223
|
+
return /*#__PURE__*/jsxs(Modal, _objectSpread(_objectSpread({
|
|
224
|
+
isOpen: isOpen,
|
|
225
|
+
onClose: onClose,
|
|
226
|
+
closeButton: false
|
|
227
|
+
}, props), {}, {
|
|
228
|
+
children: [/*#__PURE__*/jsx(ModalHeader, {
|
|
229
|
+
enableAdvancedSearch: enableAdvancedSearch,
|
|
230
|
+
onGoToAdvanced: onGoToAdvanced,
|
|
231
|
+
loading: isFetching,
|
|
232
|
+
onSearch: setSearchTerm
|
|
233
|
+
}), /*#__PURE__*/jsx(ModalBody, {
|
|
234
|
+
containerRef: containerRef,
|
|
235
|
+
data: data,
|
|
236
|
+
iconComponentMap: iconComponentMap,
|
|
237
|
+
onClose: onClose
|
|
238
|
+
}), /*#__PURE__*/jsx(ModalFooter, {
|
|
239
|
+
enableAdvancedSearch: enableAdvancedSearch
|
|
240
|
+
})]
|
|
241
|
+
}));
|
|
242
|
+
};
|
|
243
|
+
|
|
244
|
+
export { FinderModal as default };
|
|
245
|
+
//# sourceMappingURL=FinderModal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FinderModal.js","sources":["../src/components/FinderModal/Link.jsx","../src/components/FinderModal/utils.js","../src/components/FinderModal/Body.jsx","../src/components/FinderModal/Footer.jsx","../src/components/FinderModal/Header.jsx","../src/components/FinderModal/index.jsx"],"sourcesContent":["import { Link as RRDLink } from \"react-router-dom\";\n\nconst Link = ({ to, children, ...rest }) => {\n const url = new URL(to);\n url.host = \"\";\n\n return (\n <RRDLink {...rest} to={url.pathname}>\n {children}\n </RRDLink>\n );\n};\n\nexport default Link;\n","export const minMax = (number, max = Number.POSITIVE_INFINITY, min = 0) =>\n Math.min(max, Math.max(min, number));\n\nexport const htmlToText = html => {\n const tmp = document.createElement(\"div\");\n tmp.innerHTML = html;\n\n return tmp.textContent || tmp.innerText || \"\";\n};\n","import { humanize, isNotPresent } from \"neetocist\";\nimport { Modal, Typography } from \"neetoui\";\n\nimport Link from \"./Link\";\nimport { htmlToText } from \"./utils\";\n\nconst ModalBody = ({ containerRef, data, iconComponentMap, onClose }) => (\n <Modal.Body className=\"h-96 overflow-y-auto px-4 py-6\">\n <div className=\"space-y-4\" ref={containerRef}>\n {Object.keys(data).map(key => {\n if (isNotPresent(data[key])) return null;\n\n return (\n <div className=\"w-full\" key={key}>\n <Typography\n className=\"neeto-ui-text-gray-700 mb-2\"\n style=\"h6\"\n textTransform=\"uppercase\"\n >\n {humanize(key)}\n </Typography>\n <div className=\"w-full\">\n {data[key].map(item => {\n const Icon = iconComponentMap[key] || iconComponentMap.default;\n\n return (\n <Link\n className=\"neeto-molecules-search-result-item hover:neeto-ui-bg-gray-100 focus:neeto-ui-bg-gray-100 neeto-ui-rounded flex w-full cursor-pointer items-center gap-2 p-2 text-xs\"\n key={item.id}\n to={item.url}\n onClick={onClose}\n >\n <Icon\n className=\"neeto-ui-text-gray-600 min-w-fit\"\n size={16}\n />\n <Typography\n className=\"neeto-ui-text-gray-800 line-clamp-1\"\n component=\"span\"\n style=\"body3\"\n >\n {htmlToText(item.content ?? item.body ?? item.name)}\n </Typography>\n </Link>\n );\n })}\n </div>\n </div>\n );\n })}\n </div>\n </Modal.Body>\n);\n\nexport default ModalBody;\n","import { Down, Up } from \"neetoicons\";\nimport { Modal, Typography } from \"neetoui\";\nimport { prop } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nconst ModalFooter = ({ enableAdvancedSearch }) => {\n const { t } = useTranslation();\n\n const shortcuts = [\n {\n label: t(\"neetoMolecules.finderModal.advancedSearch\"),\n keys: [\"Cmd/Ctrl\", \"Return\"],\n isVisible: enableAdvancedSearch,\n },\n {\n label: t(\"neetoMolecules.common.actions.open\"),\n keys: [\"Return\"],\n isVisible: true,\n },\n {\n label: t(\"neetoMolecules.common.actions.move\"),\n keys: [\n <Up className=\"neeto-ui-text-gray-800\" key=\"up\" size={12} />,\n <Down className=\"neeto-ui-text-gray-800\" key=\"down\" size={12} />,\n ],\n isVisible: true,\n },\n {\n label: t(\"neetoMolecules.common.actions.close\"),\n keys: [\"Esc\"],\n isVisible: true,\n },\n ];\n\n return (\n <Modal.Footer className=\"neeto-ui-border-gray-300 border-t px-4 py-2\">\n <div className=\"neeto-ui-text-xxs flex items-center justify-end gap-4\">\n {shortcuts.filter(prop(\"isVisible\")).map(({ label, keys }, index) => (\n <div className=\"flex items-center gap-1\" key={index}>\n <Typography component=\"span\" style=\"nano\">\n {label}\n </Typography>\n {keys.map((key, index) => (\n <Typography\n className=\"neeto-ui-bg-gray-200 neeto-ui-rounded-sm p-1\"\n component=\"span\"\n key={index}\n style=\"nano\"\n >\n {key}\n </Typography>\n ))}\n </div>\n ))}\n </div>\n </Modal.Footer>\n );\n};\n\nexport default ModalFooter;\n","import { withT } from \"neetocommons/react-utils\";\nimport { Button, Modal, Spinner } from \"neetoui\";\n\nimport Search from \"components/Search\";\n\nconst ModalHeader = withT(\n ({ t, enableAdvancedSearch, loading, onSearch, onGoToAdvanced }) => (\n <Modal.Header className=\"border-b px-0 py-0\">\n <Search\n {...{ onSearch }}\n nakedInput\n autoComplete=\"off\"\n className=\"px-4 py-1.5\"\n name=\"term\"\n placeholder={t(\"neetoMolecules.common.actions.search\")}\n suffix={\n <div className=\"flex items-center gap-x-2 px-2\">\n <div className=\"h-3 w-3\">{loading && <Spinner size=\"small\" />}</div>\n {enableAdvancedSearch && (\n <Button\n className=\"ml-2 whitespace-nowrap\"\n label={t(\"neetoMolecules.finderModal.advancedSearch\")}\n size=\"small\"\n style=\"secondary\"\n onClick={onGoToAdvanced}\n />\n )}\n </div>\n }\n />\n </Modal.Header>\n )\n);\n\nexport default ModalHeader;\n","import { useRef } from \"react\";\n\nimport { noop } from \"neetocist\";\nimport useHotkeys from \"neetohotkeys\";\nimport { Modal } from \"neetoui\";\nimport PropTypes from \"prop-types\";\n\nimport ModalBody from \"./Body\";\nimport ModalFooter from \"./Footer\";\nimport ModalHeader from \"./Header\";\nimport { minMax } from \"./utils\";\n\nconst FinderModal = ({\n enableAdvancedSearch = true,\n data,\n iconComponentMap,\n isFetching,\n isOpen,\n setSearchTerm,\n onClose,\n onGoToAdvanced = noop,\n ...props\n}) => {\n const containerRef = useRef();\n const mutables = useRef({ focusIndex: -1 }).current;\n\n const onFocusChange = offset => {\n const container = containerRef.current;\n const nodes = container.querySelectorAll(\n \"a.neeto-molecules-search-result-item\"\n );\n\n mutables.focusIndex = minMax(\n mutables.focusIndex + offset,\n nodes.length - 1\n );\n nodes[mutables.focusIndex].focus();\n };\n\n useHotkeys(\n [\"up\", \"down\"],\n event => {\n event.preventDefault();\n if (event.code === \"ArrowUp\") onFocusChange(-1);\n else if (event.code === \"ArrowDown\") onFocusChange(1);\n },\n { mode: \"global\" }\n );\n\n useHotkeys([\"ctrl+enter\", \"command+enter\"], onGoToAdvanced, {\n mode: \"global\",\n enabled: enableAdvancedSearch,\n });\n\n return (\n <Modal {...{ isOpen, onClose }} closeButton={false} {...props}>\n <ModalHeader\n {...{ enableAdvancedSearch, onGoToAdvanced }}\n loading={isFetching}\n onSearch={setSearchTerm}\n />\n <ModalBody {...{ containerRef, data, iconComponentMap, onClose }} />\n <ModalFooter {...{ enableAdvancedSearch }} />\n </Modal>\n );\n};\n\nFinderModal.propTypes = {\n /*\n Boolean to indicate decide whether to show advanced search button or not\n */\n enableAdvancedSearch: PropTypes.bool,\n /*\n Data to be displayed in the modal\n */\n data: PropTypes.objectOf(\n PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n url: PropTypes.string,\n content: PropTypes.string,\n body: PropTypes.string,\n name: PropTypes.string,\n })\n )\n ),\n /*\n Icon component map to render icons for each section\n */\n iconComponentMap: PropTypes.objectOf(PropTypes.elementType),\n /*\n Boolean to indicate whether data is being fetched or not\n */\n isFetching: PropTypes.bool,\n /*\n Boolean to indicate whether modal is open or not\n */\n isOpen: PropTypes.bool,\n /*\n Function to set search term\n */\n setSearchTerm: PropTypes.func,\n /*\n Function to close the modal\n */\n onClose: PropTypes.func,\n /*\n Function to execute when user clicks on advanced search button\n */\n onGoToAdvanced: PropTypes.func,\n};\n\nexport default FinderModal;\n"],"names":["Link","_ref","to","children","rest","_objectWithoutProperties","_excluded","url","URL","host","_jsx","RRDLink","_objectSpread","pathname","minMax","number","max","arguments","length","undefined","Number","POSITIVE_INFINITY","min","Math","htmlToText","html","tmp","document","createElement","innerHTML","textContent","innerText","ModalBody","containerRef","data","iconComponentMap","onClose","Modal","Body","className","ref","Object","keys","map","key","isNotPresent","_jsxs","Typography","style","textTransform","humanize","item","_ref2","_item$content","Icon","onClick","size","component","content","body","name","id","ModalFooter","enableAdvancedSearch","_useTranslation","useTranslation","t","shortcuts","label","isVisible","Up","Down","Footer","filter","prop","index","ModalHeader","withT","loading","onSearch","onGoToAdvanced","Header","Search","nakedInput","autoComplete","placeholder","suffix","Spinner","Button","FinderModal","_ref$enableAdvancedSe","isFetching","isOpen","setSearchTerm","_ref$onGoToAdvanced","noop","props","useRef","mutables","focusIndex","current","onFocusChange","offset","container","nodes","querySelectorAll","focus","useHotkeys","event","preventDefault","code","mode","enabled","closeButton"],"mappings":"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"}
|
|
@@ -0,0 +1,247 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var neetoCist = require('@bigbinary/neeto-cist');
|
|
7
|
+
var useHotkeys = require('@bigbinary/neeto-hotkeys');
|
|
8
|
+
var Modal = require('@bigbinary/neetoui/Modal');
|
|
9
|
+
var Typography = require('@bigbinary/neetoui/Typography');
|
|
10
|
+
var reactRouterDom = require('react-router-dom');
|
|
11
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
12
|
+
var Down = require('@bigbinary/neeto-icons/Down');
|
|
13
|
+
var Up = require('@bigbinary/neeto-icons/Up');
|
|
14
|
+
var ramda = require('ramda');
|
|
15
|
+
var reactI18next = require('react-i18next');
|
|
16
|
+
var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
|
|
17
|
+
var Button = require('@bigbinary/neetoui/Button');
|
|
18
|
+
var Spinner = require('@bigbinary/neetoui/Spinner');
|
|
19
|
+
var Search = require('./Search.js');
|
|
20
|
+
require('@babel/runtime/helpers/slicedToArray');
|
|
21
|
+
require('@bigbinary/neeto-commons-frontend/react-utils/useFuncDebounce');
|
|
22
|
+
require('@bigbinary/neeto-commons-frontend/react-utils/useQueryParams');
|
|
23
|
+
require('@bigbinary/neeto-commons-frontend/react-utils/useUpdateEffect');
|
|
24
|
+
require('@bigbinary/neeto-commons-frontend/utils/general');
|
|
25
|
+
require('@bigbinary/neeto-icons/Search');
|
|
26
|
+
require('@bigbinary/neetoui/Input');
|
|
27
|
+
require('./inject-css-vQvjPR2x.js');
|
|
28
|
+
require('@bigbinary/neeto-commons-frontend/utils');
|
|
29
|
+
|
|
30
|
+
var _excluded$1 = ["to", "children"];
|
|
31
|
+
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
32
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
33
|
+
var Link = function Link(_ref) {
|
|
34
|
+
var to = _ref.to,
|
|
35
|
+
children = _ref.children,
|
|
36
|
+
rest = _objectWithoutProperties(_ref, _excluded$1);
|
|
37
|
+
var url = new URL(to);
|
|
38
|
+
url.host = "";
|
|
39
|
+
return /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Link, _objectSpread$1(_objectSpread$1({}, rest), {}, {
|
|
40
|
+
to: url.pathname,
|
|
41
|
+
children: children
|
|
42
|
+
}));
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
var minMax = function minMax(number) {
|
|
46
|
+
var max = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Number.POSITIVE_INFINITY;
|
|
47
|
+
var min = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
48
|
+
return Math.min(max, Math.max(min, number));
|
|
49
|
+
};
|
|
50
|
+
var htmlToText = function htmlToText(html) {
|
|
51
|
+
var tmp = document.createElement("div");
|
|
52
|
+
tmp.innerHTML = html;
|
|
53
|
+
return tmp.textContent || tmp.innerText || "";
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
var ModalBody = function ModalBody(_ref) {
|
|
57
|
+
var containerRef = _ref.containerRef,
|
|
58
|
+
data = _ref.data,
|
|
59
|
+
iconComponentMap = _ref.iconComponentMap,
|
|
60
|
+
onClose = _ref.onClose;
|
|
61
|
+
return /*#__PURE__*/jsxRuntime.jsx(Modal.Body, {
|
|
62
|
+
className: "h-96 overflow-y-auto px-4 py-6",
|
|
63
|
+
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
64
|
+
className: "space-y-4",
|
|
65
|
+
ref: containerRef,
|
|
66
|
+
children: Object.keys(data).map(function (key) {
|
|
67
|
+
if (neetoCist.isNotPresent(data[key])) return null;
|
|
68
|
+
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
69
|
+
className: "w-full",
|
|
70
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
71
|
+
className: "neeto-ui-text-gray-700 mb-2",
|
|
72
|
+
style: "h6",
|
|
73
|
+
textTransform: "uppercase",
|
|
74
|
+
children: neetoCist.humanize(key)
|
|
75
|
+
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
76
|
+
className: "w-full",
|
|
77
|
+
children: data[key].map(function (item) {
|
|
78
|
+
var _ref2, _item$content;
|
|
79
|
+
var Icon = iconComponentMap[key] || iconComponentMap["default"];
|
|
80
|
+
return /*#__PURE__*/jsxRuntime.jsxs(Link, {
|
|
81
|
+
className: "neeto-molecules-search-result-item hover:neeto-ui-bg-gray-100 focus:neeto-ui-bg-gray-100 neeto-ui-rounded flex w-full cursor-pointer items-center gap-2 p-2 text-xs",
|
|
82
|
+
to: item.url,
|
|
83
|
+
onClick: onClose,
|
|
84
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(Icon, {
|
|
85
|
+
className: "neeto-ui-text-gray-600 min-w-fit",
|
|
86
|
+
size: 16
|
|
87
|
+
}), /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
88
|
+
className: "neeto-ui-text-gray-800 line-clamp-1",
|
|
89
|
+
component: "span",
|
|
90
|
+
style: "body3",
|
|
91
|
+
children: htmlToText((_ref2 = (_item$content = item.content) !== null && _item$content !== void 0 ? _item$content : item.body) !== null && _ref2 !== void 0 ? _ref2 : item.name)
|
|
92
|
+
})]
|
|
93
|
+
}, item.id);
|
|
94
|
+
})
|
|
95
|
+
})]
|
|
96
|
+
}, key);
|
|
97
|
+
})
|
|
98
|
+
})
|
|
99
|
+
});
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
var ModalFooter = function ModalFooter(_ref) {
|
|
103
|
+
var enableAdvancedSearch = _ref.enableAdvancedSearch;
|
|
104
|
+
var _useTranslation = reactI18next.useTranslation(),
|
|
105
|
+
t = _useTranslation.t;
|
|
106
|
+
var shortcuts = [{
|
|
107
|
+
label: t("neetoMolecules.finderModal.advancedSearch"),
|
|
108
|
+
keys: ["Cmd/Ctrl", "Return"],
|
|
109
|
+
isVisible: enableAdvancedSearch
|
|
110
|
+
}, {
|
|
111
|
+
label: t("neetoMolecules.common.actions.open"),
|
|
112
|
+
keys: ["Return"],
|
|
113
|
+
isVisible: true
|
|
114
|
+
}, {
|
|
115
|
+
label: t("neetoMolecules.common.actions.move"),
|
|
116
|
+
keys: [/*#__PURE__*/jsxRuntime.jsx(Up, {
|
|
117
|
+
className: "neeto-ui-text-gray-800",
|
|
118
|
+
size: 12
|
|
119
|
+
}, "up"), /*#__PURE__*/jsxRuntime.jsx(Down, {
|
|
120
|
+
className: "neeto-ui-text-gray-800",
|
|
121
|
+
size: 12
|
|
122
|
+
}, "down")],
|
|
123
|
+
isVisible: true
|
|
124
|
+
}, {
|
|
125
|
+
label: t("neetoMolecules.common.actions.close"),
|
|
126
|
+
keys: ["Esc"],
|
|
127
|
+
isVisible: true
|
|
128
|
+
}];
|
|
129
|
+
return /*#__PURE__*/jsxRuntime.jsx(Modal.Footer, {
|
|
130
|
+
className: "neeto-ui-border-gray-300 border-t px-4 py-2",
|
|
131
|
+
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
132
|
+
className: "neeto-ui-text-xxs flex items-center justify-end gap-4",
|
|
133
|
+
children: shortcuts.filter(ramda.prop("isVisible")).map(function (_ref2, index) {
|
|
134
|
+
var label = _ref2.label,
|
|
135
|
+
keys = _ref2.keys;
|
|
136
|
+
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
137
|
+
className: "flex items-center gap-1",
|
|
138
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
139
|
+
component: "span",
|
|
140
|
+
style: "nano",
|
|
141
|
+
children: label
|
|
142
|
+
}), keys.map(function (key, index) {
|
|
143
|
+
return /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
144
|
+
className: "neeto-ui-bg-gray-200 neeto-ui-rounded-sm p-1",
|
|
145
|
+
component: "span",
|
|
146
|
+
style: "nano",
|
|
147
|
+
children: key
|
|
148
|
+
}, index);
|
|
149
|
+
})]
|
|
150
|
+
}, index);
|
|
151
|
+
})
|
|
152
|
+
})
|
|
153
|
+
});
|
|
154
|
+
};
|
|
155
|
+
|
|
156
|
+
var ModalHeader = reactUtils.withT(function (_ref) {
|
|
157
|
+
var t = _ref.t,
|
|
158
|
+
enableAdvancedSearch = _ref.enableAdvancedSearch,
|
|
159
|
+
loading = _ref.loading,
|
|
160
|
+
onSearch = _ref.onSearch,
|
|
161
|
+
onGoToAdvanced = _ref.onGoToAdvanced;
|
|
162
|
+
return /*#__PURE__*/jsxRuntime.jsx(Modal.Header, {
|
|
163
|
+
className: "border-b px-0 py-0",
|
|
164
|
+
children: /*#__PURE__*/jsxRuntime.jsx(Search, {
|
|
165
|
+
onSearch: onSearch,
|
|
166
|
+
nakedInput: true,
|
|
167
|
+
autoComplete: "off",
|
|
168
|
+
className: "px-4 py-1.5",
|
|
169
|
+
name: "term",
|
|
170
|
+
placeholder: t("neetoMolecules.common.actions.search"),
|
|
171
|
+
suffix: /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
172
|
+
className: "flex items-center gap-x-2 px-2",
|
|
173
|
+
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
174
|
+
className: "h-3 w-3",
|
|
175
|
+
children: loading && /*#__PURE__*/jsxRuntime.jsx(Spinner, {
|
|
176
|
+
size: "small"
|
|
177
|
+
})
|
|
178
|
+
}), enableAdvancedSearch && /*#__PURE__*/jsxRuntime.jsx(Button, {
|
|
179
|
+
className: "ml-2 whitespace-nowrap",
|
|
180
|
+
label: t("neetoMolecules.finderModal.advancedSearch"),
|
|
181
|
+
size: "small",
|
|
182
|
+
style: "secondary",
|
|
183
|
+
onClick: onGoToAdvanced
|
|
184
|
+
})]
|
|
185
|
+
})
|
|
186
|
+
})
|
|
187
|
+
});
|
|
188
|
+
});
|
|
189
|
+
|
|
190
|
+
var _excluded = ["enableAdvancedSearch", "data", "iconComponentMap", "isFetching", "isOpen", "setSearchTerm", "onClose", "onGoToAdvanced"];
|
|
191
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
192
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
193
|
+
var FinderModal = function FinderModal(_ref) {
|
|
194
|
+
var _ref$enableAdvancedSe = _ref.enableAdvancedSearch,
|
|
195
|
+
enableAdvancedSearch = _ref$enableAdvancedSe === void 0 ? true : _ref$enableAdvancedSe,
|
|
196
|
+
data = _ref.data,
|
|
197
|
+
iconComponentMap = _ref.iconComponentMap,
|
|
198
|
+
isFetching = _ref.isFetching,
|
|
199
|
+
isOpen = _ref.isOpen,
|
|
200
|
+
setSearchTerm = _ref.setSearchTerm,
|
|
201
|
+
onClose = _ref.onClose,
|
|
202
|
+
_ref$onGoToAdvanced = _ref.onGoToAdvanced,
|
|
203
|
+
onGoToAdvanced = _ref$onGoToAdvanced === void 0 ? neetoCist.noop : _ref$onGoToAdvanced,
|
|
204
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
205
|
+
var containerRef = React.useRef();
|
|
206
|
+
var mutables = React.useRef({
|
|
207
|
+
focusIndex: -1
|
|
208
|
+
}).current;
|
|
209
|
+
var onFocusChange = function onFocusChange(offset) {
|
|
210
|
+
var container = containerRef.current;
|
|
211
|
+
var nodes = container.querySelectorAll("a.neeto-molecules-search-result-item");
|
|
212
|
+
mutables.focusIndex = minMax(mutables.focusIndex + offset, nodes.length - 1);
|
|
213
|
+
nodes[mutables.focusIndex].focus();
|
|
214
|
+
};
|
|
215
|
+
useHotkeys(["up", "down"], function (event) {
|
|
216
|
+
event.preventDefault();
|
|
217
|
+
if (event.code === "ArrowUp") onFocusChange(-1);else if (event.code === "ArrowDown") onFocusChange(1);
|
|
218
|
+
}, {
|
|
219
|
+
mode: "global"
|
|
220
|
+
});
|
|
221
|
+
useHotkeys(["ctrl+enter", "command+enter"], onGoToAdvanced, {
|
|
222
|
+
mode: "global",
|
|
223
|
+
enabled: enableAdvancedSearch
|
|
224
|
+
});
|
|
225
|
+
return /*#__PURE__*/jsxRuntime.jsxs(Modal, _objectSpread(_objectSpread({
|
|
226
|
+
isOpen: isOpen,
|
|
227
|
+
onClose: onClose,
|
|
228
|
+
closeButton: false
|
|
229
|
+
}, props), {}, {
|
|
230
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(ModalHeader, {
|
|
231
|
+
enableAdvancedSearch: enableAdvancedSearch,
|
|
232
|
+
onGoToAdvanced: onGoToAdvanced,
|
|
233
|
+
loading: isFetching,
|
|
234
|
+
onSearch: setSearchTerm
|
|
235
|
+
}), /*#__PURE__*/jsxRuntime.jsx(ModalBody, {
|
|
236
|
+
containerRef: containerRef,
|
|
237
|
+
data: data,
|
|
238
|
+
iconComponentMap: iconComponentMap,
|
|
239
|
+
onClose: onClose
|
|
240
|
+
}), /*#__PURE__*/jsxRuntime.jsx(ModalFooter, {
|
|
241
|
+
enableAdvancedSearch: enableAdvancedSearch
|
|
242
|
+
})]
|
|
243
|
+
}));
|
|
244
|
+
};
|
|
245
|
+
|
|
246
|
+
module.exports = FinderModal;
|
|
247
|
+
//# sourceMappingURL=FinderModal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FinderModal.js","sources":["../../src/components/FinderModal/Link.jsx","../../src/components/FinderModal/utils.js","../../src/components/FinderModal/Body.jsx","../../src/components/FinderModal/Footer.jsx","../../src/components/FinderModal/Header.jsx","../../src/components/FinderModal/index.jsx"],"sourcesContent":["import { Link as RRDLink } from \"react-router-dom\";\n\nconst Link = ({ to, children, ...rest }) => {\n const url = new URL(to);\n url.host = \"\";\n\n return (\n <RRDLink {...rest} to={url.pathname}>\n {children}\n </RRDLink>\n );\n};\n\nexport default Link;\n","export const minMax = (number, max = Number.POSITIVE_INFINITY, min = 0) =>\n Math.min(max, Math.max(min, number));\n\nexport const htmlToText = html => {\n const tmp = document.createElement(\"div\");\n tmp.innerHTML = html;\n\n return tmp.textContent || tmp.innerText || \"\";\n};\n","import { humanize, isNotPresent } from \"neetocist\";\nimport { Modal, Typography } from \"neetoui\";\n\nimport Link from \"./Link\";\nimport { htmlToText } from \"./utils\";\n\nconst ModalBody = ({ containerRef, data, iconComponentMap, onClose }) => (\n <Modal.Body className=\"h-96 overflow-y-auto px-4 py-6\">\n <div className=\"space-y-4\" ref={containerRef}>\n {Object.keys(data).map(key => {\n if (isNotPresent(data[key])) return null;\n\n return (\n <div className=\"w-full\" key={key}>\n <Typography\n className=\"neeto-ui-text-gray-700 mb-2\"\n style=\"h6\"\n textTransform=\"uppercase\"\n >\n {humanize(key)}\n </Typography>\n <div className=\"w-full\">\n {data[key].map(item => {\n const Icon = iconComponentMap[key] || iconComponentMap.default;\n\n return (\n <Link\n className=\"neeto-molecules-search-result-item hover:neeto-ui-bg-gray-100 focus:neeto-ui-bg-gray-100 neeto-ui-rounded flex w-full cursor-pointer items-center gap-2 p-2 text-xs\"\n key={item.id}\n to={item.url}\n onClick={onClose}\n >\n <Icon\n className=\"neeto-ui-text-gray-600 min-w-fit\"\n size={16}\n />\n <Typography\n className=\"neeto-ui-text-gray-800 line-clamp-1\"\n component=\"span\"\n style=\"body3\"\n >\n {htmlToText(item.content ?? item.body ?? item.name)}\n </Typography>\n </Link>\n );\n })}\n </div>\n </div>\n );\n })}\n </div>\n </Modal.Body>\n);\n\nexport default ModalBody;\n","import { Down, Up } from \"neetoicons\";\nimport { Modal, Typography } from \"neetoui\";\nimport { prop } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nconst ModalFooter = ({ enableAdvancedSearch }) => {\n const { t } = useTranslation();\n\n const shortcuts = [\n {\n label: t(\"neetoMolecules.finderModal.advancedSearch\"),\n keys: [\"Cmd/Ctrl\", \"Return\"],\n isVisible: enableAdvancedSearch,\n },\n {\n label: t(\"neetoMolecules.common.actions.open\"),\n keys: [\"Return\"],\n isVisible: true,\n },\n {\n label: t(\"neetoMolecules.common.actions.move\"),\n keys: [\n <Up className=\"neeto-ui-text-gray-800\" key=\"up\" size={12} />,\n <Down className=\"neeto-ui-text-gray-800\" key=\"down\" size={12} />,\n ],\n isVisible: true,\n },\n {\n label: t(\"neetoMolecules.common.actions.close\"),\n keys: [\"Esc\"],\n isVisible: true,\n },\n ];\n\n return (\n <Modal.Footer className=\"neeto-ui-border-gray-300 border-t px-4 py-2\">\n <div className=\"neeto-ui-text-xxs flex items-center justify-end gap-4\">\n {shortcuts.filter(prop(\"isVisible\")).map(({ label, keys }, index) => (\n <div className=\"flex items-center gap-1\" key={index}>\n <Typography component=\"span\" style=\"nano\">\n {label}\n </Typography>\n {keys.map((key, index) => (\n <Typography\n className=\"neeto-ui-bg-gray-200 neeto-ui-rounded-sm p-1\"\n component=\"span\"\n key={index}\n style=\"nano\"\n >\n {key}\n </Typography>\n ))}\n </div>\n ))}\n </div>\n </Modal.Footer>\n );\n};\n\nexport default ModalFooter;\n","import { withT } from \"neetocommons/react-utils\";\nimport { Button, Modal, Spinner } from \"neetoui\";\n\nimport Search from \"components/Search\";\n\nconst ModalHeader = withT(\n ({ t, enableAdvancedSearch, loading, onSearch, onGoToAdvanced }) => (\n <Modal.Header className=\"border-b px-0 py-0\">\n <Search\n {...{ onSearch }}\n nakedInput\n autoComplete=\"off\"\n className=\"px-4 py-1.5\"\n name=\"term\"\n placeholder={t(\"neetoMolecules.common.actions.search\")}\n suffix={\n <div className=\"flex items-center gap-x-2 px-2\">\n <div className=\"h-3 w-3\">{loading && <Spinner size=\"small\" />}</div>\n {enableAdvancedSearch && (\n <Button\n className=\"ml-2 whitespace-nowrap\"\n label={t(\"neetoMolecules.finderModal.advancedSearch\")}\n size=\"small\"\n style=\"secondary\"\n onClick={onGoToAdvanced}\n />\n )}\n </div>\n }\n />\n </Modal.Header>\n )\n);\n\nexport default ModalHeader;\n","import { useRef } from \"react\";\n\nimport { noop } from \"neetocist\";\nimport useHotkeys from \"neetohotkeys\";\nimport { Modal } from \"neetoui\";\nimport PropTypes from \"prop-types\";\n\nimport ModalBody from \"./Body\";\nimport ModalFooter from \"./Footer\";\nimport ModalHeader from \"./Header\";\nimport { minMax } from \"./utils\";\n\nconst FinderModal = ({\n enableAdvancedSearch = true,\n data,\n iconComponentMap,\n isFetching,\n isOpen,\n setSearchTerm,\n onClose,\n onGoToAdvanced = noop,\n ...props\n}) => {\n const containerRef = useRef();\n const mutables = useRef({ focusIndex: -1 }).current;\n\n const onFocusChange = offset => {\n const container = containerRef.current;\n const nodes = container.querySelectorAll(\n \"a.neeto-molecules-search-result-item\"\n );\n\n mutables.focusIndex = minMax(\n mutables.focusIndex + offset,\n nodes.length - 1\n );\n nodes[mutables.focusIndex].focus();\n };\n\n useHotkeys(\n [\"up\", \"down\"],\n event => {\n event.preventDefault();\n if (event.code === \"ArrowUp\") onFocusChange(-1);\n else if (event.code === \"ArrowDown\") onFocusChange(1);\n },\n { mode: \"global\" }\n );\n\n useHotkeys([\"ctrl+enter\", \"command+enter\"], onGoToAdvanced, {\n mode: \"global\",\n enabled: enableAdvancedSearch,\n });\n\n return (\n <Modal {...{ isOpen, onClose }} closeButton={false} {...props}>\n <ModalHeader\n {...{ enableAdvancedSearch, onGoToAdvanced }}\n loading={isFetching}\n onSearch={setSearchTerm}\n />\n <ModalBody {...{ containerRef, data, iconComponentMap, onClose }} />\n <ModalFooter {...{ enableAdvancedSearch }} />\n </Modal>\n );\n};\n\nFinderModal.propTypes = {\n /*\n Boolean to indicate decide whether to show advanced search button or not\n */\n enableAdvancedSearch: PropTypes.bool,\n /*\n Data to be displayed in the modal\n */\n data: PropTypes.objectOf(\n PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n url: PropTypes.string,\n content: PropTypes.string,\n body: PropTypes.string,\n name: PropTypes.string,\n })\n )\n ),\n /*\n Icon component map to render icons for each section\n */\n iconComponentMap: PropTypes.objectOf(PropTypes.elementType),\n /*\n Boolean to indicate whether data is being fetched or not\n */\n isFetching: PropTypes.bool,\n /*\n Boolean to indicate whether modal is open or not\n */\n isOpen: PropTypes.bool,\n /*\n Function to set search term\n */\n setSearchTerm: PropTypes.func,\n /*\n Function to close the modal\n */\n onClose: PropTypes.func,\n /*\n Function to execute when user clicks on advanced search button\n */\n onGoToAdvanced: PropTypes.func,\n};\n\nexport default FinderModal;\n"],"names":["Link","_ref","to","children","rest","_objectWithoutProperties","_excluded","url","URL","host","_jsx","RRDLink","_objectSpread","pathname","minMax","number","max","arguments","length","undefined","Number","POSITIVE_INFINITY","min","Math","htmlToText","html","tmp","document","createElement","innerHTML","textContent","innerText","ModalBody","containerRef","data","iconComponentMap","onClose","Modal","Body","className","ref","Object","keys","map","key","isNotPresent","_jsxs","Typography","style","textTransform","humanize","item","_ref2","_item$content","Icon","onClick","size","component","content","body","name","id","ModalFooter","enableAdvancedSearch","_useTranslation","useTranslation","t","shortcuts","label","isVisible","Up","Down","Footer","filter","prop","index","ModalHeader","withT","loading","onSearch","onGoToAdvanced","Header","Search","nakedInput","autoComplete","placeholder","suffix","Spinner","Button","FinderModal","_ref$enableAdvancedSe","isFetching","isOpen","setSearchTerm","_ref$onGoToAdvanced","noop","props","useRef","mutables","focusIndex","current","onFocusChange","offset","container","nodes","querySelectorAll","focus","useHotkeys","event","preventDefault","code","mode","enabled","closeButton"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bigbinary/neeto-molecules",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.10.1",
|
|
4
4
|
"description": "A package of reusable molecular components for neeto products.",
|
|
5
5
|
"repository": "git@github.com:bigbinary/neeto-molecules.git",
|
|
6
6
|
"author": "Amaljith K <amaljith.k@bigbinary.com>",
|
package/src/translations/en.json
CHANGED
|
@@ -13,6 +13,8 @@
|
|
|
13
13
|
"search": "Search",
|
|
14
14
|
"cancel": "Cancel",
|
|
15
15
|
"close": "Close",
|
|
16
|
+
"open": "Open",
|
|
17
|
+
"move": "Move",
|
|
16
18
|
"save": "Save",
|
|
17
19
|
"edit": "Edit",
|
|
18
20
|
"delete": "Delete",
|
|
@@ -826,6 +828,9 @@
|
|
|
826
828
|
},
|
|
827
829
|
"viewMore": "View more",
|
|
828
830
|
"viewLess": "View less"
|
|
831
|
+
},
|
|
832
|
+
"finderModal": {
|
|
833
|
+
"advancedSearch": "Advanced search"
|
|
829
834
|
}
|
|
830
835
|
}
|
|
831
836
|
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
interface Data {
|
|
4
|
+
[key: string]: Array<{
|
|
5
|
+
id: string;
|
|
6
|
+
url: string;
|
|
7
|
+
content?: string;
|
|
8
|
+
body?: string;
|
|
9
|
+
name?: string;
|
|
10
|
+
}>;
|
|
11
|
+
}
|
|
12
|
+
interface IconComponentMap {
|
|
13
|
+
[key: string]: React.ComponentType;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
*
|
|
17
|
+
* FinderModal is a component that can be used to search for items across the
|
|
18
|
+
*
|
|
19
|
+
* workspace.
|
|
20
|
+
*
|
|
21
|
+
* 
|
|
22
|
+
*
|
|
23
|
+
* @example
|
|
24
|
+
*
|
|
25
|
+
* import { useState } from "react";
|
|
26
|
+
*
|
|
27
|
+
* import { Tickets, UserCircle } from "@bigbinary/neeto-icons";
|
|
28
|
+
* import FinderModal from "@bigbinary/neeto-molecules/FinderModal";
|
|
29
|
+
*
|
|
30
|
+
* const App = () => {
|
|
31
|
+
* const [searchTerm, setSearchTerm] = useState("");
|
|
32
|
+
* const [isFinderModalOpen, setIsFinderModalOpen] = useState(false);
|
|
33
|
+
*
|
|
34
|
+
* const iconComponentMap = { tickets: Tickets, contacts: UserCircle };
|
|
35
|
+
*
|
|
36
|
+
* const { data: searchResults, isFetching } = useSearchApi({ searchTerm });
|
|
37
|
+
*
|
|
38
|
+
* return (
|
|
39
|
+
* <FinderModal
|
|
40
|
+
* data={searchResults}
|
|
41
|
+
* iconComponentMap={iconComponentMap}
|
|
42
|
+
* isFetching={isFetching}
|
|
43
|
+
* isOpen={isFinderModalOpen}
|
|
44
|
+
* setSearchTerm={setSearchTerm}
|
|
45
|
+
* onClose={() => setIsFinderModalOpen(false)}
|
|
46
|
+
* onGoToAdvanced={() => {
|
|
47
|
+
* history.push("/advanced-search");
|
|
48
|
+
* }}
|
|
49
|
+
* />
|
|
50
|
+
* );
|
|
51
|
+
* };
|
|
52
|
+
* @endexample
|
|
53
|
+
*/
|
|
54
|
+
declare const FinderModal: React.FC<{
|
|
55
|
+
enableAdvancedSearch?: boolean;
|
|
56
|
+
data: Data;
|
|
57
|
+
iconComponentMap: IconComponentMap;
|
|
58
|
+
isFetching: boolean;
|
|
59
|
+
isOpen: boolean;
|
|
60
|
+
setSearchTerm: (searchTerm: string) => void;
|
|
61
|
+
onClose: () => void;
|
|
62
|
+
onGoToAdvanced?: () => void;
|
|
63
|
+
}>;
|
|
64
|
+
|
|
65
|
+
export { FinderModal as default };
|