@appbaseio/reactivesearch-vue 1.34.0-alpha.2 → 1.34.0

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.
Files changed (104) hide show
  1. package/dist/@appbaseio/reactivesearch-vue.umd.js +10874 -8633
  2. package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
  3. package/dist/@appbaseio/reactivesearch-vue.umd.min.js +12 -11
  4. package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
  5. package/dist/cjs/Button-841fd06d.js +62 -0
  6. package/dist/cjs/{CancelSvg-062a42f0.js → CancelSvg-220a7cc3.js} +40 -32
  7. package/dist/cjs/Card-240f283d.js +30 -0
  8. package/dist/cjs/{ComponentWrapper-db45cc6d.js → ComponentWrapper-94c50228.js} +7 -7
  9. package/dist/cjs/Container-e699ea95.js +15 -0
  10. package/dist/cjs/DataSearch.js +1312 -20
  11. package/dist/cjs/{DropDown-3b899b20.js → DropDown-7a52c661.js} +79 -78
  12. package/dist/cjs/DynamicRangeSlider.js +46 -56
  13. package/dist/cjs/Flex-ddd7cb6b.js +50 -0
  14. package/dist/cjs/FormControlList-bbb5cd24.js +45 -0
  15. package/dist/cjs/Input-ead4cd84.js +77 -0
  16. package/dist/cjs/ListItem-5088bd6a.js +45 -0
  17. package/dist/cjs/MultiDropdownList.js +68 -74
  18. package/dist/cjs/MultiList.js +94 -89
  19. package/dist/cjs/MultiRange.js +44 -54
  20. package/dist/cjs/{Pagination-a468f960.js → Pagination-e56a5b79.js} +53 -56
  21. package/dist/cjs/{PreferencesConsumer-034c55e3.js → PreferencesConsumer-5e6e84a2.js} +5 -6
  22. package/dist/cjs/RangeInput.js +107 -115
  23. package/dist/cjs/RangeSlider.js +39 -50
  24. package/dist/cjs/ReactiveBase.js +55 -69
  25. package/dist/cjs/ReactiveComponent.js +316 -46
  26. package/dist/cjs/{ReactiveComponent-f0f486ca.js → ReactiveComponentPrivate-244c6055.js} +321 -618
  27. package/dist/cjs/ReactiveComponentPrivate.js +55 -0
  28. package/dist/cjs/ReactiveGoogleMap.js +439 -384
  29. package/dist/cjs/ReactiveList.js +128 -100
  30. package/dist/cjs/ResultCard.js +19 -26
  31. package/dist/cjs/ResultList.js +27 -31
  32. package/dist/cjs/SelectedFilters.js +34 -49
  33. package/dist/cjs/SingleDropdownList.js +66 -73
  34. package/dist/cjs/SingleList.js +96 -90
  35. package/dist/cjs/SingleRange.js +42 -48
  36. package/dist/cjs/StateProvider.js +2 -2
  37. package/dist/cjs/Tags-4ec43831.js +883 -0
  38. package/dist/cjs/Title-16042ea0.js +15 -0
  39. package/dist/cjs/ToggleButton.js +34 -39
  40. package/dist/cjs/{index-dc25b706.js → index-de136c17.js} +8 -6
  41. package/dist/cjs/index.js +27 -25
  42. package/dist/cjs/initReactivesearch.js +0 -3
  43. package/dist/cjs/install.js +23 -22
  44. package/dist/cjs/ssr-f2fc1bf6.js +36 -0
  45. package/dist/cjs/version.js +1 -1
  46. package/dist/cjs/{vueTypes-621a8143.js → vueTypes-b7007f5f.js} +3 -2
  47. package/dist/es/Button-153cd885.js +53 -0
  48. package/dist/es/{CancelSvg-14ebc9a1.js → CancelSvg-e40552a5.js} +37 -30
  49. package/dist/es/{Card-1951569e.js → Card-19ad6d90.js} +6 -5
  50. package/dist/es/{ComponentWrapper-bf443c0b.js → ComponentWrapper-edaeaceb.js} +6 -6
  51. package/dist/es/Container-d00219f7.js +1 -1
  52. package/dist/es/DataSearch.js +1312 -18
  53. package/dist/es/{DropDown-35e232b7.js → DropDown-2c0dd714.js} +78 -78
  54. package/dist/es/DynamicRangeSlider.js +43 -53
  55. package/dist/es/Flex-7c177a10.js +45 -0
  56. package/dist/es/FormControlList-99797d0a.js +38 -0
  57. package/dist/es/Input-c09c0b56.js +69 -0
  58. package/dist/es/{ListItem-47a6345a.js → ListItem-07888a65.js} +7 -6
  59. package/dist/es/MultiDropdownList.js +66 -72
  60. package/dist/es/MultiList.js +93 -88
  61. package/dist/es/MultiRange.js +42 -52
  62. package/dist/es/{Pagination-145b4ff2.js → Pagination-edeb7dbe.js} +53 -56
  63. package/dist/es/{PreferencesConsumer-7ea7313a.js → PreferencesConsumer-86a676c8.js} +4 -5
  64. package/dist/es/RangeInput.js +103 -112
  65. package/dist/es/RangeSlider.js +36 -47
  66. package/dist/es/ReactiveBase.js +53 -68
  67. package/dist/es/ReactiveComponent.js +316 -45
  68. package/dist/es/{ReactiveComponent-e2fb9eb4.js → ReactiveComponentPrivate-6f16e1b7.js} +316 -614
  69. package/dist/es/ReactiveComponentPrivate.js +47 -0
  70. package/dist/es/ReactiveGoogleMap.js +434 -380
  71. package/dist/es/ReactiveList.js +125 -98
  72. package/dist/es/ResultCard.js +18 -25
  73. package/dist/es/ResultList.js +26 -30
  74. package/dist/es/SelectedFilters.js +32 -47
  75. package/dist/es/SingleDropdownList.js +64 -71
  76. package/dist/es/SingleList.js +94 -88
  77. package/dist/es/SingleRange.js +40 -46
  78. package/dist/es/StateProvider.js +2 -2
  79. package/dist/es/Tags-1c2d6c4d.js +869 -0
  80. package/dist/es/Title-863dfa42.js +1 -1
  81. package/dist/es/ToggleButton.js +32 -37
  82. package/dist/es/{index-285a43a6.js → index-5509c0bc.js} +8 -6
  83. package/dist/es/index.js +20 -19
  84. package/dist/es/initReactivesearch.js +0 -3
  85. package/dist/es/install.js +20 -19
  86. package/dist/es/ssr-03607d84.js +1 -1
  87. package/dist/es/version.js +1 -1
  88. package/dist/es/{vueTypes-e4af6fe2.js → vueTypes-66ebc93e.js} +3 -2
  89. package/package.json +10 -10
  90. package/dist/cjs/Button-626c5e8e.js +0 -58
  91. package/dist/cjs/Card-c381ded3.js +0 -26
  92. package/dist/cjs/Container-29f049b2.js +0 -12
  93. package/dist/cjs/DataSearch-7c71ec9f.js +0 -2043
  94. package/dist/cjs/Flex-d5675ea6.js +0 -48
  95. package/dist/cjs/FormControlList-cf1ff2ca.js +0 -42
  96. package/dist/cjs/Input-4d278ca0.js +0 -74
  97. package/dist/cjs/ListItem-c067bc07.js +0 -41
  98. package/dist/cjs/Title-8802a218.js +0 -12
  99. package/dist/cjs/ssr-eb901d09.js +0 -35
  100. package/dist/es/Button-ebafa3d6.js +0 -52
  101. package/dist/es/DataSearch-4f9a4e46.js +0 -2028
  102. package/dist/es/Flex-a08e22d7.js +0 -46
  103. package/dist/es/FormControlList-fa5cf78b.js +0 -38
  104. package/dist/es/Input-3b8408a6.js +0 -69
@@ -1,2043 +0,0 @@
1
- 'use strict';
2
-
3
- function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
-
5
- var configureStore = require('@appbaseio/reactivecore');
6
- var configureStore__default = _interopDefault(configureStore);
7
- var constants = require('@appbaseio/reactivecore/lib/utils/constants');
8
- var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
9
- var vue = require('vue');
10
- var VueTypes = _interopDefault(require('vue-types'));
11
- var helper = require('@appbaseio/reactivecore/lib/utils/helper');
12
- var vueEmotion = require('@appbaseio/vue-emotion');
13
- var emotion = require('emotion');
14
- var vueTypes = require('./vueTypes-621a8143.js');
15
- var index = require('./index-dc25b706.js');
16
- var ComponentWrapper = require('./ComponentWrapper-db45cc6d.js');
17
- var PreferencesConsumer = require('./PreferencesConsumer-034c55e3.js');
18
- var Title = require('./Title-8802a218.js');
19
- var Flex = require('./Flex-d5675ea6.js');
20
- var hotkeys = _interopDefault(require('hotkeys-js'));
21
- var CancelSvg = require('./CancelSvg-062a42f0.js');
22
- var Input = require('./Input-4d278ca0.js');
23
- var Container = require('./Container-29f049b2.js');
24
- var Highlight = _interopDefault(require('vue-highlight-words'));
25
-
26
- var _templateObject;
27
- var InputGroup = vueEmotion.styled('div')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n display: flex;\n align-items: stretch;\n width: 100%;\n"])));
28
- InputGroup.defaultProps = {
29
- className: 'input-group'
30
- };
31
-
32
- var _templateObject$1;
33
- var InputAddon = vueEmotion.styled('span')(_templateObject$1 || (_templateObject$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #fafafa;\n border: 1px solid #ccc;\n border-radius: 2px;\n color: rgba(0, 0, 0, 0.85);\n font-size: 14px;\n font-weight: 400;\n padding: 0 11px;\n position: relative;\n transition: all 0.3s;\n box-sizing: border-box;\n overflow: hidden;\n\n &:first-of-type {\n border-right: none;\n }\n &:last-of-type {\n border-left: none;\n }\n"])));
34
- InputAddon.defaultProps = {
35
- className: 'input-addon'
36
- };
37
-
38
- var getClassName = configureStore.helper.getClassName;
39
- var SuggestionWrapper = {
40
- name: 'SuggestionWrapper',
41
- props: {
42
- innerClassName: vueTypes.types.string,
43
- themePreset: vueTypes.types.themePreset,
44
- innerClass: vueTypes.types.style
45
- },
46
- render: function render() {
47
- var _this$$props = this.$props,
48
- themePreset = _this$$props.themePreset,
49
- innerClass = _this$$props.innerClass,
50
- innerClassName = _this$$props.innerClassName;
51
- return vue.createVNode("div", {
52
- "class": Input.noSuggestions(themePreset) + " " + getClassName(innerClass, innerClassName || '')
53
- }, [vue.createVNode("li", null, [this.$slots["default"]()])]);
54
- }
55
- };
56
-
57
- var _templateObject$2;
58
- var highlightStyle = {
59
- fontWeight: 600,
60
- padding: 0,
61
- backgroundColor: 'transparent',
62
- color: 'inherit'
63
- };
64
- var PredictiveSuggestion = vueEmotion.styled('span')(_templateObject$2 || (_templateObject$2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t.highlight {\n\t\tbackground: transparent;\n\t\tcolor: inherit;\n\t\tfont-weight: 600;\n\t\tpadding: 0;\n\t}\n"])));
65
- var SuggestionItem = {
66
- name: 'SuggestionItem',
67
- props: {
68
- currentValue: vueTypes.types.string,
69
- suggestion: vueTypes.types.any
70
- },
71
- render: function render() {
72
- var _this = this;
73
- var _this$suggestion = this.suggestion,
74
- label = _this$suggestion.label,
75
- value = _this$suggestion.value,
76
- title = _this$suggestion.title,
77
- description = _this$suggestion.description,
78
- image = _this$suggestion.image,
79
- isPredictiveSuggestion = _this$suggestion.isPredictiveSuggestion,
80
- _suggestion_type = _this$suggestion._suggestion_type,
81
- _category = _this$suggestion._category;
82
- if (label) {
83
- // label has highest precedence
84
- return typeof label === 'string' ? vue.createVNode("div", {
85
- "class": "trim"
86
- }, [(_category ? false : isPredictiveSuggestion
87
- // eslint-disable-next-line
88
- || !!_suggestion_type) ? vue.createVNode(PredictiveSuggestion, {
89
- "innerHTML": label
90
- }, null) : vue.createVNode(Highlight, {
91
- "searchWords": _category ? [_category] : this.currentValue.split(' '),
92
- "textToHighlight": label,
93
- "autoEscape": true,
94
- "highlightStyle": highlightStyle
95
- }, null)]) : label;
96
- }
97
- if (title || image || description) {
98
- return vue.createVNode(Flex.Flex, {
99
- "alignItems": "center",
100
- "css": {
101
- width: '100%'
102
- }
103
- }, {
104
- "default": function _default() {
105
- return [image && vue.createVNode("div", {
106
- "css": {
107
- margin: 'auto',
108
- marginRight: 10
109
- }
110
- }, [vue.createVNode("img", {
111
- "src": image,
112
- "alt": " ",
113
- "height": "50px",
114
- "width": "50px",
115
- "css": {
116
- objectFit: 'contain'
117
- }
118
- }, null)]), vue.createVNode(Flex.Flex, {
119
- "direction": "column",
120
- "css": {
121
- width: image ? 'calc(100% - 60px)' : '100%'
122
- }
123
- }, {
124
- "default": function _default() {
125
- return [title && vue.createVNode("div", {
126
- "class": "trim"
127
- }, [vue.createVNode(Highlight, {
128
- "searchWords": _this.currentValue.split(' '),
129
- "textToHighlight": title,
130
- "highlightStyle": highlightStyle,
131
- "class": emotion.css({
132
- fontSize: '1rem'
133
- })
134
- }, null)]), description && vue.createVNode("div", {
135
- "class": emotion.cx('trim', emotion.css({
136
- marginTop: 3
137
- }))
138
- }, [vue.createVNode(Highlight, {
139
- "searchWords": _this.currentValue.split(' '),
140
- "textToHighlight": description,
141
- "highlightStyle": highlightStyle
142
- }, null)])];
143
- }
144
- })];
145
- }
146
- });
147
- }
148
- return value;
149
- }
150
- };
151
-
152
- var SearchSvg = {
153
- name: 'SearchSvg',
154
- props: ['styles'],
155
- render: function render() {
156
- return vue.createVNode("svg", {
157
- "alt": "Search",
158
- "class": "search-icon",
159
- "height": "12",
160
- "xmlns": "http://www.w3.org/2000/svg",
161
- "viewBox": "0 0 15 15",
162
- "style": _rollupPluginBabelHelpers._extends({
163
- transform: 'scale(1.35)',
164
- position: 'relative'
165
- }, this.$props.styles ? this.$props.styles : {})
166
- }, [vue.createVNode("title", null, [vue.createTextVNode("Search")]), vue.createVNode("path", {
167
- "d": 'M6.02945,10.20327a4.17382,4.17382,0,1,1,4.17382-4.17382A4.15609,4.15609,0,0,1,6.02945,10.20327Zm9.69195,4.2199L10.8989,9.59979A5.88021,5.88021,0,0,0,12.058,6.02856,6.00467,6.00467,0,1,0,9.59979,10.8989l4.82338,4.82338a.89729.89729,0,0,0,1.29912,0,.89749.89749,0,0,0-.00087-1.29909Z'
168
- }, null)]);
169
- }
170
- };
171
-
172
- var _templateObject$3;
173
-
174
- // eslint-disable-next-line
175
- vueEmotion.createGlobalStyle(_templateObject$3 || (_templateObject$3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t#el_TvxDfTAtKp {\n\t\tstroke: none;\n\t\tstroke-width: 1;\n\t\tfill: none;\n\t}\n\t#el_D93PK3GbmJ {\n\t\t-webkit-transform: translate(163px, 131px);\n\t\ttransform: translate(163px, 131px);\n\t\tfill: #d8d8d8;\n\t}\n"])));
176
- var MicSvg = {
177
- name: 'MicSvg',
178
- props: ['className'],
179
- render: function render() {
180
- return vue.createVNode("svg", {
181
- "viewBox": "0 0 480 480",
182
- "xmlns": "http://www.w3.org/2000/svg",
183
- "id": "el_xS0FRzQjJ",
184
- "width": 28,
185
- "height": 28,
186
- "className": this.$props.className,
187
- "style": {
188
- transform: 'scale(1.5)'
189
- }
190
- }, [vue.createVNode("g", {
191
- "id": "el_TvxDfTAtKp",
192
- "fillRule": "evenodd"
193
- }, [vue.createVNode("g", {
194
- "id": "el_D93PK3GbmJ",
195
- "fillRule": "nonzero",
196
- "style": {
197
- fill: '#595959'
198
- }
199
- }, [vue.createVNode("path", {
200
- "d": "M142.731204,111 C137.280427,111 132.719573,114.852 131.82965,120.095 C127.268796,145.24 104.464526,164.5 76.9881611,164.5 C49.5117965,164.5 26.7075263,145.24 22.1466723,120.095 C21.2567496,114.852 16.6958955,111 11.2451187,111 C4.45945784,111 -0.880078594,116.778 0.121084488,123.198 C5.57186127,155.298 32.2695435,180.443 65.8641269,185.044 L65.8641269,207.3 C65.8641269,213.185 70.8699423,218 76.9881611,218 C83.10638,218 88.1121954,213.185 88.1121954,207.3 L88.1121954,185.044 C121.706779,180.443 148.404461,155.298 153.855238,123.198 C154.967641,116.778 149.516864,111 142.731204,111 Z",
201
- "id": "el_uly3EwA2O3"
202
- }, null), vue.createVNode("path", {
203
- "d": "M76.9864699,147.789474 C98.090352,147.789474 115.126016,131.286316 115.126016,110.842105 L115.126016,36.9473684 C115.126016,16.5031579 98.090352,-2.84217094e-14 76.9864699,-2.84217094e-14 C55.8825877,-2.84217094e-14 38.8469239,16.5031579 38.8469239,36.9473684 L38.8469239,110.842105 C38.8469239,131.286316 55.8825877,147.789474 76.9864699,147.789474 Z",
204
- "id": "el_tnDbR4ytu4"
205
- }, null)])])]);
206
- }
207
- };
208
-
209
- var _templateObject$4;
210
-
211
- // eslint-disable-next-line
212
- vueEmotion.createGlobalStyle(_templateObject$4 || (_templateObject$4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t#el_X81iT9kZYo {\n\t\tstroke: none;\n\t\tstroke-width: 1;\n\t\tfill: none;\n\t}\n\t#el_gMpyalCphp {\n\t\t-webkit-transform: translate(163px, 131px);\n\t\ttransform: translate(163px, 131px);\n\t}\n\t#el_c7H-3u-D4l {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_qhFcdAAFwo {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_M8X8g37WOI {\n\t\tstroke: #e83137;\n\t\tstroke-width: 21;\n\t}\n"])));
213
- var MuteSvg = {
214
- name: 'MuteSvg',
215
- props: ['className'],
216
- render: function render() {
217
- return vue.createVNode("svg", {
218
- "style": {
219
- transform: 'scale(1.5)'
220
- },
221
- "viewBox": "0 0 480 480",
222
- "xmlns": "http://www.w3.org/2000/svg",
223
- "id": "el_D1rEpH2zj",
224
- "width": 28,
225
- "height": 28,
226
- "className": this.$props.className
227
- }, [vue.createVNode("g", {
228
- "id": "el_X81iT9kZYo",
229
- "fillRule": "evenodd"
230
- }, [vue.createVNode("g", {
231
- "id": "el_gMpyalCphp"
232
- }, [vue.createVNode("path", {
233
- "d": "M142.731204,111 C137.280427,111 132.719573,114.852 131.82965,120.095 C127.268796,145.24 104.464526,164.5 76.9881611,164.5 C49.5117965,164.5 26.7075263,145.24 22.1466723,120.095 C21.2567496,114.852 16.6958955,111 11.2451187,111 C4.45945784,111 -0.880078594,116.778 0.121084488,123.198 C5.57186127,155.298 32.2695435,180.443 65.8641269,185.044 L65.8641269,207.3 C65.8641269,213.185 70.8699423,218 76.9881611,218 C83.10638,218 88.1121954,213.185 88.1121954,207.3 L88.1121954,185.044 C121.706779,180.443 148.404461,155.298 153.855238,123.198 C154.967641,116.778 149.516864,111 142.731204,111 Z",
234
- "id": "el_c7H-3u-D4l",
235
- "fillRule": "nonzero",
236
- "style": {
237
- fill: '#595959'
238
- }
239
- }, null), vue.createVNode("path", {
240
- "d": "M76.9864699,147.789474 C98.090352,147.789474 115.126016,131.286316 115.126016,110.842105 L115.126016,36.9473684 C115.126016,16.5031579 98.090352,-2.84217094e-14 76.9864699,-2.84217094e-14 C55.8825877,-2.84217094e-14 38.8469239,16.5031579 38.8469239,36.9473684 L38.8469239,110.842105 C38.8469239,131.286316 55.8825877,147.789474 76.9864699,147.789474 Z",
241
- "id": "el_qhFcdAAFwo",
242
- "fillRule": "nonzero",
243
- "style": {
244
- fill: '#595959'
245
- }
246
- }, null), vue.createVNode("path", {
247
- "d": "M11.5,206.5 L142.5,12.5",
248
- "id": "el_M8X8g37WOI",
249
- "strokeLinecap": "round",
250
- "strokeLinejoin": "round"
251
- }, null)])])]);
252
- }
253
- };
254
-
255
- var _templateObject$5;
256
-
257
- // eslint-disable-next-line
258
- vueEmotion.createGlobalStyle(_templateObject$5 || (_templateObject$5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t@-webkit-keyframes kf_el_6WKby7wXqV_an_qqO-rxbNc {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t13.89% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_6WKby7wXqV_an_qqO-rxbNc {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t13.89% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_Wi-my975tM_an_XhXP1epXB {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t27.78% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_Wi-my975tM_an_XhXP1epXB {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t27.78% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_DkfFFTaFxy8_an_T2XxzvIaA {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t41.67% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_DkfFFTaFxy8_an_T2XxzvIaA {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t41.67% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_34IgwiMB5rf_an_TPom3H2LI {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t55.56% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_34IgwiMB5rf_an_TPom3H2LI {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t55.56% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_DeebuCsPTGA_an_aYTRBE7Na {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t69.44% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_DeebuCsPTGA_an_aYTRBE7Na {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t69.44% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_ZOjjrPTvyrv_an_l_BjBNzXw {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t83.33% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_ZOjjrPTvyrv_an_l_BjBNzXw {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t83.33% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@-webkit-keyframes kf_el_2FATegVmf0K_an_wLg4ofuFx {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t97.22% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t@keyframes kf_el_2FATegVmf0K_an_wLg4ofuFx {\n\t\t0% {\n\t\t\topacity: 0;\n\t\t}\n\t\t97.22% {\n\t\t\topacity: 1;\n\t\t}\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\t#el_hiibMG0x- * {\n\t\t-webkit-animation-duration: 1.2s;\n\t\tanimation-duration: 1.2s;\n\t\t-webkit-animation-iteration-count: infinite;\n\t\tanimation-iteration-count: infinite;\n\t\t-webkit-animation-timing-function: cubic-bezier(0, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0, 0, 1, 1);\n\t}\n\t#el_QJeJ_2CDw5 {\n\t\tstroke: none;\n\t\tstroke-width: 1;\n\t\tfill: none;\n\t}\n\t#el_UYYCfubTRf {\n\t\t-webkit-transform: translate(163px, 123px);\n\t\ttransform: translate(163px, 123px);\n\t}\n\t#el_uzZNtK32Zi {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_EYKQ2N9Kgy {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_6SDP2LAgKC {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t}\n\t#el_-Vm65Ltfy7 {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_q04iZcSim4 {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_6WKby7wXqV {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_6WKby7wXqV_an_qqO-rxbNc;\n\t\tanimation-name: kf_el_6WKby7wXqV_an_qqO-rxbNc;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_9bggsfQOtU {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_NKxqi9eIym {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_Wi-my975tM {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_Wi-my975tM_an_XhXP1epXB;\n\t\tanimation-name: kf_el_Wi-my975tM_an_XhXP1epXB;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_zclQ34fvf7 {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_1OsvRT8HkeZ {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_DkfFFTaFxy8 {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_DkfFFTaFxy8_an_T2XxzvIaA;\n\t\tanimation-name: kf_el_DkfFFTaFxy8_an_T2XxzvIaA;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_aa9sjx4H0vA {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_tea114vWg0J {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_34IgwiMB5rf {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_34IgwiMB5rf_an_TPom3H2LI;\n\t\tanimation-name: kf_el_34IgwiMB5rf_an_TPom3H2LI;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_z5u6RAFhx7d {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_7nfuWmA5Uhy {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_DeebuCsPTGA {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_DeebuCsPTGA_an_aYTRBE7Na;\n\t\tanimation-name: kf_el_DeebuCsPTGA_an_aYTRBE7Na;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el__ZcqlS20zcw {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_8DnEQnD7VWV {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_ZOjjrPTvyrv {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_ZOjjrPTvyrv_an_l_BjBNzXw;\n\t\tanimation-name: kf_el_ZOjjrPTvyrv_an_l_BjBNzXw;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_FYYKCI_u24e {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_XZty4MnTp5Y {\n\t\tfill: #d8d8d8;\n\t}\n\t#el_2FATegVmf0K {\n\t\t-webkit-transform: translate(37.846924px, 0px);\n\t\ttransform: translate(37.846924px, 0px);\n\t\t-webkit-animation-fill-mode: backwards;\n\t\tanimation-fill-mode: backwards;\n\t\topacity: 0;\n\t\t-webkit-animation-name: kf_el_2FATegVmf0K_an_wLg4ofuFx;\n\t\tanimation-name: kf_el_2FATegVmf0K_an_wLg4ofuFx;\n\t\t-webkit-animation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t\tanimation-timing-function: cubic-bezier(0.42, 0, 1, 1);\n\t}\n\t#el_RMT1KUfbdF8 {\n\t\tfill: #0B6AFF;\n\t}\n\t#el_RgLcovvFiO1 {\n\t\tfill: #d8d8d8;\n\t}\n"])));
259
- var ListenSvg = {
260
- name: 'ListenSvg',
261
- props: ['className'],
262
- render: function render() {
263
- return vue.createVNode("svg", {
264
- "viewBox": "0 0 480 480",
265
- "xmlns": "http://www.w3.org/2000/svg",
266
- "xmlnsXlink": "http://www.w3.org/1999/xlink",
267
- "id": "el_hiibMG0x-",
268
- "width": 28,
269
- "height": 29,
270
- "className": this.$props.className,
271
- "style": {
272
- transform: 'scale(1.5)'
273
- }
274
- }, [vue.createVNode("defs", null, [vue.createVNode("path", {
275
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
276
- "id": "path-1"
277
- }, null), vue.createVNode("path", {
278
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
279
- "id": "path-3"
280
- }, null), vue.createVNode("path", {
281
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
282
- "id": "path-5"
283
- }, null), vue.createVNode("path", {
284
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
285
- "id": "path-7"
286
- }, null), vue.createVNode("path", {
287
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
288
- "id": "path-9"
289
- }, null), vue.createVNode("path", {
290
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
291
- "id": "path-11"
292
- }, null), vue.createVNode("path", {
293
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
294
- "id": "path-13"
295
- }, null), vue.createVNode("path", {
296
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
297
- "id": "path-15"
298
- }, null)]), vue.createVNode("g", {
299
- "id": "el_QJeJ_2CDw5",
300
- "fillRule": "evenodd"
301
- }, [vue.createVNode("g", {
302
- "id": "el_UYYCfubTRf"
303
- }, [vue.createVNode("path", {
304
- "d": "M142.731204,111 C137.280427,111 132.719573,114.852 131.82965,120.095 C127.268796,145.24 104.464526,164.5 76.9881611,164.5 C49.5117965,164.5 26.7075263,145.24 22.1466723,120.095 C21.2567496,114.852 16.6958955,111 11.2451187,111 C4.45945784,111 -0.880078594,116.778 0.121084488,123.198 C5.57186127,155.298 32.2695435,180.443 65.8641269,185.044 L65.8641269,207.3 C65.8641269,213.185 70.8699423,218 76.9881611,218 C83.10638,218 88.1121954,213.185 88.1121954,207.3 L88.1121954,185.044 C121.706779,180.443 148.404461,155.298 153.855238,123.198 C154.967641,116.778 149.516864,111 142.731204,111 Z",
305
- "id": "el_uzZNtK32Zi",
306
- "fillRule": "nonzero",
307
- "style": {
308
- fill: '#0B6AFF'
309
- }
310
- }, null), vue.createVNode("path", {
311
- "d": "M76.9864699,147.789474 C98.090352,147.789474 115.126016,131.286316 115.126016,110.842105 L115.126016,36.9473684 C115.126016,16.5031579 98.090352,0 76.9864699,0 C55.8825877,0 38.8469239,16.5031579 38.8469239,36.9473684 L38.8469239,110.842105 C38.8469239,131.286316 55.8825877,147.789474 76.9864699,147.789474 Z",
312
- "id": "el_EYKQ2N9Kgy",
313
- "fillRule": "nonzero"
314
- }, null), vue.createVNode("g", {
315
- "id": "el_6SDP2LAgKC"
316
- }, [vue.createVNode("mask", {
317
- "id": "mask-2",
318
- "fill": "#fff"
319
- }, [vue.createVNode("use", {
320
- "xlink:href": "#path-1"
321
- }, null)]), vue.createVNode("path", {
322
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
323
- "id": "el_-Vm65Ltfy7",
324
- "fillRule": "nonzero",
325
- "mask": "url(#mask-2)"
326
- }, null), vue.createVNode("rect", {
327
- "id": "el_q04iZcSim4",
328
- "mask": "url(#mask-2)",
329
- "x": "0.279",
330
- "width": "77",
331
- "height": "130"
332
- }, null)]), vue.createVNode("g", {
333
- "id": "el_6WKby7wXqV"
334
- }, [vue.createVNode("mask", {
335
- "id": "mask-4",
336
- "fill": "#fff"
337
- }, [vue.createVNode("use", {
338
- "xlink:href": "#path-3"
339
- }, null)]), vue.createVNode("path", {
340
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
341
- "id": "el_9bggsfQOtU",
342
- "fillRule": "nonzero",
343
- "mask": "url(#mask-4)"
344
- }, null), vue.createVNode("rect", {
345
- "id": "el_NKxqi9eIym",
346
- "mask": "url(#mask-4)",
347
- "x": "0.279",
348
- "width": "77",
349
- "height": "115"
350
- }, null)]), vue.createVNode("g", {
351
- "id": "el_Wi-my975tM"
352
- }, [vue.createVNode("mask", {
353
- "id": "mask-6",
354
- "fill": "#fff"
355
- }, [vue.createVNode("use", {
356
- "xlink:href": "#path-5"
357
- }, null)]), vue.createVNode("path", {
358
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
359
- "id": "el_zclQ34fvf7",
360
- "fillRule": "nonzero",
361
- "mask": "url(#mask-6)"
362
- }, null), vue.createVNode("rect", {
363
- "id": "el_1OsvRT8HkeZ",
364
- "mask": "url(#mask-6)",
365
- "x": "0.279",
366
- "width": "77",
367
- "height": "100"
368
- }, null)]), vue.createVNode("g", {
369
- "id": "el_DkfFFTaFxy8"
370
- }, [vue.createVNode("mask", {
371
- "id": "mask-8",
372
- "fill": "#fff"
373
- }, [vue.createVNode("use", {
374
- "xlink:href": "#path-7"
375
- }, null)]), vue.createVNode("path", {
376
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
377
- "id": "el_aa9sjx4H0vA",
378
- "fillRule": "nonzero",
379
- "mask": "url(#mask-8)"
380
- }, null), vue.createVNode("rect", {
381
- "id": "el_tea114vWg0J",
382
- "mask": "url(#mask-8)",
383
- "x": "0.279",
384
- "width": "77",
385
- "height": "85"
386
- }, null)]), vue.createVNode("g", {
387
- "id": "el_34IgwiMB5rf"
388
- }, [vue.createVNode("mask", {
389
- "id": "mask-10",
390
- "fill": "#fff"
391
- }, [vue.createVNode("use", {
392
- "xlink:href": "#path-9"
393
- }, null)]), vue.createVNode("path", {
394
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
395
- "id": "el_z5u6RAFhx7d",
396
- "fillRule": "nonzero",
397
- "mask": "url(#mask-10)"
398
- }, null), vue.createVNode("rect", {
399
- "id": "el_7nfuWmA5Uhy",
400
- "mask": "url(#mask-10)",
401
- "x": "0.279",
402
- "width": "77",
403
- "height": "70"
404
- }, null)]), vue.createVNode("g", {
405
- "id": "el_DeebuCsPTGA"
406
- }, [vue.createVNode("mask", {
407
- "id": "mask-12",
408
- "fill": "#fff"
409
- }, [vue.createVNode("use", {
410
- "xlink:href": "#path-11"
411
- }, null)]), vue.createVNode("path", {
412
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
413
- "id": "el__ZcqlS20zcw",
414
- "fillRule": "nonzero",
415
- "mask": "url(#mask-12)"
416
- }, null), vue.createVNode("rect", {
417
- "id": "el_8DnEQnD7VWV",
418
- "mask": "url(#mask-12)",
419
- "x": "0.279",
420
- "width": "77",
421
- "height": "55"
422
- }, null)]), vue.createVNode("g", {
423
- "id": "el_ZOjjrPTvyrv"
424
- }, [vue.createVNode("mask", {
425
- "id": "mask-14",
426
- "fill": "#fff"
427
- }, [vue.createVNode("use", {
428
- "xlink:href": "#path-13"
429
- }, null)]), vue.createVNode("path", {
430
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
431
- "id": "el_FYYKCI_u24e",
432
- "fillRule": "nonzero",
433
- "mask": "url(#mask-14)"
434
- }, null), vue.createVNode("rect", {
435
- "id": "el_XZty4MnTp5Y",
436
- "mask": "url(#mask-14)",
437
- "x": "0.279",
438
- "width": "77",
439
- "height": "40"
440
- }, null)]), vue.createVNode("g", {
441
- "id": "el_2FATegVmf0K"
442
- }, [vue.createVNode("mask", {
443
- "id": "mask-16",
444
- "fill": "#fff"
445
- }, [vue.createVNode("use", {
446
- "xlink:href": "#path-15"
447
- }, null)]), vue.createVNode("path", {
448
- "d": "M38.779092,147.789474 C60.0824253,147.789474 77.279092,131.286316 77.279092,110.842105 L77.279092,36.9473684 C77.279092,16.5031579 60.0824253,0 38.779092,0 C17.4757586,0 0.279091964,16.5031579 0.279091964,36.9473684 L0.279091964,110.842105 C0.279091964,131.286316 17.4757586,147.789474 38.779092,147.789474 Z",
449
- "id": "el_RMT1KUfbdF8",
450
- "fillRule": "nonzero",
451
- "mask": "url(#mask-16)"
452
- }, null), vue.createVNode("rect", {
453
- "id": "el_RgLcovvFiO1",
454
- "mask": "url(#mask-16)",
455
- "x": "0.279",
456
- "width": "77",
457
- "height": "25"
458
- }, null)])])])]);
459
- }
460
- };
461
-
462
- var STATUS = {
463
- inactive: 'INACTIVE',
464
- stopped: 'STOPPED',
465
- active: 'ACTIVE',
466
- denied: 'DENIED'
467
- };
468
- var Mic = {
469
- name: 'Mic',
470
- props: {
471
- children: vueTypes.types.title,
472
- lang: VueTypes.string.def('en-US'),
473
- iconPosition: VueTypes.string.def('left'),
474
- handleResult: vueTypes.types.func,
475
- onNoMatch: vueTypes.types.func,
476
- onError: vueTypes.types.func,
477
- getInstance: vueTypes.types.func,
478
- render: vueTypes.types.func,
479
- className: vueTypes.types.string,
480
- applyClearStyle: VueTypes.bool,
481
- showIcon: VueTypes.bool
482
- },
483
- methods: {
484
- getComponent: function getComponent() {
485
- var status = this.$data.status;
486
- var data = {
487
- handleClick: this.handleClick,
488
- status: status
489
- };
490
- return index.getComponent(data, this);
491
- },
492
- stopMic: function stopMic() {
493
- if (this.instance) {
494
- this.status = STATUS.inactive;
495
- this.instance.stop();
496
- this.instance = null;
497
- }
498
- },
499
- handleClick: function handleClick() {
500
- var _this = this;
501
- this.results = [];
502
- if (window && window.SpeechRecognition) {
503
- var status = this.$data.status;
504
- if (status === STATUS.active) {
505
- this.status = STATUS.inactive;
506
- }
507
- var _this$$props = this.$props,
508
- handleResult = _this$$props.handleResult,
509
- onNoMatch = _this$$props.onNoMatch,
510
- onError = _this$$props.onError,
511
- lang = _this$$props.lang,
512
- getInstance = _this$$props.getInstance;
513
- var _window = window,
514
- SpeechRecognition = _window.SpeechRecognition;
515
- if (this.instance && this.status !== STATUS.denied) {
516
- this.status = STATUS.inactive;
517
- this.instance.stop();
518
- this.instance = null;
519
- return;
520
- }
521
- this.instance = new SpeechRecognition();
522
- this.instance.continuous = true;
523
- this.instance.interimResults = true;
524
- this.instance.lang = lang;
525
- if (getInstance) {
526
- getInstance(this.instance);
527
- }
528
- this.instance.start();
529
- this.instance.onstart = function () {
530
- _this.status = STATUS.active;
531
- };
532
- this.instance.onresult = function (_ref) {
533
- var results = _ref.results,
534
- timeStamp = _ref.timeStamp;
535
- _this.stopMic();
536
- if (handleResult) {
537
- handleResult({
538
- results: results,
539
- timeStamp: timeStamp
540
- });
541
- }
542
- _this.results.push({
543
- results: results,
544
- timeStamp: timeStamp
545
- });
546
- };
547
- this.instance.onnomatch = function (e) {
548
- return onNoMatch ? onNoMatch(e) : console.warn(e);
549
- };
550
- this.instance.onerror = function (e) {
551
- if (e.error === 'no-speech' || e.error === 'audio-capture') {
552
- _this.status = STATUS.inactive;
553
- } else if (e.error === 'not-allowed') {
554
- _this.status = STATUS.denied;
555
- }
556
- console.error(e);
557
- if (onError) {
558
- onError(e);
559
- }
560
- };
561
-
562
- /* Below Two methods run when Continuous is False */
563
- this.instance.onspeechend = function () {
564
- _this.status = STATUS.inactive;
565
- };
566
- this.instance.onaudioend = function () {
567
- _this.status = STATUS.inactive;
568
- };
569
- }
570
- }
571
- },
572
- computed: {
573
- hasCustomRenderer: function hasCustomRenderer() {
574
- return index.hasCustomRenderer(this);
575
- },
576
- Icon: function Icon() {
577
- var status = this.$data.status;
578
- var className = this.$props.className;
579
- switch (status) {
580
- case STATUS.active:
581
- return vue.createVNode(ListenSvg, {
582
- "className": className,
583
- "nativeOnClick": this.handleClick
584
- }, null);
585
- case STATUS.stopped:
586
- case STATUS.denied:
587
- return vue.createVNode(MuteSvg, {
588
- "className": className,
589
- "nativeOnClick": this.handleClick
590
- }, null);
591
- default:
592
- return vue.createVNode(MicSvg, {
593
- "className": className,
594
- "nativeOnClick": this.handleClick
595
- }, null);
596
- }
597
- }
598
- },
599
- data: function data() {
600
- return {
601
- status: STATUS.inactive
602
- };
603
- },
604
- created: function created() {
605
- this.results = [];
606
- if (typeof window !== 'undefined') {
607
- window.SpeechRecognition = window.webkitSpeechRecognition || window.SpeechRecognition || null;
608
- if (!window.SpeechRecognition) {
609
- console.error('SpeechRecognition is not supported in this browser. Please check the browser compatibility at https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition#Browser_compatibility.');
610
- }
611
- }
612
- },
613
- render: function render() {
614
- var _this2 = this;
615
- if (this.hasCustomRenderer) {
616
- return this.getComponent();
617
- }
618
- return vue.createVNode(CancelSvg.IconWrapper, null, {
619
- "default": function _default() {
620
- return [_this2.Icon];
621
- }
622
- });
623
- }
624
- };
625
-
626
- var CustomSvg = {
627
- name: 'CustomSvg',
628
- props: {
629
- className: String,
630
- icon: Function,
631
- type: String
632
- },
633
- data: function data() {
634
- return {
635
- customIcon: this.$props.icon && typeof this.$props.icon === 'function' ? this.$props.icon() : null
636
- };
637
- },
638
- render: function render() {
639
- if (this.customIcon) {
640
- return vue.createVNode("div", {
641
- "class": this.$props.className
642
- }, [this.customIcon]);
643
- }
644
- if (this.$props.type === 'recent-search-icon') {
645
- return vue.createVNode("svg", {
646
- "xmlns": "http://www.w3.org/2000/svg",
647
- "alt": "Recent Search",
648
- "height": "20",
649
- "width": "20",
650
- "viewBox": "0 0 24 24",
651
- "style": {
652
- fill: '#707070'
653
- },
654
- "class": this.$props.className
655
- }, [vue.createVNode("path", {
656
- "d": "M0 0h24v24H0z",
657
- "fill": "none"
658
- }, null), vue.createVNode("path", {
659
- "d": "M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z"
660
- }, null)]);
661
- }
662
- if (this.$props.type === 'promoted-search-icon') {
663
- return vue.createVNode("svg", {
664
- "xmlns": "http://www.w3.org/2000/svg",
665
- "width": "20",
666
- "alt": "promoted search",
667
- "height": "20",
668
- "viewBox": "0 0 24 24",
669
- "class": this.$props.className,
670
- "style": {
671
- fill: '#707070'
672
- }
673
- }, [vue.createVNode("path", {
674
- "d": "M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z"
675
- }, null)]);
676
- }
677
- if (this.$props.type === 'popular-search-icon') {
678
- return vue.createVNode("svg", {
679
- "xmlns": "http://www.w3.org/2000/svg",
680
- "alt": "Popular Search",
681
- "height": "20",
682
- "width": "20",
683
- "viewBox": "0 0 24 24",
684
- "style": {
685
- fill: '#707070'
686
- },
687
- "class": this.$props.className
688
- }, [vue.createVNode("path", {
689
- "d": "M0 0h24v24H0z",
690
- "fill": "none"
691
- }, null), vue.createVNode("path", {
692
- "d": "M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z"
693
- }, null)]);
694
- }
695
- return vue.createVNode(SearchSvg, {
696
- "styles": {
697
- position: 'relative',
698
- fill: '#707070',
699
- left: '3px',
700
- marginRight: '8px'
701
- }
702
- }, null);
703
- }
704
- };
705
-
706
- var _templateObject$6, _templateObject2;
707
- var TagsContainer = vueEmotion.styled('div')(_templateObject$6 || (_templateObject$6 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tmargin-top: 10px;\n\twidth: 100%;\n"])));
708
- var TagItem = vueEmotion.styled('span')(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tcursor: default;\n\tbox-sizing: border-box;\n\tmargin: 0 4px 4px 0;\n\tcolor: #000000d9;\n\tfont-size: 14px;\n\tfont-variant: tabular-nums;\n\tline-height: 1.5715;\n\tlist-style: none;\n\tfont-feature-settings: 'tnum';\n\tdisplay: inline-block;\n\theight: auto;\n\tpadding: 0 2px 0 7px;\n\tfont-size: 12px;\n\tline-height: 22px;\n\twhite-space: nowrap;\n\tbackground: #fafafa;\n\tborder: 1px solid #d9d9d9;\n\tborder-radius: 2px;\n\topacity: 1;\n\ttransition: all 0.3s;\n\n\tspan.close-icon {\n\t\tsvg {\n\t\t\tcursor: pointer;\n\t\t\theight: 15px;\n\t\t\tposition: relative;\n\t\t\ttop: 4px;\n\t\t\tfill: #262626;\n\t\t}\n\t}\n"])));
709
-
710
- function _isSlot(s) {
711
- return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
712
- }
713
- var updateQuery = configureStore.Actions.updateQuery,
714
- setQueryOptions = configureStore.Actions.setQueryOptions,
715
- setCustomQuery = configureStore.Actions.setCustomQuery,
716
- setDefaultQuery = configureStore.Actions.setDefaultQuery,
717
- setCustomHighlightOptions = configureStore.Actions.setCustomHighlightOptions,
718
- recordSuggestionClick = configureStore.Actions.recordSuggestionClick,
719
- loadPopularSuggestions = configureStore.Actions.loadPopularSuggestions,
720
- getRecentSearches = configureStore.Actions.getRecentSearches,
721
- resetStoreForComponent = configureStore.Actions.resetStoreForComponent;
722
- var debounce = configureStore.helper.debounce,
723
- checkValueChange = configureStore.helper.checkValueChange,
724
- getClassName$1 = configureStore.helper.getClassName,
725
- extractQueryFromCustomQuery = configureStore.helper.extractQueryFromCustomQuery,
726
- getOptionsForCustomQuery = configureStore.helper.getOptionsForCustomQuery,
727
- isEqual = configureStore.helper.isEqual,
728
- getCompositeAggsQuery = configureStore.helper.getCompositeAggsQuery,
729
- withClickIds = configureStore.helper.withClickIds,
730
- getResultStats = configureStore.helper.getResultStats,
731
- handleOnSuggestions = configureStore.helper.handleOnSuggestions,
732
- getTopSuggestions = configureStore.helper.getTopSuggestions,
733
- normalizeDataField = configureStore.helper.normalizeDataField;
734
- var DataSearch = {
735
- name: 'DataSearch',
736
- isTagsMode: false,
737
- data: function data() {
738
- var props = this.$props;
739
- this.__state = {
740
- currentValue: '',
741
- selectedTags: [],
742
- isOpen: false,
743
- normalizedSuggestions: [],
744
- isPending: false
745
- };
746
- this.internalComponent = props.componentId + "__internal";
747
- return this.__state;
748
- },
749
- inject: {
750
- theme: {
751
- from: 'theme_reactivesearch'
752
- }
753
- },
754
- created: function created() {
755
- var _this$$props = this.$props,
756
- enableRecentSearches = _this$$props.enableRecentSearches,
757
- distinctField = _this$$props.distinctField,
758
- distinctFieldConfig = _this$$props.distinctFieldConfig,
759
- index$1 = _this$$props.index,
760
- mode = _this$$props.mode;
761
- if (mode === constants.SEARCH_COMPONENTS_MODES.TAG) {
762
- this.$options.isTagsMode = true;
763
- }
764
- if (this.enableAppbase && this.aggregationField && this.aggregationField !== '') {
765
- console.warn('Warning(ReactiveSearch): The `aggregationField` prop has been marked as deprecated, please use the `distinctField` prop instead.');
766
- }
767
- if (!this.enableAppbase && (distinctField || distinctFieldConfig)) {
768
- console.warn('Warning(ReactiveSearch): In order to use the `distinctField` and `distinctFieldConfig` props, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
769
- }
770
- if (!this.enableAppbase && index$1) {
771
- console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
772
- }
773
- this.currentValue = '';
774
- if (this.$options.isTagsMode) {
775
- this.currentValue = '';
776
- }
777
- var shouldFetchInitialSuggestions = this.$props.enableDefaultSuggestions || this.currentValue;
778
- if (shouldFetchInitialSuggestions) {
779
- this.loadPopularSuggestions(this.$props.componentId);
780
- if (enableRecentSearches) {
781
- this.getRecentSearches();
782
- }
783
- }
784
- this.handleTextChange = debounce(this.handleText, this.$props.debounce);
785
- this.updateDefaultQueryHandlerDebounced = debounce(this.updateDefaultQueryHandler, this.$props.debounce);
786
- this.updateQueryHandlerDebounced = debounce(this.updateQueryHandler, this.$props.debounce);
787
- // Set custom and default queries in store
788
- index.updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
789
- index.updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.currentValue);
790
- this.updateDefaultQueryHandlerDebounced(this.currentValue, this.$props, false);
791
- },
792
- computed: {
793
- suggestionsList: function suggestionsList() {
794
- var suggestionsList = [];
795
- if (!this.$data.currentValue && this.$props.defaultSuggestions && this.$props.defaultSuggestions.length) {
796
- suggestionsList = this.$props.defaultSuggestions;
797
- } else if (this.$data.currentValue) {
798
- suggestionsList = this.normalizedSuggestions;
799
- }
800
- return withClickIds(suggestionsList);
801
- },
802
- topSuggestions: function topSuggestions() {
803
- if (!this.currentValue) {
804
- return [];
805
- }
806
- return this.enablePopularSuggestions ? this.normalizedPopularSuggestions : [];
807
- },
808
- normalizedRecentSearches: function normalizedRecentSearches() {
809
- return this.recentSearches || [];
810
- },
811
- normalizedPopularSuggestions: function normalizedPopularSuggestions() {
812
- return getTopSuggestions(
813
- // use default popular suggestions if value is empty
814
- this.currentValue ? this.popularSuggestions : this.defaultPopularSuggestions || [], this.currentValue, this.showDistinctSuggestions);
815
- },
816
- defaultSearchSuggestions: function defaultSearchSuggestions() {
817
- var isPopularSuggestionsEnabled = this.enablePopularSuggestions;
818
- if (this.currentValue || !this.enableDefaultSuggestions) {
819
- return [];
820
- }
821
- var customDefaultPopularSuggestions = (this.defaultPopularSuggestions || []).map(function (suggestion) {
822
- return _rollupPluginBabelHelpers._extends({}, suggestion, {
823
- _popular_suggestion: true
824
- });
825
- });
826
- var customNormalizedRecentSearches = (this.normalizedRecentSearches || []).map(function (search) {
827
- return _rollupPluginBabelHelpers._extends({}, search, {
828
- _recent_search: true
829
- });
830
- });
831
- var defaultSuggestions = isPopularSuggestionsEnabled ? [].concat(customNormalizedRecentSearches, customDefaultPopularSuggestions || []) : customNormalizedRecentSearches;
832
- return getTopSuggestions(
833
- // use default popular suggestions if value is empty
834
- defaultSuggestions, this.currentValue, this.showDistinctSuggestions);
835
- },
836
- hasCustomRenderer: function hasCustomRenderer() {
837
- return index.hasCustomRenderer(this);
838
- },
839
- stats: function stats() {
840
- return getResultStats(this);
841
- }
842
- },
843
- props: {
844
- options: vueTypes.types.options,
845
- autoFocus: VueTypes.bool,
846
- autosuggest: VueTypes.bool.def(true),
847
- beforeValueChange: vueTypes.types.func,
848
- className: VueTypes.string.def(''),
849
- clearIcon: vueTypes.types.children,
850
- componentId: vueTypes.types.stringRequired,
851
- customHighlight: vueTypes.types.func,
852
- customQuery: vueTypes.types.func,
853
- defaultQuery: vueTypes.types.func,
854
- dataField: VueTypes.oneOfType([VueTypes.string, VueTypes.shape({
855
- field: VueTypes.string,
856
- weight: VueTypes.number
857
- }), VueTypes.arrayOf(VueTypes.string), VueTypes.arrayOf({
858
- field: VueTypes.string,
859
- weight: VueTypes.number
860
- })]),
861
- aggregationField: vueTypes.types.string,
862
- aggregationSize: VueTypes.number,
863
- size: VueTypes.number,
864
- debounce: VueTypes.number.def(0),
865
- defaultValue: vueTypes.types.string,
866
- excludeFields: vueTypes.types.excludeFields,
867
- value: VueTypes.oneOfType([VueTypes.arrayOf(VueTypes.string), vueTypes.types.value]),
868
- defaultSuggestions: vueTypes.types.suggestions,
869
- enableSynonyms: VueTypes.bool.def(true),
870
- enablePopularSuggestions: VueTypes.bool.def(false),
871
- enableRecentSearches: VueTypes.bool.def(false),
872
- fieldWeights: vueTypes.types.fieldWeights,
873
- filterLabel: vueTypes.types.string,
874
- fuzziness: vueTypes.types.fuzziness,
875
- highlight: VueTypes.bool,
876
- highlightField: vueTypes.types.stringOrArray,
877
- icon: vueTypes.types.children,
878
- iconPosition: VueTypes.oneOf(['left', 'right']).def('left'),
879
- includeFields: vueTypes.types.includeFields,
880
- innerClass: vueTypes.types.style,
881
- innerRef: VueTypes.string.def('searchInputField'),
882
- render: vueTypes.types.func,
883
- renderPopularSuggestions: vueTypes.types.func,
884
- parseSuggestion: vueTypes.types.func,
885
- renderNoSuggestion: vueTypes.types.title,
886
- renderError: vueTypes.types.title,
887
- placeholder: VueTypes.string.def('Search'),
888
- queryFormat: VueTypes.oneOf(['and', 'or']).def('or'),
889
- react: vueTypes.types.react,
890
- showClear: VueTypes.bool.def(true),
891
- showDistinctSuggestions: VueTypes.bool.def(true),
892
- showFilter: VueTypes.bool.def(true),
893
- showIcon: VueTypes.bool.def(true),
894
- title: vueTypes.types.title,
895
- theme: vueTypes.types.style,
896
- URLParams: VueTypes.bool.def(false),
897
- strictSelection: VueTypes.bool.def(false),
898
- nestedField: vueTypes.types.string,
899
- enablePredictiveSuggestions: VueTypes.bool.def(false),
900
- recentSearchesIcon: VueTypes.any,
901
- popularSearchesIcon: VueTypes.any,
902
- // mic props
903
- showVoiceSearch: VueTypes.bool.def(false),
904
- getMicInstance: vueTypes.types.func,
905
- renderMic: vueTypes.types.func,
906
- distinctField: vueTypes.types.string,
907
- distinctFieldConfig: vueTypes.types.props,
908
- //
909
- focusShortcuts: VueTypes.arrayOf(VueTypes.oneOfType([VueTypes.string, VueTypes.number])).def(['/']),
910
- addonBefore: VueTypes.any,
911
- addonAfter: VueTypes.any,
912
- expandSuggestionsContainer: VueTypes.bool.def(true),
913
- index: VueTypes.string,
914
- enableDefaultSuggestions: VueTypes.bool.def(true),
915
- mode: VueTypes.oneOf(['select', 'tag']).def('select'),
916
- renderSelectedTags: VueTypes.any,
917
- endpoint: vueTypes.types.endpointConfig
918
- },
919
- beforeMount: function beforeMount() {
920
- if (this.$props.highlight) {
921
- if (this.customHighlight && typeof this.customHighlight === 'function') {
922
- this.setCustomHighlightOptions(this.componentId, this.customHighlight(this.$props));
923
- }
924
- var queryOptions = DataSearch.highlightQuery(this.$props) || {};
925
- this.queryOptions = _rollupPluginBabelHelpers._extends({}, queryOptions, this.getBasicQueryOptions());
926
- this.setQueryOptions(this.$props.componentId, this.queryOptions);
927
- } else {
928
- this.queryOptions = this.getBasicQueryOptions();
929
- this.setQueryOptions(this.$props.componentId, this.queryOptions);
930
- }
931
- if (this.selectedValue) {
932
- this.setValue(this.selectedValue, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
933
- } else if (this.$props.value) {
934
- this.setValue(this.$props.value, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
935
- } else if (this.$props.defaultValue) {
936
- this.setValue(this.$props.defaultValue, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
937
- }
938
- },
939
- mounted: function mounted() {
940
- this.listenForFocusShortcuts();
941
- },
942
- watch: {
943
- highlight: function highlight() {
944
- this.updateQueryOptions();
945
- },
946
- dataField: function dataField() {
947
- this.updateQueryOptions();
948
- this.updateQueryHandler(this.$props.componentId, this.$options.isTagsMode ? this.$data.selectedTags : this.$data.currentValue, this.$props);
949
- },
950
- highlightField: function highlightField() {
951
- this.updateQueryOptions();
952
- },
953
- fieldWeights: function fieldWeights() {
954
- this.updateQueryHandler(this.$props.componentId, this.$options.isTagsMode ? this.$data.selectedTags : this.$data.currentValue, this.$props);
955
- },
956
- fuzziness: function fuzziness() {
957
- this.updateQueryHandler(this.$props.componentId, this.$options.isTagsMode ? this.$data.selectedTags : this.$data.currentValue, this.$props);
958
- },
959
- queryFormat: function queryFormat() {
960
- this.updateQueryHandler(this.$props.componentId, this.$options.isTagsMode ? this.$data.selectedTags : this.$data.currentValue, this.$props);
961
- },
962
- defaultValue: function defaultValue(newVal) {
963
- this.setValue(newVal, true, this.$props);
964
- },
965
- value: function value(newVal, oldVal) {
966
- if (!isEqual(newVal, oldVal) || this.$options.isTagsMode && !isEqual(newVal, this.selectedTags)) {
967
- if (this.isPending && this.$options.isTagsMode && Array.isArray(newVal)) {
968
- this.isPending = false;
969
- }
970
- this.setValue(newVal, true, this.$props, newVal === '' ? configureStore.causes.CLEAR_VALUE : undefined, false, typeof newVal !== 'string' && this.$options.isTagsMode);
971
- }
972
- },
973
- defaultQuery: function defaultQuery(newVal, oldVal) {
974
- if (!index.isQueryIdentical(newVal, oldVal, this.$data.currentValue, this.$props)) {
975
- this.updateDefaultQueryHandlerDebounced(this.$data.currentValue, this.$props);
976
- }
977
- },
978
- customQuery: function customQuery(newVal, oldVal) {
979
- if (!index.isQueryIdentical(newVal, oldVal, this.$data.currentValue, this.$props)) {
980
- this.updateQueryHandler(this.componentId, this.$data.currentValue, this.$props);
981
- }
982
- },
983
- suggestions: function suggestions(newVal) {
984
- if (Array.isArray(newVal) && this.$data.currentValue.trim().length) {
985
- // shallow check allows us to set suggestions even if the next set
986
- // of suggestions are same as the current one
987
- this.$emit('suggestions', newVal);
988
- this.normalizedSuggestions = this.onSuggestions(newVal);
989
- }
990
- },
991
- selectedValue: function selectedValue(newVal, oldVal) {
992
- if (!isEqual(newVal, oldVal) && (this.$options.isTagsMode ? !isEqual(this.$data.selectedTags, newVal) : this.$data.currentValue !== newVal)) {
993
- if (!newVal && this.$data.currentValue) {
994
- // selected value is cleared, call onValueSelected
995
- this.onValueSelectedHandler('', configureStore.causes.CLEAR_VALUE);
996
- }
997
- if (this.$options.isTagsMode) {
998
- // handling reset of tags through SelectedFilters or URL
999
- this.selectedTags = [];
1000
- }
1001
- this.setValue(newVal || '', true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
1002
- }
1003
- },
1004
- focusShortcuts: function focusShortcuts() {
1005
- this.listenForFocusShortcuts();
1006
- }
1007
- },
1008
- methods: {
1009
- handleText: function handleText(value) {
1010
- if (this.$props.autosuggest) {
1011
- this.updateDefaultQueryHandlerDebounced(value, this.$props);
1012
- } else if (!this.$options.isTagsMode) {
1013
- this.updateQueryHandlerDebounced(this.$props.componentId, value, this.$props);
1014
- } else if (this.$options.isTagsMode) {
1015
- this.$data.currentValue = value;
1016
- }
1017
- },
1018
- validateDataField: function validateDataField() {
1019
- var propName = 'dataField';
1020
- var componentName = DataSearch.name;
1021
- var props = this.$props;
1022
- var requiredError = propName + " supplied to " + componentName + " is required. Validation failed.";
1023
- var propValue = props[propName];
1024
- if (!this.enableAppbase) {
1025
- if (!propValue) {
1026
- console.error(requiredError);
1027
- return;
1028
- }
1029
- if (typeof propValue !== 'string' && typeof propValue !== 'object' && !Array.isArray(propValue)) {
1030
- console.error("Invalid " + propName + " supplied to " + componentName + ". Validation failed.");
1031
- return;
1032
- }
1033
- if (Array.isArray(propValue) && propValue.length === 0) {
1034
- console.error(requiredError);
1035
- }
1036
- }
1037
- },
1038
- updateQueryOptions: function updateQueryOptions() {
1039
- if (this.customHighlight && typeof this.customHighlight === 'function') {
1040
- this.setCustomHighlightOptions(this.componentId, this.customHighlight(this.$props));
1041
- }
1042
- var queryOptions = DataSearch.highlightQuery(this.$props) || {};
1043
- this.queryOptions = _rollupPluginBabelHelpers._extends({}, queryOptions, this.getBasicQueryOptions());
1044
- this.setQueryOptions(this.$props.componentId, this.queryOptions);
1045
- },
1046
- getComponent: function getComponent(downshiftProps, isQuerySuggestionsRender) {
1047
- if (downshiftProps === void 0) {
1048
- downshiftProps = {};
1049
- }
1050
- if (isQuerySuggestionsRender === void 0) {
1051
- isQuerySuggestionsRender = false;
1052
- }
1053
- var currentValue = this.$data.currentValue;
1054
- var data = {
1055
- error: this.error,
1056
- loading: this.isLoading,
1057
- downshiftProps: downshiftProps,
1058
- data: this.suggestionsList,
1059
- promotedData: this.promotedResults,
1060
- aggregationData: this.aggregationData,
1061
- rawData: this.rawData,
1062
- customData: this.customData,
1063
- value: currentValue,
1064
- triggerClickAnalytics: this.triggerClickAnalytics,
1065
- resultStats: this.stats,
1066
- querySuggestions: this.normalizedPopularSuggestions,
1067
- popularSuggestions: this.normalizedPopularSuggestions
1068
- };
1069
- if (isQuerySuggestionsRender) {
1070
- return index.getQuerySuggestionsComponent({
1071
- downshiftProps: downshiftProps,
1072
- data: this.normalizedPopularSuggestions,
1073
- value: currentValue,
1074
- loading: this.isLoading,
1075
- error: this.error
1076
- }, this);
1077
- }
1078
- return index.getComponent(data, this);
1079
- },
1080
- // returns size and aggs property
1081
- getBasicQueryOptions: function getBasicQueryOptions() {
1082
- var aggregationField = this.$props.aggregationField;
1083
- var queryOptions = helper.getQueryOptions(this.$props);
1084
- if (aggregationField) {
1085
- queryOptions.aggs = getCompositeAggsQuery({
1086
- props: this.$props,
1087
- showTopHits: true
1088
- }).aggs;
1089
- }
1090
- return queryOptions;
1091
- },
1092
- onSuggestions: function onSuggestions(results) {
1093
- return handleOnSuggestions(results, this.$data.currentValue, this);
1094
- },
1095
- handleSearchIconClick: function handleSearchIconClick() {
1096
- var currentValue = this.currentValue;
1097
- if (currentValue.trim()) {
1098
- this.isPending = false;
1099
- this.setValue(currentValue, true);
1100
- this.onValueSelectedHandler(currentValue, configureStore.causes.SEARCH_ICON_CLICK);
1101
- }
1102
- },
1103
- setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen, isTagsMode) {
1104
- var _this = this;
1105
- if (isDefaultValue === void 0) {
1106
- isDefaultValue = false;
1107
- }
1108
- if (props === void 0) {
1109
- props = this.$props;
1110
- }
1111
- if (toggleIsOpen === void 0) {
1112
- toggleIsOpen = true;
1113
- }
1114
- if (isTagsMode === void 0) {
1115
- isTagsMode = this.$options.isTagsMode;
1116
- }
1117
- var performUpdate = function performUpdate() {
1118
- if (isTagsMode && isEqual(value, _this.selectedTags)) {
1119
- return;
1120
- }
1121
- // Refresh recent searches when value becomes empty
1122
- if (!value && props.enableDefaultSuggestions === false) {
1123
- _this.resetStoreForComponent(props.componentId);
1124
- } else if (!value && _this.currentValue && _this.enableRecentSearches) {
1125
- _this.getRecentSearches();
1126
- }
1127
- if (isTagsMode) {
1128
- if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
1129
- // check if value already present in selectedTags
1130
- if (typeof value === 'string' && _this.selectedTags.includes(value)) {
1131
- _this.isOpen = false;
1132
- return;
1133
- }
1134
- _this.selectedTags = [].concat(_this.selectedTags);
1135
- if (typeof value === 'string' && !!value) {
1136
- _this.selectedTags.push(value);
1137
- } else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
1138
- _this.selectedTags = value;
1139
- }
1140
- } else if (value) {
1141
- _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
1142
- }
1143
- _this.currentValue = '';
1144
- } else {
1145
- _this.currentValue = value;
1146
- }
1147
- var queryHandlerValue = value;
1148
- if (isTagsMode) {
1149
- queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
1150
- }
1151
- if (isDefaultValue) {
1152
- if (_this.$props.autosuggest) {
1153
- if (toggleIsOpen) {
1154
- _this.isOpen = false;
1155
- }
1156
- if (typeof value === 'string') _this.updateDefaultQueryHandlerDebounced(value, _this.$props);
1157
- } // in case of strict selection only SUGGESTION_SELECT should be able
1158
- // to set the query otherwise the value should reset
1159
-
1160
- if (props.strictSelection && props.autosuggest) {
1161
- if (cause === configureStore.causes.SUGGESTION_SELECT || props.value !== undefined) {
1162
- _this.updateQueryHandler(props.componentId, queryHandlerValue, props);
1163
- } else if (_this.currentValue !== '') {
1164
- _this.setValue('', true);
1165
- }
1166
- } else {
1167
- _this.updateQueryHandler(props.componentId, queryHandlerValue, props);
1168
- }
1169
- } else {
1170
- // debounce for handling text while typing
1171
- _this.handleTextChange(value);
1172
- }
1173
- _this.$emit('valueChange', value);
1174
- _this.$emit('value-change', value);
1175
- // Set the already fetched suggestions if query is same as used last to fetch the hits
1176
- if (value === _this.lastUsedQuery) {
1177
- _this.suggestions = _this.onSuggestions(_this.suggestions);
1178
- // invoke on suggestions
1179
- _this.$emit('suggestions', _this.suggestions);
1180
- } else if (!value) {
1181
- // reset suggestions
1182
- _this.suggestions = [];
1183
- // invoke on suggestions
1184
- _this.$emit('suggestions', _this.suggestions);
1185
- }
1186
- };
1187
- checkValueChange(props.componentId, value, props.beforeValueChange, performUpdate);
1188
- },
1189
- updateDefaultQueryHandler: function updateDefaultQueryHandler(value, props, execute) {
1190
- if (props === void 0) {
1191
- props = this.$props;
1192
- }
1193
- if (!value && props.enableDefaultSuggestions === false) {
1194
- // clear Component data from store
1195
- this.resetStoreForComponent(props.componentId);
1196
- return;
1197
- }
1198
- var defaultQueryOptions;
1199
- var query = DataSearch.defaultQuery(value, props);
1200
- if (this.defaultQuery) {
1201
- var defaultQueryToBeSet = this.defaultQuery(value, props) || {};
1202
- var defaultQueryObj = extractQueryFromCustomQuery(defaultQueryToBeSet);
1203
- if (defaultQueryObj) {
1204
- query = defaultQueryObj;
1205
- }
1206
- defaultQueryOptions = getOptionsForCustomQuery(defaultQueryToBeSet);
1207
- // Update calculated default query in store
1208
- index.updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
1209
- }
1210
- this.setQueryOptions(this.internalComponent, _rollupPluginBabelHelpers._extends({}, this.queryOptions, defaultQueryOptions), execute);
1211
- this.updateQuery({
1212
- componentId: this.internalComponent,
1213
- query: query,
1214
- value: value,
1215
- componentType: constants.componentTypes.dataSearch
1216
- }, execute);
1217
- },
1218
- updateQueryHandler: function updateQueryHandler(componentId, value, props) {
1219
- var customQuery = props.customQuery,
1220
- filterLabel = props.filterLabel,
1221
- showFilter = props.showFilter,
1222
- URLParams = props.URLParams;
1223
- var customQueryOptions;
1224
- var defaultQueryTobeSet = DataSearch.defaultQuery(value, props);
1225
- var query = defaultQueryTobeSet;
1226
- if (customQuery) {
1227
- var customQueryTobeSet = customQuery(value, props);
1228
- var queryTobeSet = extractQueryFromCustomQuery(customQueryTobeSet);
1229
- if (queryTobeSet) {
1230
- query = queryTobeSet;
1231
- }
1232
- customQueryOptions = getOptionsForCustomQuery(customQueryTobeSet);
1233
- index.updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
1234
- this.setQueryOptions(componentId, _rollupPluginBabelHelpers._extends({}, this.queryOptions, customQueryOptions), false);
1235
- }
1236
- if (!this.isPending) {
1237
- this.updateQuery({
1238
- componentId: componentId,
1239
- query: query,
1240
- value: value,
1241
- label: filterLabel,
1242
- showFilter: showFilter,
1243
- URLParams: URLParams,
1244
- componentType: 'DATASEARCH'
1245
- });
1246
- }
1247
- },
1248
- // need to review
1249
- handleFocus: function handleFocus(event) {
1250
- this.isOpen = true;
1251
- this.$emit('focus', event);
1252
- },
1253
- handleVoiceResults: function handleVoiceResults(_ref) {
1254
- var results = _ref.results;
1255
- if (results && results[0] && results[0].isFinal && results[0][0] && results[0][0].transcript && results[0][0].transcript.trim()) {
1256
- this.isPending = false;
1257
- this.setValue(results[0][0].transcript.trim(), true);
1258
- }
1259
- },
1260
- triggerQuery: function triggerQuery(_temp) {
1261
- var _ref2 = _temp === void 0 ? false : _temp,
1262
- _ref2$isOpen = _ref2.isOpen,
1263
- isOpen = _ref2$isOpen === void 0 ? false : _ref2$isOpen;
1264
- var value = this.$props.value;
1265
- if (value !== undefined) {
1266
- this.isPending = false;
1267
- this.setValue(this.$props.value, !isOpen);
1268
- }
1269
- },
1270
- triggerClickAnalytics: function triggerClickAnalytics(searchPosition, documentId) {
1271
- // click analytics would only work client side and after javascript loads
1272
- var docId = documentId;
1273
- if (!docId) {
1274
- var hitData = this.suggestionsList.find(function (hit) {
1275
- return hit._click_id === searchPosition;
1276
- });
1277
- if (hitData && hitData.source && hitData.source._id) {
1278
- docId = hitData.source._id;
1279
- }
1280
- }
1281
- this.recordSuggestionClick(searchPosition, docId);
1282
- },
1283
- clearValue: function clearValue() {
1284
- this.isPending = false;
1285
- this.setValue('', true);
1286
- this.onValueSelectedHandler('', configureStore.causes.CLEAR_VALUE);
1287
- },
1288
- handleKeyDown: function handleKeyDown(event, highlightedIndex) {
1289
- var targetValue = event.target.value;
1290
- var _this$$props2 = this.$props,
1291
- value = _this$$props2.value,
1292
- strictSelection = _this$$props2.strictSelection,
1293
- size = _this$$props2.size;
1294
- if (value !== undefined) {
1295
- this.isPending = true;
1296
- }
1297
-
1298
- // if a suggestion was selected, delegate the handling to suggestion handler
1299
- if (event.key === 'Enter' && (highlightedIndex === null || highlightedIndex < 0 || highlightedIndex === [].concat([].concat(this.suggestionsList).slice(0, size || 10), this.defaultSearchSuggestions, this.topSuggestions).length)) {
1300
- this.isPending = false;
1301
- this.setValue(this.$options.isTagsMode && strictSelection ? '' : targetValue, true, this.$props, undefined, false);
1302
- this.onValueSelectedHandler(targetValue, configureStore.causes.ENTER_PRESS);
1303
- }
1304
- // Need to review
1305
- this.$emit('keyDown', event, this.triggerQuery);
1306
- this.$emit('key-down', event, this.triggerQuery);
1307
- },
1308
- onInputChange: function onInputChange(e) {
1309
- var _this2 = this;
1310
- var inputValue = e.target.value;
1311
- if (!this.$data.isOpen) {
1312
- this.isOpen = true;
1313
- }
1314
- var _this$$props3 = this.$props,
1315
- value = _this$$props3.value,
1316
- autosuggest = _this$$props3.autosuggest;
1317
- if (value === undefined) {
1318
- this.setValue(inputValue, false, this.$props, undefined, true, false);
1319
- } else {
1320
- this.isPending = true;
1321
- this.currentValue = inputValue;
1322
- this.$emit('change', inputValue, function (_temp2) {
1323
- var _ref3 = _temp2 === void 0 ? {} : _temp2,
1324
- _ref3$isOpen = _ref3.isOpen,
1325
- isOpen = _ref3$isOpen === void 0 ? false : _ref3$isOpen;
1326
- if (_this2.$options.isTagsMode && autosuggest) {
1327
- _this2.isOpen = isOpen;
1328
- _this2.updateDefaultQueryHandlerDebounced(_this2.currentValue, _this2.$props);
1329
- return;
1330
- }
1331
- _this2.triggerQuery({
1332
- isOpen: isOpen
1333
- });
1334
- }, e);
1335
- }
1336
- },
1337
- onSuggestionSelected: function onSuggestionSelected(suggestion) {
1338
- var value = this.$props.value;
1339
- // Record analytics for selected suggestions
1340
- this.triggerClickAnalytics(suggestion._click_id);
1341
- if (value === undefined) {
1342
- this.setValue(suggestion.value, true, this.$props, configureStore.causes.SUGGESTION_SELECT);
1343
- } else if (this.$options.isTagsMode) {
1344
- var emitValue = Array.isArray(this.selectedTags) ? [].concat(this.selectedTags) : [];
1345
- if (this.selectedTags.includes(suggestion.value)) {
1346
- // avoid duplicates in tags array
1347
- this.isOpen = false;
1348
- return;
1349
- }
1350
- emitValue.push(suggestion.value);
1351
- this.setValue(emitValue, true, this.$props, configureStore.causes.SUGGESTION_SELECT, true);
1352
- this.$emit('change', emitValue, this.triggerQuery);
1353
- } else {
1354
- this.$emit('change', suggestion.value, this.triggerQuery);
1355
- }
1356
- this.isPending = false;
1357
- this.onValueSelectedHandler(suggestion.value, configureStore.causes.SUGGESTION_SELECT, suggestion.source);
1358
- },
1359
- onValueSelectedHandler: function onValueSelectedHandler(currentValue) {
1360
- if (currentValue === void 0) {
1361
- currentValue = this.$data.currentValue;
1362
- }
1363
- for (var _len = arguments.length, cause = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
1364
- cause[_key - 1] = arguments[_key];
1365
- }
1366
- this.$emit.apply(this, ['valueSelected', currentValue].concat(cause));
1367
- this.$emit.apply(this, ['value-selected', currentValue].concat(cause));
1368
- },
1369
- handleStateChange: function handleStateChange(changes) {
1370
- var isOpen = changes.isOpen;
1371
- this.isOpen = isOpen;
1372
- },
1373
- getBackgroundColor: function getBackgroundColor(highlightedIndex, index) {
1374
- var isDark = this.themePreset === 'dark';
1375
- if (isDark) {
1376
- return highlightedIndex === index ? '#555' : '#424242';
1377
- }
1378
- return highlightedIndex === index ? '#eee' : '#fff';
1379
- },
1380
- renderIcon: function renderIcon() {
1381
- if (this.$props.showIcon) {
1382
- return this.$props.icon || vue.createVNode(SearchSvg, null, null);
1383
- }
1384
- return null;
1385
- },
1386
- renderErrorComponent: function renderErrorComponent() {
1387
- var _this3 = this;
1388
- var renderError = this.$slots.renderError || this.$props.renderError;
1389
- if (this.error && renderError && this.$data.currentValue && !this.isLoading) {
1390
- return vue.createVNode(SuggestionWrapper, {
1391
- "innerClass": this.$props.innerClass,
1392
- "innerClassName": "error",
1393
- "theme": this.theme,
1394
- "themePreset": this.themePreset
1395
- }, {
1396
- "default": function _default() {
1397
- return [index.isFunction(renderError) ? renderError(_this3.error) : renderError];
1398
- }
1399
- });
1400
- }
1401
- return null;
1402
- },
1403
- renderCancelIcon: function renderCancelIcon() {
1404
- if (this.$props.showClear) {
1405
- return this.$props.clearIcon || vue.createVNode(CancelSvg.CancelSvg, null, null);
1406
- }
1407
- return null;
1408
- },
1409
- renderNoSuggestions: function renderNoSuggestions(finalSuggestionsList) {
1410
- if (finalSuggestionsList === void 0) {
1411
- finalSuggestionsList = [];
1412
- }
1413
- var _this$$props4 = this.$props,
1414
- theme = _this$$props4.theme,
1415
- innerClass = _this$$props4.innerClass;
1416
- var renderNoSuggestion = this.$slots.renderNoSuggestion() || this.$props.renderNoSuggestion;
1417
- var renderError = this.$slots.renderError() || this.$props.renderError;
1418
- var _this$$data = this.$data,
1419
- isOpen = _this$$data.isOpen,
1420
- currentValue = _this$$data.currentValue;
1421
- if (renderNoSuggestion && isOpen && !finalSuggestionsList.length && !this.isLoading && currentValue && !(renderError && this.error)) {
1422
- return vue.createVNode(SuggestionWrapper, {
1423
- "innerClass": innerClass,
1424
- "themePreset": this.themePreset,
1425
- "theme": theme,
1426
- "innerClassName": "noSuggestion",
1427
- "scopedSlots": {
1428
- "default": function _default() {
1429
- return typeof renderNoSuggestion === 'function' ? renderNoSuggestion(currentValue) : renderNoSuggestion;
1430
- }
1431
- }
1432
- }, null);
1433
- }
1434
- return null;
1435
- },
1436
- renderInputAddonBefore: function renderInputAddonBefore() {
1437
- var addonBefore = this.$slots.addonBefore;
1438
- if (addonBefore) {
1439
- var _slot;
1440
- return vue.createVNode(InputAddon, null, _isSlot(_slot = addonBefore()) ? _slot : {
1441
- "default": function _default() {
1442
- return [_slot];
1443
- }
1444
- });
1445
- }
1446
- return null;
1447
- },
1448
- renderTag: function renderTag(item) {
1449
- var _this4 = this;
1450
- var innerClass = this.$props.innerClass;
1451
- return vue.createVNode(TagItem, {
1452
- "class": getClassName$1(innerClass, 'selected-tag') || ''
1453
- }, {
1454
- "default": function _default() {
1455
- return [vue.createVNode("span", null, [item]), vue.createVNode("span", {
1456
- "role": "img",
1457
- "aria-label": "delete-tag",
1458
- "class": "close-icon",
1459
- "onClick": function onClick() {
1460
- return _this4.clearTag(item);
1461
- }
1462
- }, [vue.createVNode(CancelSvg.CancelSvg, null, null)])];
1463
- }
1464
- });
1465
- },
1466
- clearAllTags: function clearAllTags() {
1467
- this.selectedTags = [];
1468
- this.setValue('', true, this.$props, configureStore.causes.SUGGESTION_SELECT);
1469
- if (this.$props.value !== undefined) {
1470
- this.$emit('change', this.selectedTags, this.triggerQuery);
1471
- }
1472
- },
1473
- clearTag: function clearTag(tagValue) {
1474
- this.selectedTags = [].concat(this.selectedTags.filter(function (tag) {
1475
- return tag !== tagValue;
1476
- }));
1477
- this.setValue('', true, this.$props, configureStore.causes.SUGGESTION_SELECT);
1478
- if (this.$props.value !== undefined) {
1479
- this.$emit('change', this.selectedTags, this.triggerQuery);
1480
- }
1481
- },
1482
- renderTags: function renderTags() {
1483
- var _this5 = this;
1484
- if (!Array.isArray(this.selectedTags)) {
1485
- return null;
1486
- }
1487
- var tagsList = [].concat(this.selectedTags);
1488
- var shouldRenderClearAllTag = tagsList.length > 1;
1489
- var renderSelectedTags = this.$slots.renderSelectedTags || this.$props.renderSelectedTags;
1490
- return renderSelectedTags ? renderSelectedTags({
1491
- values: this.selectedTags,
1492
- handleClear: this.clearTag,
1493
- handleClearAll: this.clearAllTags
1494
- }) : vue.createVNode(TagsContainer, null, {
1495
- "default": function _default() {
1496
- return [tagsList.map(function (item) {
1497
- return _this5.renderTag(item);
1498
- }), shouldRenderClearAllTag && vue.createVNode(TagItem, {
1499
- "class": getClassName$1(_this5.$props.innerClass, 'selected-tag') || ''
1500
- }, {
1501
- "default": function _default() {
1502
- return [vue.createVNode("span", null, [vue.createTextVNode("Clear All")]), vue.createVNode("span", {
1503
- "role": "img",
1504
- "aria-label": "delete-tag",
1505
- "class": "close-icon",
1506
- "onClick": _this5.clearAllTags
1507
- }, [vue.createVNode(CancelSvg.CancelSvg, null, null)])];
1508
- }
1509
- })];
1510
- }
1511
- });
1512
- },
1513
- renderInputAddonAfter: function renderInputAddonAfter() {
1514
- var addonAfter = this.$slots.addonAfter;
1515
- if (addonAfter) {
1516
- var _slot2;
1517
- return vue.createVNode(InputAddon, null, _isSlot(_slot2 = addonAfter()) ? _slot2 : {
1518
- "default": function _default() {
1519
- return [_slot2];
1520
- }
1521
- });
1522
- }
1523
- return null;
1524
- },
1525
- renderIcons: function renderIcons() {
1526
- var _this6 = this;
1527
- var _slot3, _slot4, _slot5;
1528
- var _this$$props5 = this.$props,
1529
- iconPosition = _this$$props5.iconPosition,
1530
- showClear = _this$$props5.showClear,
1531
- innerClass = _this$$props5.innerClass,
1532
- getMicInstance = _this$$props5.getMicInstance,
1533
- showVoiceSearch = _this$$props5.showVoiceSearch,
1534
- showIcon = _this$$props5.showIcon;
1535
- var renderMic = this.$slots.renderMic || this.$props.renderMic;
1536
- var currentValue = this.$data.currentValue;
1537
- return vue.createVNode("div", null, [vue.createVNode(CancelSvg.IconGroup, {
1538
- "groupPosition": "right",
1539
- "positionType": "absolute"
1540
- }, {
1541
- "default": function _default() {
1542
- return [currentValue && showClear && vue.createVNode(CancelSvg.IconWrapper, {
1543
- "onClick": _this6.clearValue,
1544
- "showIcon": showIcon,
1545
- "isClearIcon": true
1546
- }, _isSlot(_slot3 = _this6.renderCancelIcon()) ? _slot3 : {
1547
- "default": function _default() {
1548
- return [_slot3];
1549
- }
1550
- }), showVoiceSearch && vue.createVNode(Mic, {
1551
- "getInstance": getMicInstance,
1552
- "render": renderMic,
1553
- "handleResult": _this6.handleVoiceResults,
1554
- "className": getClassName$1(innerClass, 'mic') || null
1555
- }, null), iconPosition === 'right' && showIcon && vue.createVNode(CancelSvg.IconWrapper, {
1556
- "onClick": _this6.handleSearchIconClick
1557
- }, _isSlot(_slot4 = _this6.renderIcon()) ? _slot4 : {
1558
- "default": function _default() {
1559
- return [_slot4];
1560
- }
1561
- })];
1562
- }
1563
- }), vue.createVNode(CancelSvg.IconGroup, {
1564
- "groupPosition": "left",
1565
- "positionType": "absolute"
1566
- }, {
1567
- "default": function _default() {
1568
- return [iconPosition === 'left' && showIcon && vue.createVNode(CancelSvg.IconWrapper, {
1569
- "onClick": _this6.handleSearchIconClick
1570
- }, _isSlot(_slot5 = _this6.renderIcon()) ? _slot5 : {
1571
- "default": function _default() {
1572
- return [_slot5];
1573
- }
1574
- })];
1575
- }
1576
- })]);
1577
- },
1578
- focusSearchBox: function focusSearchBox(event) {
1579
- var _this$$refs, _this$$refs$this$$pro;
1580
- var elt = event.target || event.srcElement;
1581
- var tagName = elt.tagName;
1582
- if (elt.isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA') {
1583
- // already in an input
1584
- return;
1585
- }
1586
- (_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$this$$pro = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.focus(); // eslint-disable-line
1587
- },
1588
- listenForFocusShortcuts: function listenForFocusShortcuts() {
1589
- var _this7 = this;
1590
- var _this$$props$focusSho = this.$props.focusShortcuts,
1591
- focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
1592
- if (index.isEmpty(focusShortcuts)) {
1593
- return;
1594
- }
1595
- var shortcutsString = index.parseFocusShortcuts(focusShortcuts).join(',');
1596
-
1597
- // handler for alphabets and other key combinations
1598
- hotkeys(shortcutsString,
1599
- // eslint-disable-next-line no-unused-vars
1600
- /* eslint-disable no-shadow */
1601
- function (event, handler) {
1602
- // Prevent the default refresh event under WINDOWS system
1603
- event.preventDefault();
1604
- _this7.focusSearchBox(event);
1605
- });
1606
-
1607
- // if one of modifier keys are used, they are handled below
1608
- hotkeys('*', function (event) {
1609
- var modifierKeys = index.extractModifierKeysFromFocusShortcuts(focusShortcuts);
1610
- if (modifierKeys.length === 0) return;
1611
- for (var index$1 = 0; index$1 < modifierKeys.length; index$1 += 1) {
1612
- var element = modifierKeys[index$1];
1613
- if (hotkeys[element]) {
1614
- _this7.focusSearchBox(event);
1615
- break;
1616
- }
1617
- }
1618
- });
1619
- }
1620
- },
1621
- render: function render() {
1622
- var _this8 = this;
1623
- var _this$$props6 = this.$props,
1624
- theme = _this$$props6.theme,
1625
- size = _this$$props6.size,
1626
- expandSuggestionsContainer = _this$$props6.expandSuggestionsContainer,
1627
- enableDefaultSuggestions = _this$$props6.enableDefaultSuggestions;
1628
- var _this$$slots = this.$slots,
1629
- recentSearchesIcon = _this$$slots.recentSearchesIcon,
1630
- popularSearchesIcon = _this$$slots.popularSearchesIcon;
1631
- var hasSuggestions = this.currentValue ? this.suggestionsList.length || this.topSuggestions.length : this.defaultSearchSuggestions.length;
1632
- if (enableDefaultSuggestions === false && !this.currentValue) {
1633
- hasSuggestions = false;
1634
- }
1635
- return vue.createVNode(Container.Container, {
1636
- "class": this.$props.className
1637
- }, {
1638
- "default": function _default() {
1639
- return [_this8.$props.title && vue.createVNode(Title.Title, {
1640
- "class": getClassName$1(_this8.$props.innerClass, 'title') || ''
1641
- }, {
1642
- "default": function _default() {
1643
- return [_this8.$props.title];
1644
- }
1645
- }), _this8.$props.defaultSuggestions || _this8.$props.autosuggest ? vue.createVNode(CancelSvg.Downshift, {
1646
- "id": _this8.$props.componentId + "-downshift",
1647
- "handleChange": _this8.onSuggestionSelected,
1648
- "handleMouseup": _this8.handleStateChange,
1649
- "isOpen": _this8.$data.isOpen,
1650
- "scopedSlots": {
1651
- "default": function _default(_ref4) {
1652
- var getInputEvents = _ref4.getInputEvents,
1653
- getInputProps = _ref4.getInputProps,
1654
- getItemProps = _ref4.getItemProps,
1655
- getItemEvents = _ref4.getItemEvents,
1656
- isOpen = _ref4.isOpen,
1657
- highlightedIndex = _ref4.highlightedIndex,
1658
- setHighlightedIndex = _ref4.setHighlightedIndex;
1659
- var renderSuggestionsContainer = function renderSuggestionsContainer() {
1660
- return vue.createVNode("div", null, [_this8.hasCustomRenderer && _this8.getComponent({
1661
- isOpen: isOpen,
1662
- getItemProps: getItemProps,
1663
- getItemEvents: getItemEvents,
1664
- highlightedIndex: highlightedIndex
1665
- }), _this8.renderErrorComponent(), !_this8.hasCustomRenderer && isOpen && hasSuggestions ? vue.createVNode("ul", {
1666
- "class": Input.suggestions(_this8.themePreset, theme) + " " + getClassName$1(_this8.$props.innerClass, 'list')
1667
- }, [_this8.suggestionsList.slice(0, size || 10).map(function (item, index) {
1668
- return vue.createVNode("li", vue.mergeProps({
1669
- domProps: getItemProps({
1670
- item: item
1671
- })
1672
- }, {
1673
- on: getItemEvents({
1674
- item: item
1675
- })
1676
- }, {
1677
- "key": index + 1 + "-" + item.value,
1678
- "style": {
1679
- backgroundColor: _this8.getBackgroundColor(highlightedIndex, index)
1680
- }
1681
- }), [vue.createVNode(SuggestionItem, {
1682
- "currentValue": _this8.currentValue,
1683
- "suggestion": item
1684
- }, null)]);
1685
- }), _this8.defaultSearchSuggestions.map(function (sugg, index) {
1686
- return vue.createVNode("li", vue.mergeProps({
1687
- domProps: getItemProps({
1688
- item: sugg
1689
- })
1690
- }, {
1691
- on: getItemEvents({
1692
- item: sugg
1693
- })
1694
- }, {
1695
- "key": _this8.suggestionsList.length + index + 1 + "-" + sugg.value,
1696
- "style": {
1697
- backgroundColor: _this8.getBackgroundColor(highlightedIndex, _this8.suggestionsList.length + index),
1698
- justifyContent: 'flex-start'
1699
- }
1700
- }), [vue.createVNode("div", {
1701
- "style": {
1702
- padding: '0 10px 0 0'
1703
- }
1704
- }, [sugg.source && sugg.source._recent_search && vue.createVNode(CustomSvg, {
1705
- "className": getClassName$1(_this8.$props.innerClass, 'recent-search-icon') || null,
1706
- "icon": recentSearchesIcon,
1707
- "type": "recent-search-icon"
1708
- }, null), sugg.source && sugg.source._popular_suggestion && vue.createVNode(CustomSvg, {
1709
- "className": getClassName$1(_this8.$props.innerClass, 'popular-search-icon') || null,
1710
- "icon": popularSearchesIcon,
1711
- "type": "popular-search-icon"
1712
- }, null)]), vue.createVNode(SuggestionItem, {
1713
- "currentValue": _this8.currentValue,
1714
- "suggestion": sugg
1715
- }, null)]);
1716
- }), index.hasQuerySuggestionsRenderer(_this8) ? _this8.getComponent({
1717
- isOpen: isOpen,
1718
- getItemProps: getItemProps,
1719
- getItemEvents: getItemEvents,
1720
- highlightedIndex: highlightedIndex
1721
- }, true) : _this8.topSuggestions.map(function (sugg, index) {
1722
- return vue.createVNode("li", vue.mergeProps({
1723
- domProps: getItemProps({
1724
- item: sugg
1725
- })
1726
- }, {
1727
- on: getItemEvents({
1728
- item: sugg
1729
- })
1730
- }, {
1731
- "key": _this8.suggestionsList.length + index + 1 + "-" + sugg.value,
1732
- "style": {
1733
- backgroundColor: _this8.getBackgroundColor(highlightedIndex, _this8.suggestionsList.length + index),
1734
- justifyContent: 'flex-start'
1735
- }
1736
- }), [vue.createVNode("div", {
1737
- "style": {
1738
- padding: '0 10px 0 0'
1739
- }
1740
- }, [vue.createVNode(CustomSvg, {
1741
- "className": getClassName$1(_this8.$props.innerClass, 'popular-search-icon') || null,
1742
- "icon": popularSearchesIcon,
1743
- "type": "popular-search-icon"
1744
- }, null)]), vue.createVNode(SuggestionItem, {
1745
- "currentValue": _this8.currentValue,
1746
- "suggestion": sugg
1747
- }, null)]);
1748
- })]) : _this8.renderNoSuggestions(_this8.suggestionsList)]);
1749
- };
1750
- return vue.createVNode("div", {
1751
- "class": Input.suggestionsContainer
1752
- }, [vue.createVNode(InputGroup, null, {
1753
- "default": function _default() {
1754
- return [_this8.renderInputAddonBefore(), vue.createVNode(CancelSvg.InputWrapper, null, {
1755
- "default": function _default() {
1756
- return [vue.createVNode(Input.Input, vue.mergeProps({
1757
- "id": _this8.$props.componentId + "-input",
1758
- "showIcon": _this8.$props.showIcon,
1759
- "showClear": _this8.$props.showClear,
1760
- "iconPosition": _this8.$props.iconPosition,
1761
- "ref": _this8.$props.innerRef,
1762
- "class": getClassName$1(_this8.$props.innerClass, 'input'),
1763
- "placeholder": _this8.$props.placeholder,
1764
- "autoFocus": _this8.$props.autoFocus
1765
- }, {
1766
- on: getInputEvents({
1767
- onInput: _this8.onInputChange,
1768
- onBlur: function onBlur(e) {
1769
- _this8.$emit('blur', e, _this8.triggerQuery);
1770
- },
1771
- onFocus: _this8.handleFocus,
1772
- onKeyPress: function onKeyPress(e) {
1773
- _this8.$emit('keyPress', e, _this8.triggerQuery);
1774
- _this8.$emit('key-press', e, _this8.triggerQuery);
1775
- },
1776
- onKeyDown: function onKeyDown(e) {
1777
- return _this8.handleKeyDown(e, highlightedIndex);
1778
- },
1779
- onKeyUp: function onKeyUp(e) {
1780
- _this8.$emit('keyUp', e, _this8.triggerQuery);
1781
- _this8.$emit('key-up', e, _this8.triggerQuery);
1782
- },
1783
- onClick: function onClick() {
1784
- setHighlightedIndex(null);
1785
- }
1786
- })
1787
- }, {
1788
- domProps: getInputProps({
1789
- value: _this8.$data.currentValue === null || typeof _this8.$data.currentValue !== 'string' ? '' : _this8.$data.currentValue
1790
- })
1791
- }, {
1792
- "themePreset": _this8.themePreset,
1793
- "autocomplete": "off"
1794
- }), null), _this8.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()];
1795
- }
1796
- }), ' ', _this8.renderInputAddonAfter()];
1797
- }
1798
- }), expandSuggestionsContainer && renderSuggestionsContainer(), _this8.renderTags()]);
1799
- }
1800
- }
1801
- }, null) : vue.createVNode("div", {
1802
- "class": Input.suggestionsContainer
1803
- }, [vue.createVNode(InputGroup, null, {
1804
- "default": function _default() {
1805
- return [_this8.renderInputAddonBefore(), vue.createVNode(CancelSvg.InputWrapper, null, {
1806
- "default": function _default() {
1807
- return [vue.createVNode(Input.Input, vue.mergeProps({
1808
- "class": getClassName$1(_this8.$props.innerClass, 'input') || '',
1809
- "placeholder": _this8.$props.placeholder
1810
- }, {
1811
- on: {
1812
- blur: function blur(e) {
1813
- _this8.$emit('blur', e, _this8.triggerQuery);
1814
- },
1815
- keypress: function keypress(e) {
1816
- _this8.$emit('keyPress', e, _this8.triggerQuery);
1817
- _this8.$emit('key-press', e, _this8.triggerQuery);
1818
- },
1819
- input: _this8.onInputChange,
1820
- focus: function focus(e) {
1821
- _this8.$emit('focus', e, _this8.triggerQuery);
1822
- },
1823
- keydown: function keydown(e) {
1824
- _this8.$emit('keyDown', e, _this8.triggerQuery);
1825
- _this8.$emit('key-down', e, _this8.triggerQuery);
1826
- },
1827
- keyup: function keyup(e) {
1828
- _this8.$emit('keyUp', e, _this8.triggerQuery);
1829
- _this8.$emit('key-up', e, _this8.triggerQuery);
1830
- }
1831
- }
1832
- }, {
1833
- domProps: {
1834
- autofocus: _this8.$props.autoFocus,
1835
- value: _this8.$data.currentValue ? _this8.$data.currentValue : ''
1836
- }
1837
- }, {
1838
- "iconPosition": _this8.$props.iconPosition,
1839
- "showIcon": _this8.$props.showIcon,
1840
- "showClear": _this8.$props.showClear,
1841
- "ref": _this8.$props.innerRef,
1842
- "themePreset": _this8.themePreset
1843
- }), null), _this8.renderIcons()];
1844
- }
1845
- }), _this8.renderInputAddonAfter()];
1846
- }
1847
- }), _this8.renderTags()])];
1848
- }
1849
- });
1850
- },
1851
- destroyed: function destroyed() {
1852
- document.removeEventListener('keydown', this.onKeyDown);
1853
- }
1854
- };
1855
- DataSearch.defaultQuery = function (value, props) {
1856
- var finalQuery = null;
1857
- if (value) {
1858
- var fields = normalizeDataField(props.dataField, props.fieldWeights);
1859
- finalQuery = {
1860
- bool: {
1861
- should: DataSearch.shouldQuery(value, fields, props),
1862
- minimum_should_match: '1'
1863
- }
1864
- };
1865
- }
1866
- if (value === '') {
1867
- finalQuery = null;
1868
- }
1869
- if (finalQuery && props.nestedField) {
1870
- return {
1871
- query: {
1872
- nested: {
1873
- path: props.nestedField,
1874
- query: finalQuery
1875
- }
1876
- }
1877
- };
1878
- }
1879
- return finalQuery;
1880
- };
1881
- DataSearch.shouldQuery = function (value, dataFields, props) {
1882
- var finalQuery = [];
1883
- var phrasePrefixFields = [];
1884
- var fields = dataFields.map(function (dataField) {
1885
- var queryField = "" + dataField.field + (dataField.weight ? "^" + dataField.weight : '');
1886
- if (!(dataField.field.endsWith('.keyword') || dataField.field.endsWith('.autosuggest') || dataField.field.endsWith('.search'))) {
1887
- phrasePrefixFields.push(queryField);
1888
- }
1889
- return queryField;
1890
- });
1891
- if (props.searchOperators || props.queryString) {
1892
- return {
1893
- query: value,
1894
- fields: fields,
1895
- default_operator: props.queryFormat
1896
- };
1897
- }
1898
- if (props.queryFormat === 'and') {
1899
- finalQuery.push({
1900
- multi_match: {
1901
- query: value,
1902
- fields: fields,
1903
- type: 'cross_fields',
1904
- operator: 'and'
1905
- }
1906
- });
1907
- finalQuery.push({
1908
- multi_match: {
1909
- query: value,
1910
- fields: fields,
1911
- type: 'phrase',
1912
- operator: 'and'
1913
- }
1914
- });
1915
- if (phrasePrefixFields.length > 0) {
1916
- finalQuery.push({
1917
- multi_match: {
1918
- query: value,
1919
- fields: phrasePrefixFields,
1920
- type: 'phrase_prefix',
1921
- operator: 'and'
1922
- }
1923
- });
1924
- }
1925
- return finalQuery;
1926
- }
1927
- finalQuery.push({
1928
- multi_match: {
1929
- query: value,
1930
- fields: fields,
1931
- type: 'best_fields',
1932
- operator: 'or',
1933
- fuzziness: props.fuzziness ? props.fuzziness : 0
1934
- }
1935
- });
1936
- finalQuery.push({
1937
- multi_match: {
1938
- query: value,
1939
- fields: fields,
1940
- type: 'phrase',
1941
- operator: 'or'
1942
- }
1943
- });
1944
- if (phrasePrefixFields.length > 0) {
1945
- finalQuery.push({
1946
- multi_match: {
1947
- query: value,
1948
- fields: phrasePrefixFields,
1949
- type: 'phrase_prefix',
1950
- operator: 'or'
1951
- }
1952
- });
1953
- }
1954
- return finalQuery;
1955
- };
1956
- DataSearch.highlightQuery = function (props) {
1957
- if (props.customHighlight) {
1958
- return props.customHighlight(props);
1959
- }
1960
- if (!props.highlight) {
1961
- return null;
1962
- }
1963
- var fields = {};
1964
- var highlightField = props.highlightField ? props.highlightField : props.dataField;
1965
- if (typeof highlightField === 'string') {
1966
- fields[highlightField] = {};
1967
- } else if (Array.isArray(highlightField)) {
1968
- highlightField.forEach(function (item) {
1969
- fields[item] = {};
1970
- });
1971
- }
1972
- return {
1973
- highlight: _rollupPluginBabelHelpers._extends({
1974
- pre_tags: ['<mark>'],
1975
- post_tags: ['</mark>'],
1976
- fields: fields
1977
- }, props.highlightField && {
1978
- require_field_match: false
1979
- })
1980
- };
1981
- };
1982
- DataSearch.hasInternalComponent = function () {
1983
- return true;
1984
- };
1985
- var mapStateToProps = function mapStateToProps(state, props) {
1986
- return {
1987
- selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
1988
- suggestions: state.hits[props.componentId] && state.hits[props.componentId].hits,
1989
- rawData: state.rawData[props.componentId],
1990
- aggregationData: state.compositeAggregations[props.componentId] || [],
1991
- isLoading: !!state.isLoading[props.componentId + "_active"],
1992
- themePreset: state.config.themePreset,
1993
- error: state.error[props.componentId],
1994
- analytics: state.analytics,
1995
- enableAppbase: state.config.enableAppbase,
1996
- headers: state.appbaseRef.headers,
1997
- promotedResults: state.promotedResults[props.componentId] || [],
1998
- customData: state.customData[props.componentId],
1999
- time: state.hits[props.componentId] && state.hits[props.componentId].time || 0,
2000
- total: state.hits[props.componentId] && state.hits[props.componentId].total,
2001
- hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden,
2002
- popularSuggestions: state.querySuggestions[props.componentId],
2003
- defaultPopularSuggestions: state.defaultPopularSuggestions[props.componentId],
2004
- componentProps: state.props[props.componentId],
2005
- lastUsedQuery: state.queryToHits[props.componentId],
2006
- recentSearches: state.recentSearches.data
2007
- };
2008
- };
2009
- var mapDispatchToProps = {
2010
- setQueryOptions: setQueryOptions,
2011
- updateQuery: updateQuery,
2012
- setCustomQuery: setCustomQuery,
2013
- setDefaultQuery: setDefaultQuery,
2014
- setCustomHighlightOptions: setCustomHighlightOptions,
2015
- recordSuggestionClick: recordSuggestionClick,
2016
- loadPopularSuggestions: loadPopularSuggestions,
2017
- getRecentSearches: getRecentSearches,
2018
- resetStoreForComponent: resetStoreForComponent
2019
- };
2020
- var DSConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps, mapDispatchToProps)(DataSearch), {
2021
- componentType: constants.componentTypes.dataSearch,
2022
- internalComponent: DataSearch.hasInternalComponent()
2023
- }));
2024
- DSConnected.name = DataSearch.name;
2025
-
2026
- // plugins usage
2027
- DSConnected.install = function (Vue) {
2028
- Vue.component(DSConnected.name, DSConnected);
2029
- };
2030
- // Add componentType for SSR
2031
- DSConnected.componentType = constants.componentTypes.dataSearch;
2032
-
2033
- exports.CustomSvg = CustomSvg;
2034
- exports.DSConnected = DSConnected;
2035
- exports.DataSearch = DSConnected;
2036
- exports.InputAddon = InputAddon;
2037
- exports.InputGroup = InputGroup;
2038
- exports.Mic = Mic;
2039
- exports.SearchSvg = SearchSvg;
2040
- exports.SuggestionItem = SuggestionItem;
2041
- exports.SuggestionWrapper = SuggestionWrapper;
2042
- exports.TagItem = TagItem;
2043
- exports.TagsContainer = TagsContainer;