@geneui/components 2.11.2 → 2.12.2
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/{ActionableList.js → ActionableList/index.js} +83 -152
- package/{AdvancedSearch.js → AdvancedSearch/index.js} +290 -304
- package/Alert/index.js +97 -0
- package/Avatar/index.js +30 -0
- package/Badge/index.js +75 -0
- package/{Breadcrumb.js → Breadcrumb/index.js} +32 -31
- package/BusyLoader/index.js +68 -0
- package/Button/index.js +129 -0
- package/CHANGELOG.md +53 -0
- package/{Card.js → Card/index.js} +82 -94
- package/{CardList.js → CardList/index.js} +120 -165
- package/{CellMeasurerCache-b786dd93.js → CellMeasurerCache-3741d716.js} +2 -2
- package/{index-9164a86d.js → Charts/index.js} +17103 -30447
- package/{Checkbox.js → Checkbox/index.js} +37 -38
- package/{CheckboxGroup.js → CheckboxGroup/index.js} +41 -42
- package/{CheckboxGroupWithSearch.js → CheckboxGroupWithSearch/index.js} +64 -65
- package/{Collapse.js → Collapse/index.js} +28 -29
- package/{ColorPicker.js → ColorPicker/index.js} +16 -16
- package/ComboBox/index.js +525 -0
- package/Counter/index.js +310 -0
- package/{DateFilter.js → DateFilter/index.js} +45 -43
- package/{DatePicker.js → DatePicker/index.js} +106 -108
- package/{index-0199942c.js → DatePickerInput/index.js} +114 -100
- package/{Divider.js → Divider/index.js} +9 -10
- package/{Drawer.js → Drawer/index.js} +40 -41
- package/Dropdown/index.js +41 -0
- package/{Editor.js → Editor/index.js} +165 -164
- package/{Empty.js → Empty/index.js} +12 -13
- package/{ExtendedInput.js → ExtendedInput/index.js} +81 -71
- package/Form/index.js +83 -0
- package/{FormContainer.js → FormContainer/index.js} +25 -26
- package/FormableCheckbox/index.js +26 -0
- package/FormableDatePicker/index.js +41 -0
- package/FormableDropdown/index.js +48 -0
- package/FormableEditor/index.js +24 -0
- package/{FormableHOC-21051057.js → FormableHOC-55263162.js} +3 -3
- package/FormableMultiSelectDropdown/index.js +48 -0
- package/FormableNumberInput/index.js +32 -0
- package/FormableRadio/index.js +22 -0
- package/FormableSwitcher/index.js +22 -0
- package/FormableTextInput/index.js +32 -0
- package/FormableUploader/index.js +42 -0
- package/GeneUIProvider/index.js +282 -0
- package/{Grid.js → Grid/index.js} +27 -27
- package/Holder/index.js +261 -0
- package/{Icon.js → Icon/index.js} +9 -10
- package/Image/index.js +129 -0
- package/ImagePreview/index.js +481 -0
- package/{KeyValue.js → KeyValue/index.js} +11 -12
- package/LICENSE +21 -0
- package/Label/index.js +57 -0
- package/LinkButton/index.js +67 -0
- package/{Menu.js → Menu/index.js} +27 -28
- package/MobileNavigation/index.js +94 -0
- package/{MobilePopup.js → MobilePopup/index.js} +42 -41
- package/{Modal.js → Modal/index.js} +39 -40
- package/ModuleTitle/index.js +143 -0
- package/{NavigationMenu.js → NavigationMenu/index.js} +30 -29
- package/Notification/index.js +119 -0
- package/Option/index.js +184 -0
- package/Overlay/index.js +189 -0
- package/Overspread/index.js +289 -0
- package/{Pagination.js → Pagination/index.js} +35 -34
- package/Paper/index.js +96 -0
- package/{index-084588e9.js → Popover/index.js} +48 -58
- package/PopoverV2/index.js +18 -0
- package/{Portal.js → Portal/index.js} +7 -8
- package/{Products.js → Products/index.js} +20 -21
- package/Profile/index.js +585 -0
- package/Progress/index.js +199 -0
- package/{QRCode.js → QRCode/index.js} +4 -6
- package/{Radio.js → Radio/index.js} +25 -26
- package/{RadioGroup.js → RadioGroup/index.js} +17 -18
- package/{index-00fe8887.js → Range/index.js} +29 -32
- package/RichEditor/index.js +13 -0
- package/{RichEditor-98accead.js → RichEditor-8b0f7ccd.js} +18 -18
- package/{Scrollbar.js → Scrollbar/index.js} +15 -17
- package/{Search.js → Search/index.js} +25 -24
- package/SearchWithDropdown/index.js +138 -0
- package/Section/index.js +61 -0
- package/{SkeletonLoader.js → SkeletonLoader/index.js} +13 -14
- package/{Slider.js → Slider/index.js} +46 -43
- package/Status/index.js +103 -0
- package/Steps/index.js +313 -0
- package/{index-897d8240.js → SuggestionList/index.js} +15 -38
- package/{Switcher.js → Switcher/index.js} +30 -31
- package/Table/index.js +53 -0
- package/{TableCompositions.js → TableCompositions/index.js} +131 -168
- package/Tabs/index.js +235 -0
- package/Tag/index.js +102 -0
- package/{TextLink.js → TextLink/index.js} +3 -3
- package/{Textarea.js → Textarea/index.js} +66 -65
- package/{Time.js → Time/index.js} +13 -14
- package/TimePicker/index.js +555 -0
- package/Timeline/index.js +113 -0
- package/Title/index.js +65 -0
- package/{Toaster.js → Toaster/index.js} +19 -20
- package/{Tooltip.js → Tooltip/index.js} +27 -28
- package/{TransferList.js → TransferList/index.js} +44 -55
- package/{index-135b9d17.js → Uploader/index.js} +119 -116
- package/{ValidatableCheckbox.js → ValidatableCheckbox/index.js} +23 -24
- package/{ValidatableDatePicker.js → ValidatableDatePicker/index.js} +44 -42
- package/ValidatableDropdown/index.js +139 -0
- package/ValidatableElements/index.js +65 -0
- package/ValidatableMultiSelectDropdown/index.js +150 -0
- package/{ValidatableNumberInput.js → ValidatableNumberInput/index.js} +41 -33
- package/{ValidatableRadio.js → ValidatableRadio/index.js} +19 -20
- package/{ValidatableSwitcher.js → ValidatableSwitcher/index.js} +19 -20
- package/{ValidatableTextInput.js → ValidatableTextInput/index.js} +32 -31
- package/{ValidatableTimeInput.js → ValidatableTimeInput/index.js} +31 -30
- package/{ValidatableUploader.js → ValidatableUploader/index.js} +36 -34
- package/Widget/index.js +227 -0
- package/config-0ca92874.js +31 -0
- package/{configs-91c86664.js → configs-fed6ac34.js} +28 -1
- package/hooks/useBodyScroll.js +16 -0
- package/hooks/useClick.js +18 -0
- package/{useClickOutside-5183e396.js → hooks/useClickOutside.js} +1 -1
- package/hooks/useDebounceHook.js +16 -0
- package/{useDeviceType-dd51db38.js → hooks/useDeviceType.js} +4 -3
- package/hooks/useDidMount.js +15 -0
- package/{useEllipsisDetection-ef536015.js → hooks/useEllipsisDetection.js} +1 -1
- package/hooks/useForceUpdate.js +8 -0
- package/hooks/useImgDownload.js +18 -0
- package/{useKeyDown-38102ae7.js → hooks/useKeyDown.js} +1 -1
- package/hooks/useMount.js +13 -0
- package/hooks/useMutationObserver.js +21 -0
- package/hooks/usePrevious.js +10 -0
- package/hooks/useThrottle.js +16 -0
- package/hooks/useToggle.js +11 -0
- package/hooks/useUpdatableRef.js +14 -0
- package/hooks/useUpdate.js +10 -0
- package/{useWidth-9f4647f8.js → hooks/useWidth.js} +2 -2
- package/{useWindowSize-80369d76.js → hooks/useWindowSize.js} +1 -1
- package/{index-8c98317a.js → index-11eea761.js} +678 -752
- package/index-2ad83e03.js +4 -0
- package/index-34e47647.js +10054 -0
- package/index-45eafea6.js +90 -0
- package/{index-5e96cb4d.js → index-462461c0.js} +50 -48
- package/{index-ac59cb10.js → index-a0e4e333.js} +6 -6
- package/{index-e8776f3d.js → index-b1e429a7.js} +1 -1
- package/index.d.ts +115 -0
- package/index.js +137 -113
- package/index.mobile.d.ts +16 -0
- package/lib/atoms/Avatar/Avatar.d.ts +34 -0
- package/lib/atoms/Avatar/index.d.ts +1 -0
- package/lib/atoms/LinkButton/LinkButton.d.ts +46 -0
- package/lib/atoms/LinkButton/index.d.ts +1 -0
- package/{objectWithoutPropertiesLoose-299691d8.js → objectWithoutPropertiesLoose-d8a4a68c.js} +12 -12
- package/package.json +42 -22
- package/{rangeAndSlider-20599da4.js → rangeAndSlider-0301a458.js} +220 -375
- package/{react-beautiful-dnd.esm-38c37304.js → react-beautiful-dnd.esm-04c14563.js} +9 -9
- package/react-lifecycles-compat.es-6e1f3768.js +158 -0
- package/Alert.js +0 -98
- package/Avatar.js +0 -77
- package/Badge.js +0 -76
- package/BusyLoader.js +0 -69
- package/Button.js +0 -130
- package/Charts.js +0 -99
- package/ComboBox.js +0 -99
- package/Counter.js +0 -99
- package/DatePickerInput.js +0 -30
- package/Dropdown.js +0 -99
- package/Form.js +0 -116
- package/FormableCheckbox.js +0 -27
- package/FormableDatePicker.js +0 -39
- package/FormableDropdown.js +0 -105
- package/FormableEditor.js +0 -24
- package/FormableMultiSelectDropdown.js +0 -105
- package/FormableNumberInput.js +0 -31
- package/FormableRadio.js +0 -23
- package/FormableSwitcher.js +0 -23
- package/FormableTextInput.js +0 -31
- package/FormableUploader.js +0 -40
- package/GeneUIProvider.js +0 -256
- package/Holder.js +0 -99
- package/Image.js +0 -130
- package/ImagePreview.js +0 -99
- package/Label.js +0 -58
- package/LinkButton.js +0 -104
- package/MobileNavigation.js +0 -95
- package/ModuleTitle.js +0 -99
- package/Notification.js +0 -120
- package/Option.js +0 -186
- package/Overlay.js +0 -99
- package/Overspread.js +0 -343
- package/Paper.js +0 -97
- package/Popover.js +0 -20
- package/PopoverV2.js +0 -19
- package/Profile.js +0 -99
- package/Progress.js +0 -200
- package/Range.js +0 -14
- package/RichEditor.js +0 -13
- package/SearchWithDropdown.js +0 -195
- package/Section.js +0 -62
- package/Status.js +0 -104
- package/Steps.js +0 -312
- package/SuggestionList.js +0 -15
- package/Table.js +0 -102
- package/Tabs.js +0 -236
- package/Tag.js +0 -103
- package/TimePicker.js +0 -99
- package/Timeline.js +0 -114
- package/Title.js +0 -66
- package/Uploader.js +0 -32
- package/ValidatableDropdown.js +0 -99
- package/ValidatableElements.js +0 -99
- package/ValidatableMultiSelectDropdown.js +0 -99
- package/Widget.js +0 -99
- package/globalStyling-9c60a159.js +0 -4
- package/index-2030e31c.js +0 -4
- package/index-b7a33c58.js +0 -11
- package/index-e0af0caf.js +0 -1182
- package/useMount-6fef51a5.js +0 -9
|
@@ -1,52 +1,38 @@
|
|
|
1
|
-
import { _ as _extends } from '
|
|
2
|
-
import React__default, {
|
|
3
|
-
import
|
|
4
|
-
import { c as classnames } from '
|
|
5
|
-
import { a as dayjs } from '
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
18
|
-
import
|
|
19
|
-
import
|
|
1
|
+
import { _ as _extends } from '../_rollupPluginBabelHelpers-e8fb2e5c.js';
|
|
2
|
+
import React__default, { useRef, useState, useCallback, useEffect, useMemo } from 'react';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import { c as classnames } from '../index-6ff23041.js';
|
|
5
|
+
import { a as dayjs } from '../dateValidation-67caec66.js';
|
|
6
|
+
import { j as advancedSearchConfig } from '../configs-fed6ac34.js';
|
|
7
|
+
import { n as noop } from '../index-a0e4e333.js';
|
|
8
|
+
import useKeyDown from '../hooks/useKeyDown.js';
|
|
9
|
+
import useDebounce from '../hooks/useDebounceHook.js';
|
|
10
|
+
import { P as PopoverV2 } from '../index-462461c0.js';
|
|
11
|
+
import ExtendedInput from '../ExtendedInput/index.js';
|
|
12
|
+
import CustomScrollbar from '../Scrollbar/index.js';
|
|
13
|
+
import LinkButton from '../LinkButton/index.js';
|
|
14
|
+
import useEllipsisDetection from '../hooks/useEllipsisDetection.js';
|
|
15
|
+
import Icon from '../Icon/index.js';
|
|
16
|
+
import Checkbox from '../Checkbox/index.js';
|
|
17
|
+
import Tooltip from '../Tooltip/index.js';
|
|
18
|
+
import SkeletonLoader from '../SkeletonLoader/index.js';
|
|
19
|
+
import Badge from '../Badge/index.js';
|
|
20
|
+
import Empty from '../Empty/index.js';
|
|
20
21
|
import 'react-dom';
|
|
21
|
-
import
|
|
22
|
-
import '
|
|
23
|
-
import
|
|
24
|
-
import '
|
|
25
|
-
import '
|
|
26
|
-
import '
|
|
27
|
-
import '
|
|
28
|
-
import '
|
|
29
|
-
import '
|
|
30
|
-
import '
|
|
31
|
-
import '
|
|
32
|
-
import '
|
|
33
|
-
import '
|
|
34
|
-
import '
|
|
35
|
-
import './checkboxRadioSwitcher-5b69d7bd.js';
|
|
36
|
-
import './guid-8ddf77b3.js';
|
|
37
|
-
|
|
38
|
-
const useDebounce = (value, delay) => {
|
|
39
|
-
const [debouncedValue, setDebouncedValue] = useState(value);
|
|
40
|
-
useEffect(() => {
|
|
41
|
-
const handler = setTimeout(() => {
|
|
42
|
-
setDebouncedValue(value);
|
|
43
|
-
}, delay);
|
|
44
|
-
return () => {
|
|
45
|
-
clearTimeout(handler);
|
|
46
|
-
};
|
|
47
|
-
}, [delay, value]);
|
|
48
|
-
return debouncedValue;
|
|
49
|
-
};
|
|
22
|
+
import Button from '../Button/index.js';
|
|
23
|
+
import { s as styleInject } from '../style-inject.es-746bb8ed.js';
|
|
24
|
+
import '../_commonjsHelpers-24198af3.js';
|
|
25
|
+
import '../index-122432cd.js';
|
|
26
|
+
import '../hooks/useDeviceType.js';
|
|
27
|
+
import '../hooks/useWindowSize.js';
|
|
28
|
+
import '../hooks/useClickOutside.js';
|
|
29
|
+
import '../GeneUIProvider/index.js';
|
|
30
|
+
import '../debounce-4419bc2f.js';
|
|
31
|
+
import '../SuggestionList/index.js';
|
|
32
|
+
import '../config-0ca92874.js';
|
|
33
|
+
import '../Popover-f4d1cac0.js';
|
|
34
|
+
import '../checkboxRadioSwitcher-5b69d7bd.js';
|
|
35
|
+
import '../guid-8ddf77b3.js';
|
|
50
36
|
|
|
51
37
|
function ListElementWithCheckbox(_ref) {
|
|
52
38
|
let {
|
|
@@ -101,14 +87,148 @@ ListElementWithCheckbox.defaultProps = {
|
|
|
101
87
|
}
|
|
102
88
|
};
|
|
103
89
|
ListElementWithCheckbox.propTypes = {
|
|
104
|
-
item:
|
|
105
|
-
name:
|
|
106
|
-
value:
|
|
107
|
-
checked:
|
|
108
|
-
icon:
|
|
90
|
+
item: PropTypes.shape({
|
|
91
|
+
name: PropTypes.string,
|
|
92
|
+
value: PropTypes.string,
|
|
93
|
+
checked: PropTypes.bool,
|
|
94
|
+
icon: PropTypes.string
|
|
109
95
|
})
|
|
110
96
|
};
|
|
111
97
|
|
|
98
|
+
function SkeletonSet(_ref) {
|
|
99
|
+
let {
|
|
100
|
+
count,
|
|
101
|
+
searchResult
|
|
102
|
+
} = _ref;
|
|
103
|
+
return searchResult ? /*#__PURE__*/React__default.createElement("ul", {
|
|
104
|
+
className: "skeleton"
|
|
105
|
+
}, Array(count || 1).fill('').map((_, i) => /*#__PURE__*/React__default.createElement("li", {
|
|
106
|
+
className: "skeleton__searchElement",
|
|
107
|
+
key: i
|
|
108
|
+
}, /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
109
|
+
duration: +"".concat(2, ".0", i),
|
|
110
|
+
width: "100%",
|
|
111
|
+
isBusy: true
|
|
112
|
+
})))) : /*#__PURE__*/React__default.createElement("ul", null, Array(count || 1).fill('').map((_, i) => /*#__PURE__*/React__default.createElement("li", {
|
|
113
|
+
className: "skeleton__filter",
|
|
114
|
+
key: i
|
|
115
|
+
}, /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
116
|
+
duration: 2,
|
|
117
|
+
height: "23px",
|
|
118
|
+
width: "23px",
|
|
119
|
+
isBusy: true
|
|
120
|
+
}), /*#__PURE__*/React__default.createElement("span", {
|
|
121
|
+
style: {
|
|
122
|
+
width: '10px'
|
|
123
|
+
}
|
|
124
|
+
}), /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
125
|
+
duration: +"".concat(2, ".0", i),
|
|
126
|
+
height: "23px",
|
|
127
|
+
width: "".concat(Math.floor(Math.random() * 51) + 50, "%"),
|
|
128
|
+
isBusy: true
|
|
129
|
+
}))));
|
|
130
|
+
}
|
|
131
|
+
SkeletonSet.defaultProps = {};
|
|
132
|
+
SkeletonSet.propTypes = {};
|
|
133
|
+
|
|
134
|
+
function FilterList(_ref) {
|
|
135
|
+
let {
|
|
136
|
+
data,
|
|
137
|
+
skeletonCount,
|
|
138
|
+
onSelect
|
|
139
|
+
} = _ref;
|
|
140
|
+
const {
|
|
141
|
+
data: filterData,
|
|
142
|
+
isLoading,
|
|
143
|
+
onShowMoreClick,
|
|
144
|
+
showMoreIsLoading,
|
|
145
|
+
sectionNameText,
|
|
146
|
+
hasActiveShowMore,
|
|
147
|
+
showMoreText
|
|
148
|
+
} = data;
|
|
149
|
+
const listRef = useRef(null);
|
|
150
|
+
const scrollbarRef = useRef(null);
|
|
151
|
+
const [ableToScroll, setAbleToScroll] = useState(false);
|
|
152
|
+
const [dataLengthSnapshots, setDataLengthSnapshots] = useState([]);
|
|
153
|
+
const [elementTopToScroll, setElementTopToScroll] = useState(0);
|
|
154
|
+
const onShowMoreHandler = useCallback(e => {
|
|
155
|
+
onShowMoreClick(e);
|
|
156
|
+
setAbleToScroll(true);
|
|
157
|
+
}, []);
|
|
158
|
+
useEffect(() => {
|
|
159
|
+
setDataLengthSnapshots(prev => [...prev, filterData === null || filterData === void 0 ? void 0 : filterData.length]);
|
|
160
|
+
}, [filterData === null || filterData === void 0 ? void 0 : filterData.length]);
|
|
161
|
+
useEffect(() => {
|
|
162
|
+
var _listRef$current, _listRef$current$chil;
|
|
163
|
+
const scrollToElementTop = +(listRef === null || listRef === void 0 ? void 0 : (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$chil = _listRef$current.children[dataLengthSnapshots[(dataLengthSnapshots === null || dataLengthSnapshots === void 0 ? void 0 : dataLengthSnapshots.length) - 1] - 1]) === null || _listRef$current$chil === void 0 ? void 0 : _listRef$current$chil.offsetTop);
|
|
164
|
+
if (!isLoading && ableToScroll) {
|
|
165
|
+
setElementTopToScroll(scrollToElementTop);
|
|
166
|
+
setAbleToScroll(false);
|
|
167
|
+
}
|
|
168
|
+
}, [isLoading]);
|
|
169
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
170
|
+
className: "filterList__filter"
|
|
171
|
+
}, /*#__PURE__*/React__default.createElement(CustomScrollbar, {
|
|
172
|
+
autoHeightMax: 500,
|
|
173
|
+
className: "filterList__scrollbar",
|
|
174
|
+
style: {
|
|
175
|
+
height: '100%'
|
|
176
|
+
},
|
|
177
|
+
ref: scrollbarRef,
|
|
178
|
+
scrollTop: elementTopToScroll,
|
|
179
|
+
withSmoothScroll: true
|
|
180
|
+
}, /*#__PURE__*/React__default.createElement("h6", {
|
|
181
|
+
className: "filterList__filterHeader"
|
|
182
|
+
}, sectionNameText), /*#__PURE__*/React__default.createElement("ul", {
|
|
183
|
+
className: "filterList__filterList",
|
|
184
|
+
ref: listRef
|
|
185
|
+
}, isLoading ? /*#__PURE__*/React__default.createElement(SkeletonSet, {
|
|
186
|
+
count: skeletonCount
|
|
187
|
+
}) : filterData === null || filterData === void 0 ? void 0 : filterData.map((item, index) => /*#__PURE__*/React__default.createElement(ListElementWithCheckbox, {
|
|
188
|
+
key: index,
|
|
189
|
+
onSelect: onSelect,
|
|
190
|
+
item: item
|
|
191
|
+
})), hasActiveShowMore && /*#__PURE__*/React__default.createElement("li", {
|
|
192
|
+
className: "filterList__showMoreLi"
|
|
193
|
+
}, /*#__PURE__*/React__default.createElement(LinkButton, {
|
|
194
|
+
tabIndex: 0,
|
|
195
|
+
ariaLabel: showMoreText,
|
|
196
|
+
onClick: onShowMoreHandler,
|
|
197
|
+
className: "filterList__showMoreLink"
|
|
198
|
+
}, showMoreText)))));
|
|
199
|
+
}
|
|
200
|
+
FilterList.defaultProps = {
|
|
201
|
+
data: {
|
|
202
|
+
data: []
|
|
203
|
+
},
|
|
204
|
+
onSelect: noop,
|
|
205
|
+
skeletonCount: 5,
|
|
206
|
+
showMoreIsLoading: false
|
|
207
|
+
};
|
|
208
|
+
FilterList.propTypes = {
|
|
209
|
+
/**
|
|
210
|
+
* data structure for secondary filter
|
|
211
|
+
*/
|
|
212
|
+
data: PropTypes.shape({
|
|
213
|
+
sectionNameText: PropTypes.string,
|
|
214
|
+
onChange: PropTypes.func,
|
|
215
|
+
hasActiveShowMore: PropTypes.bool,
|
|
216
|
+
showMoreText: PropTypes.string,
|
|
217
|
+
showMoreIsLoading: PropTypes.bool,
|
|
218
|
+
onShowMoreClick: PropTypes.func,
|
|
219
|
+
isLoading: PropTypes.bool,
|
|
220
|
+
data: PropTypes.arrayOf(PropTypes.shape({
|
|
221
|
+
name: PropTypes.string,
|
|
222
|
+
value: PropTypes.string,
|
|
223
|
+
checked: PropTypes.bool,
|
|
224
|
+
icon: PropTypes.string
|
|
225
|
+
}))
|
|
226
|
+
}),
|
|
227
|
+
skeleton: PropTypes.element,
|
|
228
|
+
onSelect: PropTypes.func,
|
|
229
|
+
skeletonCount: PropTypes.number
|
|
230
|
+
};
|
|
231
|
+
|
|
112
232
|
function SearchResultRow(_ref) {
|
|
113
233
|
let {
|
|
114
234
|
element
|
|
@@ -190,20 +310,20 @@ SearchResultRow.defaultProps = {
|
|
|
190
310
|
element: {}
|
|
191
311
|
};
|
|
192
312
|
SearchResultRow.propTypes = {
|
|
193
|
-
element:
|
|
194
|
-
icon:
|
|
195
|
-
id:
|
|
196
|
-
title:
|
|
197
|
-
type:
|
|
198
|
-
name:
|
|
199
|
-
date:
|
|
200
|
-
labelText:
|
|
201
|
-
date:
|
|
313
|
+
element: PropTypes.shape({
|
|
314
|
+
icon: PropTypes.string,
|
|
315
|
+
id: PropTypes.string,
|
|
316
|
+
title: PropTypes.string,
|
|
317
|
+
type: PropTypes.string,
|
|
318
|
+
name: PropTypes.string,
|
|
319
|
+
date: PropTypes.shape({
|
|
320
|
+
labelText: PropTypes.string,
|
|
321
|
+
date: PropTypes.oneOfType([PropTypes.instanceOf(dayjs), PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number])
|
|
202
322
|
}),
|
|
203
|
-
actions:
|
|
204
|
-
name:
|
|
205
|
-
icon:
|
|
206
|
-
onClick:
|
|
323
|
+
actions: PropTypes.arrayOf(PropTypes.shape({
|
|
324
|
+
name: PropTypes.string,
|
|
325
|
+
icon: PropTypes.string,
|
|
326
|
+
onClick: PropTypes.func
|
|
207
327
|
}))
|
|
208
328
|
})
|
|
209
329
|
};
|
|
@@ -300,217 +420,83 @@ SearchResult.propTypes = {
|
|
|
300
420
|
/**
|
|
301
421
|
* total count of data to show in badge
|
|
302
422
|
*/
|
|
303
|
-
totalCount:
|
|
423
|
+
totalCount: PropTypes.number,
|
|
304
424
|
/**
|
|
305
425
|
* text for no data to display
|
|
306
426
|
*/
|
|
307
|
-
noDataText:
|
|
427
|
+
noDataText: PropTypes.string,
|
|
308
428
|
/**
|
|
309
429
|
* If search field is empty, will show initialData for example (Recently modified data).
|
|
310
430
|
*/
|
|
311
|
-
initialData:
|
|
312
|
-
icon:
|
|
313
|
-
id:
|
|
314
|
-
title:
|
|
315
|
-
type:
|
|
316
|
-
name:
|
|
317
|
-
date:
|
|
318
|
-
labelText:
|
|
319
|
-
date:
|
|
431
|
+
initialData: PropTypes.arrayOf(PropTypes.shape({
|
|
432
|
+
icon: PropTypes.string,
|
|
433
|
+
id: PropTypes.string,
|
|
434
|
+
title: PropTypes.string,
|
|
435
|
+
type: PropTypes.string,
|
|
436
|
+
name: PropTypes.string,
|
|
437
|
+
date: PropTypes.shape({
|
|
438
|
+
labelText: PropTypes.string,
|
|
439
|
+
date: PropTypes.oneOfType([PropTypes.instanceOf(dayjs), PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number])
|
|
320
440
|
}),
|
|
321
|
-
actions:
|
|
322
|
-
name:
|
|
323
|
-
icon:
|
|
324
|
-
onClick:
|
|
441
|
+
actions: PropTypes.arrayOf(PropTypes.shape({
|
|
442
|
+
name: PropTypes.string,
|
|
443
|
+
icon: PropTypes.string,
|
|
444
|
+
onClick: PropTypes.func
|
|
325
445
|
}))
|
|
326
446
|
})),
|
|
327
447
|
/**
|
|
328
448
|
* text for link under search result
|
|
329
449
|
*/
|
|
330
|
-
showMoreText:
|
|
450
|
+
showMoreText: PropTypes.string,
|
|
331
451
|
/**
|
|
332
452
|
* total max count of data to show totalCountMax+ in badge
|
|
333
453
|
*/
|
|
334
|
-
totalCountMax:
|
|
454
|
+
totalCountMax: PropTypes.number,
|
|
335
455
|
/**
|
|
336
456
|
* label text for badge component
|
|
337
457
|
*/
|
|
338
|
-
totalCountText:
|
|
458
|
+
totalCountText: PropTypes.string,
|
|
339
459
|
/**
|
|
340
460
|
* Fires an event when clicked on link under search result
|
|
341
461
|
*/
|
|
342
|
-
onShowMoreClick:
|
|
462
|
+
onShowMoreClick: PropTypes.func,
|
|
343
463
|
/**
|
|
344
464
|
* To control showMore loading state
|
|
345
465
|
*/
|
|
346
|
-
showMoreIsLoading:
|
|
466
|
+
showMoreIsLoading: PropTypes.bool,
|
|
347
467
|
/**
|
|
348
468
|
* search loading state
|
|
349
469
|
*/
|
|
350
|
-
isSearchLoading:
|
|
470
|
+
isSearchLoading: PropTypes.bool,
|
|
351
471
|
/**
|
|
352
472
|
* if hasActive hasActiveShowMore is true you will see show more link under search result
|
|
353
473
|
*/
|
|
354
|
-
hasActiveShowMore:
|
|
474
|
+
hasActiveShowMore: PropTypes.bool,
|
|
355
475
|
/**
|
|
356
476
|
* If search field is empty, initialDataDescription is describing witch data is showing by default for example (Recently modified data).
|
|
357
477
|
*/
|
|
358
|
-
initialDataDescription:
|
|
478
|
+
initialDataDescription: PropTypes.string,
|
|
359
479
|
/**
|
|
360
480
|
* data structure
|
|
361
481
|
* */
|
|
362
|
-
data:
|
|
363
|
-
icon:
|
|
364
|
-
id:
|
|
365
|
-
title:
|
|
366
|
-
type:
|
|
367
|
-
name:
|
|
368
|
-
date:
|
|
369
|
-
labelText:
|
|
370
|
-
date:
|
|
482
|
+
data: PropTypes.arrayOf(PropTypes.shape({
|
|
483
|
+
icon: PropTypes.string,
|
|
484
|
+
id: PropTypes.string,
|
|
485
|
+
title: PropTypes.string,
|
|
486
|
+
type: PropTypes.string,
|
|
487
|
+
name: PropTypes.string,
|
|
488
|
+
date: PropTypes.shape({
|
|
489
|
+
labelText: PropTypes.string,
|
|
490
|
+
date: PropTypes.oneOfType([PropTypes.instanceOf(dayjs), PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number])
|
|
371
491
|
}),
|
|
372
|
-
actions:
|
|
373
|
-
name:
|
|
374
|
-
icon:
|
|
375
|
-
onClick:
|
|
492
|
+
actions: PropTypes.arrayOf(PropTypes.shape({
|
|
493
|
+
name: PropTypes.string,
|
|
494
|
+
icon: PropTypes.string,
|
|
495
|
+
onClick: PropTypes.func
|
|
376
496
|
}))
|
|
377
497
|
}))
|
|
378
498
|
};
|
|
379
499
|
|
|
380
|
-
function SkeletonSet(_ref) {
|
|
381
|
-
let {
|
|
382
|
-
count,
|
|
383
|
-
searchResult
|
|
384
|
-
} = _ref;
|
|
385
|
-
return searchResult ? /*#__PURE__*/React__default.createElement("ul", {
|
|
386
|
-
className: "skeleton"
|
|
387
|
-
}, Array(count || 1).fill('').map((_, i) => /*#__PURE__*/React__default.createElement("li", {
|
|
388
|
-
className: "skeleton__searchElement",
|
|
389
|
-
key: i
|
|
390
|
-
}, /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
391
|
-
duration: +"".concat(2, ".0", i),
|
|
392
|
-
width: "100%",
|
|
393
|
-
isBusy: true
|
|
394
|
-
})))) : /*#__PURE__*/React__default.createElement("ul", null, Array(count || 1).fill('').map((_, i) => /*#__PURE__*/React__default.createElement("li", {
|
|
395
|
-
className: "skeleton__filter",
|
|
396
|
-
key: i
|
|
397
|
-
}, /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
398
|
-
duration: 2,
|
|
399
|
-
height: "23px",
|
|
400
|
-
width: "23px",
|
|
401
|
-
isBusy: true
|
|
402
|
-
}), /*#__PURE__*/React__default.createElement("span", {
|
|
403
|
-
style: {
|
|
404
|
-
width: '10px'
|
|
405
|
-
}
|
|
406
|
-
}), /*#__PURE__*/React__default.createElement(SkeletonLoader, {
|
|
407
|
-
duration: +"".concat(2, ".0", i),
|
|
408
|
-
height: "23px",
|
|
409
|
-
width: "".concat(Math.floor(Math.random() * 51) + 50, "%"),
|
|
410
|
-
isBusy: true
|
|
411
|
-
}))));
|
|
412
|
-
}
|
|
413
|
-
SkeletonSet.defaultProps = {};
|
|
414
|
-
SkeletonSet.propTypes = {};
|
|
415
|
-
|
|
416
|
-
function FilterList(_ref) {
|
|
417
|
-
let {
|
|
418
|
-
data,
|
|
419
|
-
skeletonCount,
|
|
420
|
-
onSelect
|
|
421
|
-
} = _ref;
|
|
422
|
-
const {
|
|
423
|
-
data: filterData,
|
|
424
|
-
isLoading,
|
|
425
|
-
onShowMoreClick,
|
|
426
|
-
showMoreIsLoading,
|
|
427
|
-
sectionNameText,
|
|
428
|
-
hasActiveShowMore,
|
|
429
|
-
showMoreText
|
|
430
|
-
} = data;
|
|
431
|
-
const listRef = useRef(null);
|
|
432
|
-
const scrollbarRef = useRef(null);
|
|
433
|
-
const [ableToScroll, setAbleToScroll] = useState(false);
|
|
434
|
-
const [dataLengthSnapshots, setDataLengthSnapshots] = useState([]);
|
|
435
|
-
const [elementTopToScroll, setElementTopToScroll] = useState(0);
|
|
436
|
-
const onShowMoreHandler = useCallback(e => {
|
|
437
|
-
onShowMoreClick(e);
|
|
438
|
-
setAbleToScroll(true);
|
|
439
|
-
}, []);
|
|
440
|
-
useEffect(() => {
|
|
441
|
-
setDataLengthSnapshots(prev => [...prev, filterData === null || filterData === void 0 ? void 0 : filterData.length]);
|
|
442
|
-
}, [filterData === null || filterData === void 0 ? void 0 : filterData.length]);
|
|
443
|
-
useEffect(() => {
|
|
444
|
-
var _listRef$current, _listRef$current$chil;
|
|
445
|
-
const scrollToElementTop = +(listRef === null || listRef === void 0 ? void 0 : (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : (_listRef$current$chil = _listRef$current.children[dataLengthSnapshots[(dataLengthSnapshots === null || dataLengthSnapshots === void 0 ? void 0 : dataLengthSnapshots.length) - 1] - 1]) === null || _listRef$current$chil === void 0 ? void 0 : _listRef$current$chil.offsetTop);
|
|
446
|
-
if (!isLoading && ableToScroll) {
|
|
447
|
-
setElementTopToScroll(scrollToElementTop);
|
|
448
|
-
setAbleToScroll(false);
|
|
449
|
-
}
|
|
450
|
-
}, [isLoading]);
|
|
451
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
452
|
-
className: "filterList__filter"
|
|
453
|
-
}, /*#__PURE__*/React__default.createElement(CustomScrollbar, {
|
|
454
|
-
autoHeightMax: 500,
|
|
455
|
-
className: "filterList__scrollbar",
|
|
456
|
-
style: {
|
|
457
|
-
height: '100%'
|
|
458
|
-
},
|
|
459
|
-
ref: scrollbarRef,
|
|
460
|
-
scrollTop: elementTopToScroll,
|
|
461
|
-
withSmoothScroll: true
|
|
462
|
-
}, /*#__PURE__*/React__default.createElement("h6", {
|
|
463
|
-
className: "filterList__filterHeader"
|
|
464
|
-
}, sectionNameText), /*#__PURE__*/React__default.createElement("ul", {
|
|
465
|
-
className: "filterList__filterList",
|
|
466
|
-
ref: listRef
|
|
467
|
-
}, isLoading ? /*#__PURE__*/React__default.createElement(SkeletonSet, {
|
|
468
|
-
count: skeletonCount
|
|
469
|
-
}) : filterData === null || filterData === void 0 ? void 0 : filterData.map((item, index) => /*#__PURE__*/React__default.createElement(ListElementWithCheckbox, {
|
|
470
|
-
key: index,
|
|
471
|
-
onSelect: onSelect,
|
|
472
|
-
item: item
|
|
473
|
-
})), hasActiveShowMore && /*#__PURE__*/React__default.createElement("li", {
|
|
474
|
-
className: "filterList__showMoreLi"
|
|
475
|
-
}, /*#__PURE__*/React__default.createElement(LinkButton, {
|
|
476
|
-
tabIndex: 0,
|
|
477
|
-
ariaLabel: showMoreText,
|
|
478
|
-
onClick: onShowMoreHandler,
|
|
479
|
-
className: "filterList__showMoreLink"
|
|
480
|
-
}, showMoreText)))));
|
|
481
|
-
}
|
|
482
|
-
FilterList.defaultProps = {
|
|
483
|
-
data: {
|
|
484
|
-
data: []
|
|
485
|
-
},
|
|
486
|
-
onSelect: noop,
|
|
487
|
-
skeletonCount: 5,
|
|
488
|
-
showMoreIsLoading: false
|
|
489
|
-
};
|
|
490
|
-
FilterList.propTypes = {
|
|
491
|
-
/**
|
|
492
|
-
* data structure for secondary filter
|
|
493
|
-
*/
|
|
494
|
-
data: propTypesExports.shape({
|
|
495
|
-
sectionNameText: propTypesExports.string,
|
|
496
|
-
onChange: propTypesExports.func,
|
|
497
|
-
hasActiveShowMore: propTypesExports.bool,
|
|
498
|
-
showMoreText: propTypesExports.string,
|
|
499
|
-
showMoreIsLoading: propTypesExports.bool,
|
|
500
|
-
onShowMoreClick: propTypesExports.func,
|
|
501
|
-
isLoading: propTypesExports.bool,
|
|
502
|
-
data: propTypesExports.arrayOf(propTypesExports.shape({
|
|
503
|
-
name: propTypesExports.string,
|
|
504
|
-
value: propTypesExports.string,
|
|
505
|
-
checked: propTypesExports.bool,
|
|
506
|
-
icon: propTypesExports.string
|
|
507
|
-
}))
|
|
508
|
-
}),
|
|
509
|
-
skeleton: propTypesExports.element,
|
|
510
|
-
onSelect: propTypesExports.func,
|
|
511
|
-
skeletonCount: propTypesExports.number
|
|
512
|
-
};
|
|
513
|
-
|
|
514
500
|
function Content(_ref) {
|
|
515
501
|
let {
|
|
516
502
|
data,
|
|
@@ -594,7 +580,7 @@ function Content(_ref) {
|
|
|
594
580
|
Content.defaultProps = {};
|
|
595
581
|
Content.propTypes = {};
|
|
596
582
|
|
|
597
|
-
var css_248z = "[data-gene-ui-version=\"
|
|
583
|
+
var css_248z = "[data-gene-ui-version=\"2.12.2\"] .advancedSearch{margin-left:auto;margin-right:0;min-height:3.6rem;min-width:10rem;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}[data-gene-ui-version=\"2.12.2\"] .advancedSearch-left{margin-left:0;margin-right:auto}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__wrapper{color:rgba(var(--background-sc-rgb),.75);left:auto;max-width:var(--advanced-search-width);position:absolute;right:0;top:0;width:100vw}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__wrapper-left{left:0;right:auto}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__popover{min-height:50rem;width:var(--advanced-search-width)}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__content{color:rgba(var(--background-sc-rgb),.75);display:flex;height:52rem;justify-content:space-between;max-height:50rem!important}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__searchResult{flex-grow:3;height:auto;max-height:100%}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__searchResult-border{border-left:none;border-right:1px solid rgba(var(--background-sc-rgb),.3)}[data-gene-ui-version=\"2.12.2\"] [dir=rtl] .advancedSearch__searchResult-border{border-left:1px solid rgba(var(--background-sc-rgb),.3);border-right:none}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__filters{width:27rem}[data-gene-ui-version=\"2.12.2\"] .advancedSearch__divider{border-bottom:1px solid rgba(var(--background-sc-rgb),.3)}[data-gene-ui-version=\"2.12.2\"] .filterList__filter{height:50%;min-height:50%;padding:.8rem 0;padding-inline-end:0;width:100%}[data-gene-ui-version=\"2.12.2\"] .filterList__filterHeader{font-size:1.2rem;padding:.8rem}[data-gene-ui-version=\"2.12.2\"] .filterList__filterList{display:flex;flex-direction:column}[data-gene-ui-version=\"2.12.2\"] .filterList__showMoreLi{margin:.8rem}[data-gene-ui-version=\"2.12.2\"] .filterList__showMoreLink{padding:.4rem .8rem}[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox{align-items:center;display:flex;flex-wrap:nowrap;height:4rem;padding:0 1.6rem}[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox-hover,[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox:hover{background:rgba(var(--background-sc-rgb),.03)}[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox__label{align-items:center;cursor:pointer;display:flex;-webkit-user-select:none;user-select:none;width:100%}[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox__icon,[data-gene-ui-version=\"2.12.2\"] .listElementWithCheckbox__name{margin-inline-start:.8rem}[data-gene-ui-version=\"2.12.2\"] .searchResult{height:100%;padding:.8rem 0;padding-inline-end:0;position:relative}[data-gene-ui-version=\"2.12.2\"] .searchResult__scrollbar{height:100%}[data-gene-ui-version=\"2.12.2\"] .searchResult__scrollbar-loading{visibility:hidden}[data-gene-ui-version=\"2.12.2\"] .searchResult__header{align-items:center;display:flex;justify-content:flex-start;padding:.8rem;width:100%}[data-gene-ui-version=\"2.12.2\"] .searchResult__list{width:100%}[data-gene-ui-version=\"2.12.2\"] .searchResult__text{font-size:1.2rem}[data-gene-ui-version=\"2.12.2\"] .searchResult__badge{margin-inline-start:.8rem}[data-gene-ui-version=\"2.12.2\"] .searchResult__showMoreLi{margin:.8rem;padding:.8rem 0;padding-inline-start:.8rem}[data-gene-ui-version=\"2.12.2\"] .searchResult__showMoreLink{padding:.4rem}[data-gene-ui-version=\"2.12.2\"] .searchResult__empty{height:calc(100% - 5.5rem)}[data-gene-ui-version=\"2.12.2\"] .searchResultRow{align-items:center;display:flex;height:4.5rem;justify-content:space-between;margin:.4rem 0;max-width:100%;padding:.4rem .8rem;width:100%}[data-gene-ui-version=\"2.12.2\"] .searchResultRow-hover,[data-gene-ui-version=\"2.12.2\"] .searchResultRow:hover{background:rgba(var(--background-sc-rgb),.03)}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__icon{padding:0 .8rem}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__info{display:flex;flex-direction:column;flex-grow:2;height:100%;justify-content:space-between;overflow:hidden;padding-inline-start:.8rem;width:100%}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__titleWrapper{align-items:center;display:flex;font-weight:600}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__id{color:rgba(var(--background-sc-rgb),.6);margin-inline-end:.8rem}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__title{color:var(--background-sc-rgb)}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__nameWrapper{align-items:center;color:rgba(var(--background-sc-rgb),.6);display:flex;flex-wrap:nowrap}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__name{font-size:1.2rem;white-space:nowrap}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__dateSeparator{font-size:1.2rem;padding-top:.3rem}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__dateWrapper{align-items:center;display:flex;font-size:1rem;padding-top:.3rem}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__dateText{font-style:italic;margin-inline-end:.4rem}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__actions{display:flex;height:100%}[data-gene-ui-version=\"2.12.2\"] .searchResultRow__action{color:var(--hero);cursor:pointer;margin:0 .4rem}[data-gene-ui-version=\"2.12.2\"] .skeleton{height:100%;left:0;position:absolute;top:0;width:100%}[data-gene-ui-version=\"2.12.2\"] .skeleton__filter{align-items:center;display:flex;flex-wrap:nowrap;height:4rem;padding:0 .8rem}[data-gene-ui-version=\"2.12.2\"] .skeleton__searchElement{align-items:center;display:flex;height:44px;margin:1.5rem .8rem;padding-inline-end:.8rem}";
|
|
598
584
|
styleInject(css_248z);
|
|
599
585
|
|
|
600
586
|
function AdvancedSearch(_ref) {
|
|
@@ -719,142 +705,142 @@ AdvancedSearch.propTypes = {
|
|
|
719
705
|
* If set to 'right', it will stretch from right to left, and if set to 'left', it will stretch from left to right.
|
|
720
706
|
* By default, the component stretches from right to left.
|
|
721
707
|
*/
|
|
722
|
-
position:
|
|
708
|
+
position: PropTypes.oneOf(Object.values(advancedSearchConfig.positions)),
|
|
723
709
|
/**
|
|
724
710
|
* Width of closed AdvancedSearch input.
|
|
725
711
|
* if you set number it will be px, or you can set string for Example 20vw
|
|
726
712
|
*/
|
|
727
|
-
closedInputWidth:
|
|
713
|
+
closedInputWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
728
714
|
/**
|
|
729
715
|
* Width of opened AdvancedSearch input.
|
|
730
716
|
* It can be only with a number and it will be converted to vw(viewport's width), which is equal to viewport %
|
|
731
717
|
*/
|
|
732
|
-
openedInputWidth:
|
|
718
|
+
openedInputWidth: PropTypes.number,
|
|
733
719
|
/**
|
|
734
720
|
* See ExtendedInput components docs
|
|
735
721
|
*/
|
|
736
|
-
extendedInputConfigs:
|
|
722
|
+
extendedInputConfigs: PropTypes.shape({
|
|
737
723
|
...ExtendedInput.propTypes
|
|
738
724
|
}),
|
|
739
725
|
/**
|
|
740
726
|
* data structure for primary filter
|
|
741
727
|
*/
|
|
742
|
-
primaryFilterData:
|
|
743
|
-
sectionNameText:
|
|
744
|
-
onChange:
|
|
745
|
-
hasActiveShowMore:
|
|
746
|
-
showMoreText:
|
|
747
|
-
showMoreIsLoading:
|
|
748
|
-
onShowMoreClick:
|
|
749
|
-
isLoading:
|
|
750
|
-
data:
|
|
751
|
-
name:
|
|
752
|
-
value:
|
|
753
|
-
checked:
|
|
754
|
-
icon:
|
|
728
|
+
primaryFilterData: PropTypes.shape({
|
|
729
|
+
sectionNameText: PropTypes.string,
|
|
730
|
+
onChange: PropTypes.func,
|
|
731
|
+
hasActiveShowMore: PropTypes.bool,
|
|
732
|
+
showMoreText: PropTypes.string,
|
|
733
|
+
showMoreIsLoading: PropTypes.bool,
|
|
734
|
+
onShowMoreClick: PropTypes.func,
|
|
735
|
+
isLoading: PropTypes.bool,
|
|
736
|
+
data: PropTypes.arrayOf(PropTypes.shape({
|
|
737
|
+
name: PropTypes.string,
|
|
738
|
+
value: PropTypes.string,
|
|
739
|
+
checked: PropTypes.bool,
|
|
740
|
+
icon: PropTypes.string
|
|
755
741
|
}))
|
|
756
742
|
}),
|
|
757
743
|
/**
|
|
758
744
|
* data structure for secondary filter
|
|
759
745
|
*/
|
|
760
|
-
secondaryFilterData:
|
|
761
|
-
sectionNameText:
|
|
762
|
-
onChange:
|
|
763
|
-
hasActiveShowMore:
|
|
764
|
-
showMoreText:
|
|
765
|
-
showMoreIsLoading:
|
|
766
|
-
onShowMoreClick:
|
|
767
|
-
isLoading:
|
|
768
|
-
data:
|
|
769
|
-
name:
|
|
770
|
-
value:
|
|
771
|
-
checked:
|
|
772
|
-
icon:
|
|
746
|
+
secondaryFilterData: PropTypes.shape({
|
|
747
|
+
sectionNameText: PropTypes.string,
|
|
748
|
+
onChange: PropTypes.func,
|
|
749
|
+
hasActiveShowMore: PropTypes.bool,
|
|
750
|
+
showMoreText: PropTypes.string,
|
|
751
|
+
showMoreIsLoading: PropTypes.bool,
|
|
752
|
+
onShowMoreClick: PropTypes.func,
|
|
753
|
+
isLoading: PropTypes.bool,
|
|
754
|
+
data: PropTypes.arrayOf(PropTypes.shape({
|
|
755
|
+
name: PropTypes.string,
|
|
756
|
+
value: PropTypes.string,
|
|
757
|
+
checked: PropTypes.bool,
|
|
758
|
+
icon: PropTypes.string
|
|
773
759
|
}))
|
|
774
760
|
}),
|
|
775
761
|
/**
|
|
776
762
|
* Fires an event when input changes and returns value of input (used 300ms debounce)
|
|
777
763
|
*/
|
|
778
|
-
onSearch:
|
|
764
|
+
onSearch: PropTypes.func,
|
|
779
765
|
// Pass typed value using some debounce
|
|
780
766
|
/**
|
|
781
767
|
* If search field is empty, initialDataDescription is describing witch data is showing by default for example (Recently modified data).
|
|
782
768
|
*/
|
|
783
|
-
initialDataDescription:
|
|
769
|
+
initialDataDescription: PropTypes.string,
|
|
784
770
|
/**
|
|
785
771
|
* If search field is empty, will show initialData for example (Recently modified data).
|
|
786
772
|
*/
|
|
787
|
-
initialData:
|
|
788
|
-
icon:
|
|
789
|
-
id:
|
|
790
|
-
title:
|
|
791
|
-
type:
|
|
792
|
-
name:
|
|
793
|
-
date:
|
|
794
|
-
labelText:
|
|
795
|
-
date:
|
|
773
|
+
initialData: PropTypes.arrayOf(PropTypes.shape({
|
|
774
|
+
icon: PropTypes.string,
|
|
775
|
+
id: PropTypes.string,
|
|
776
|
+
title: PropTypes.string,
|
|
777
|
+
type: PropTypes.string,
|
|
778
|
+
name: PropTypes.string,
|
|
779
|
+
date: PropTypes.shape({
|
|
780
|
+
labelText: PropTypes.string,
|
|
781
|
+
date: PropTypes.oneOfType([PropTypes.instanceOf(dayjs), PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number])
|
|
796
782
|
}),
|
|
797
|
-
actions:
|
|
798
|
-
name:
|
|
799
|
-
icon:
|
|
800
|
-
onClick:
|
|
783
|
+
actions: PropTypes.arrayOf(PropTypes.shape({
|
|
784
|
+
name: PropTypes.string,
|
|
785
|
+
icon: PropTypes.string,
|
|
786
|
+
onClick: PropTypes.func
|
|
801
787
|
}))
|
|
802
788
|
})),
|
|
803
789
|
/**
|
|
804
790
|
* if hasActive hasActiveShowMore is true you will see show more link under search result
|
|
805
791
|
*/
|
|
806
|
-
hasActiveShowMore:
|
|
792
|
+
hasActiveShowMore: PropTypes.bool,
|
|
807
793
|
/**
|
|
808
794
|
* text for link under search result
|
|
809
795
|
*/
|
|
810
|
-
showMoreText:
|
|
796
|
+
showMoreText: PropTypes.string,
|
|
811
797
|
/**
|
|
812
798
|
* To control showMore loading state
|
|
813
799
|
*/
|
|
814
|
-
showMoreIsLoading:
|
|
800
|
+
showMoreIsLoading: PropTypes.bool,
|
|
815
801
|
/**
|
|
816
802
|
* Fires an event when clicked on link under search result
|
|
817
803
|
*/
|
|
818
|
-
onShowMoreClick:
|
|
804
|
+
onShowMoreClick: PropTypes.func,
|
|
819
805
|
/**
|
|
820
806
|
* search loading state
|
|
821
807
|
*/
|
|
822
|
-
isSearchLoading:
|
|
808
|
+
isSearchLoading: PropTypes.bool,
|
|
823
809
|
/**
|
|
824
810
|
* total count of data to show in badge
|
|
825
811
|
*/
|
|
826
|
-
totalCount:
|
|
812
|
+
totalCount: PropTypes.number,
|
|
827
813
|
/**
|
|
828
814
|
* total max count of data to show totalCountMax+ in badge
|
|
829
815
|
*/
|
|
830
|
-
totalCountMax:
|
|
816
|
+
totalCountMax: PropTypes.number,
|
|
831
817
|
/**
|
|
832
818
|
* label text for badge component
|
|
833
819
|
*/
|
|
834
|
-
totalCountText:
|
|
820
|
+
totalCountText: PropTypes.string,
|
|
835
821
|
/**
|
|
836
822
|
* data structure
|
|
837
823
|
* */
|
|
838
|
-
data:
|
|
839
|
-
icon:
|
|
840
|
-
id:
|
|
841
|
-
title:
|
|
842
|
-
type:
|
|
843
|
-
name:
|
|
844
|
-
date:
|
|
845
|
-
labelText:
|
|
846
|
-
date:
|
|
824
|
+
data: PropTypes.arrayOf(PropTypes.shape({
|
|
825
|
+
icon: PropTypes.string,
|
|
826
|
+
id: PropTypes.string,
|
|
827
|
+
title: PropTypes.string,
|
|
828
|
+
type: PropTypes.string,
|
|
829
|
+
name: PropTypes.string,
|
|
830
|
+
date: PropTypes.shape({
|
|
831
|
+
labelText: PropTypes.string,
|
|
832
|
+
date: PropTypes.oneOfType([PropTypes.instanceOf(dayjs), PropTypes.instanceOf(Date), PropTypes.string, PropTypes.number])
|
|
847
833
|
}),
|
|
848
|
-
actions:
|
|
849
|
-
name:
|
|
850
|
-
icon:
|
|
851
|
-
onClick:
|
|
834
|
+
actions: PropTypes.arrayOf(PropTypes.shape({
|
|
835
|
+
name: PropTypes.string,
|
|
836
|
+
icon: PropTypes.string,
|
|
837
|
+
onClick: PropTypes.func
|
|
852
838
|
}))
|
|
853
839
|
})),
|
|
854
840
|
/**
|
|
855
841
|
* text for no data to display
|
|
856
842
|
*/
|
|
857
|
-
noDataText:
|
|
843
|
+
noDataText: PropTypes.string
|
|
858
844
|
};
|
|
859
845
|
AdvancedSearch.defaultProps = {
|
|
860
846
|
onSearch: noop,
|