@elliemae/ds-search-field 2.0.0-next.7 → 2.0.0-rc.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/cjs/DSSearchField.js +62 -59
- package/cjs/impl/DSSeachFieldImpl.js +9 -2
- package/cjs/impl/components/AdvanceSearchOption/AdvanceSearchOption.js +14 -11
- package/cjs/impl/components/LookupIndicator/LookupIndicator.js +20 -18
- package/cjs/impl/components/ModalSearchField/DataGridSearch.js +11 -7
- package/cjs/impl/components/ModalSearchField/ModalSearchField.js +69 -61
- package/esm/DSSearchField.js +61 -58
- package/esm/impl/DSSeachFieldImpl.js +8 -1
- package/esm/impl/components/AdvanceSearchOption/AdvanceSearchOption.js +14 -11
- package/esm/impl/components/LookupIndicator/LookupIndicator.js +20 -17
- package/esm/impl/components/ModalSearchField/DataGridSearch.js +10 -5
- package/esm/impl/components/ModalSearchField/ModalSearchField.js +69 -61
- package/package.json +9 -14
- package/types/DSSearchField.d.ts +1 -1
- package/types/impl/components/AdvanceSearchOption/AdvanceSearchOption.d.ts +1 -1
- package/types/impl/components/LookupIndicator/LookupIndicator.d.ts +1 -1
- package/types/impl/components/ModalSearchField/ModalSearchField.d.ts +1 -1
package/cjs/DSSearchField.js
CHANGED
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
require('react');
|
|
7
7
|
var reactDesc = require('react-desc');
|
|
8
|
-
var
|
|
8
|
+
var dsTabs = require('@elliemae/ds-tabs');
|
|
9
9
|
var DSSeachFieldImpl = require('./impl/DSSeachFieldImpl.js');
|
|
10
10
|
var ModalSearchField = require('./impl/components/ModalSearchField/ModalSearchField.js');
|
|
11
11
|
|
|
@@ -13,63 +13,66 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
13
13
|
|
|
14
14
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
15
15
|
|
|
16
|
-
const DSSearchField =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
16
|
+
const DSSearchField = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
containerProps = {},
|
|
19
|
+
onChange = () => null,
|
|
20
|
+
searchOptionLabel = 'Advanced Search',
|
|
21
|
+
placeholder = 'Select field',
|
|
22
|
+
modalSize = 'x-large',
|
|
23
|
+
modalTitle = 'Search Field ID',
|
|
24
|
+
tabsAnimated = true,
|
|
25
|
+
tabsEnableMouseEvents = true,
|
|
26
|
+
tabType = dsTabs.TabTypes.NORMAL,
|
|
27
|
+
tabData = [],
|
|
28
|
+
searchGrid = false,
|
|
29
|
+
searchFilters = true,
|
|
30
|
+
confirmLabel = 'Apply',
|
|
31
|
+
rejectLabel = 'Cancel',
|
|
32
|
+
modalType = 'confirm',
|
|
33
|
+
onConfirmField = () => null,
|
|
34
|
+
onRejectField = () => null,
|
|
35
|
+
onTabChange = () => null,
|
|
36
|
+
appElement = '#root',
|
|
37
|
+
value = null,
|
|
38
|
+
additionalInfo = null,
|
|
39
|
+
displayProperty = 'name',
|
|
40
|
+
dropdownOptions = [],
|
|
41
|
+
customDataGridOptions = {},
|
|
42
|
+
customDropdownOptions = {},
|
|
43
|
+
useLookupIndicator = true,
|
|
44
|
+
searchable = false
|
|
45
|
+
} = _ref;
|
|
46
|
+
return /*#__PURE__*/_jsx__default["default"](DSSeachFieldImpl["default"], {
|
|
47
|
+
additionalInfo: additionalInfo,
|
|
48
|
+
appElement: appElement,
|
|
49
|
+
searchable: searchable,
|
|
50
|
+
confirmLabel: confirmLabel,
|
|
51
|
+
containerProps: containerProps,
|
|
52
|
+
customDataGridOptions: customDataGridOptions,
|
|
53
|
+
customDropdownOptions: customDropdownOptions,
|
|
54
|
+
displayProperty: displayProperty,
|
|
55
|
+
dropdownOptions: dropdownOptions,
|
|
56
|
+
modalSize: modalSize,
|
|
57
|
+
modalTitle: modalTitle,
|
|
58
|
+
modalType: modalType,
|
|
59
|
+
onChange: onChange,
|
|
60
|
+
onConfirmField: onConfirmField,
|
|
61
|
+
onRejectField: onRejectField,
|
|
62
|
+
onTabChange: onTabChange,
|
|
63
|
+
placeholder: placeholder,
|
|
64
|
+
rejectLabel: rejectLabel,
|
|
65
|
+
searchFilters: searchFilters,
|
|
66
|
+
searchGrid: searchGrid,
|
|
67
|
+
searchOptionLabel: searchOptionLabel,
|
|
68
|
+
tabData: tabData,
|
|
69
|
+
tabsAnimated: tabsAnimated,
|
|
70
|
+
tabsEnableMouseEvents: tabsEnableMouseEvents,
|
|
71
|
+
tabType: tabType,
|
|
72
|
+
useLookupIndicator: useLookupIndicator,
|
|
73
|
+
value: value
|
|
74
|
+
});
|
|
75
|
+
};
|
|
73
76
|
|
|
74
77
|
const props = {
|
|
75
78
|
/*
|
|
@@ -102,7 +105,7 @@ const props = {
|
|
|
102
105
|
tabsEnableMouseEvents: reactDesc.PropTypes.bool.description('enable mouse event on tabs'),
|
|
103
106
|
|
|
104
107
|
/** tab types on modal */
|
|
105
|
-
tabType: reactDesc.PropTypes.oneOf([
|
|
108
|
+
tabType: reactDesc.PropTypes.oneOf([dsTabs.TabTypes.NORMAL, dsTabs.TabTypes.SUBTABS]).description('tab types on modal'),
|
|
106
109
|
|
|
107
110
|
/** data for modal tabs */
|
|
108
111
|
tabData: reactDesc.PropTypes.array.description('data for modal tabs'),
|
|
@@ -5,10 +5,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
7
7
|
require('core-js/modules/web.dom-collections.iterator.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.find.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.find.js');
|
|
11
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
13
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
14
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
8
15
|
var react = require('react');
|
|
9
16
|
var reactSelect = require('react-select');
|
|
10
17
|
var dsClassnames = require('@elliemae/ds-classnames');
|
|
11
|
-
var
|
|
18
|
+
var dsForm = require('@elliemae/ds-form');
|
|
12
19
|
var ModalSearchField = require('./components/ModalSearchField/ModalSearchField.js');
|
|
13
20
|
var AdvanceSearchOption = require('./components/AdvanceSearchOption/AdvanceSearchOption.js');
|
|
14
21
|
var LookupIndicator = require('./components/LookupIndicator/LookupIndicator.js');
|
|
@@ -193,7 +200,7 @@ class DSSearchFieldImpl extends react.Component {
|
|
|
193
200
|
className: "".concat(cssClassName),
|
|
194
201
|
children: [/*#__PURE__*/_jsx__default["default"]("div", {
|
|
195
202
|
className: "".concat(classNameBlock('container-selector'))
|
|
196
|
-
}, void 0, /*#__PURE__*/jsxRuntime.jsx(
|
|
203
|
+
}, void 0, /*#__PURE__*/jsxRuntime.jsx(dsForm.DSComboBox2, _objectSpread({
|
|
197
204
|
className: "".concat(classNameElement('dropdown-field-selector')),
|
|
198
205
|
components: customComponents,
|
|
199
206
|
onChange: this.onChangeDropdown,
|
|
@@ -2,22 +2,25 @@
|
|
|
2
2
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
4
|
require('react');
|
|
5
|
-
var DSButton = require('@elliemae/ds-
|
|
5
|
+
var DSButton = require('@elliemae/ds-button');
|
|
6
6
|
|
|
7
7
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
8
|
|
|
9
9
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
10
10
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
11
11
|
|
|
12
|
-
const AdvanceSearchOption =
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
12
|
+
const AdvanceSearchOption = _ref => {
|
|
13
|
+
let {
|
|
14
|
+
advanceSearchLabel = 'Advanced Search',
|
|
15
|
+
onAdvanceSearchClick = () => null
|
|
16
|
+
} = _ref;
|
|
17
|
+
return /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
18
|
+
className: "advance-search-option-btn",
|
|
19
|
+
labelText: advanceSearchLabel,
|
|
20
|
+
onClick: onAdvanceSearchClick,
|
|
21
|
+
tabIndex: -1,
|
|
22
|
+
type: "button"
|
|
23
|
+
});
|
|
24
|
+
};
|
|
22
25
|
|
|
23
26
|
module.exports = AdvanceSearchOption;
|
|
@@ -2,31 +2,33 @@
|
|
|
2
2
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
4
|
require('react');
|
|
5
|
-
var
|
|
6
|
-
var DSButton = require('@elliemae/ds-
|
|
5
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
6
|
+
var DSButton = require('@elliemae/ds-button');
|
|
7
7
|
|
|
8
8
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
9
|
|
|
10
10
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
11
|
-
var Search__default = /*#__PURE__*/_interopDefaultLegacy(Search);
|
|
12
11
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
13
12
|
|
|
14
13
|
var _Search;
|
|
15
14
|
|
|
16
|
-
const LookupIndicator =
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
e
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
15
|
+
const LookupIndicator = _ref => {
|
|
16
|
+
let {
|
|
17
|
+
onAdvanceSearchClick = () => null,
|
|
18
|
+
className = ''
|
|
19
|
+
} = _ref;
|
|
20
|
+
return /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
21
|
+
"data-testid": "ds-searchfield-search-btn",
|
|
22
|
+
buttonType: "secondary",
|
|
23
|
+
className: className,
|
|
24
|
+
icon: _Search || (_Search = /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {})),
|
|
25
|
+
iconSize: "s",
|
|
26
|
+
onClick: e => {
|
|
27
|
+
e.stopPropagation();
|
|
28
|
+
e.preventDefault();
|
|
29
|
+
onAdvanceSearchClick();
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
};
|
|
31
33
|
|
|
32
34
|
module.exports = LookupIndicator;
|
|
@@ -4,9 +4,14 @@ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
|
4
4
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
5
5
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
6
6
|
require('core-js/modules/web.dom-collections.iterator.js');
|
|
7
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
7
12
|
var react = require('react');
|
|
8
|
-
var DSToolbar = require('@elliemae/ds-
|
|
9
|
-
var
|
|
13
|
+
var DSToolbar = require('@elliemae/ds-toolbar');
|
|
14
|
+
var dsForm = require('@elliemae/ds-form');
|
|
10
15
|
var dsDatagrids = require('@elliemae/ds-datagrids');
|
|
11
16
|
var uid = require('uid');
|
|
12
17
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -17,7 +22,6 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
|
|
|
17
22
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
18
23
|
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
19
24
|
var DSToolbar__default = /*#__PURE__*/_interopDefaultLegacy(DSToolbar);
|
|
20
|
-
var DSSearchBox__default = /*#__PURE__*/_interopDefaultLegacy(DSSearchBox);
|
|
21
25
|
|
|
22
26
|
const _excluded = ["onFiltersChange"];
|
|
23
27
|
|
|
@@ -34,14 +38,14 @@ class DataGridSearch extends react.Component {
|
|
|
34
38
|
this.handleFiltersChange = this.handleFiltersChange.bind(this);
|
|
35
39
|
}
|
|
36
40
|
|
|
37
|
-
handleSearch(
|
|
41
|
+
handleSearch() {
|
|
38
42
|
const {
|
|
39
43
|
customDataGridOptions
|
|
40
44
|
} = this.props;
|
|
41
45
|
const {
|
|
42
46
|
property,
|
|
43
47
|
value
|
|
44
|
-
} =
|
|
48
|
+
} = arguments.length <= 0 ? undefined : arguments[0];
|
|
45
49
|
const {
|
|
46
50
|
filters
|
|
47
51
|
} = this.state;
|
|
@@ -53,7 +57,7 @@ class DataGridSearch extends react.Component {
|
|
|
53
57
|
id: uid.uid(16)
|
|
54
58
|
}]
|
|
55
59
|
});
|
|
56
|
-
if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...
|
|
60
|
+
if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...arguments);
|
|
57
61
|
}
|
|
58
62
|
|
|
59
63
|
handleFiltersChange(nextFilters) {
|
|
@@ -86,7 +90,7 @@ class DataGridSearch extends react.Component {
|
|
|
86
90
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
87
91
|
children: [/*#__PURE__*/_jsx__default["default"](DSToolbar__default["default"], {
|
|
88
92
|
withDepth: false
|
|
89
|
-
}, void 0, /*#__PURE__*/_jsx__default["default"](DSToolbar.ToolbarGroup, {}, void 0, /*#__PURE__*/_jsx__default["default"](
|
|
93
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](DSToolbar.ToolbarGroup, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSSearchBox, {
|
|
90
94
|
cleanOnSearch: true,
|
|
91
95
|
onSearch: this.handleSearch,
|
|
92
96
|
placeholder: "Search all"
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
4
6
|
require('react');
|
|
5
7
|
var DSModal = require('@elliemae/ds-modal');
|
|
6
|
-
var
|
|
8
|
+
var dsTabs = require('@elliemae/ds-tabs');
|
|
7
9
|
var DataGridSearch = require('./DataGridSearch.js');
|
|
8
10
|
|
|
9
11
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -11,65 +13,71 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
11
13
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
12
14
|
var DSModal__default = /*#__PURE__*/_interopDefaultLegacy(DSModal);
|
|
13
15
|
|
|
14
|
-
const ModalSearchField =
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
16
|
+
const ModalSearchField = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
isOpen = false,
|
|
19
|
+
onClose = () => null,
|
|
20
|
+
modalTitle = 'Search Field ID',
|
|
21
|
+
modalSize = 'x-large',
|
|
22
|
+
tabsAnimated = true,
|
|
23
|
+
tabsEnableMouseEvents = true,
|
|
24
|
+
tabType = dsTabs.TabTypes.NORMAL,
|
|
25
|
+
tabData = [],
|
|
26
|
+
searchFilters = true,
|
|
27
|
+
searchGrid = false,
|
|
28
|
+
confirmLabel = 'Apply',
|
|
29
|
+
rejectLabel = 'Cancel',
|
|
30
|
+
modalType = 'confirm',
|
|
31
|
+
onConfirmField = () => null,
|
|
32
|
+
onRejectField = () => null,
|
|
33
|
+
handleSelect = () => null,
|
|
34
|
+
onTabChange = () => null,
|
|
35
|
+
appElement = null,
|
|
36
|
+
customDataGridOptions = {}
|
|
37
|
+
} = _ref;
|
|
38
|
+
return /*#__PURE__*/_jsx__default["default"](DSModal__default["default"], {
|
|
39
|
+
dataTestId: "ds-searchfield-modal",
|
|
40
|
+
appElement: appElement,
|
|
41
|
+
centered: false,
|
|
42
|
+
className: "modal-search-field",
|
|
43
|
+
confirmLabel: confirmLabel,
|
|
44
|
+
isOpen: isOpen,
|
|
45
|
+
modalTitle: modalTitle,
|
|
46
|
+
modalType: modalType,
|
|
47
|
+
onClose: onClose,
|
|
48
|
+
onConfirm: onConfirmField,
|
|
49
|
+
onReject: onRejectField,
|
|
50
|
+
rejectLabel: rejectLabel,
|
|
51
|
+
size: modalSize
|
|
52
|
+
}, void 0, tabData.length > 0 && /*#__PURE__*/_jsx__default["default"](dsTabs.DSTabs, {
|
|
53
|
+
animated: tabsAnimated,
|
|
54
|
+
enableMouseEvents: tabsEnableMouseEvents,
|
|
55
|
+
onlyRenderActiveTab: true,
|
|
56
|
+
onTabChange: onTabChange,
|
|
57
|
+
type: tabType
|
|
58
|
+
}, void 0, tabData.map(_ref2 => {
|
|
59
|
+
let {
|
|
60
|
+
tabId,
|
|
61
|
+
tabTitle,
|
|
62
|
+
columns,
|
|
63
|
+
rows,
|
|
64
|
+
boundFetchRows
|
|
65
|
+
} = _ref2;
|
|
66
|
+
return /*#__PURE__*/_jsx__default["default"](dsTabs.DSTab, {
|
|
67
|
+
className: "tab-content",
|
|
68
|
+
tabId: tabId,
|
|
69
|
+
title: tabTitle
|
|
70
|
+
}, tabId, /*#__PURE__*/_jsx__default["default"](DataGridSearch, {
|
|
71
|
+
boundFetchRows: boundFetchRows,
|
|
72
|
+
columns: columns,
|
|
73
|
+
customDataGridOptions: customDataGridOptions,
|
|
74
|
+
handleSelect: handleSelect,
|
|
75
|
+
id: "datagrid_search_field_".concat(tabId),
|
|
76
|
+
rows: rows,
|
|
77
|
+
searchFilters: searchFilters,
|
|
78
|
+
searchGrid: searchGrid
|
|
79
|
+
}));
|
|
80
|
+
})));
|
|
81
|
+
};
|
|
74
82
|
|
|
75
83
|
module.exports = ModalSearchField;
|
package/esm/DSSearchField.js
CHANGED
|
@@ -1,67 +1,70 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import 'react';
|
|
3
3
|
import { PropTypes, describe } from 'react-desc';
|
|
4
|
-
import { TabTypes } from '@elliemae/ds-
|
|
4
|
+
import { TabTypes } from '@elliemae/ds-tabs';
|
|
5
5
|
import DSSearchFieldImpl from './impl/DSSeachFieldImpl.js';
|
|
6
6
|
export { default as DSModalSearchField } from './impl/components/ModalSearchField/ModalSearchField.js';
|
|
7
7
|
|
|
8
|
-
const DSSearchField =
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
8
|
+
const DSSearchField = _ref => {
|
|
9
|
+
let {
|
|
10
|
+
containerProps = {},
|
|
11
|
+
onChange = () => null,
|
|
12
|
+
searchOptionLabel = 'Advanced Search',
|
|
13
|
+
placeholder = 'Select field',
|
|
14
|
+
modalSize = 'x-large',
|
|
15
|
+
modalTitle = 'Search Field ID',
|
|
16
|
+
tabsAnimated = true,
|
|
17
|
+
tabsEnableMouseEvents = true,
|
|
18
|
+
tabType = TabTypes.NORMAL,
|
|
19
|
+
tabData = [],
|
|
20
|
+
searchGrid = false,
|
|
21
|
+
searchFilters = true,
|
|
22
|
+
confirmLabel = 'Apply',
|
|
23
|
+
rejectLabel = 'Cancel',
|
|
24
|
+
modalType = 'confirm',
|
|
25
|
+
onConfirmField = () => null,
|
|
26
|
+
onRejectField = () => null,
|
|
27
|
+
onTabChange = () => null,
|
|
28
|
+
appElement = '#root',
|
|
29
|
+
value = null,
|
|
30
|
+
additionalInfo = null,
|
|
31
|
+
displayProperty = 'name',
|
|
32
|
+
dropdownOptions = [],
|
|
33
|
+
customDataGridOptions = {},
|
|
34
|
+
customDropdownOptions = {},
|
|
35
|
+
useLookupIndicator = true,
|
|
36
|
+
searchable = false
|
|
37
|
+
} = _ref;
|
|
38
|
+
return /*#__PURE__*/_jsx(DSSearchFieldImpl, {
|
|
39
|
+
additionalInfo: additionalInfo,
|
|
40
|
+
appElement: appElement,
|
|
41
|
+
searchable: searchable,
|
|
42
|
+
confirmLabel: confirmLabel,
|
|
43
|
+
containerProps: containerProps,
|
|
44
|
+
customDataGridOptions: customDataGridOptions,
|
|
45
|
+
customDropdownOptions: customDropdownOptions,
|
|
46
|
+
displayProperty: displayProperty,
|
|
47
|
+
dropdownOptions: dropdownOptions,
|
|
48
|
+
modalSize: modalSize,
|
|
49
|
+
modalTitle: modalTitle,
|
|
50
|
+
modalType: modalType,
|
|
51
|
+
onChange: onChange,
|
|
52
|
+
onConfirmField: onConfirmField,
|
|
53
|
+
onRejectField: onRejectField,
|
|
54
|
+
onTabChange: onTabChange,
|
|
55
|
+
placeholder: placeholder,
|
|
56
|
+
rejectLabel: rejectLabel,
|
|
57
|
+
searchFilters: searchFilters,
|
|
58
|
+
searchGrid: searchGrid,
|
|
59
|
+
searchOptionLabel: searchOptionLabel,
|
|
60
|
+
tabData: tabData,
|
|
61
|
+
tabsAnimated: tabsAnimated,
|
|
62
|
+
tabsEnableMouseEvents: tabsEnableMouseEvents,
|
|
63
|
+
tabType: tabType,
|
|
64
|
+
useLookupIndicator: useLookupIndicator,
|
|
65
|
+
value: value
|
|
66
|
+
});
|
|
67
|
+
};
|
|
65
68
|
|
|
66
69
|
const props = {
|
|
67
70
|
/*
|
|
@@ -1,10 +1,17 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
3
3
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.find.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
6
|
+
import 'core-js/modules/esnext.iterator.find.js';
|
|
7
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
8
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
9
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
10
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
4
11
|
import { Component } from 'react';
|
|
5
12
|
import { components } from 'react-select';
|
|
6
13
|
import { convertPropToCssClassName } from '@elliemae/ds-classnames';
|
|
7
|
-
import { DSComboBox2 } from '@elliemae/ds-
|
|
14
|
+
import { DSComboBox2 } from '@elliemae/ds-form';
|
|
8
15
|
import ModalSearchField from './components/ModalSearchField/ModalSearchField.js';
|
|
9
16
|
export { default as DSModalSearchField } from './components/ModalSearchField/ModalSearchField.js';
|
|
10
17
|
import AdvanceSearchOption from './components/AdvanceSearchOption/AdvanceSearchOption.js';
|
|
@@ -1,16 +1,19 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import 'react';
|
|
3
|
-
import DSButton from '@elliemae/ds-
|
|
3
|
+
import DSButton from '@elliemae/ds-button';
|
|
4
4
|
|
|
5
|
-
const AdvanceSearchOption =
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
5
|
+
const AdvanceSearchOption = _ref => {
|
|
6
|
+
let {
|
|
7
|
+
advanceSearchLabel = 'Advanced Search',
|
|
8
|
+
onAdvanceSearchClick = () => null
|
|
9
|
+
} = _ref;
|
|
10
|
+
return /*#__PURE__*/_jsx(DSButton, {
|
|
11
|
+
className: "advance-search-option-btn",
|
|
12
|
+
labelText: advanceSearchLabel,
|
|
13
|
+
onClick: onAdvanceSearchClick,
|
|
14
|
+
tabIndex: -1,
|
|
15
|
+
type: "button"
|
|
16
|
+
});
|
|
17
|
+
};
|
|
15
18
|
|
|
16
19
|
export { AdvanceSearchOption as default };
|
|
@@ -1,24 +1,27 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
2
|
import 'react';
|
|
3
|
-
import Search from '@elliemae/ds-icons
|
|
4
|
-
import DSButton from '@elliemae/ds-
|
|
3
|
+
import { Search } from '@elliemae/ds-icons';
|
|
4
|
+
import DSButton from '@elliemae/ds-button';
|
|
5
5
|
|
|
6
6
|
var _Search;
|
|
7
7
|
|
|
8
|
-
const LookupIndicator =
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
e
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
8
|
+
const LookupIndicator = _ref => {
|
|
9
|
+
let {
|
|
10
|
+
onAdvanceSearchClick = () => null,
|
|
11
|
+
className = ''
|
|
12
|
+
} = _ref;
|
|
13
|
+
return /*#__PURE__*/_jsx(DSButton, {
|
|
14
|
+
"data-testid": "ds-searchfield-search-btn",
|
|
15
|
+
buttonType: "secondary",
|
|
16
|
+
className: className,
|
|
17
|
+
icon: _Search || (_Search = /*#__PURE__*/_jsx(Search, {})),
|
|
18
|
+
iconSize: "s",
|
|
19
|
+
onClick: e => {
|
|
20
|
+
e.stopPropagation();
|
|
21
|
+
e.preventDefault();
|
|
22
|
+
onAdvanceSearchClick();
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
};
|
|
23
26
|
|
|
24
27
|
export { LookupIndicator as default };
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
7
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
3
8
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
4
9
|
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
5
10
|
import { Component } from 'react';
|
|
6
|
-
import DSToolbar, { ToolbarGroup } from '@elliemae/ds-
|
|
7
|
-
import DSSearchBox from '@elliemae/ds-
|
|
11
|
+
import DSToolbar, { ToolbarGroup } from '@elliemae/ds-toolbar';
|
|
12
|
+
import { DSSearchBox } from '@elliemae/ds-form';
|
|
8
13
|
import { DSDataGrid } from '@elliemae/ds-datagrids';
|
|
9
14
|
import { uid } from 'uid';
|
|
10
15
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
@@ -24,14 +29,14 @@ class DataGridSearch extends Component {
|
|
|
24
29
|
this.handleFiltersChange = this.handleFiltersChange.bind(this);
|
|
25
30
|
}
|
|
26
31
|
|
|
27
|
-
handleSearch(
|
|
32
|
+
handleSearch() {
|
|
28
33
|
const {
|
|
29
34
|
customDataGridOptions
|
|
30
35
|
} = this.props;
|
|
31
36
|
const {
|
|
32
37
|
property,
|
|
33
38
|
value
|
|
34
|
-
} =
|
|
39
|
+
} = arguments.length <= 0 ? undefined : arguments[0];
|
|
35
40
|
const {
|
|
36
41
|
filters
|
|
37
42
|
} = this.state;
|
|
@@ -43,7 +48,7 @@ class DataGridSearch extends Component {
|
|
|
43
48
|
id: uid(16)
|
|
44
49
|
}]
|
|
45
50
|
});
|
|
46
|
-
if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...
|
|
51
|
+
if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...arguments);
|
|
47
52
|
}
|
|
48
53
|
|
|
49
54
|
handleFiltersChange(nextFilters) {
|
|
@@ -1,68 +1,76 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/esnext.async-iterator.map.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.map.js';
|
|
2
4
|
import 'react';
|
|
3
5
|
import DSModal from '@elliemae/ds-modal';
|
|
4
|
-
import { TabTypes, DSTabs, DSTab } from '@elliemae/ds-
|
|
6
|
+
import { TabTypes, DSTabs, DSTab } from '@elliemae/ds-tabs';
|
|
5
7
|
import DataGridSearch from './DataGridSearch.js';
|
|
6
8
|
|
|
7
|
-
const ModalSearchField =
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
9
|
+
const ModalSearchField = _ref => {
|
|
10
|
+
let {
|
|
11
|
+
isOpen = false,
|
|
12
|
+
onClose = () => null,
|
|
13
|
+
modalTitle = 'Search Field ID',
|
|
14
|
+
modalSize = 'x-large',
|
|
15
|
+
tabsAnimated = true,
|
|
16
|
+
tabsEnableMouseEvents = true,
|
|
17
|
+
tabType = TabTypes.NORMAL,
|
|
18
|
+
tabData = [],
|
|
19
|
+
searchFilters = true,
|
|
20
|
+
searchGrid = false,
|
|
21
|
+
confirmLabel = 'Apply',
|
|
22
|
+
rejectLabel = 'Cancel',
|
|
23
|
+
modalType = 'confirm',
|
|
24
|
+
onConfirmField = () => null,
|
|
25
|
+
onRejectField = () => null,
|
|
26
|
+
handleSelect = () => null,
|
|
27
|
+
onTabChange = () => null,
|
|
28
|
+
appElement = null,
|
|
29
|
+
customDataGridOptions = {}
|
|
30
|
+
} = _ref;
|
|
31
|
+
return /*#__PURE__*/_jsx(DSModal, {
|
|
32
|
+
dataTestId: "ds-searchfield-modal",
|
|
33
|
+
appElement: appElement,
|
|
34
|
+
centered: false,
|
|
35
|
+
className: "modal-search-field",
|
|
36
|
+
confirmLabel: confirmLabel,
|
|
37
|
+
isOpen: isOpen,
|
|
38
|
+
modalTitle: modalTitle,
|
|
39
|
+
modalType: modalType,
|
|
40
|
+
onClose: onClose,
|
|
41
|
+
onConfirm: onConfirmField,
|
|
42
|
+
onReject: onRejectField,
|
|
43
|
+
rejectLabel: rejectLabel,
|
|
44
|
+
size: modalSize
|
|
45
|
+
}, void 0, tabData.length > 0 && /*#__PURE__*/_jsx(DSTabs, {
|
|
46
|
+
animated: tabsAnimated,
|
|
47
|
+
enableMouseEvents: tabsEnableMouseEvents,
|
|
48
|
+
onlyRenderActiveTab: true,
|
|
49
|
+
onTabChange: onTabChange,
|
|
50
|
+
type: tabType
|
|
51
|
+
}, void 0, tabData.map(_ref2 => {
|
|
52
|
+
let {
|
|
53
|
+
tabId,
|
|
54
|
+
tabTitle,
|
|
55
|
+
columns,
|
|
56
|
+
rows,
|
|
57
|
+
boundFetchRows
|
|
58
|
+
} = _ref2;
|
|
59
|
+
return /*#__PURE__*/_jsx(DSTab, {
|
|
60
|
+
className: "tab-content",
|
|
61
|
+
tabId: tabId,
|
|
62
|
+
title: tabTitle
|
|
63
|
+
}, tabId, /*#__PURE__*/_jsx(DataGridSearch, {
|
|
64
|
+
boundFetchRows: boundFetchRows,
|
|
65
|
+
columns: columns,
|
|
66
|
+
customDataGridOptions: customDataGridOptions,
|
|
67
|
+
handleSelect: handleSelect,
|
|
68
|
+
id: "datagrid_search_field_".concat(tabId),
|
|
69
|
+
rows: rows,
|
|
70
|
+
searchFilters: searchFilters,
|
|
71
|
+
searchGrid: searchGrid
|
|
72
|
+
}));
|
|
73
|
+
})));
|
|
74
|
+
};
|
|
67
75
|
|
|
68
76
|
export { ModalSearchField as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-search-field",
|
|
3
|
-
"version": "2.0.0-
|
|
3
|
+
"version": "2.0.0-rc.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Search Field",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -56,19 +56,14 @@
|
|
|
56
56
|
"build": "node ../../scripts/build/build.js"
|
|
57
57
|
},
|
|
58
58
|
"dependencies": {
|
|
59
|
-
"@elliemae/ds-basic": "2.0.0-
|
|
60
|
-
"@elliemae/ds-classnames": "2.0.0-
|
|
61
|
-
"@elliemae/ds-
|
|
62
|
-
"
|
|
63
|
-
"
|
|
64
|
-
"
|
|
65
|
-
"
|
|
66
|
-
"
|
|
67
|
-
"reactabular-table": "~8.14.0",
|
|
68
|
-
"searchtabular": "~1.9.0",
|
|
69
|
-
"sortabular": "~1.6.0",
|
|
70
|
-
"table-resolver": "~4.1.1",
|
|
71
|
-
"treetabular": "~3.6.0",
|
|
59
|
+
"@elliemae/ds-basic": "2.0.0-rc.2",
|
|
60
|
+
"@elliemae/ds-classnames": "2.0.0-rc.2",
|
|
61
|
+
"@elliemae/ds-datagrids": "2.0.0-rc.2",
|
|
62
|
+
"@elliemae/ds-icons": "2.0.0-rc.2",
|
|
63
|
+
"@elliemae/ds-modal": "2.0.0-rc.2",
|
|
64
|
+
"@elliemae/ds-utilities": "2.0.0-rc.2",
|
|
65
|
+
"react-desc": "~4.1.3",
|
|
66
|
+
"react-select": "~4.3.0",
|
|
72
67
|
"uid": "~2.0.0"
|
|
73
68
|
},
|
|
74
69
|
"publishConfig": {
|
package/types/DSSearchField.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ declare const DSSearchField: {
|
|
|
10
10
|
modalTitle?: string | undefined;
|
|
11
11
|
tabsAnimated?: boolean | undefined;
|
|
12
12
|
tabsEnableMouseEvents?: boolean | undefined;
|
|
13
|
-
tabType?:
|
|
13
|
+
tabType?: string | undefined;
|
|
14
14
|
tabData?: never[] | undefined;
|
|
15
15
|
searchGrid?: boolean | undefined;
|
|
16
16
|
searchFilters?: boolean | undefined;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
declare const AdvanceSearchOption: ({ advanceSearchLabel, onAdvanceSearchClick
|
|
2
|
+
declare const AdvanceSearchOption: ({ advanceSearchLabel, onAdvanceSearchClick }: {
|
|
3
3
|
advanceSearchLabel?: string | undefined;
|
|
4
4
|
onAdvanceSearchClick?: (() => null) | undefined;
|
|
5
5
|
}) => JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
declare const LookupIndicator: ({ onAdvanceSearchClick, className
|
|
2
|
+
declare const LookupIndicator: ({ onAdvanceSearchClick, className }: {
|
|
3
3
|
onAdvanceSearchClick?: (() => null) | undefined;
|
|
4
4
|
className?: string | undefined;
|
|
5
5
|
}) => JSX.Element;
|
|
@@ -6,7 +6,7 @@ declare const ModalSearchField: ({ isOpen, onClose, modalTitle, modalSize, tabsA
|
|
|
6
6
|
modalSize?: string | undefined;
|
|
7
7
|
tabsAnimated?: boolean | undefined;
|
|
8
8
|
tabsEnableMouseEvents?: boolean | undefined;
|
|
9
|
-
tabType?:
|
|
9
|
+
tabType?: string | undefined;
|
|
10
10
|
tabData?: never[] | undefined;
|
|
11
11
|
searchFilters?: boolean | undefined;
|
|
12
12
|
searchGrid?: boolean | undefined;
|