@appbaseio/reactivesearch-vue 3.0.0-rc.5.alpha.4 → 3.0.0-rc.6
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/dist/@appbaseio/reactivesearch-vue.umd.js +39803 -35283
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +32 -32
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-d4da7470.js → Button-9e179864.js} +13 -6
- package/dist/cjs/{ComponentWrapper-9146d811.js → ComponentWrapper-0b9ffb1a.js} +3 -0
- package/dist/cjs/DropDown-aef75c14.js +702 -0
- package/dist/cjs/DynamicRangeSlider.js +1 -1
- package/dist/cjs/{Input-497be42a.js → Input-56eba499.js} +71 -1
- package/dist/cjs/MultiDropdownList.js +6 -6
- package/dist/cjs/MultiList.js +3 -3
- package/dist/cjs/MultiRange.js +2 -2
- package/dist/cjs/{Pagination-b953a80a.js → Pagination-58a0cf3f.js} +2 -2
- package/dist/cjs/RangeInput.js +3 -3
- package/dist/cjs/RangeSlider.js +2 -2
- package/dist/cjs/ReactiveBase.js +4 -4
- package/dist/cjs/ReactiveComponent.js +2 -2
- package/dist/cjs/ReactiveGoogleMap.js +6 -5
- package/dist/cjs/ReactiveList.js +4 -4
- package/dist/cjs/ResultCard.js +1 -1
- package/dist/cjs/ResultList.js +1 -1
- package/dist/cjs/SelectedFilters.js +3 -2
- package/dist/cjs/SingleDropdownList.js +6 -6
- package/dist/cjs/SingleList.js +3 -3
- package/dist/cjs/SingleRange.js +2 -2
- package/dist/cjs/ToggleButton.js +4 -3
- package/dist/cjs/index.js +14 -13
- package/dist/cjs/install-70991c13.js +3820 -0
- package/dist/cjs/install.js +9 -9
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/{vueTypes-1bf00978.js → vueTypes-a5f1745e.js} +18 -0
- package/dist/es/{Button-fd869491.js → Button-c2ff5178.js} +13 -6
- package/dist/es/{ComponentWrapper-8a3c388d.js → ComponentWrapper-a2635cfc.js} +3 -0
- package/dist/es/DropDown-39fedff8.js +693 -0
- package/dist/es/DynamicRangeSlider.js +1 -1
- package/dist/es/{Input-f7499ef8.js → Input-11d211d2.js} +71 -2
- package/dist/es/MultiDropdownList.js +6 -6
- package/dist/es/MultiList.js +3 -3
- package/dist/es/MultiRange.js +2 -2
- package/dist/es/{Pagination-c2745bec.js → Pagination-ae401c33.js} +2 -2
- package/dist/es/RangeInput.js +3 -3
- package/dist/es/RangeSlider.js +2 -2
- package/dist/es/ReactiveBase.js +4 -4
- package/dist/es/ReactiveComponent.js +2 -2
- package/dist/es/ReactiveGoogleMap.js +6 -5
- package/dist/es/ReactiveList.js +4 -4
- package/dist/es/ResultCard.js +1 -1
- package/dist/es/ResultList.js +1 -1
- package/dist/es/SelectedFilters.js +3 -2
- package/dist/es/SingleDropdownList.js +6 -6
- package/dist/es/SingleList.js +3 -3
- package/dist/es/SingleRange.js +2 -2
- package/dist/es/ToggleButton.js +4 -3
- package/dist/es/index.js +11 -11
- package/dist/es/install-8296e8da.js +3812 -0
- package/dist/es/install.js +9 -9
- package/dist/es/version.js +1 -1
- package/dist/es/{vueTypes-f1923c72.js → vueTypes-09cab4d3.js} +18 -0
- package/package.json +7 -5
- package/dist/cjs/CancelSvg-ab0f8b23.js +0 -409
- package/dist/cjs/DropDown-e7125b72.js +0 -299
- package/dist/cjs/SearchBox.js +0 -1853
- package/dist/cjs/install-3c4520bf.js +0 -874
- package/dist/es/CancelSvg-e7ae49e9.js +0 -401
- package/dist/es/DropDown-13afb4d2.js +0 -295
- package/dist/es/SearchBox.js +0 -1847
- package/dist/es/install-ff8b0750.js +0 -868
|
@@ -1,874 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
4
|
-
|
|
5
|
-
var reactivecore = require('@appbaseio/reactivecore');
|
|
6
|
-
var constants = require('@appbaseio/reactivecore/lib/utils/constants');
|
|
7
|
-
var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
|
|
8
|
-
var vue = require('vue');
|
|
9
|
-
var VueTypes = _interopDefault(require('vue-types'));
|
|
10
|
-
var helper = require('@appbaseio/reactivecore/lib/utils/helper');
|
|
11
|
-
var vueEmotion = require('@appbaseio/vue-emotion');
|
|
12
|
-
var vueTypes = require('./vueTypes-1bf00978.js');
|
|
13
|
-
var ReactiveList = require('./ReactiveList.js');
|
|
14
|
-
var transform = require('@appbaseio/reactivecore/lib/utils/transform');
|
|
15
|
-
var index = require('./index-779ed366.js');
|
|
16
|
-
var ComponentWrapper = require('./ComponentWrapper-9146d811.js');
|
|
17
|
-
var PreferencesConsumer = require('./PreferencesConsumer-85dee673.js');
|
|
18
|
-
var Title = require('./Title-8802a218.js');
|
|
19
|
-
var ListItem = require('./ListItem-7a682970.js');
|
|
20
|
-
var Flex = require('./Flex-ddde6d26.js');
|
|
21
|
-
var ReactiveBase = require('./ReactiveBase.js');
|
|
22
|
-
var SearchBox = require('./SearchBox.js');
|
|
23
|
-
var Input = require('./Input-497be42a.js');
|
|
24
|
-
var Container = require('./Container-29f049b2.js');
|
|
25
|
-
var suggestions = require('@appbaseio/reactivecore/lib/utils/suggestions');
|
|
26
|
-
var FormControlList = require('./FormControlList-fadd792f.js');
|
|
27
|
-
var utils = require('./utils-c9bd5628.js');
|
|
28
|
-
var SingleList = require('./SingleList.js');
|
|
29
|
-
var MultiList = require('./MultiList.js');
|
|
30
|
-
var types = _interopDefault(require('@appbaseio/reactivecore/lib/utils/types'));
|
|
31
|
-
var SingleDropdownList = require('./SingleDropdownList.js');
|
|
32
|
-
var MultiDropdownList = require('./MultiDropdownList.js');
|
|
33
|
-
var ToggleButton = require('./ToggleButton.js');
|
|
34
|
-
var ReactiveComponent = require('./ReactiveComponent.js');
|
|
35
|
-
var DynamicRangeSlider = require('./DynamicRangeSlider.js');
|
|
36
|
-
var SingleRange = require('./SingleRange.js');
|
|
37
|
-
var MultiRange = require('./MultiRange.js');
|
|
38
|
-
var RangeSlider = require('./RangeSlider.js');
|
|
39
|
-
var RangeInput = require('./RangeInput.js');
|
|
40
|
-
var SelectedFilters = require('./SelectedFilters.js');
|
|
41
|
-
var ResultCard = require('./ResultCard.js');
|
|
42
|
-
var ResultList = require('./ResultList.js');
|
|
43
|
-
var StateProvider = require('./StateProvider.js');
|
|
44
|
-
|
|
45
|
-
var _templateObject, _templateObject2;
|
|
46
|
-
var HierarchicalMenuList = vueEmotion.styled('ul')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: 0;\n\tmax-height: 0;\n\toverflow: hidden;\n\n\t&.--open {\n\t\tmax-height: 100%;\n\t}\n"])));
|
|
47
|
-
var HierarchicalMenuListItem = vueEmotion.styled('li')(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tfont-weight: 400;\n\tline-height: 1.5;\n\tbox-sizing: border-box;\n\n\ta {\n\t\tcolor: #424242;\n\t\ttext-decoration: none;\n\t\tgap: 5px;\n\t\t.--leaf-icon,\n\t\t.--folder-icon {\n\t\t\tline-height: 15px;\n\t\t\tsvg {\n\t\t\t\theight: 15px;\n\t\t\t}\n\t\t}\n\n\t\tinput {\n\t\t\tmargin: 0;\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n\n\t.--switcher-icon {\n\t\ttransition: all 0.2s ease-in;\n\t\tmargin-right: 2px;\n\t}\n\t.--list-child {\n\t\tpadding-left: 1rem;\n\t\tposition: relative;\n\t\t&:before {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\tborder-left: 1px solid #787878;\n\t\t\twidth: 0;\n\t\t\tleft: 19px;\n\t\t\t", ";\n\t\t}\n\n\t\t&.--show-switcher-icon {\n\t\t\tpadding-left: 36px;\n\t\t}\n\t}\n\t.--list-item-label {\n\t\tline-height: 100%;\n\t}\n\t.--list-item-count {\n\t\tmargin-left: 10px;\n\t\tpadding: 0.1rem 0.4rem;\n\t\tfont-size: 0.8rem;\n\t\tcolor: #424242;\n\t\tbackground-color: #dee1e6;\n\t\tborder-radius: 8px;\n\t}\n\t&.-selected-item {\n\t\tfont-weight: 700 !important;\n\t}\n\t&.-expanded-item {\n\t\t& > a {\n\t\t\t& div > .--switcher-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n\t.--list-item-label-count-wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t&:hover {\n\t\t\t.--list-item-count,\n\t\t\t.--list-item-label {\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n"])), function (props) {
|
|
48
|
-
return !props.showLine && "\n\t\t\t\t\tdisplay: none;\n\t\t\t\t";
|
|
49
|
-
});
|
|
50
|
-
|
|
51
|
-
var HierarchicalMenuListItemComponent = {
|
|
52
|
-
name: 'HierarchicalMenuListItemComponent',
|
|
53
|
-
data: function data() {
|
|
54
|
-
return {
|
|
55
|
-
isExpanded: false,
|
|
56
|
-
newParentPath: ''
|
|
57
|
-
};
|
|
58
|
-
},
|
|
59
|
-
created: function created() {
|
|
60
|
-
var listItemLabel = this.listItem.key;
|
|
61
|
-
var newParentPath = listItemLabel;
|
|
62
|
-
if (this.parentPath) {
|
|
63
|
-
newParentPath = "" + this.parentPath + constants.TREELIST_VALUES_PATH_SEPARATOR + listItemLabel;
|
|
64
|
-
}
|
|
65
|
-
this.newParentPath = newParentPath;
|
|
66
|
-
this.isExpanded = !!helper.recLookup(this.selectedValues, newParentPath, constants.TREELIST_VALUES_PATH_SEPARATOR);
|
|
67
|
-
},
|
|
68
|
-
watch: {
|
|
69
|
-
listItem: function listItem(newVal) {
|
|
70
|
-
if (newVal.initiallyExpanded) {
|
|
71
|
-
this.isExpanded = newVal.initiallyExpanded;
|
|
72
|
-
}
|
|
73
|
-
},
|
|
74
|
-
selectedValues: function selectedValues(newVal) {
|
|
75
|
-
this.isExpanded = !!helper.recLookup(newVal, this.newParentPath, constants.TREELIST_VALUES_PATH_SEPARATOR);
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
props: {
|
|
79
|
-
parentPath: types.string,
|
|
80
|
-
selectedValues: types.rawData,
|
|
81
|
-
mode: types.string,
|
|
82
|
-
searchTerm: types.string,
|
|
83
|
-
listItem: types.rawData,
|
|
84
|
-
showLine: types.bool,
|
|
85
|
-
renderItem: types.func,
|
|
86
|
-
handleListItemClick: types.func,
|
|
87
|
-
renderSwitcherIcon: types.func,
|
|
88
|
-
showCheckbox: VueTypes.bool,
|
|
89
|
-
innerClass: types.style,
|
|
90
|
-
showRadio: VueTypes.bool,
|
|
91
|
-
renderIcon: types.func,
|
|
92
|
-
showCount: VueTypes.bool,
|
|
93
|
-
showSwitcherIcon: types.bool,
|
|
94
|
-
switcherIcon: types.children
|
|
95
|
-
},
|
|
96
|
-
render: function render() {
|
|
97
|
-
var _this = this;
|
|
98
|
-
var _this$$props = this.$props,
|
|
99
|
-
selectedValues = _this$$props.selectedValues,
|
|
100
|
-
mode = _this$$props.mode,
|
|
101
|
-
searchTerm = _this$$props.searchTerm,
|
|
102
|
-
listItem = _this$$props.listItem,
|
|
103
|
-
parentPath = _this$$props.parentPath,
|
|
104
|
-
showLine = _this$$props.showLine,
|
|
105
|
-
renderItem = _this$$props.renderItem,
|
|
106
|
-
handleListItemClick = _this$$props.handleListItemClick,
|
|
107
|
-
showCheckbox = _this$$props.showCheckbox,
|
|
108
|
-
innerClass = _this$$props.innerClass,
|
|
109
|
-
showRadio = _this$$props.showRadio,
|
|
110
|
-
renderIcon = _this$$props.renderIcon,
|
|
111
|
-
showCount = _this$$props.showCount,
|
|
112
|
-
showSwitcherIcon = _this$$props.showSwitcherIcon;
|
|
113
|
-
if (!(listItem instanceof Object) || Object.keys(listItem).length === 0) {
|
|
114
|
-
return null;
|
|
115
|
-
}
|
|
116
|
-
var listItemLabel = listItem.key;
|
|
117
|
-
var listItemCount = listItem.count;
|
|
118
|
-
var isLeafNode = !(Array.isArray(listItem.list) && listItem.list.length > 0);
|
|
119
|
-
var renderSwitcherIcon = function renderSwitcherIcon(isExpandedProp) {
|
|
120
|
-
if (showSwitcherIcon === false) {
|
|
121
|
-
return null;
|
|
122
|
-
}
|
|
123
|
-
var switcherIcon = _this.$props.switcherIcon;
|
|
124
|
-
if (switcherIcon) return switcherIcon(isExpandedProp);
|
|
125
|
-
return (
|
|
126
|
-
/* eslint-disable jsx-a11y/click-events-have-key-events
|
|
127
|
-
, jsx-a11y/no-static-element-interactions,jsx-a11y/no-noninteractive-tabindex */
|
|
128
|
-
vue.createVNode("span", {
|
|
129
|
-
"tabIndex": "0",
|
|
130
|
-
"onClick": function onClick(e) {
|
|
131
|
-
e.stopPropagation();
|
|
132
|
-
_this.isExpanded = !_this.isExpanded;
|
|
133
|
-
},
|
|
134
|
-
"class": "--switcher-icon"
|
|
135
|
-
}, [vue.createTextVNode("\u27A4")])
|
|
136
|
-
);
|
|
137
|
-
};
|
|
138
|
-
var isSelected = false;
|
|
139
|
-
if (mode === 'single') {
|
|
140
|
-
if (helper.recLookup(selectedValues, this.newParentPath, constants.TREELIST_VALUES_PATH_SEPARATOR) === true) {
|
|
141
|
-
isSelected = true;
|
|
142
|
-
}
|
|
143
|
-
} else {
|
|
144
|
-
isSelected = !!helper.recLookup(selectedValues, this.newParentPath, constants.TREELIST_VALUES_PATH_SEPARATOR);
|
|
145
|
-
}
|
|
146
|
-
return vue.createVNode(HierarchicalMenuListItem, {
|
|
147
|
-
"class": (isSelected ? '-selected-item' : '') + " " + (this.isExpanded ? '-expanded-item' : ''),
|
|
148
|
-
"key": this.newParentPath,
|
|
149
|
-
"showLine": showLine
|
|
150
|
-
}, {
|
|
151
|
-
"default": function _default() {
|
|
152
|
-
return [vue.createVNode(ListItem.ListItem, {
|
|
153
|
-
"isTreeListItem": true,
|
|
154
|
-
"onClick": function onClick() {
|
|
155
|
-
handleListItemClick(listItemLabel, parentPath);
|
|
156
|
-
},
|
|
157
|
-
"style": {
|
|
158
|
-
textDecoration: 'none'
|
|
159
|
-
}
|
|
160
|
-
}, {
|
|
161
|
-
"default": function _default() {
|
|
162
|
-
return [renderItem ? renderItem(listItemLabel, listItemCount, isSelected) : vue.createVNode(Flex.Flex, {
|
|
163
|
-
"alignItems": "center",
|
|
164
|
-
"gap": "5px"
|
|
165
|
-
}, {
|
|
166
|
-
"default": function _default() {
|
|
167
|
-
return [!isLeafNode && renderSwitcherIcon(isSelected), mode === 'multiple' && showCheckbox && vue.createVNode(Flex.Flex, {
|
|
168
|
-
"alignItems": "center",
|
|
169
|
-
"gap": "5px"
|
|
170
|
-
}, {
|
|
171
|
-
"default": function _default() {
|
|
172
|
-
return [vue.createVNode(FormControlList.Checkbox, {
|
|
173
|
-
"type": "checkbox",
|
|
174
|
-
"class": helper.getClassName(innerClass, 'checkbox') || null,
|
|
175
|
-
"checked": isSelected,
|
|
176
|
-
"id": listItemLabel + "-checkbox-" + _this.newParentPath,
|
|
177
|
-
"name": listItemLabel + "-checkbox-" + _this.newParentPath,
|
|
178
|
-
"show": true,
|
|
179
|
-
"readOnly": true
|
|
180
|
-
}, null), vue.createVNode("label", {
|
|
181
|
-
"style": {
|
|
182
|
-
width: '26px',
|
|
183
|
-
marginTop: 0,
|
|
184
|
-
marginBottom: 0,
|
|
185
|
-
marginRight: '-9px',
|
|
186
|
-
left: '-3px'
|
|
187
|
-
},
|
|
188
|
-
"htmlFor": listItemLabel + "-checkbox-" + _this.newParentPath,
|
|
189
|
-
"onClick": function onClick(e) {
|
|
190
|
-
e.stopPropagation();
|
|
191
|
-
}
|
|
192
|
-
}, null)];
|
|
193
|
-
}
|
|
194
|
-
}), mode === 'single' && showRadio && vue.createVNode(Flex.Flex, {
|
|
195
|
-
"alignItems": "center",
|
|
196
|
-
"gap": "5px"
|
|
197
|
-
}, {
|
|
198
|
-
"default": function _default() {
|
|
199
|
-
return [vue.createVNode(FormControlList.Radio, {
|
|
200
|
-
"checked": isSelected,
|
|
201
|
-
"class": helper.getClassName(innerClass, 'radio') || null,
|
|
202
|
-
"id": listItemLabel + "-radio-" + _this.newParentPath,
|
|
203
|
-
"name": listItemLabel + "-radio-" + _this.newParentPath,
|
|
204
|
-
"show": true,
|
|
205
|
-
"readOnly": true,
|
|
206
|
-
"type": "radio"
|
|
207
|
-
}, null), vue.createVNode("label", {
|
|
208
|
-
"style": {
|
|
209
|
-
width: '26px',
|
|
210
|
-
marginTop: 0,
|
|
211
|
-
marginBottom: 0,
|
|
212
|
-
marginRight: '-9px',
|
|
213
|
-
left: '-3px'
|
|
214
|
-
},
|
|
215
|
-
"htmlFor": listItemLabel + "-radio-" + _this.newParentPath,
|
|
216
|
-
"onClick": function onClick(e) {
|
|
217
|
-
e.stopPropagation();
|
|
218
|
-
}
|
|
219
|
-
}, null)];
|
|
220
|
-
}
|
|
221
|
-
}), ' ', renderIcon(isLeafNode), vue.createVNode("div", {
|
|
222
|
-
"class": "--list-item-label-count-wrapper"
|
|
223
|
-
}, [vue.createVNode("span", {
|
|
224
|
-
"class": "--list-item-label " + (helper.getClassName(innerClass, 'label') || '')
|
|
225
|
-
}, [listItemLabel]), showCount && vue.createVNode("span", {
|
|
226
|
-
"class": "--list-item-count " + (helper.getClassName(innerClass, 'count') || '')
|
|
227
|
-
}, [listItemCount])])];
|
|
228
|
-
}
|
|
229
|
-
})];
|
|
230
|
-
}
|
|
231
|
-
}), isLeafNode === false && vue.createVNode("div", {
|
|
232
|
-
"class": "--list-child " + (showSwitcherIcon ? ' --show-switcher-icon' : '')
|
|
233
|
-
}, [vue.createVNode(HierarchicalMenuComponent, {
|
|
234
|
-
"key": _this.newParentPath + "-" + listItemLabel + "-" + listItemCount,
|
|
235
|
-
"listArray": listItem.list,
|
|
236
|
-
"parentPath": _this.newParentPath,
|
|
237
|
-
"isExpanded": _this.isExpanded,
|
|
238
|
-
"listItemProps": {
|
|
239
|
-
mode: mode,
|
|
240
|
-
selectedValues: selectedValues,
|
|
241
|
-
searchTerm: searchTerm,
|
|
242
|
-
showLine: showLine,
|
|
243
|
-
renderItem: renderItem,
|
|
244
|
-
handleListItemClick: handleListItemClick,
|
|
245
|
-
renderSwitcherIcon: renderSwitcherIcon,
|
|
246
|
-
showCheckbox: showCheckbox,
|
|
247
|
-
innerClass: innerClass,
|
|
248
|
-
showRadio: showRadio,
|
|
249
|
-
renderIcon: renderIcon,
|
|
250
|
-
showCount: showCount,
|
|
251
|
-
showSwitcherIcon: showSwitcherIcon,
|
|
252
|
-
switcherIcon: _this.$props.switcherIcon
|
|
253
|
-
}
|
|
254
|
-
}, null)])];
|
|
255
|
-
}
|
|
256
|
-
});
|
|
257
|
-
}
|
|
258
|
-
};
|
|
259
|
-
|
|
260
|
-
function _isSlot(s) {
|
|
261
|
-
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
262
|
-
}
|
|
263
|
-
var HierarchicalMenuComponent = {
|
|
264
|
-
name: 'HierarchicalMenuComponent',
|
|
265
|
-
props: {
|
|
266
|
-
listArray: VueTypes.arrayOf(VueTypes.object),
|
|
267
|
-
// array of objects
|
|
268
|
-
parentPath: VueTypes.string.def(''),
|
|
269
|
-
isExpanded: VueTypes.bool.def(false),
|
|
270
|
-
listItemProps: types.rawData
|
|
271
|
-
},
|
|
272
|
-
render: function render() {
|
|
273
|
-
var _slot;
|
|
274
|
-
var _this$$props = this.$props,
|
|
275
|
-
listArray = _this$$props.listArray,
|
|
276
|
-
isExpanded = _this$$props.isExpanded,
|
|
277
|
-
parentPath = _this$$props.parentPath,
|
|
278
|
-
listItemProps = _this$$props.listItemProps;
|
|
279
|
-
if (!Array.isArray(listArray) || listArray.length === 0) {
|
|
280
|
-
return null;
|
|
281
|
-
}
|
|
282
|
-
return vue.createVNode(HierarchicalMenuList, {
|
|
283
|
-
"class": "" + (isExpanded ? '--open' : ''),
|
|
284
|
-
"isSelected": isExpanded
|
|
285
|
-
}, _isSlot(_slot = listArray.map(function (listItem) {
|
|
286
|
-
return vue.createVNode(HierarchicalMenuListItemComponent, vue.mergeProps({
|
|
287
|
-
"key": parentPath + "__" + JSON.stringify(listItem),
|
|
288
|
-
"parentPath": parentPath,
|
|
289
|
-
"listItem": listItem
|
|
290
|
-
}, listItemProps), null);
|
|
291
|
-
})) ? _slot : {
|
|
292
|
-
"default": function _default() {
|
|
293
|
-
return [_slot];
|
|
294
|
-
}
|
|
295
|
-
});
|
|
296
|
-
}
|
|
297
|
-
};
|
|
298
|
-
|
|
299
|
-
function _isSlot$1(s) {
|
|
300
|
-
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
301
|
-
}
|
|
302
|
-
var updateQueryAction = reactivecore.Actions.updateQuery,
|
|
303
|
-
setQueryOptions = reactivecore.Actions.setQueryOptions;
|
|
304
|
-
var transformValueIntoLocalState = function transformValueIntoLocalState(valueArray) {
|
|
305
|
-
var valueToSet = {};
|
|
306
|
-
if (valueArray.length) {
|
|
307
|
-
var newSelectedValues = {};
|
|
308
|
-
valueArray.forEach(function (valueItem) {
|
|
309
|
-
helper.setDeep(newSelectedValues, valueItem.split(' > '), !helper.recLookup(newSelectedValues, valueItem.split(' > '), constants.TREELIST_VALUES_PATH_SEPARATOR), true);
|
|
310
|
-
});
|
|
311
|
-
valueToSet = newSelectedValues;
|
|
312
|
-
}
|
|
313
|
-
return valueToSet;
|
|
314
|
-
};
|
|
315
|
-
var TreeList = {
|
|
316
|
-
name: 'TreeList',
|
|
317
|
-
props: {
|
|
318
|
-
selectedValue: vueTypes.types.selectedValue,
|
|
319
|
-
error: vueTypes.types.title,
|
|
320
|
-
rawData: vueTypes.types.rawData,
|
|
321
|
-
aggregationData: vueTypes.types.rawData,
|
|
322
|
-
themePreset: vueTypes.types.themePreset,
|
|
323
|
-
updateQueryAction: vueTypes.types.funcRequired,
|
|
324
|
-
setQueryOptions: vueTypes.types.funcRequired,
|
|
325
|
-
// component props
|
|
326
|
-
componentId: vueTypes.types.string.isRequired,
|
|
327
|
-
className: vueTypes.types.string,
|
|
328
|
-
style: vueTypes.types.style,
|
|
329
|
-
showRadio: VueTypes.bool.def(false),
|
|
330
|
-
showCheckbox: vueTypes.types.bool.def(false),
|
|
331
|
-
mode: VueTypes.oneOf(['single', 'multiple']).def('multiple'),
|
|
332
|
-
showCount: VueTypes.bool.def(false),
|
|
333
|
-
showSearch: VueTypes.bool.def(false),
|
|
334
|
-
showIcon: VueTypes.bool.def(false),
|
|
335
|
-
icon: vueTypes.types.children,
|
|
336
|
-
showLeafIcon: VueTypes.bool.def(false),
|
|
337
|
-
leafIcon: vueTypes.types.children,
|
|
338
|
-
showLine: VueTypes.bool.def(false),
|
|
339
|
-
switcherIcon: vueTypes.types.func,
|
|
340
|
-
render: vueTypes.types.func,
|
|
341
|
-
renderItem: vueTypes.types.func,
|
|
342
|
-
innerClass: vueTypes.types.style,
|
|
343
|
-
placeholder: vueTypes.types.string,
|
|
344
|
-
title: vueTypes.types.title,
|
|
345
|
-
isLoading: vueTypes.types.bool,
|
|
346
|
-
dataField: vueTypes.types.stringArray.isRequired,
|
|
347
|
-
onQueryChange: vueTypes.types.func,
|
|
348
|
-
defaultValue: vueTypes.types.stringArray,
|
|
349
|
-
value: vueTypes.types.stringArray,
|
|
350
|
-
customQuery: vueTypes.types.func,
|
|
351
|
-
defaultQuery: vueTypes.types.func,
|
|
352
|
-
enableAppbase: vueTypes.types.bool,
|
|
353
|
-
index: vueTypes.types.string,
|
|
354
|
-
showFilter: vueTypes.types.bool,
|
|
355
|
-
URLParams: vueTypes.types.bool,
|
|
356
|
-
filterLabel: vueTypes.types.string,
|
|
357
|
-
onChange: vueTypes.types.func,
|
|
358
|
-
onValueChange: vueTypes.types.func,
|
|
359
|
-
beforeValueChange: vueTypes.types.func,
|
|
360
|
-
sortBy: vueTypes.types.sortByWithCount.def('count'),
|
|
361
|
-
onError: vueTypes.types.func,
|
|
362
|
-
showSwitcherIcon: vueTypes.types.bool.def(true),
|
|
363
|
-
renderError: vueTypes.types.title,
|
|
364
|
-
renderNoResults: vueTypes.types.func,
|
|
365
|
-
loader: vueTypes.types.title,
|
|
366
|
-
aggergationSize: vueTypes.types.number,
|
|
367
|
-
endpoint: vueTypes.types.endpoint,
|
|
368
|
-
queryFormat: vueTypes.types.queryFormatSearch.def('or'),
|
|
369
|
-
size: vueTypes.types.number.def(100),
|
|
370
|
-
nestedField: vueTypes.types.string,
|
|
371
|
-
react: vueTypes.types.react,
|
|
372
|
-
transformData: vueTypes.types.func,
|
|
373
|
-
selectAllLabel: vueTypes.types.string,
|
|
374
|
-
showMissing: VueTypes.bool.def(false),
|
|
375
|
-
missingLabel: VueTypes.string.def('N/A')
|
|
376
|
-
},
|
|
377
|
-
data: function data() {
|
|
378
|
-
var props = this.$props;
|
|
379
|
-
this.__state = {
|
|
380
|
-
selectedValues: {},
|
|
381
|
-
searchTerm: '',
|
|
382
|
-
aggregationData: []
|
|
383
|
-
};
|
|
384
|
-
this.internalComponent = props.componentId + "__internal";
|
|
385
|
-
return this.__state;
|
|
386
|
-
},
|
|
387
|
-
created: function created() {
|
|
388
|
-
var props = this.$props;
|
|
389
|
-
var componentId = props.componentId;
|
|
390
|
-
var defaultValue = this.defaultValue || this.value;
|
|
391
|
-
var currentValueArray = this.selectedValue || defaultValue || [];
|
|
392
|
-
// update local state for selected values
|
|
393
|
-
if (currentValueArray.length) {
|
|
394
|
-
var newSelectedValues = transformValueIntoLocalState(currentValueArray);
|
|
395
|
-
this.setValue(newSelectedValues, true);
|
|
396
|
-
}
|
|
397
|
-
|
|
398
|
-
// Set custom and default queries in store
|
|
399
|
-
helper.updateCustomQuery(componentId, props, currentValueArray);
|
|
400
|
-
helper.updateDefaultQuery(componentId, props, currentValueArray);
|
|
401
|
-
this.updateQueryOptions();
|
|
402
|
-
},
|
|
403
|
-
mounted: function mounted() {
|
|
404
|
-
var _this$$props = this.$props,
|
|
405
|
-
enableAppbase = _this$$props.enableAppbase,
|
|
406
|
-
index = _this$$props.index;
|
|
407
|
-
if (!enableAppbase && index) {
|
|
408
|
-
console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
|
|
409
|
-
}
|
|
410
|
-
},
|
|
411
|
-
watch: {
|
|
412
|
-
defaultQuery: function defaultQuery() {
|
|
413
|
-
this.updateDefaultQuery();
|
|
414
|
-
this.updateQuery([]);
|
|
415
|
-
},
|
|
416
|
-
customQuery: function customQuery() {
|
|
417
|
-
var valueArray = helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues) || [];
|
|
418
|
-
this.updateQuery(valueArray);
|
|
419
|
-
},
|
|
420
|
-
sortBy: function sortBy() {
|
|
421
|
-
this.updateQueryOptions();
|
|
422
|
-
},
|
|
423
|
-
dataField: function dataField() {
|
|
424
|
-
var valueArray = helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues) || [];
|
|
425
|
-
this.updateQueryOptions();
|
|
426
|
-
this.updateQuery(valueArray);
|
|
427
|
-
},
|
|
428
|
-
value: function value(newVal, oldVal) {
|
|
429
|
-
if (!helper.isEqual(newVal, oldVal)) {
|
|
430
|
-
this.setValue(newVal);
|
|
431
|
-
}
|
|
432
|
-
},
|
|
433
|
-
selectedValue: function selectedValue(newVal) {
|
|
434
|
-
if (!helper.isEqual(helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues), newVal)) {
|
|
435
|
-
var _this$$props2 = this.$props,
|
|
436
|
-
value = _this$$props2.value,
|
|
437
|
-
onChange = _this$$props2.onChange;
|
|
438
|
-
var valueToSet = [];
|
|
439
|
-
if (Array.isArray(newVal) && newVal.length) {
|
|
440
|
-
valueToSet = newVal;
|
|
441
|
-
}
|
|
442
|
-
if (value === undefined) {
|
|
443
|
-
this.setValue(valueToSet);
|
|
444
|
-
} else if (onChange && !helper.isEqual(value, valueToSet)) {
|
|
445
|
-
onChange(valueToSet);
|
|
446
|
-
}
|
|
447
|
-
}
|
|
448
|
-
},
|
|
449
|
-
aggregationData: function aggregationData(newVal, oldVal) {
|
|
450
|
-
if (newVal && !helper.isEqual(newVal, oldVal)) {
|
|
451
|
-
this.$data.aggregationData = newVal;
|
|
452
|
-
}
|
|
453
|
-
}
|
|
454
|
-
},
|
|
455
|
-
computed: {
|
|
456
|
-
hasCustomRenderer: function hasCustomRenderer() {
|
|
457
|
-
return index.hasCustomRenderer(this);
|
|
458
|
-
}
|
|
459
|
-
},
|
|
460
|
-
methods: {
|
|
461
|
-
renderIcon: function renderIcon(isLeafNode) {
|
|
462
|
-
var _this$$props3 = this.$props,
|
|
463
|
-
showIcon = _this$$props3.showIcon,
|
|
464
|
-
showLeafIcon = _this$$props3.showLeafIcon,
|
|
465
|
-
icon = _this$$props3.icon;
|
|
466
|
-
if (isLeafNode) {
|
|
467
|
-
if (!showLeafIcon) return null;
|
|
468
|
-
var _ref = this.$slots || this.$props,
|
|
469
|
-
leafIcon = _ref.leafIcon;
|
|
470
|
-
if (leafIcon) return leafIcon();
|
|
471
|
-
return vue.createVNode("span", {
|
|
472
|
-
"role": "img",
|
|
473
|
-
"aria-label": "file",
|
|
474
|
-
"class": "--leaf-icon"
|
|
475
|
-
}, [vue.createVNode("svg", {
|
|
476
|
-
"viewBox": "64 64 896 896",
|
|
477
|
-
"focusable": "false",
|
|
478
|
-
"data-icon": "file",
|
|
479
|
-
"width": "1em",
|
|
480
|
-
"height": "1em",
|
|
481
|
-
"fill": "currentColor",
|
|
482
|
-
"aria-hidden": "true"
|
|
483
|
-
}, [vue.createVNode("path", {
|
|
484
|
-
"d": "M854.6 288.6L639.4 73.4c-6-6-14.1-9.4-22.6-9.4H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V311.3c0-8.5-3.4-16.7-9.4-22.7zM790.2 326H602V137.8L790.2 326zm1.8 562H232V136h302v216a42 42 0 0042 42h216v494z"
|
|
485
|
-
}, null)])]);
|
|
486
|
-
}
|
|
487
|
-
if (!showIcon) return null;
|
|
488
|
-
if (icon) {
|
|
489
|
-
return icon;
|
|
490
|
-
}
|
|
491
|
-
if (this.$slots.icon) {
|
|
492
|
-
return this.$slots.icon();
|
|
493
|
-
}
|
|
494
|
-
return vue.createVNode("span", {
|
|
495
|
-
"role": "img",
|
|
496
|
-
"aria-label": "folder-open",
|
|
497
|
-
"class": "--folder-icon"
|
|
498
|
-
}, [vue.createVNode("svg", {
|
|
499
|
-
"viewBox": "64 64 896 896",
|
|
500
|
-
"focusable": "false",
|
|
501
|
-
"data-icon": "folder-open",
|
|
502
|
-
"width": "1em",
|
|
503
|
-
"height": "1em",
|
|
504
|
-
"fill": "currentColor",
|
|
505
|
-
"aria-hidden": "true"
|
|
506
|
-
}, [vue.createVNode("path", {
|
|
507
|
-
"d": "M928 444H820V330.4c0-17.7-14.3-32-32-32H473L355.7 186.2a8.15 8.15 0 00-5.5-2.2H96c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h698c13 0 24.8-7.9 29.7-20l134-332c1.5-3.8 2.3-7.9 2.3-12 0-17.7-14.3-32-32-32zM136 256h188.5l119.6 114.4H748V444H238c-13 0-24.8 7.9-29.7 20L136 643.2V256zm635.3 512H159l103.3-256h612.4L771.3 768z"
|
|
508
|
-
}, null)])]);
|
|
509
|
-
},
|
|
510
|
-
getTransformedData: function getTransformedData() {
|
|
511
|
-
var _this$$props4 = this.$props,
|
|
512
|
-
dataField = _this$$props4.dataField,
|
|
513
|
-
showSearch = _this$$props4.showSearch;
|
|
514
|
-
var transformedData = helper.transformRawTreeListData(this.$data.aggregationData, dataField);
|
|
515
|
-
var filteredData = [];
|
|
516
|
-
if (showSearch && this.searchTerm) {
|
|
517
|
-
filteredData = this.filterDataBasedOnSearchTerm(transformedData, '');
|
|
518
|
-
}
|
|
519
|
-
return filteredData.length ? filteredData : transformedData;
|
|
520
|
-
},
|
|
521
|
-
handleInputChange: function handleInputChange(e) {
|
|
522
|
-
var value = e.target.value;
|
|
523
|
-
this.searchTerm = value;
|
|
524
|
-
},
|
|
525
|
-
renderSearch: function renderSearch() {
|
|
526
|
-
var _this$$props5 = this.$props,
|
|
527
|
-
showSearch = _this$$props5.showSearch,
|
|
528
|
-
innerClass = _this$$props5.innerClass,
|
|
529
|
-
placeholder = _this$$props5.placeholder,
|
|
530
|
-
componentId = _this$$props5.componentId,
|
|
531
|
-
themePreset = _this$$props5.themePreset;
|
|
532
|
-
if (showSearch) {
|
|
533
|
-
return vue.createVNode(Input.Input, {
|
|
534
|
-
"class": helper.getClassName(innerClass, 'input') || null,
|
|
535
|
-
"onInput": this.handleInputChange,
|
|
536
|
-
"value": this.searchTerm,
|
|
537
|
-
"placeholder": placeholder || 'Search',
|
|
538
|
-
"style": {
|
|
539
|
-
margin: '0 0 8px'
|
|
540
|
-
},
|
|
541
|
-
"aria-label": componentId + "-search",
|
|
542
|
-
"themePreset": themePreset
|
|
543
|
-
}, null);
|
|
544
|
-
}
|
|
545
|
-
return null;
|
|
546
|
-
},
|
|
547
|
-
handleListItemClick: function handleListItemClick(key, parentPath) {
|
|
548
|
-
var path = key;
|
|
549
|
-
if (parentPath) {
|
|
550
|
-
path = "" + parentPath + constants.TREELIST_VALUES_PATH_SEPARATOR + key;
|
|
551
|
-
}
|
|
552
|
-
var newSelectedValues = _rollupPluginBabelHelpers._extends({}, this.selectedValues);
|
|
553
|
-
if (this.$props.mode === 'single') {
|
|
554
|
-
newSelectedValues = {};
|
|
555
|
-
helper.setDeep(newSelectedValues, path.split(constants.TREELIST_VALUES_PATH_SEPARATOR), true, true);
|
|
556
|
-
} else {
|
|
557
|
-
var newValue = !helper.recLookup(newSelectedValues, path, constants.TREELIST_VALUES_PATH_SEPARATOR);
|
|
558
|
-
helper.setDeep(newSelectedValues, path.split(constants.TREELIST_VALUES_PATH_SEPARATOR), newValue, true);
|
|
559
|
-
}
|
|
560
|
-
newSelectedValues = utils.sanitizeObject(_rollupPluginBabelHelpers._extends({}, newSelectedValues));
|
|
561
|
-
if (this.$props.value === undefined) {
|
|
562
|
-
this.setValue(newSelectedValues);
|
|
563
|
-
} else if (this.$props.onChange) {
|
|
564
|
-
var valueToSet = helper.transformTreeListLocalStateIntoQueryComptaibleFormat(newSelectedValues);
|
|
565
|
-
this.$props.onChange(valueToSet);
|
|
566
|
-
}
|
|
567
|
-
},
|
|
568
|
-
filterDataBasedOnSearchTerm: function filterDataBasedOnSearchTerm(listArray, parentPath) {
|
|
569
|
-
var _this = this;
|
|
570
|
-
if (!(listArray && Array.isArray(listArray) && listArray.length)) {
|
|
571
|
-
return null;
|
|
572
|
-
}
|
|
573
|
-
var result = [];
|
|
574
|
-
listArray.forEach(function (ele) {
|
|
575
|
-
var isLeafItem = !ele.list;
|
|
576
|
-
var newParentPath = ele.key;
|
|
577
|
-
if (parentPath) {
|
|
578
|
-
newParentPath = parentPath + "." + ele.key;
|
|
579
|
-
}
|
|
580
|
-
var keyHasSearchTerm = suggestions.replaceDiacritics(ele.key).toLowerCase().includes(suggestions.replaceDiacritics(_this.$data.searchTerm).toLowerCase()) || helper.recLookup(_this.$data.selectedValues, newParentPath, constants.TREELIST_VALUES_PATH_SEPARATOR);
|
|
581
|
-
if (isLeafItem && keyHasSearchTerm) {
|
|
582
|
-
result.push(_rollupPluginBabelHelpers._extends({}, ele, {
|
|
583
|
-
initiallyExpanded: keyHasSearchTerm
|
|
584
|
-
}));
|
|
585
|
-
} else if (!isLeafItem) {
|
|
586
|
-
var filteredChildrenItems = _this.filterDataBasedOnSearchTerm(ele.list, newParentPath);
|
|
587
|
-
if (keyHasSearchTerm || !!filteredChildrenItems.length) {
|
|
588
|
-
result.push(_rollupPluginBabelHelpers._extends({}, ele, {
|
|
589
|
-
initiallyExpanded: keyHasSearchTerm || !!filteredChildrenItems.length,
|
|
590
|
-
list: filteredChildrenItems
|
|
591
|
-
}));
|
|
592
|
-
}
|
|
593
|
-
}
|
|
594
|
-
});
|
|
595
|
-
return result;
|
|
596
|
-
},
|
|
597
|
-
getComponent: function getComponent() {
|
|
598
|
-
var _this$$props6 = this.$props,
|
|
599
|
-
rawData = _this$$props6.rawData,
|
|
600
|
-
error = _this$$props6.error,
|
|
601
|
-
isLoading = _this$$props6.isLoading;
|
|
602
|
-
var data = {
|
|
603
|
-
data: this.getTransformedData(),
|
|
604
|
-
rawData: rawData,
|
|
605
|
-
error: error,
|
|
606
|
-
handleClick: this.handleListItemClick,
|
|
607
|
-
value: this.$data.selectedValues,
|
|
608
|
-
loading: isLoading,
|
|
609
|
-
PATH_SEPARATOR: constants.TREELIST_VALUES_PATH_SEPARATOR
|
|
610
|
-
};
|
|
611
|
-
return this.$slots.render(data) || helper.getComponent(data, this.$props);
|
|
612
|
-
},
|
|
613
|
-
getDefaultQuery: function getDefaultQuery(value) {
|
|
614
|
-
var _this2 = this;
|
|
615
|
-
var query = null;
|
|
616
|
-
var type = 'term';
|
|
617
|
-
var booleanAggregator = this.$props.queryFormat === 'or' ? 'should' : 'must';
|
|
618
|
-
if (!Array.isArray(value) || value.length === 0) {
|
|
619
|
-
return null;
|
|
620
|
-
}
|
|
621
|
-
if (value) {
|
|
622
|
-
var _bool;
|
|
623
|
-
// adds a sub-query with must as an array of objects for each term/value
|
|
624
|
-
var queryArray = value.map(function (item) {
|
|
625
|
-
return {
|
|
626
|
-
bool: {
|
|
627
|
-
must: item.split(' > ').map(function (subItem, i) {
|
|
628
|
-
var _type, _ref2;
|
|
629
|
-
return _ref2 = {}, _ref2[type] = (_type = {}, _type[_this2.$props.dataField[i]] = subItem, _type), _ref2;
|
|
630
|
-
})
|
|
631
|
-
}
|
|
632
|
-
};
|
|
633
|
-
});
|
|
634
|
-
var listQuery = {
|
|
635
|
-
bool: (_bool = {}, _bool[booleanAggregator] = queryArray, _bool)
|
|
636
|
-
};
|
|
637
|
-
query = value.length ? listQuery : null;
|
|
638
|
-
}
|
|
639
|
-
if (query && this.$props.nestedField) {
|
|
640
|
-
return {
|
|
641
|
-
nested: {
|
|
642
|
-
path: this.$props.nestedField,
|
|
643
|
-
query: query
|
|
644
|
-
}
|
|
645
|
-
};
|
|
646
|
-
}
|
|
647
|
-
return query;
|
|
648
|
-
},
|
|
649
|
-
updateQuery: function updateQuery(value) {
|
|
650
|
-
var customQuery = this.$props.customQuery;
|
|
651
|
-
var query = this.getDefaultQuery(value);
|
|
652
|
-
var customQueryOptions;
|
|
653
|
-
if (customQuery) {
|
|
654
|
-
var _ref3 = customQuery(value, this.$props) || {};
|
|
655
|
-
query = _ref3.query;
|
|
656
|
-
customQueryOptions = helper.getOptionsFromQuery(customQuery(value, this.$props));
|
|
657
|
-
helper.updateCustomQuery(this.$props.componentId, this.$props, value);
|
|
658
|
-
}
|
|
659
|
-
this.setQueryOptions(this.$props.componentId, _rollupPluginBabelHelpers._extends({}, this.generateQueryOptions(), customQueryOptions));
|
|
660
|
-
this.updateQueryAction({
|
|
661
|
-
componentId: this.$props.componentId,
|
|
662
|
-
query: query,
|
|
663
|
-
value: value,
|
|
664
|
-
label: this.$props.filterLabel,
|
|
665
|
-
showFilter: this.$props.showFilter,
|
|
666
|
-
URLParams: this.$props.URLParams,
|
|
667
|
-
componentType: constants.componentTypes.treeList
|
|
668
|
-
});
|
|
669
|
-
},
|
|
670
|
-
setValue: function setValue(value, hasMountedParam) {
|
|
671
|
-
var _this3 = this;
|
|
672
|
-
if (hasMountedParam === void 0) {
|
|
673
|
-
hasMountedParam = true;
|
|
674
|
-
}
|
|
675
|
-
var finalValues = Array.isArray(value) === false ? helper.transformTreeListLocalStateIntoQueryComptaibleFormat(value) : value;
|
|
676
|
-
var performUpdate = function performUpdate() {
|
|
677
|
-
var handleUpdates = function handleUpdates() {
|
|
678
|
-
_this3.updateQuery(finalValues);
|
|
679
|
-
if (_this3.$props.onValueChange) _this3.$props.onValueChange(finalValues);
|
|
680
|
-
};
|
|
681
|
-
if (hasMountedParam) {
|
|
682
|
-
_this3.selectedValues = Array.isArray(value) ? transformValueIntoLocalState(value) : value;
|
|
683
|
-
handleUpdates();
|
|
684
|
-
} else {
|
|
685
|
-
handleUpdates();
|
|
686
|
-
}
|
|
687
|
-
};
|
|
688
|
-
helper.checkValueChange(this.$props.componentId, finalValues, this.$props.beforeValueChange, performUpdate);
|
|
689
|
-
},
|
|
690
|
-
generateQueryOptions: function generateQueryOptions() {
|
|
691
|
-
var queryOptions = helper.getQueryOptions(this.$props);
|
|
692
|
-
var valueArray = helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.selectedValues);
|
|
693
|
-
return helper.getAggsQuery(valueArray, queryOptions, this.$props);
|
|
694
|
-
},
|
|
695
|
-
updateDefaultQuery: function updateDefaultQuery(queryOptions) {
|
|
696
|
-
var value = helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.selectedValues);
|
|
697
|
-
// Update default query for RS API
|
|
698
|
-
helper.updateDefaultQuery(this.$props.componentId, this.$props, value);
|
|
699
|
-
helper.updateInternalQuery(transform.getInternalComponentID(this.$props.componentId), queryOptions, value, this.$props, this.generateQueryOptions(), null);
|
|
700
|
-
},
|
|
701
|
-
updateQueryOptions: function updateQueryOptions() {
|
|
702
|
-
// for a new query due to other changes don't append after to get fresh results
|
|
703
|
-
var queryOptions = this.generateQueryOptions(this.$props, {}, helper.transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues));
|
|
704
|
-
if (this.$props.defaultQuery) {
|
|
705
|
-
// eslint-disable-next-line no-use-before-define
|
|
706
|
-
this.updateDefaultQuery(queryOptions);
|
|
707
|
-
} else {
|
|
708
|
-
this.setQueryOptions(transform.getInternalComponentID(this.$props.componentId), queryOptions);
|
|
709
|
-
}
|
|
710
|
-
}
|
|
711
|
-
},
|
|
712
|
-
render: function render() {
|
|
713
|
-
var _this4 = this;
|
|
714
|
-
var props = this.$props;
|
|
715
|
-
var style = props.style,
|
|
716
|
-
className = props.className,
|
|
717
|
-
mode = props.mode,
|
|
718
|
-
showLine = props.showLine,
|
|
719
|
-
renderItem = props.renderItem,
|
|
720
|
-
showCheckbox = props.showCheckbox,
|
|
721
|
-
innerClass = props.innerClass,
|
|
722
|
-
showRadio = props.showRadio,
|
|
723
|
-
showCount = props.showCount,
|
|
724
|
-
showSwitcherIcon = props.showSwitcherIcon,
|
|
725
|
-
switcherIcon = props.switcherIcon,
|
|
726
|
-
title = props.title,
|
|
727
|
-
loader = props.loader,
|
|
728
|
-
renderError = props.renderError;
|
|
729
|
-
if (this.isLoading) {
|
|
730
|
-
return (this.$slots.loader ? this.$slots.loader() : loader) || null;
|
|
731
|
-
}
|
|
732
|
-
if (this.error) {
|
|
733
|
-
if (this.$slots.renderError) {
|
|
734
|
-
return this.$slots.renderError(this.error);
|
|
735
|
-
}
|
|
736
|
-
return helper.isFunction(renderError) ? renderError(this.error) : renderError;
|
|
737
|
-
}
|
|
738
|
-
var transformedData = this.getTransformedData();
|
|
739
|
-
if (!transformedData || transformedData.length === 0) {
|
|
740
|
-
return this.$slots.renderNoResults ? this.$slots.renderNoResults() : null;
|
|
741
|
-
}
|
|
742
|
-
return vue.createVNode(Container.Container, {
|
|
743
|
-
"style": style,
|
|
744
|
-
"class": className
|
|
745
|
-
}, {
|
|
746
|
-
"default": function _default() {
|
|
747
|
-
return [props.title && vue.createVNode(Title.Title, {
|
|
748
|
-
"class": helper.getClassName(innerClass, 'title') || null
|
|
749
|
-
}, _isSlot$1(title) ? title : {
|
|
750
|
-
"default": function _default() {
|
|
751
|
-
return [title];
|
|
752
|
-
}
|
|
753
|
-
}), _this4.renderSearch(), _this4.hasCustomRenderer ? _this4.getComponent() : vue.createVNode(HierarchicalMenuComponent, {
|
|
754
|
-
"key": "initial-node",
|
|
755
|
-
"listArray": transformedData,
|
|
756
|
-
"parentPath": "",
|
|
757
|
-
"isExpanded": true,
|
|
758
|
-
"listItemProps": {
|
|
759
|
-
mode: mode,
|
|
760
|
-
selectedValues: _this4.selectedValues,
|
|
761
|
-
searchTerm: _this4.searchTerm,
|
|
762
|
-
showLine: showLine,
|
|
763
|
-
renderItem: renderItem != null ? renderItem : _this4.$slots.renderItem,
|
|
764
|
-
handleListItemClick: _this4.handleListItemClick,
|
|
765
|
-
showCheckbox: showCheckbox,
|
|
766
|
-
innerClass: innerClass,
|
|
767
|
-
showRadio: showRadio,
|
|
768
|
-
renderIcon: _this4.renderIcon,
|
|
769
|
-
showCount: showCount,
|
|
770
|
-
showSwitcherIcon: showSwitcherIcon,
|
|
771
|
-
switcherIcon: switcherIcon != null ? switcherIcon : _this4.$slots.switcherIcon
|
|
772
|
-
}
|
|
773
|
-
}, null)];
|
|
774
|
-
}
|
|
775
|
-
});
|
|
776
|
-
}
|
|
777
|
-
};
|
|
778
|
-
var mapStateToProps = function mapStateToProps(state, props) {
|
|
779
|
-
return {
|
|
780
|
-
selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
|
|
781
|
-
rawData: state.rawData[props.componentId] || {},
|
|
782
|
-
aggregationData: props.nestedField && state.aggregations[props.componentId] ? state.aggregations[props.componentId].reactivesearch_nested : state.aggregations[props.componentId] || {},
|
|
783
|
-
themePreset: state.config.themePreset,
|
|
784
|
-
error: state.error[props.componentId],
|
|
785
|
-
isLoading: state.isLoading[props.componentId],
|
|
786
|
-
enableAppbase: state.config.enableAppbase
|
|
787
|
-
};
|
|
788
|
-
};
|
|
789
|
-
var mapDispatchtoProps = {
|
|
790
|
-
setQueryOptions: setQueryOptions,
|
|
791
|
-
updateQueryAction: updateQueryAction
|
|
792
|
-
};
|
|
793
|
-
TreeList.hasInternalComponent = function () {
|
|
794
|
-
return true;
|
|
795
|
-
};
|
|
796
|
-
var TreeListConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps, mapDispatchtoProps)(TreeList), {
|
|
797
|
-
componentType: constants.componentTypes.treeList,
|
|
798
|
-
internalComponent: TreeList.hasInternalComponent()
|
|
799
|
-
}));
|
|
800
|
-
TreeListConnected.name = TreeList.name;
|
|
801
|
-
TreeListConnected.install = function (Vue) {
|
|
802
|
-
Vue.component(TreeListConnected.name, TreeListConnected);
|
|
803
|
-
};
|
|
804
|
-
|
|
805
|
-
// Add componentType for SSR
|
|
806
|
-
TreeListConnected.componentType = constants.componentTypes.treeList;
|
|
807
|
-
|
|
808
|
-
var RcConnected = PreferencesConsumer.PreferencesConsumer({
|
|
809
|
-
name: 'RcConnected',
|
|
810
|
-
render: function render() {
|
|
811
|
-
var component = ReactiveComponent.default;
|
|
812
|
-
switch (this.$attrs.componentType) {
|
|
813
|
-
case constants.componentTypes.reactiveList:
|
|
814
|
-
component = ReactiveList.default;
|
|
815
|
-
break;
|
|
816
|
-
case constants.componentTypes.searchBox:
|
|
817
|
-
component = SearchBox.default;
|
|
818
|
-
break;
|
|
819
|
-
// list components
|
|
820
|
-
case constants.componentTypes.singleList:
|
|
821
|
-
component = SingleList.default;
|
|
822
|
-
break;
|
|
823
|
-
case constants.componentTypes.multiList:
|
|
824
|
-
component = MultiList.default;
|
|
825
|
-
break;
|
|
826
|
-
case constants.componentTypes.singleDropdownList:
|
|
827
|
-
component = SingleDropdownList.default;
|
|
828
|
-
break;
|
|
829
|
-
case constants.componentTypes.multiDropdownList:
|
|
830
|
-
component = MultiDropdownList.default;
|
|
831
|
-
break;
|
|
832
|
-
// basic components
|
|
833
|
-
case constants.componentTypes.toggleButton:
|
|
834
|
-
component = ToggleButton.default;
|
|
835
|
-
break;
|
|
836
|
-
// range components
|
|
837
|
-
case constants.componentTypes.dynamicRangeSlider:
|
|
838
|
-
component = DynamicRangeSlider.default;
|
|
839
|
-
break;
|
|
840
|
-
case constants.componentTypes.singleRange:
|
|
841
|
-
component = SingleRange.default;
|
|
842
|
-
break;
|
|
843
|
-
case constants.componentTypes.multiRange:
|
|
844
|
-
component = MultiRange.default;
|
|
845
|
-
break;
|
|
846
|
-
case constants.componentTypes.rangeSlider:
|
|
847
|
-
component = RangeSlider.default;
|
|
848
|
-
break;
|
|
849
|
-
case constants.componentTypes.rangeInput:
|
|
850
|
-
component = RangeInput.default;
|
|
851
|
-
break;
|
|
852
|
-
}
|
|
853
|
-
return vue.h(component, null, this.$slots);
|
|
854
|
-
}
|
|
855
|
-
});
|
|
856
|
-
RcConnected.name = ReactiveComponent.default.name;
|
|
857
|
-
RcConnected.hasInternalComponent = ReactiveComponent.default.hasInternalComponent;
|
|
858
|
-
// Add componentType for SSR
|
|
859
|
-
RcConnected.componentType = constants.componentTypes.reactiveComponent;
|
|
860
|
-
RcConnected.install = function (Vue) {
|
|
861
|
-
Vue.component(RcConnected.name, RcConnected);
|
|
862
|
-
};
|
|
863
|
-
|
|
864
|
-
var components = [ReactiveList.default, ResultCard.default, ResultList.default, ReactiveBase.default, SearchBox.default, SingleList.default, MultiList.default, SingleRange.default, MultiRange.default, RangeSlider.default, DynamicRangeSlider.default, ReactiveComponent.default, RcConnected, SelectedFilters.default, ToggleButton.default, SingleDropdownList.default, MultiDropdownList.default, StateProvider.default, RangeInput.default, TreeListConnected];
|
|
865
|
-
function install (Vue) {
|
|
866
|
-
components.map(function (component) {
|
|
867
|
-
Vue.use(component);
|
|
868
|
-
return null;
|
|
869
|
-
});
|
|
870
|
-
}
|
|
871
|
-
|
|
872
|
-
exports.ReactiveComponentPrivate = RcConnected;
|
|
873
|
-
exports.TreeList = TreeListConnected;
|
|
874
|
-
exports.install = install;
|