@appbaseio/reactivesearch-vue 1.33.1 → 1.33.3
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 +2888 -6530
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +7 -9
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-0673191e.js → Button-841fd06d.js} +1 -7
- package/dist/cjs/{CancelSvg-9f258f4f.js → CancelSvg-220a7cc3.js} +24 -58
- package/dist/cjs/{Card-642547a8.js → Card-240f283d.js} +2 -2
- package/dist/cjs/{ComponentWrapper-981ab977.js → ComponentWrapper-9318cece.js} +21 -41
- package/dist/cjs/{Container-daf30918.js → Container-e699ea95.js} +1 -1
- package/dist/cjs/{DataSearch-c42d8681.js → DataSearch-e4822dbf.js} +131 -299
- package/dist/cjs/DataSearch.js +11 -11
- package/dist/cjs/{DropDown-c479bbb0.js → DropDown-8984b544.js} +27 -48
- package/dist/cjs/DynamicRangeSlider.js +44 -93
- package/dist/cjs/{Flex-aa517a13.js → Flex-ddd7cb6b.js} +1 -3
- package/dist/cjs/{FormControlList-c195a592.js → FormControlList-bbb5cd24.js} +1 -3
- package/dist/cjs/{Input-e6603a7e.js → Input-ead4cd84.js} +14 -16
- package/dist/cjs/{ListItem-8c9e0d68.js → ListItem-5088bd6a.js} +2 -3
- package/dist/cjs/MultiDropdownList.js +41 -102
- package/dist/cjs/MultiList.js +35 -98
- package/dist/cjs/MultiRange.js +27 -53
- package/dist/cjs/{Pagination-3d73e1b3.js → Pagination-07f4dbad.js} +10 -30
- package/dist/cjs/{PreferencesConsumer-4707bd94.js → PreferencesConsumer-5d67b486.js} +8 -18
- package/dist/cjs/RangeInput.js +36 -52
- package/dist/cjs/RangeSlider.js +24 -48
- package/dist/cjs/ReactiveBase.js +66 -81
- package/dist/cjs/{ReactiveComponent-63ef70c2.js → ReactiveComponent-b8efb0cf.js} +118 -301
- package/dist/cjs/ReactiveComponent.js +20 -20
- package/dist/cjs/ReactiveGoogleMap.js +167 -353
- package/dist/cjs/ReactiveList.js +88 -176
- package/dist/cjs/ResultCard.js +10 -18
- package/dist/cjs/ResultList.js +13 -24
- package/dist/cjs/SelectedFilters.js +16 -34
- package/dist/cjs/SingleDropdownList.js +35 -75
- package/dist/cjs/SingleList.js +29 -75
- package/dist/cjs/SingleRange.js +17 -40
- package/dist/cjs/StateProvider.js +28 -32
- package/dist/cjs/{Title-1de7d0f4.js → Title-16042ea0.js} +1 -1
- package/dist/cjs/ToggleButton.js +20 -58
- package/dist/cjs/{_rollupPluginBabelHelpers-c705cbe6.js → _rollupPluginBabelHelpers-f8b843f8.js} +0 -15
- package/dist/cjs/{index-08f8dfa3.js → index-30126fd0.js} +39 -75
- package/dist/cjs/index.js +21 -22
- package/dist/cjs/initReactivesearch.js +49 -120
- package/dist/cjs/install.js +21 -21
- package/dist/cjs/{ssr-3027b848.js → ssr-f2fc1bf6.js} +1 -4
- package/dist/cjs/{utils-d6a52588.js → utils-83fd01e9.js} +7 -16
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/{vueTypes-727b7c63.js → vueTypes-7cfc2f98.js} +6 -11
- package/dist/es/{Button-35aa984e.js → Button-153cd885.js} +1 -7
- package/dist/es/{CancelSvg-4cfae5fd.js → CancelSvg-e40552a5.js} +24 -58
- package/dist/es/{Card-450683f1.js → Card-19ad6d90.js} +2 -2
- package/dist/es/{ComponentWrapper-d5e814a4.js → ComponentWrapper-240450cc.js} +21 -41
- package/dist/es/{Container-ba826e96.js → Container-d00219f7.js} +1 -1
- package/dist/es/{DataSearch-d56bf07a.js → DataSearch-5ddfba23.js} +131 -299
- package/dist/es/DataSearch.js +11 -11
- package/dist/es/{DropDown-05a644a5.js → DropDown-28ddce07.js} +27 -48
- package/dist/es/DynamicRangeSlider.js +44 -93
- package/dist/es/{Flex-1f0795c3.js → Flex-7c177a10.js} +1 -3
- package/dist/es/{FormControlList-c22d64f6.js → FormControlList-99797d0a.js} +1 -3
- package/dist/es/{Input-7a2a9fac.js → Input-c09c0b56.js} +14 -16
- package/dist/es/{ListItem-cad14c5e.js → ListItem-07888a65.js} +2 -3
- package/dist/es/MultiDropdownList.js +41 -102
- package/dist/es/MultiList.js +35 -98
- package/dist/es/MultiRange.js +27 -53
- package/dist/es/{Pagination-af9de08f.js → Pagination-28e56c5c.js} +10 -30
- package/dist/es/{PreferencesConsumer-4169deb1.js → PreferencesConsumer-bc097ebb.js} +8 -18
- package/dist/es/RangeInput.js +36 -52
- package/dist/es/RangeSlider.js +24 -48
- package/dist/es/ReactiveBase.js +66 -81
- package/dist/es/{ReactiveComponent-9e4721e1.js → ReactiveComponent-59107264.js} +118 -301
- package/dist/es/ReactiveComponent.js +20 -20
- package/dist/es/ReactiveGoogleMap.js +167 -353
- package/dist/es/ReactiveList.js +88 -176
- package/dist/es/ResultCard.js +10 -18
- package/dist/es/ResultList.js +13 -24
- package/dist/es/SelectedFilters.js +16 -34
- package/dist/es/SingleDropdownList.js +35 -75
- package/dist/es/SingleList.js +29 -75
- package/dist/es/SingleRange.js +17 -40
- package/dist/es/StateProvider.js +29 -33
- package/dist/es/{Title-3342664a.js → Title-863dfa42.js} +1 -1
- package/dist/es/ToggleButton.js +20 -58
- package/dist/es/{_rollupPluginBabelHelpers-76660dab.js → _rollupPluginBabelHelpers-ded08042.js} +0 -15
- package/dist/es/{index-99c5f9c9.js → index-0444a498.js} +39 -75
- package/dist/es/index.js +21 -22
- package/dist/es/initReactivesearch.js +49 -120
- package/dist/es/install.js +21 -21
- package/dist/es/{ssr-b2c0b401.js → ssr-03607d84.js} +1 -4
- package/dist/es/{utils-9e68acee.js → utils-9e5a16a1.js} +7 -16
- package/dist/es/version.js +1 -1
- package/dist/es/{vueTypes-b8146772.js → vueTypes-8986b709.js} +6 -11
- package/package.json +3 -2
package/dist/es/DataSearch.js
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
import '@appbaseio/reactivecore';
|
|
2
2
|
import '@appbaseio/reactivecore/lib/utils/constants';
|
|
3
|
-
import './_rollupPluginBabelHelpers-
|
|
3
|
+
import './_rollupPluginBabelHelpers-ded08042.js';
|
|
4
4
|
import 'vue-types';
|
|
5
5
|
import '@appbaseio/reactivecore/lib/utils/helper';
|
|
6
6
|
import 'emotion';
|
|
7
7
|
import '@appbaseio/vue-emotion';
|
|
8
8
|
import 'polished';
|
|
9
|
-
import './vueTypes-
|
|
9
|
+
import './vueTypes-8986b709.js';
|
|
10
10
|
import '@appbaseio/reactivecore/lib/utils/transform';
|
|
11
11
|
import 'redux';
|
|
12
|
-
import './index-
|
|
13
|
-
import './ComponentWrapper-
|
|
14
|
-
import './PreferencesConsumer-
|
|
15
|
-
import './Title-
|
|
16
|
-
import './Flex-
|
|
12
|
+
import './index-0444a498.js';
|
|
13
|
+
import './ComponentWrapper-240450cc.js';
|
|
14
|
+
import './PreferencesConsumer-bc097ebb.js';
|
|
15
|
+
import './Title-863dfa42.js';
|
|
16
|
+
import './Flex-7c177a10.js';
|
|
17
17
|
import 'hotkeys-js';
|
|
18
|
-
export { D as DSConnected, a as default } from './DataSearch-
|
|
19
|
-
import './CancelSvg-
|
|
20
|
-
import './Input-
|
|
18
|
+
export { D as DSConnected, a as default } from './DataSearch-5ddfba23.js';
|
|
19
|
+
import './CancelSvg-e40552a5.js';
|
|
20
|
+
import './Input-c09c0b56.js';
|
|
21
21
|
import 'compute-scroll-into-view';
|
|
22
|
-
import './Container-
|
|
22
|
+
import './Container-d00219f7.js';
|
|
23
23
|
import 'vue-highlight-words';
|
|
@@ -1,23 +1,21 @@
|
|
|
1
1
|
import { helper } from '@appbaseio/reactivecore';
|
|
2
|
-
import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-
|
|
2
|
+
import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
|
|
3
3
|
import VueTypes from 'vue-types';
|
|
4
4
|
import { css } from 'emotion';
|
|
5
5
|
import styled from '@appbaseio/vue-emotion';
|
|
6
|
-
import { t as types } from './vueTypes-
|
|
7
|
-
import { a as isFunction } from './index-
|
|
6
|
+
import { t as types } from './vueTypes-8986b709.js';
|
|
7
|
+
import { a as isFunction } from './index-0444a498.js';
|
|
8
8
|
import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
|
|
9
|
-
import { D as Downshift, b as InputWrapper, a as IconGroup, I as IconWrapper, C as CancelSvg } from './CancelSvg-
|
|
10
|
-
import { s as suggestionsContainer, a as suggestions, I as Input } from './Input-
|
|
9
|
+
import { D as Downshift, b as InputWrapper, a as IconGroup, I as IconWrapper, C as CancelSvg } from './CancelSvg-e40552a5.js';
|
|
10
|
+
import { s as suggestionsContainer, a as suggestions, I as Input } from './Input-c09c0b56.js';
|
|
11
11
|
import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
|
|
12
12
|
|
|
13
13
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
14
14
|
var small = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tmin-height: 0;\n\theight: 30px;\n\tborder: 0;\n\tbox-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;\n\tborder-radius: 2px;\n"])));
|
|
15
|
-
|
|
16
15
|
var dark = function dark(_ref) {
|
|
17
16
|
var theme = _ref.theme;
|
|
18
17
|
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tbackground-color: ", ";\n\tborder-color: ", ";\n\tcolor: ", ";\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: ", ";\n\t}\n"])), theme.colors.backgroundColor, theme.colors.borderColor, theme.colors.textColor, theme.colors.backgroundColor);
|
|
19
18
|
};
|
|
20
|
-
|
|
21
19
|
var Select = styled('button')(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 42px;\n\tborder-radius: 0;\n\toutline: none;\n\tpadding: 5px 12px;\n\tfont-size: 0.9rem;\n\tline-height: 1.2rem;\n\tbackground-color: #fff;\n\tborder: 1px solid #ccc;\n\tcolor: #424242;\n\tcursor: pointer;\n\tuser-select: none;\n\ttransition: all 0.3s ease;\n\n\t", ";\n\n\t& > div {\n\t\twidth: calc(100% - 24px);\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\ttext-align: left;\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: #fcfcfc;\n\t}\n\n\t", ";\n"])), function (props) {
|
|
22
20
|
return props.small ? small : null;
|
|
23
21
|
}, function (_ref2) {
|
|
@@ -76,36 +74,31 @@ var Dropdown = {
|
|
|
76
74
|
},
|
|
77
75
|
render: function render() {
|
|
78
76
|
var _this = this;
|
|
79
|
-
|
|
80
77
|
var h = arguments[0];
|
|
81
78
|
var _this$$props = this.$props,
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
79
|
+
items = _this$$props.items,
|
|
80
|
+
selectedItem = _this$$props.selectedItem,
|
|
81
|
+
placeholder = _this$$props.placeholder,
|
|
82
|
+
labelField = _this$$props.labelField,
|
|
83
|
+
keyField = _this$$props.keyField,
|
|
84
|
+
themePreset = _this$$props.themePreset,
|
|
85
|
+
renderItem = _this$$props.renderItem,
|
|
86
|
+
transformData = _this$$props.transformData,
|
|
87
|
+
footer = _this$$props.footer,
|
|
88
|
+
customLabelRenderer = _this$$props.customLabelRenderer,
|
|
89
|
+
hasCustomRenderer = _this$$props.hasCustomRenderer,
|
|
90
|
+
customRenderer = _this$$props.customRenderer;
|
|
94
91
|
var itemsToRender = items;
|
|
95
|
-
|
|
96
92
|
if (transformData) {
|
|
97
93
|
itemsToRender = transformData(itemsToRender);
|
|
98
94
|
}
|
|
99
|
-
|
|
100
95
|
var filteredItemsToRender = itemsToRender.filter(function (item) {
|
|
101
96
|
if (String(item[labelField]).length) {
|
|
102
97
|
if (_this.$props.showSearch && _this.$data.searchTerm) {
|
|
103
98
|
return replaceDiacritics(String(item[labelField])).toLowerCase().includes(replaceDiacritics(_this.$data.searchTerm.toLowerCase()));
|
|
104
99
|
}
|
|
105
|
-
|
|
106
100
|
return true;
|
|
107
101
|
}
|
|
108
|
-
|
|
109
102
|
return false;
|
|
110
103
|
});
|
|
111
104
|
return h(Downshift, {
|
|
@@ -118,11 +111,11 @@ var Dropdown = {
|
|
|
118
111
|
"scopedSlots": {
|
|
119
112
|
"default": function _default(_ref) {
|
|
120
113
|
var getItemProps = _ref.getItemProps,
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
114
|
+
isOpen = _ref.isOpen,
|
|
115
|
+
highlightedIndex = _ref.highlightedIndex,
|
|
116
|
+
getButtonProps = _ref.getButtonProps,
|
|
117
|
+
getItemEvents = _ref.getItemEvents,
|
|
118
|
+
getInputEvents = _ref.getInputEvents;
|
|
126
119
|
return h("div", {
|
|
127
120
|
"class": suggestionsContainer
|
|
128
121
|
}, [h(Select, {
|
|
@@ -203,7 +196,6 @@ var Dropdown = {
|
|
|
203
196
|
} else {
|
|
204
197
|
this.$props.handleChange(item[this.$props.keyField]);
|
|
205
198
|
}
|
|
206
|
-
|
|
207
199
|
if (!this.$props.multi) {
|
|
208
200
|
this.isOpen = false;
|
|
209
201
|
this.searchTerm = '';
|
|
@@ -215,15 +207,12 @@ var Dropdown = {
|
|
|
215
207
|
},
|
|
216
208
|
getBackgroundColor: function getBackgroundColor(highlighted, selected) {
|
|
217
209
|
var isDark = this.$props.themePreset === 'dark';
|
|
218
|
-
|
|
219
210
|
if (highlighted) {
|
|
220
211
|
return isDark ? '#555' : '#eee';
|
|
221
212
|
}
|
|
222
|
-
|
|
223
213
|
if (selected) {
|
|
224
214
|
return isDark ? '#686868' : '#fafafa';
|
|
225
215
|
}
|
|
226
|
-
|
|
227
216
|
return isDark ? '#424242' : '#fff';
|
|
228
217
|
},
|
|
229
218
|
handleInputChange: function handleInputChange(e) {
|
|
@@ -235,36 +224,28 @@ var Dropdown = {
|
|
|
235
224
|
},
|
|
236
225
|
renderToString: function renderToString(value) {
|
|
237
226
|
var _this2 = this;
|
|
238
|
-
|
|
239
227
|
var customLabelRenderer = this.$props.customLabelRenderer;
|
|
240
|
-
|
|
241
228
|
if (customLabelRenderer) {
|
|
242
229
|
var customLabel = customLabelRenderer(value);
|
|
243
|
-
|
|
244
230
|
if (typeof customLabel === 'string') {
|
|
245
231
|
return customLabel;
|
|
246
232
|
}
|
|
247
233
|
}
|
|
248
|
-
|
|
249
234
|
if (Array.isArray(value) && value.length) {
|
|
250
235
|
var arrayToRender = value.map(function (item) {
|
|
251
236
|
return _this2.renderToString(item);
|
|
252
237
|
});
|
|
253
238
|
return arrayToRender.join(', ');
|
|
254
239
|
}
|
|
255
|
-
|
|
256
240
|
if (value && typeof value === 'object') {
|
|
257
241
|
if (value[this.$props.labelField]) {
|
|
258
242
|
return value[this.$props.labelField];
|
|
259
243
|
}
|
|
260
|
-
|
|
261
244
|
if (Object.keys(value).length) {
|
|
262
245
|
return this.renderToString(Object.keys(value));
|
|
263
246
|
}
|
|
264
|
-
|
|
265
247
|
return this.$props.placeholder;
|
|
266
248
|
}
|
|
267
|
-
|
|
268
249
|
return value;
|
|
269
250
|
},
|
|
270
251
|
renderNoResult: function renderNoResult() {
|
|
@@ -277,11 +258,11 @@ var Dropdown = {
|
|
|
277
258
|
renderSearchbox: function renderSearchbox(eventObject) {
|
|
278
259
|
var h = this.$createElement;
|
|
279
260
|
var _this$$props2 = this.$props,
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
261
|
+
componentId = _this$$props2.componentId,
|
|
262
|
+
searchPlaceholder = _this$$props2.searchPlaceholder,
|
|
263
|
+
showClear = _this$$props2.showClear,
|
|
264
|
+
themePreset = _this$$props2.themePreset,
|
|
265
|
+
innerClass = _this$$props2.innerClass;
|
|
285
266
|
var InputComponent = h(Input, _mergeJSXProps([{
|
|
286
267
|
"attrs": {
|
|
287
268
|
"id": componentId + "-input",
|
|
@@ -297,7 +278,6 @@ var Dropdown = {
|
|
|
297
278
|
},
|
|
298
279
|
"class": getClassName(innerClass, 'input')
|
|
299
280
|
}, eventObject]));
|
|
300
|
-
|
|
301
281
|
if (showClear) {
|
|
302
282
|
return h(InputWrapper, [InputComponent, this.searchTerm && h(IconGroup, {
|
|
303
283
|
"attrs": {
|
|
@@ -313,7 +293,6 @@ var Dropdown = {
|
|
|
313
293
|
}
|
|
314
294
|
}, [h(CancelSvg)])])]);
|
|
315
295
|
}
|
|
316
|
-
|
|
317
296
|
return InputComponent;
|
|
318
297
|
}
|
|
319
298
|
}
|
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
import { Actions, helper } from '@appbaseio/reactivecore';
|
|
2
2
|
import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
|
|
3
|
-
import { a as _extends } from './_rollupPluginBabelHelpers-
|
|
3
|
+
import { a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
|
|
4
4
|
import VueTypes from 'vue-types';
|
|
5
5
|
import '@appbaseio/vue-emotion';
|
|
6
|
-
import { t as types } from './vueTypes-
|
|
6
|
+
import { t as types } from './vueTypes-8986b709.js';
|
|
7
7
|
import 'redux';
|
|
8
|
-
import { f as updateCustomQuery, d as getValidPropsKeys, i as isQueryIdentical, c as connect } from './index-
|
|
9
|
-
import { P as PreferencesConsumer } from './PreferencesConsumer-
|
|
10
|
-
import { T as Title } from './Title-
|
|
11
|
-
import { C as Container } from './Container-
|
|
8
|
+
import { f as updateCustomQuery, d as getValidPropsKeys, i as isQueryIdentical, c as connect } from './index-0444a498.js';
|
|
9
|
+
import { P as PreferencesConsumer } from './PreferencesConsumer-bc097ebb.js';
|
|
10
|
+
import { T as Title } from './Title-863dfa42.js';
|
|
11
|
+
import { C as Container } from './Container-d00219f7.js';
|
|
12
12
|
import NoSSR from 'vue-no-ssr';
|
|
13
|
-
import { g as getComponents, S as Slider } from './ssr-
|
|
13
|
+
import { g as getComponents, S as Slider } from './ssr-03607d84.js';
|
|
14
14
|
|
|
15
15
|
var addComponent = Actions.addComponent,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
16
|
+
removeComponent = Actions.removeComponent,
|
|
17
|
+
watchComponent = Actions.watchComponent,
|
|
18
|
+
updateQuery = Actions.updateQuery,
|
|
19
|
+
setQueryListener = Actions.setQueryListener,
|
|
20
|
+
setQueryOptions = Actions.setQueryOptions,
|
|
21
|
+
setComponentProps = Actions.setComponentProps,
|
|
22
|
+
setCustomQuery = Actions.setCustomQuery,
|
|
23
|
+
updateComponentProps = Actions.updateComponentProps;
|
|
24
24
|
var checkValueChange = helper.checkValueChange,
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
getClassName = helper.getClassName,
|
|
26
|
+
isEqual = helper.isEqual,
|
|
27
|
+
checkSomePropChange = helper.checkSomePropChange,
|
|
28
|
+
extractQueryFromCustomQuery = helper.extractQueryFromCustomQuery,
|
|
29
|
+
getOptionsForCustomQuery = helper.getOptionsForCustomQuery;
|
|
30
30
|
var DynamicRangeSlider = {
|
|
31
31
|
name: 'DynamicRangeSlider',
|
|
32
32
|
components: getComponents(),
|
|
@@ -62,27 +62,21 @@ var DynamicRangeSlider = {
|
|
|
62
62
|
},
|
|
63
63
|
created: function created() {
|
|
64
64
|
var _this = this;
|
|
65
|
-
|
|
66
65
|
var onQueryChange = function onQueryChange() {
|
|
67
66
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
68
67
|
args[_key] = arguments[_key];
|
|
69
68
|
}
|
|
70
|
-
|
|
71
69
|
_this.$emit.apply(_this, ['queryChange'].concat(args));
|
|
72
|
-
|
|
73
70
|
_this.$emit.apply(_this, ['query-change'].concat(args));
|
|
74
71
|
};
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
72
|
+
this.setQueryListener(this.$props.componentId, onQueryChange, null);
|
|
73
|
+
// Update props in store
|
|
78
74
|
this.setComponentProps(this.componentId, this.$props, componentTypes.dynamicRangeSlider);
|
|
79
75
|
this.setComponentProps(this.internalRangeComponent, this.$props, componentTypes.dynamicRangeSlider);
|
|
80
|
-
|
|
81
76
|
if (!this.enableAppbase && this.$props.index) {
|
|
82
77
|
console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
|
|
78
|
+
}
|
|
79
|
+
// Set custom query in store
|
|
86
80
|
updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
|
|
87
81
|
},
|
|
88
82
|
mounted: function mounted() {
|
|
@@ -90,28 +84,23 @@ var DynamicRangeSlider = {
|
|
|
90
84
|
},
|
|
91
85
|
beforeMount: function beforeMount() {
|
|
92
86
|
var components = [];
|
|
93
|
-
|
|
94
87
|
if (this.$$store) {
|
|
95
88
|
var _this$$$store$getStat = this.$$store.getState();
|
|
96
|
-
|
|
97
89
|
components = _this$$$store$getStat.components;
|
|
98
90
|
}
|
|
99
|
-
|
|
100
91
|
var value = this.$props.value;
|
|
101
|
-
|
|
102
92
|
if (this.destroyOnUnmount || components.indexOf(this.componentId) === -1) {
|
|
103
93
|
this.addComponent(this.componentId);
|
|
104
94
|
this.addComponent(this.internalRangeComponent);
|
|
105
|
-
|
|
106
95
|
if (Array.isArray(this.selectedValue)) {
|
|
107
96
|
this.handleChange(this.selectedValue);
|
|
108
97
|
} else if (this.selectedValue) {
|
|
109
98
|
this.handleChange(DynamicRangeSlider.parseValue(this.selectedValue, this.$props));
|
|
110
99
|
} else if (value) {
|
|
111
100
|
this.handleChange(DynamicRangeSlider.parseValue(value, this.$props));
|
|
112
|
-
}
|
|
113
|
-
|
|
101
|
+
}
|
|
114
102
|
|
|
103
|
+
// get range before executing other queries
|
|
115
104
|
this.updateRangeQueryOptions();
|
|
116
105
|
}
|
|
117
106
|
},
|
|
@@ -131,18 +120,15 @@ var DynamicRangeSlider = {
|
|
|
131
120
|
if (this.$props.value && this.$listeners) {
|
|
132
121
|
return true;
|
|
133
122
|
}
|
|
134
|
-
|
|
135
123
|
return false;
|
|
136
124
|
},
|
|
137
125
|
setDefaultValue: function setDefaultValue(_ref) {
|
|
138
126
|
var start = _ref.start,
|
|
139
|
-
|
|
140
|
-
|
|
127
|
+
end = _ref.end;
|
|
141
128
|
if (this.$props.defaultValue) {
|
|
142
129
|
var _this$$props$defaultV = this.$props.defaultValue(start, end),
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
130
|
+
defaultStart = _this$$props$defaultV.start,
|
|
131
|
+
defaultEnd = _this$$props$defaultV.end;
|
|
146
132
|
this.handleChange([defaultStart, defaultEnd]);
|
|
147
133
|
} else if (this.isControlled()) {
|
|
148
134
|
this.handleChange(DynamicRangeSlider.parseValue(this.$props.value), 'change');
|
|
@@ -175,10 +161,8 @@ var DynamicRangeSlider = {
|
|
|
175
161
|
},
|
|
176
162
|
updateRangeQueryOptions: function updateRangeQueryOptions() {
|
|
177
163
|
var aggs = {};
|
|
178
|
-
|
|
179
164
|
if (this.$props.nestedField) {
|
|
180
165
|
var _aggs;
|
|
181
|
-
|
|
182
166
|
aggs = (_aggs = {}, _aggs[this.$props.nestedField] = {
|
|
183
167
|
nested: {
|
|
184
168
|
path: this.$props.nestedField
|
|
@@ -188,7 +172,6 @@ var DynamicRangeSlider = {
|
|
|
188
172
|
} else {
|
|
189
173
|
aggs = this.rangeQuery();
|
|
190
174
|
}
|
|
191
|
-
|
|
192
175
|
this.setQueryOptions(this.internalRangeComponent, {
|
|
193
176
|
aggs: aggs
|
|
194
177
|
});
|
|
@@ -196,7 +179,6 @@ var DynamicRangeSlider = {
|
|
|
196
179
|
handleSlider: function handleSlider() {
|
|
197
180
|
var sliderValues = this.$refs.slider.getValue();
|
|
198
181
|
var value = this.$props.value;
|
|
199
|
-
|
|
200
182
|
if (value === undefined) {
|
|
201
183
|
this.handleChange(sliderValues);
|
|
202
184
|
} else {
|
|
@@ -208,26 +190,20 @@ var DynamicRangeSlider = {
|
|
|
208
190
|
},
|
|
209
191
|
handleChange: function handleChange(currentValue) {
|
|
210
192
|
var _this2 = this;
|
|
211
|
-
|
|
212
193
|
// Always keep the values within range
|
|
213
194
|
var normalizedValue = [this.range ? Math.max(this.range.start, currentValue[0]) : currentValue[0], this.range ? Math.min(this.range.end, currentValue[1]) : currentValue[1]];
|
|
214
|
-
|
|
215
195
|
var performUpdate = function performUpdate() {
|
|
216
196
|
_this2.currentValue = normalizedValue;
|
|
217
|
-
|
|
218
197
|
_this2.updateQueryHandler(normalizedValue, _this2.$props);
|
|
219
|
-
|
|
220
198
|
_this2.$emit('valueChange', {
|
|
221
199
|
start: normalizedValue[0],
|
|
222
200
|
end: normalizedValue[1]
|
|
223
201
|
});
|
|
224
|
-
|
|
225
202
|
_this2.$emit('value-change', {
|
|
226
203
|
start: normalizedValue[0],
|
|
227
204
|
end: normalizedValue[1]
|
|
228
205
|
});
|
|
229
206
|
};
|
|
230
|
-
|
|
231
207
|
checkValueChange(this.$props.componentId, {
|
|
232
208
|
start: normalizedValue[0],
|
|
233
209
|
end: normalizedValue[1]
|
|
@@ -235,30 +211,25 @@ var DynamicRangeSlider = {
|
|
|
235
211
|
},
|
|
236
212
|
updateQueryHandler: function updateQueryHandler(value) {
|
|
237
213
|
var query = DynamicRangeSlider.defaultQuery(value, this.$props);
|
|
238
|
-
|
|
239
214
|
if (this.$props.customQuery) {
|
|
240
215
|
var customQueryTobeSet = this.$props.customQuery(value, this.$props);
|
|
241
216
|
var queryTobeSet = extractQueryFromCustomQuery(customQueryTobeSet);
|
|
242
|
-
|
|
243
217
|
if (queryTobeSet) {
|
|
244
218
|
query = queryTobeSet;
|
|
245
219
|
}
|
|
246
|
-
|
|
247
220
|
var customQueryOptions = getOptionsForCustomQuery(customQueryTobeSet);
|
|
248
221
|
updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, value);
|
|
249
222
|
this.setQueryOptions(this.$props.componentId, customQueryOptions, false);
|
|
250
223
|
}
|
|
251
|
-
|
|
252
224
|
var _ref2 = this.range || {
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
225
|
+
start: value[0],
|
|
226
|
+
end: value[1]
|
|
227
|
+
},
|
|
228
|
+
start = _ref2.start,
|
|
229
|
+
end = _ref2.end;
|
|
259
230
|
var currentStart = value[0],
|
|
260
|
-
|
|
261
|
-
|
|
231
|
+
currentEnd = value[1];
|
|
232
|
+
// check if the slider is at its initial position
|
|
262
233
|
var isInitialValue = currentStart === start && currentEnd === end;
|
|
263
234
|
this.updateQuery({
|
|
264
235
|
componentId: this.$props.componentId,
|
|
@@ -282,11 +253,9 @@ var DynamicRangeSlider = {
|
|
|
282
253
|
deep: true,
|
|
283
254
|
handler: function handler(newVal) {
|
|
284
255
|
var _this3 = this;
|
|
285
|
-
|
|
286
256
|
var propsKeys = getValidPropsKeys(newVal);
|
|
287
257
|
checkSomePropChange(newVal, this.componentProps, propsKeys, function () {
|
|
288
258
|
_this3.updateComponentProps(_this3.componentId, newVal, componentTypes.dynamicRangeSlider);
|
|
289
|
-
|
|
290
259
|
_this3.updateComponentProps(_this3.internalRangeComponent, newVal, componentTypes.dynamicRangeSlider);
|
|
291
260
|
});
|
|
292
261
|
}
|
|
@@ -305,15 +274,12 @@ var DynamicRangeSlider = {
|
|
|
305
274
|
},
|
|
306
275
|
range: function range(newValue, oldValue) {
|
|
307
276
|
if (isEqual(newValue, oldValue) || !this.currentValue) return;
|
|
308
|
-
|
|
309
277
|
var _ref3 = this.currentValue || [],
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
278
|
+
currentStart = _ref3[0],
|
|
279
|
+
currentEnd = _ref3[1];
|
|
313
280
|
var _ref4 = oldValue || {},
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
281
|
+
oldStart = _ref4.start,
|
|
282
|
+
oldEnd = _ref4.end;
|
|
317
283
|
var newStart = currentStart === oldStart ? newValue.start : currentStart;
|
|
318
284
|
var newEnd = currentEnd === oldEnd ? newValue.end : currentEnd;
|
|
319
285
|
this.handleChange([newStart, newEnd]);
|
|
@@ -331,14 +297,12 @@ var DynamicRangeSlider = {
|
|
|
331
297
|
},
|
|
332
298
|
render: function render() {
|
|
333
299
|
var h = arguments[0];
|
|
334
|
-
|
|
335
300
|
if (!this.range || !this.currentValue) {
|
|
336
301
|
return null;
|
|
337
302
|
}
|
|
338
|
-
|
|
339
303
|
var _this$range = this.range,
|
|
340
|
-
|
|
341
|
-
|
|
304
|
+
start = _this$range.start,
|
|
305
|
+
end = _this$range.end;
|
|
342
306
|
return h(Container, {
|
|
343
307
|
"class": this.$props.className
|
|
344
308
|
}, [this.$props.title && h(Title, {
|
|
@@ -369,13 +333,10 @@ var DynamicRangeSlider = {
|
|
|
369
333
|
}, [this.labels.end])]) : null])])]);
|
|
370
334
|
}
|
|
371
335
|
};
|
|
372
|
-
|
|
373
336
|
DynamicRangeSlider.defaultQuery = function (values, props) {
|
|
374
337
|
var query = null;
|
|
375
|
-
|
|
376
338
|
if (Array.isArray(values) && values.length) {
|
|
377
339
|
var _range;
|
|
378
|
-
|
|
379
340
|
query = {
|
|
380
341
|
range: (_range = {}, _range[props.dataField] = {
|
|
381
342
|
gte: values[0],
|
|
@@ -384,7 +345,6 @@ DynamicRangeSlider.defaultQuery = function (values, props) {
|
|
|
384
345
|
}, _range)
|
|
385
346
|
};
|
|
386
347
|
}
|
|
387
|
-
|
|
388
348
|
if (query && props.nestedField) {
|
|
389
349
|
return {
|
|
390
350
|
query: {
|
|
@@ -395,28 +355,22 @@ DynamicRangeSlider.defaultQuery = function (values, props) {
|
|
|
395
355
|
}
|
|
396
356
|
};
|
|
397
357
|
}
|
|
398
|
-
|
|
399
358
|
return query;
|
|
400
359
|
};
|
|
401
|
-
|
|
402
360
|
DynamicRangeSlider.parseValue = function (value) {
|
|
403
361
|
if (value) {
|
|
404
362
|
return Array.isArray(value) ? value : [value.start, value.end];
|
|
405
363
|
}
|
|
406
|
-
|
|
407
364
|
return [];
|
|
408
365
|
};
|
|
409
|
-
|
|
410
366
|
DynamicRangeSlider.hasInternalComponent = function () {
|
|
411
367
|
return true;
|
|
412
368
|
};
|
|
413
|
-
|
|
414
369
|
var mapStateToProps = function mapStateToProps(state, props) {
|
|
415
370
|
var componentId = state.aggregations[props.componentId];
|
|
416
371
|
var internalRange = state.aggregations[props.componentId + "__range__internal"];
|
|
417
372
|
var options = componentId && componentId[props.dataField];
|
|
418
373
|
var range = state.aggregations[props.componentId + "__range__internal"];
|
|
419
|
-
|
|
420
374
|
if (props.nestedField) {
|
|
421
375
|
options = options && componentId[props.dataField][props.nestedField] && componentId[props.dataField][props.nestedField].buckets ? componentId[props.dataField][props.nestedField].buckets : [];
|
|
422
376
|
range = range && internalRange[props.nestedField].min ? {
|
|
@@ -430,7 +384,6 @@ var mapStateToProps = function mapStateToProps(state, props) {
|
|
|
430
384
|
end: internalRange.max.value
|
|
431
385
|
} : null;
|
|
432
386
|
}
|
|
433
|
-
|
|
434
387
|
return {
|
|
435
388
|
options: options,
|
|
436
389
|
range: range,
|
|
@@ -439,7 +392,6 @@ var mapStateToProps = function mapStateToProps(state, props) {
|
|
|
439
392
|
enableAppbase: state.config.enableAppbase
|
|
440
393
|
};
|
|
441
394
|
};
|
|
442
|
-
|
|
443
395
|
var mapDispatchtoProps = {
|
|
444
396
|
addComponent: addComponent,
|
|
445
397
|
removeComponent: removeComponent,
|
|
@@ -452,12 +404,11 @@ var mapDispatchtoProps = {
|
|
|
452
404
|
updateComponentProps: updateComponentProps
|
|
453
405
|
};
|
|
454
406
|
var RangeConnected = PreferencesConsumer(connect(mapStateToProps, mapDispatchtoProps)(DynamicRangeSlider));
|
|
455
|
-
|
|
456
407
|
DynamicRangeSlider.install = function (Vue) {
|
|
457
408
|
Vue.component(DynamicRangeSlider.name, RangeConnected);
|
|
458
|
-
};
|
|
459
|
-
|
|
409
|
+
};
|
|
460
410
|
|
|
411
|
+
// Add componentType for SSR
|
|
461
412
|
DynamicRangeSlider.componentType = componentTypes.dynamicRangeSlider;
|
|
462
413
|
|
|
463
414
|
export default DynamicRangeSlider;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-
|
|
1
|
+
import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
|
|
2
2
|
import { css } from 'emotion';
|
|
3
3
|
import styled from '@appbaseio/vue-emotion';
|
|
4
4
|
import { lighten } from 'polished';
|
|
@@ -8,12 +8,10 @@ var leftLabel = css(_templateObject || (_templateObject = _taggedTemplateLiteral
|
|
|
8
8
|
var rightLabel = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tflex-direction: row-reverse;\n\talign-items: center;\n"])));
|
|
9
9
|
var topLabel = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\tflex-direction: column;\n"])));
|
|
10
10
|
var bottomLabel = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n\tflex-direction: column-reverse;\n"])));
|
|
11
|
-
|
|
12
11
|
var border = function border(_ref) {
|
|
13
12
|
var colors = _ref.theme.colors;
|
|
14
13
|
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n\tborder: 1px solid ", ";\n"])), colors.borderColor || '#ccc');
|
|
15
14
|
};
|
|
16
|
-
|
|
17
15
|
var Flex = styled('div')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n\tdisplay: ", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\n\tsvg.cancel-icon {\n\t\tcursor: pointer;\n\t\tfill: ", ";\n\t\tflex-basis: 30px;\n\n\t\t&:hover {\n\t\t\tfill: ", ";\n\t\t}\n\t}\n"])), function (props) {
|
|
18
16
|
return props.inline ? 'inline-flex' : 'flex';
|
|
19
17
|
}, function (props) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-
|
|
1
|
+
import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
|
|
2
2
|
import { css } from 'emotion';
|
|
3
3
|
import styled from '@appbaseio/vue-emotion';
|
|
4
4
|
import { lighten } from 'polished';
|
|
@@ -11,12 +11,10 @@ var item = {
|
|
|
11
11
|
};
|
|
12
12
|
var vh = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tborder: 0;\n\tclip: rect(1px, 1px, 1px, 1px);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tpadding: 0;\n\tposition: absolute;\n\twidth: 1px;\n\twhite-space: nowrap;\n"])));
|
|
13
13
|
var hideInputControl = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\t+ label {\n\t\tpadding-left: 0;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder: 0;\n\t\t\tmargin: 0;\n\t\t\tvisibility: hidden;\n\t\t}\n\t}\n\n\t&:checked {\n\t\t+ label {\n\t\t\tfont-weight: bold;\n\t\t}\n\t}\n"])));
|
|
14
|
-
|
|
15
14
|
var formItem = function formItem(_ref) {
|
|
16
15
|
var theme = _ref.theme;
|
|
17
16
|
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\t", ";\n\n\t&:focus {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tbox-shadow: 0 0 0 2px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t&:hover {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tborder-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t&:active {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\ttransition-duration: 0;\n\t\t\t}\n\t\t}\n\t}\n\n\t+ label {\n\t\tposition: relative;\n\t\tuser-select: none;\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\talign-items: center;\n\t\tcursor: pointer;\n\n\t\t&::before {\n\t\t\tbackground-color: #fff;\n\t\t\tborder: 1px solid ", ";\n\t\t\tbox-sizing: content-box;\n\t\t\tcontent: '';\n\t\t\tcolor: ", ";\n\t\t\tmargin-right: calc(", " * 0.5);\n\t\t\ttop: 50%;\n\t\t\tleft: 0;\n\t\t\twidth: ", ";\n\t\t\theight: ", ";\n\t\t\tdisplay: inline-block;\n\t\t\tvertical-align: middle;\n\t\t}\n\n\t\t&::after {\n\t\t\tbox-sizing: content-box;\n\t\t\tcontent: '';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\ttop: 50%;\n\t\t\tleft: calc(1px + ", " / 2);\n\t\t\twidth: calc(", " - ", ");\n\t\t\theight: calc(", " - ", ");\n\t\t\tmargin-top: calc(", " / -2 - ", " / -2);\n\t\t\ttransform: scale(0);\n\t\t\ttransform-origin: 50%;\n\t\t\ttransition: transform 200ms ease-out;\n\t\t}\n\t}\n"])), vh, lighten(0.4, theme.colors.primaryColor), theme.colors.primaryColor, theme.colors.borderColor || lighten(0.1, theme.colors.textColor), theme.colors.primaryColor, item.width, item.width, item.height, theme.colors.primaryColor, item.scale, item.width, item.scale, item.height, item.scale, item.height, item.scale);
|
|
18
17
|
};
|
|
19
|
-
|
|
20
18
|
var Radio = styled('input')(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t+ label {\n\t\t&::before,\n\t\t&::after {\n\t\t\tborder-radius: 50%;\n\t\t}\n\t}\n\n\t&:checked {\n\t\t&:active,\n\t\t&:focus {\n\t\t\t+ label {\n\t\t\t\tcolor: ", ";\n\n\t\t\t\t&::before {\n\t\t\t\t\tanimation: none;\n\t\t\t\t\tfilter: none;\n\t\t\t\t\ttransition: none;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tanimation: none;\n\t\t\t\tbackground-color: #fff;\n\t\t\t\tborder-color: ", ";\n\t\t}\n\n\t\t&::after {\n\t\t\ttransform: scale(1);\n\t\t}\n\t}\n"])), formItem, function (props) {
|
|
21
19
|
return props.show ? null : hideInputControl;
|
|
22
20
|
}, function (_ref2) {
|