@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
@@ -5,35 +5,37 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
5
5
  var configureStore = require('@appbaseio/reactivecore');
6
6
  var configureStore__default = _interopDefault(configureStore);
7
7
  var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
8
- var vue = require('vue');
9
8
  var VueTypes = _interopDefault(require('vue-types'));
10
- var vueEmotion = require('@appbaseio/vue-emotion');
11
- var vueTypes = require('./vueTypes-621a8143.js');
12
- var index = require('./index-dc25b706.js');
13
- var CancelSvg = require('./CancelSvg-062a42f0.js');
14
- var Input = require('./Input-4d278ca0.js');
9
+ var emotion = require('emotion');
10
+ var styled = require('@appbaseio/vue-emotion');
11
+ var styled__default = _interopDefault(styled);
12
+ var vueTypes = require('./vueTypes-b7007f5f.js');
13
+ var index = require('./index-de136c17.js');
14
+ var _mergeJSXProps = _interopDefault(require('@vue/babel-helper-vue-jsx-merge-props'));
15
+ var CancelSvg = require('./CancelSvg-220a7cc3.js');
16
+ var Input = require('./Input-ead4cd84.js');
15
17
  var suggestions = require('@appbaseio/reactivecore/lib/utils/suggestions');
16
18
 
17
- var _templateObject, _templateObject2;
18
- var small = "\n\tmin-height: 0;\n\theight: 30px;\n\tborder: 0;\n\tbox-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;\n\tborder-radius: 2px;\n";
19
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
20
+ var small = emotion.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tmin-height: 0;\n\theight: 30px;\n\tborder: 0;\n\tbox-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;\n\tborder-radius: 2px;\n"])));
19
21
  var dark = function dark(_ref) {
20
22
  var theme = _ref.theme;
21
- return "\n\tbackground-color: " + (theme.colors ? theme.colors.backgroundColor : '') + ";\n\tborder-color: " + (theme.colors ? theme.colors.borderColor : '') + ";\n\tcolor: " + (theme.colors ? theme.colors.textColor : '') + ";\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: " + (theme.colors ? theme.colors.backgroundColor : '') + ";\n\t}\n";
23
+ return emotion.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tbackground-color: ", ";\n\tborder-color: ", ";\n\tcolor: ", ";\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: ", ";\n\t}\n"])), theme.colors.backgroundColor, theme.colors.borderColor, theme.colors.textColor, theme.colors.backgroundColor);
22
24
  };
23
- var Select = vueEmotion.styled('button')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 42px;\n\tborder-radius: 0;\n\toutline: none;\n\tpadding: 5px 12px;\n\tfont-size: 0.9rem;\n\tline-height: 1.2rem;\n\tbackground-color: #fff;\n\tborder: 1px solid #ccc;\n\tcolor: #424242;\n\tcursor: pointer;\n\tuser-select: none;\n\ttransition: all 0.3s ease;\n\n\t", ";\n\n\t& > div {\n\t\twidth: calc(100% - 24px);\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\ttext-align: left;\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: #fcfcfc;\n\t}\n\n\t", ";\n"])), function (props) {
25
+ var Select = styled__default('button')(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 42px;\n\tborder-radius: 0;\n\toutline: none;\n\tpadding: 5px 12px;\n\tfont-size: 0.9rem;\n\tline-height: 1.2rem;\n\tbackground-color: #fff;\n\tborder: 1px solid #ccc;\n\tcolor: #424242;\n\tcursor: pointer;\n\tuser-select: none;\n\ttransition: all 0.3s ease;\n\n\t", ";\n\n\t& > div {\n\t\twidth: calc(100% - 24px);\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\ttext-align: left;\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: #fcfcfc;\n\t}\n\n\t", ";\n"])), function (props) {
24
26
  return props.small ? small : null;
25
27
  }, function (_ref2) {
26
28
  var themePreset = _ref2.themePreset;
27
29
  return themePreset === 'dark' && dark;
28
30
  });
29
- var Tick = vueEmotion.styled('span')(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: inline-block;\n\tposition: relative;\n\tuser-select: none;\n\talign-items: center;\n\n\t&::after {\n\t\tbox-sizing: content-box;\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tbackground-color: transparent;\n\t\ttop: 50%;\n\t\tleft: 0;\n\t\twidth: 8px;\n\t\theight: 4px;\n\t\tmargin-top: -4px;\n\t\tborder-style: solid;\n\t\tborder-color: ", ";\n\t\tborder-width: 0 0 2px 2px;\n\t\tborder-radius: 0;\n\t\tborder-image: none;\n\t\ttransform: rotate(-45deg) scale(1);\n\t\ttransition: all 200ms ease-out;\n\t}\n"])), function (_ref3) {
31
+ var Tick = styled__default('span')(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: inline-block;\n\tposition: relative;\n\tuser-select: none;\n\talign-items: center;\n\n\t&::after {\n\t\tbox-sizing: content-box;\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tbackground-color: transparent;\n\t\ttop: 50%;\n\t\tleft: 0;\n\t\twidth: 8px;\n\t\theight: 4px;\n\t\tmargin-top: -4px;\n\t\tborder-style: solid;\n\t\tborder-color: ", ";\n\t\tborder-width: 0 0 2px 2px;\n\t\tborder-radius: 0;\n\t\tborder-image: none;\n\t\ttransform: rotate(-45deg) scale(1);\n\t\ttransition: all 200ms ease-out;\n\t}\n"])), function (_ref3) {
30
32
  var theme = _ref3.theme;
31
33
  return theme.colors.primaryColor;
32
34
  });
33
35
 
34
- var _templateObject$1;
35
- var open = "\n\ttop: 0.55em;\n\ttransform: rotate(-45deg);\n";
36
- var Chevron = vueEmotion.styled('span')(_templateObject$1 || (_templateObject$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t&::before {\n\t\tcontent: '';\n\t\tborder-style: solid;\n\t\tborder-width: 0.15em 0.15em 0 0;\n\t\tdisplay: inline-block;\n\t\theight: 0.45em;\n\t\tposition: relative;\n\t\ttop: 0.35em;\n\t\tleft: 0;\n\t\ttransform: rotate(135deg);\n\t\tvertical-align: top;\n\t\twidth: 0.45em;\n\n\t\t", ";\n\t}\n"])), function (props) {
36
+ var _templateObject$1, _templateObject2$1;
37
+ var open = emotion.css(_templateObject$1 || (_templateObject$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\ttop: 0.55em;\n\ttransform: rotate(-45deg);\n"])));
38
+ var Chevron = styled__default('span')(_templateObject2$1 || (_templateObject2$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t&::before {\n\t\tcontent: '';\n\t\tborder-style: solid;\n\t\tborder-width: 0.15em 0.15em 0 0;\n\t\tdisplay: inline-block;\n\t\theight: 0.45em;\n\t\tposition: relative;\n\t\ttop: 0.35em;\n\t\tleft: 0;\n\t\ttransform: rotate(135deg);\n\t\tvertical-align: top;\n\t\twidth: 0.45em;\n\n\t\t", ";\n\t}\n"])), function (props) {
37
39
  return props.open ? open : null;
38
40
  });
39
41
 
@@ -78,6 +80,7 @@ var Dropdown = {
78
80
  },
79
81
  render: function render() {
80
82
  var _this = this;
83
+ var h = arguments[0];
81
84
  var _this$$props = this.$props,
82
85
  items = _this$$props.items,
83
86
  selectedItem = _this$$props.selectedItem,
@@ -104,11 +107,13 @@ var Dropdown = {
104
107
  }
105
108
  return false;
106
109
  });
107
- return vue.createVNode(CancelSvg.Downshift, {
108
- "isOpen": this.$data.isOpen,
109
- "selectedItem": selectedItem,
110
- "handleChange": this.onChange,
111
- "handleMouseup": this.handleStateChange,
110
+ return h(CancelSvg.Downshift, {
111
+ "attrs": {
112
+ "isOpen": this.$data.isOpen,
113
+ "selectedItem": selectedItem,
114
+ "handleChange": this.onChange,
115
+ "handleMouseup": this.handleStateChange
116
+ },
112
117
  "scopedSlots": {
113
118
  "default": function _default(_ref) {
114
119
  var getItemProps = _ref.getItemProps,
@@ -117,30 +122,29 @@ var Dropdown = {
117
122
  getButtonProps = _ref.getButtonProps,
118
123
  getItemEvents = _ref.getItemEvents,
119
124
  getInputEvents = _ref.getInputEvents;
120
- return vue.createVNode("div", {
125
+ return h("div", {
121
126
  "class": Input.suggestionsContainer
122
- }, [vue.createVNode(Select, vue.mergeProps({
123
- on: _rollupPluginBabelHelpers._extends({}, getButtonProps({
127
+ }, [h(Select, {
128
+ "on": _rollupPluginBabelHelpers._extends({}, _rollupPluginBabelHelpers._extends({}, getButtonProps({
124
129
  onClick: _this.toggle
125
- }))
126
- }, {
130
+ }))),
127
131
  "class": getClassName(_this.$props.innerClass, 'select') || '',
128
- "title": selectedItem ? _this.renderToString(selectedItem) : placeholder,
129
- "small": _this.$props.small,
130
- "themePreset": _this.$props.themePreset
131
- }), {
132
- "default": function _default() {
133
- return [customLabelRenderer ? customLabelRenderer(selectedItem) : vue.createVNode("div", null, [selectedItem ? _this.renderToString(selectedItem) : placeholder]), vue.createVNode(Chevron, {
134
- "open": isOpen
135
- }, null)];
132
+ "attrs": {
133
+ "title": selectedItem ? _this.renderToString(selectedItem) : placeholder,
134
+ "small": _this.$props.small,
135
+ "themePreset": _this.$props.themePreset
136
136
  }
137
- }), hasCustomRenderer ? customRenderer(itemsToRender, {
137
+ }, [customLabelRenderer ? customLabelRenderer(selectedItem) : h("div", [selectedItem ? _this.renderToString(selectedItem) : placeholder]), h(Chevron, {
138
+ "attrs": {
139
+ "open": isOpen
140
+ }
141
+ })]), hasCustomRenderer ? customRenderer(itemsToRender, {
138
142
  getItemProps: getItemProps,
139
143
  isOpen: isOpen,
140
144
  highlightedIndex: highlightedIndex,
141
145
  getButtonProps: getButtonProps,
142
146
  getItemEvents: getItemEvents
143
- }) : isOpen && itemsToRender.length ? vue.createVNode("ul", {
147
+ }) : isOpen && itemsToRender.length ? h("ul", {
144
148
  "class": Input.suggestions(themePreset, _this.theme) + " " + (_this.$props.small ? 'small' : '') + " " + getClassName(_this.$props.innerClass, 'list')
145
149
  }, [_this.$props.showSearch ? _this.renderSearchbox({
146
150
  on: {
@@ -155,35 +159,35 @@ var Dropdown = {
155
159
  return value[labelField] === item[labelField];
156
160
  }));
157
161
  if (!_this.$props.multi) selected = item.key === selectedItem;
158
- return vue.createVNode("li", vue.mergeProps({
159
- domProps: getItemProps({
162
+ return h("li", {
163
+ "domProps": _rollupPluginBabelHelpers._extends({}, getItemProps({
160
164
  item: item
161
- })
162
- }, {
163
- on: getItemEvents({
165
+ })),
166
+ "on": _rollupPluginBabelHelpers._extends({}, getItemEvents({
164
167
  item: item
165
- })
166
- }, {
168
+ })),
167
169
  "key": item[keyField],
168
170
  "class": "" + (selected ? 'active' : ''),
169
171
  "style": {
170
172
  backgroundColor: _this.getBackgroundColor(highlightedIndex === index, selected)
171
173
  }
172
- }), [renderItem ? renderItem({
174
+ }, [renderItem ? renderItem({
173
175
  label: item[labelField],
174
176
  count: item.doc_count,
175
177
  isChecked: selected && _this.$props.multi
176
- }) : vue.createVNode("div", null, [typeof item[labelField] === 'string' ? vue.createVNode("span", {
177
- "domPropsInnerHTML": item[labelField]
178
- }, null) : item[labelField], _this.$props.showCount && item.doc_count && vue.createVNode("span", {
178
+ }) : h("div", [typeof item[labelField] === 'string' ? h("span", {
179
+ "domProps": {
180
+ "innerHTML": item[labelField]
181
+ }
182
+ }) : item[labelField], _this.$props.showCount && item.doc_count && h("span", {
179
183
  "class": getClassName(_this.$props.innerClass, 'count') || ''
180
- }, [vue.createTextVNode("\xA0("), item.doc_count, vue.createTextVNode(")")])]), selected && _this.$props.multi ? vue.createVNode(Tick, {
184
+ }, ["\xA0(", item.doc_count, ")"])]), selected && _this.$props.multi ? h(Tick, {
181
185
  "class": getClassName(_this.$props.innerClass, 'icon') || ''
182
- }, null) : null]);
186
+ }) : null]);
183
187
  }), footer]) : null]);
184
188
  }
185
189
  }
186
- }, null);
190
+ });
187
191
  },
188
192
  methods: {
189
193
  toggle: function toggle() {
@@ -251,52 +255,49 @@ var Dropdown = {
251
255
  return value;
252
256
  },
253
257
  renderNoResult: function renderNoResult() {
254
- var renderNoResults = this.$slots.renderNoResults || this.$props.renderNoResults;
255
- return vue.createVNode("p", {
258
+ var h = this.$createElement;
259
+ var renderNoResults = this.$scopedSlots.renderNoResults || this.$props.renderNoResults;
260
+ return h("p", {
256
261
  "class": getClassName(this.$props.innerClass, 'noResults') || null
257
262
  }, [index.isFunction(renderNoResults) ? renderNoResults() : renderNoResults]);
258
263
  },
259
264
  renderSearchbox: function renderSearchbox(eventObject) {
260
- var _this3 = this;
265
+ var h = this.$createElement;
261
266
  var _this$$props2 = this.$props,
262
267
  componentId = _this$$props2.componentId,
263
268
  searchPlaceholder = _this$$props2.searchPlaceholder,
264
269
  showClear = _this$$props2.showClear,
265
270
  themePreset = _this$$props2.themePreset,
266
271
  innerClass = _this$$props2.innerClass;
267
- var InputComponent = vue.createVNode(Input.Input, vue.mergeProps({
268
- "id": componentId + "-input",
272
+ var InputComponent = h(Input.Input, _mergeJSXProps([{
273
+ "attrs": {
274
+ "id": componentId + "-input",
275
+ "showIcon": false,
276
+ "showClear": showClear,
277
+ "placeholder": searchPlaceholder,
278
+ "value": this.$data.searchTerm,
279
+ "themePreset": themePreset
280
+ },
269
281
  "style": {
270
282
  border: 0,
271
283
  borderBottom: '1px solid #ddd'
272
284
  },
273
- "showIcon": false,
274
- "showClear": showClear,
275
- "class": getClassName(innerClass, 'input'),
276
- "placeholder": searchPlaceholder,
277
- "value": this.$data.searchTerm,
278
- "themePreset": themePreset
279
- }, eventObject), null);
285
+ "class": getClassName(innerClass, 'input')
286
+ }, eventObject]));
280
287
  if (showClear) {
281
- return vue.createVNode(CancelSvg.InputWrapper, null, {
282
- "default": function _default() {
283
- return [InputComponent, _this3.searchTerm && vue.createVNode(CancelSvg.IconGroup, {
284
- "groupPosition": "right",
285
- "positionType": "absolute"
286
- }, {
287
- "default": function _default() {
288
- return [vue.createVNode(CancelSvg.IconWrapper, {
289
- "onClick": _this3.clearSearchTerm,
290
- "isClearIcon": true
291
- }, {
292
- "default": function _default() {
293
- return [vue.createVNode(CancelSvg.CancelSvg, null, null)];
294
- }
295
- })];
296
- }
297
- })];
288
+ return h(CancelSvg.InputWrapper, [InputComponent, this.searchTerm && h(CancelSvg.IconGroup, {
289
+ "attrs": {
290
+ "groupPosition": "right",
291
+ "positionType": "absolute"
298
292
  }
299
- });
293
+ }, [h(CancelSvg.IconWrapper, {
294
+ "on": {
295
+ "click": this.clearSearchTerm
296
+ },
297
+ "attrs": {
298
+ "isClearIcon": true
299
+ }
300
+ }, [h(CancelSvg.CancelSvg)])])]);
300
301
  }
301
302
  return InputComponent;
302
303
  }
@@ -7,18 +7,17 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
7
7
  var configureStore = require('@appbaseio/reactivecore');
8
8
  var configureStore__default = _interopDefault(configureStore);
9
9
  var constants = require('@appbaseio/reactivecore/lib/utils/constants');
10
- require('./_rollupPluginBabelHelpers-f8b843f8.js');
11
- var vue = require('vue');
10
+ var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
12
11
  var VueTypes = _interopDefault(require('vue-types'));
13
12
  require('@appbaseio/vue-emotion');
14
- var vueTypes = require('./vueTypes-621a8143.js');
13
+ var vueTypes = require('./vueTypes-b7007f5f.js');
15
14
  require('redux');
16
- var index = require('./index-dc25b706.js');
17
- var PreferencesConsumer = require('./PreferencesConsumer-034c55e3.js');
18
- var Title = require('./Title-8802a218.js');
19
- var Container = require('./Container-29f049b2.js');
15
+ var index = require('./index-de136c17.js');
16
+ var PreferencesConsumer = require('./PreferencesConsumer-5e6e84a2.js');
17
+ var Title = require('./Title-16042ea0.js');
18
+ var Container = require('./Container-e699ea95.js');
20
19
  var NoSSR = _interopDefault(require('vue-no-ssr'));
21
- var ssr = require('./ssr-eb901d09.js');
20
+ var ssr = require('./ssr-f2fc1bf6.js');
22
21
 
23
22
  var addComponent = configureStore.Actions.addComponent,
24
23
  removeComponent = configureStore.Actions.removeComponent,
@@ -70,6 +69,7 @@ var DynamicRangeSlider = {
70
69
  },
71
70
  created: function created() {
72
71
  var _this = this;
72
+ this.$timestamp = new Date().getTime();
73
73
  var onQueryChange = function onQueryChange() {
74
74
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
75
75
  args[_key] = arguments[_key];
@@ -98,8 +98,8 @@ var DynamicRangeSlider = {
98
98
  }
99
99
  var value = this.$props.value;
100
100
  if (this.destroyOnUnmount || components.indexOf(this.componentId) === -1) {
101
- this.addComponent(this.componentId);
102
- this.addComponent(this.internalRangeComponent);
101
+ this.addComponent(this.componentId, this.$timestamp);
102
+ this.addComponent(this.internalRangeComponent, this.$timestamp);
103
103
  if (Array.isArray(this.selectedValue)) {
104
104
  this.handleChange(this.selectedValue);
105
105
  } else if (this.selectedValue) {
@@ -117,7 +117,7 @@ var DynamicRangeSlider = {
117
117
  this.setDefaultValue(this.range);
118
118
  }
119
119
  },
120
- beforeUnmount: function beforeUnmount() {
120
+ beforeDestroy: function beforeDestroy() {
121
121
  if (this.destroyOnUnmount) {
122
122
  this.removeComponent(this.$props.componentId);
123
123
  this.removeComponent(this.internalRangeComponent);
@@ -125,7 +125,7 @@ var DynamicRangeSlider = {
125
125
  },
126
126
  methods: {
127
127
  isControlled: function isControlled() {
128
- if (this.$props.value && this.$attrs) {
128
+ if (this.$props.value && this.$listeners) {
129
129
  return true;
130
130
  }
131
131
  return false;
@@ -304,54 +304,41 @@ var DynamicRangeSlider = {
304
304
  }
305
305
  },
306
306
  render: function render() {
307
- var _this4 = this;
307
+ var h = arguments[0];
308
308
  if (!this.range || !this.currentValue) {
309
309
  return null;
310
310
  }
311
311
  var _this$range = this.range,
312
312
  start = _this$range.start,
313
313
  end = _this$range.end;
314
- return vue.createVNode(Container.Container, {
314
+ return h(Container.Container, {
315
315
  "class": this.$props.className
316
- }, {
317
- "default": function _default() {
318
- return [_this4.$props.title && vue.createVNode(Title.Title, {
319
- "class": getClassName(_this4.$props.innerClass, 'title')
320
- }, {
321
- "default": function _default() {
322
- return [_this4.$props.title];
323
- }
324
- }), vue.createVNode(NoSSR, null, {
325
- "default": function _default() {
326
- return [vue.createVNode(ssr.Slider, {
327
- "class": getClassName(_this4.$props.innerClass, 'slider')
328
- }, {
329
- "default": function _default() {
330
- return [vue.createVNode(vue.resolveComponent("vue-slider-component"), vue.mergeProps({
331
- "ref": "slider",
332
- "value": [Math.floor(Math.max(start, _this4.currentValue[0])), Math.ceil(Math.min(end, _this4.currentValue[1]))],
333
- "min": Math.floor(Math.min(start, _this4.currentValue[0])),
334
- "max": Math.ceil(Math.max(end, _this4.currentValue[1])),
335
- "onDrag-end": _this4.handleSlider,
336
- "dotSize": 20,
337
- "height": 4,
338
- "enable-cross": false,
339
- "tooltip": "always"
340
- }, {
341
- props: _this4.$props.sliderOptions
342
- }), null), _this4.labels ? vue.createVNode("div", {
343
- "class": "label-container"
344
- }, [vue.createVNode("label", {
345
- "class": getClassName(_this4.$props.innerClass, 'label') || 'range-label-left'
346
- }, [_this4.labels.start]), vue.createVNode("label", {
347
- "class": getClassName(_this4.$props.innerClass, 'label') || 'range-label-right'
348
- }, [_this4.labels.end])]) : null];
349
- }
350
- })];
351
- }
352
- })];
353
- }
354
- });
316
+ }, [this.$props.title && h(Title.Title, {
317
+ "class": getClassName(this.$props.innerClass, 'title')
318
+ }, [this.$props.title]), h(NoSSR, [h(ssr.Slider, {
319
+ "class": getClassName(this.$props.innerClass, 'slider')
320
+ }, [h("vue-slider-component", {
321
+ "ref": "slider",
322
+ "attrs": {
323
+ "value": [Math.floor(Math.max(start, this.currentValue[0])), Math.ceil(Math.min(end, this.currentValue[1]))],
324
+ "min": Math.floor(Math.min(start, this.currentValue[0])),
325
+ "max": Math.ceil(Math.max(end, this.currentValue[1])),
326
+ "dotSize": 20,
327
+ "height": 4,
328
+ "enable-cross": false,
329
+ "tooltip": "always"
330
+ },
331
+ "on": {
332
+ "drag-end": this.handleSlider
333
+ },
334
+ "props": _rollupPluginBabelHelpers._extends({}, this.$props.sliderOptions)
335
+ }), this.labels ? h("div", {
336
+ "class": "label-container"
337
+ }, [h("label", {
338
+ "class": getClassName(this.$props.innerClass, 'label') || 'range-label-left'
339
+ }, [this.labels.start]), h("label", {
340
+ "class": getClassName(this.$props.innerClass, 'label') || 'range-label-right'
341
+ }, [this.labels.end])]) : null])])]);
355
342
  }
356
343
  };
357
344
  DynamicRangeSlider.defaultQuery = function (values, props) {
@@ -425,13 +412,16 @@ var mapDispatchtoProps = {
425
412
  updateComponentProps: updateComponentProps
426
413
  };
427
414
  var RangeConnected = PreferencesConsumer.PreferencesConsumer(index.connect(mapStateToProps, mapDispatchtoProps)(DynamicRangeSlider));
415
+ RangeConnected.defaultQuery = DynamicRangeSlider.defaultQuery;
416
+ RangeConnected.parseValue = DynamicRangeSlider.parseValue;
417
+ RangeConnected.hasInternalComponent = DynamicRangeSlider.hasInternalComponent;
428
418
  RangeConnected.name = DynamicRangeSlider.name;
429
- RangeConnected.install = function (Vue) {
430
- Vue.component(RangeConnected.name, RangeConnected);
431
- };
432
419
 
433
420
  // Add componentType for SSR
434
421
  RangeConnected.componentType = constants.componentTypes.dynamicRangeSlider;
422
+ RangeConnected.install = function (Vue) {
423
+ Vue.component(RangeConnected.name, RangeConnected);
424
+ };
435
425
 
436
426
  exports.RangeConnected = RangeConnected;
437
427
  exports.default = RangeConnected;
@@ -0,0 +1,50 @@
1
+ 'use strict';
2
+
3
+ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
+
5
+ var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
6
+ var emotion = require('emotion');
7
+ var styled = require('@appbaseio/vue-emotion');
8
+ var styled__default = _interopDefault(styled);
9
+ var polished = require('polished');
10
+
11
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
12
+ var leftLabel = emotion.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tflex-direction: row;\n\talign-items: center;\n"])));
13
+ var rightLabel = emotion.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tflex-direction: row-reverse;\n\talign-items: center;\n"])));
14
+ var topLabel = emotion.css(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tflex-direction: column;\n"])));
15
+ var bottomLabel = emotion.css(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tflex-direction: column-reverse;\n"])));
16
+ var border = function border(_ref) {
17
+ var colors = _ref.theme.colors;
18
+ return emotion.css(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tborder: 1px solid ", ";\n"])), colors.borderColor || '#ccc');
19
+ };
20
+ var Flex = styled__default('div')(_templateObject6 || (_templateObject6 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: ", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\n\tsvg.cancel-icon {\n\t\tcursor: pointer;\n\t\tfill: ", ";\n\t\tflex-basis: 30px;\n\n\t\t&:hover {\n\t\t\tfill: ", ";\n\t\t}\n\t}\n"])), function (props) {
21
+ return props.inline ? 'inline-flex' : 'flex';
22
+ }, function (props) {
23
+ return (props.labelPosition === 'left' || props.iconPosition === 'right') && leftLabel;
24
+ }, function (props) {
25
+ return (props.labelPosition === 'right' || props.iconPosition === 'left') && rightLabel;
26
+ }, function (props) {
27
+ return props.labelPosition === 'top' && topLabel;
28
+ }, function (props) {
29
+ return props.labelPosition === 'bottom' && bottomLabel;
30
+ }, function (props) {
31
+ return props.showBorder && border;
32
+ }, function (props) {
33
+ return props.justifyContent && emotion.css(_templateObject7 || (_templateObject7 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tjustify-content: ", ";\n\t\t"])), props.justifyContent);
34
+ }, function (props) {
35
+ return props.alignItems && emotion.css(_templateObject8 || (_templateObject8 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\talign-items: ", ";\n\t\t"])), props.alignItems);
36
+ }, function (props) {
37
+ return props.flex && emotion.css(_templateObject9 || (_templateObject9 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tflex: ", ";\n\t\t"])), props.flex);
38
+ }, function (props) {
39
+ return props.direction && emotion.css(_templateObject10 || (_templateObject10 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tflex-direction: ", ";\n\t\t"])), props.direction);
40
+ }, function (props) {
41
+ return props.basis && emotion.css(_templateObject11 || (_templateObject11 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tflex-basis: ", ";\n\t\t"])), props.basis);
42
+ }, function (_ref2) {
43
+ var colors = _ref2.theme.colors;
44
+ return colors.borderColor || polished.lighten(0.3, colors.textColor);
45
+ }, function (_ref3) {
46
+ var theme = _ref3.theme;
47
+ return theme.colors.textColor;
48
+ });
49
+
50
+ exports.Flex = Flex;
@@ -0,0 +1,45 @@
1
+ 'use strict';
2
+
3
+ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
+
5
+ var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
6
+ var emotion = require('emotion');
7
+ var styled = require('@appbaseio/vue-emotion');
8
+ var styled__default = _interopDefault(styled);
9
+ var polished = require('polished');
10
+
11
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
12
+ var item = {
13
+ width: '15px',
14
+ height: '15px',
15
+ scale: '4px'
16
+ };
17
+ var vh = emotion.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tborder: 0;\n\tclip: rect(1px, 1px, 1px, 1px);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tpadding: 0;\n\tposition: absolute;\n\twidth: 1px;\n\twhite-space: nowrap;\n"])));
18
+ var hideInputControl = emotion.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t+ label {\n\t\tpadding-left: 0;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\twidth: 0;\n\t\t\theight: 0;\n\t\t\tborder: 0;\n\t\t\tmargin: 0;\n\t\t\tvisibility: hidden;\n\t\t}\n\t}\n\n\t&:checked {\n\t\t+ label {\n\t\t\tfont-weight: bold;\n\t\t}\n\t}\n"])));
19
+ var formItem = function formItem(_ref) {
20
+ var theme = _ref.theme;
21
+ return emotion.css(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t", ";\n\n\t&:focus {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tbox-shadow: 0 0 0 2px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t&:hover {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tborder-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t&:active {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\ttransition-duration: 0;\n\t\t\t}\n\t\t}\n\t}\n\n\t+ label {\n\t\tposition: relative;\n\t\tuser-select: none;\n\t\tdisplay: flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\talign-items: center;\n\t\tcursor: pointer;\n\n\t\t&::before {\n\t\t\tbackground-color: #fff;\n\t\t\tborder: 1px solid ", ";\n\t\t\tbox-sizing: content-box;\n\t\t\tcontent: '';\n\t\t\tcolor: ", ";\n\t\t\tmargin-right: calc(", " * 0.5);\n\t\t\ttop: 50%;\n\t\t\tleft: 0;\n\t\t\twidth: ", ";\n\t\t\theight: ", ";\n\t\t\tdisplay: inline-block;\n\t\t\tvertical-align: middle;\n\t\t}\n\n\t\t&::after {\n\t\t\tbox-sizing: content-box;\n\t\t\tcontent: '';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\ttop: 50%;\n\t\t\tleft: calc(1px + ", " / 2);\n\t\t\twidth: calc(", " - ", ");\n\t\t\theight: calc(", " - ", ");\n\t\t\tmargin-top: calc(", " / -2 - ", " / -2);\n\t\t\ttransform: scale(0);\n\t\t\ttransform-origin: 50%;\n\t\t\ttransition: transform 200ms ease-out;\n\t\t}\n\t}\n"])), vh, polished.lighten(0.4, theme.colors.primaryColor), theme.colors.primaryColor, theme.colors.borderColor || polished.lighten(0.1, theme.colors.textColor), theme.colors.primaryColor, item.width, item.width, item.height, theme.colors.primaryColor, item.scale, item.width, item.scale, item.height, item.scale, item.height, item.scale);
22
+ };
23
+ var Radio = styled__default('input')(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t+ label {\n\t\t&::before,\n\t\t&::after {\n\t\t\tborder-radius: 50%;\n\t\t}\n\t}\n\n\t&:checked {\n\t\t&:active,\n\t\t&:focus {\n\t\t\t+ label {\n\t\t\t\tcolor: ", ";\n\n\t\t\t\t&::before {\n\t\t\t\t\tanimation: none;\n\t\t\t\t\tfilter: none;\n\t\t\t\t\ttransition: none;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tanimation: none;\n\t\t\t\tbackground-color: #fff;\n\t\t\t\tborder-color: ", ";\n\t\t}\n\n\t\t&::after {\n\t\t\ttransform: scale(1);\n\t\t}\n\t}\n"])), formItem, function (props) {
24
+ return props.show ? null : hideInputControl;
25
+ }, function (_ref2) {
26
+ var theme = _ref2.theme;
27
+ return theme.colors.primaryColor;
28
+ }, function (_ref3) {
29
+ var theme = _ref3.theme;
30
+ return theme.colors.primaryColor;
31
+ });
32
+ var Checkbox = styled__default('input')(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t+ label {\n\t\t&::before,\n\t\t&::after {\n\t\t\tborder-radius: 0;\n\t\t}\n\n\t\t&::after {\n\t\t\tbackground-color: transparent;\n\t\t\ttop: 50%;\n\t\t\tleft: calc(1px + ", " / 5);\n\t\t\twidth: calc(", " / 2);\n\t\t\theight: calc(", " / 5);\n\t\t\tmargin-top: calc(", " / -2 / 2 * 0.8);\n\t\t\tborder-style: solid;\n\t\t\tborder-color: ", ";\n\t\t\tborder-width: 0 0 2px 2px;\n\t\t\tborder-radius: 0;\n\t\t\tborder-image: none;\n\t\t\ttransform: rotate(-45deg) scale(0);\n\t\t\ttransition: none;\n\t\t}\n\t}\n\n\t&:checked {\n\t\t+ label {\n\t\t\t&::before {\n\t\t\t\tborder-color: ", ";\n\t\t\t}\n\n\t\t\t&::after {\n\t\t\t\tcontent: '';\n\t\t\t\ttransform: rotate(-45deg) scale(1);\n\t\t\t\ttransition: transform 200ms ease-out;\n\t\t\t}\n\t\t}\n\t}\n"])), formItem, function (props) {
33
+ return props.show ? null : hideInputControl;
34
+ }, item.width, item.width, item.width, item.height, function (_ref4) {
35
+ var theme = _ref4.theme;
36
+ return theme.colors.primaryColor;
37
+ }, function (_ref5) {
38
+ var theme = _ref5.theme;
39
+ return theme.colors.primaryColor;
40
+ });
41
+ var UL = styled__default('ul')(_templateObject6 || (_templateObject6 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: 0;\n\tmax-height: 240px;\n\tposition: relative;\n\toverflow-y: auto;\n\tpadding-bottom: 12px;\n\n\tli {\n\t\theight 30px;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\talign-items: center;\n\t\tpadding-left: 2px;\n\t}\n"])));
42
+
43
+ exports.Checkbox = Checkbox;
44
+ exports.Radio = Radio;
45
+ exports.UL = UL;
@@ -0,0 +1,77 @@
1
+ 'use strict';
2
+
3
+ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
+
5
+ var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
6
+ var emotion = require('emotion');
7
+ var styled = require('@appbaseio/vue-emotion');
8
+ var styled__default = _interopDefault(styled);
9
+
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
11
+ var alertBorder = function alertBorder(_ref) {
12
+ var theme = _ref.theme;
13
+ return emotion.css(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tborder: 1px solid ", ";\n"])), theme.colors.alertColor);
14
+ };
15
+ var input = emotion.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\tline-height: 1.5;\n\tmin-height: 42px;\n\tpadding: 8px 12px;\n\tborder: 1px solid #ccc;\n\tbackground-color: #fafafa;\n\tfont-size: 0.9rem;\n\toutline: none;\n\theight: 100%;\n\n\t&:focus {\n\t\tbackground-color: #fff;\n\t}\n"])));
16
+ var dark = function dark(theme) {
17
+ return emotion.css(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tborder-color: ", ";\n"])), theme.colors.borderColor);
18
+ };
19
+ var darkInput = function darkInput(_ref2) {
20
+ var theme = _ref2.theme;
21
+ return emotion.css(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\t", ";\n\n\t&:focus {\n\t\tbackground-color: ", ";\n\t}\n"])), theme.colors.backgroundColor, theme.colors.textColor, dark(theme), theme.colors.backgroundColor);
22
+ };
23
+ var Input = styled__default('input')(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n"])), input, function (_ref3) {
24
+ var themePreset = _ref3.themePreset,
25
+ theme = _ref3.theme;
26
+ return themePreset === 'dark' && darkInput({
27
+ theme: theme
28
+ });
29
+ }, function (props) {
30
+ return props.showIcon && props.iconPosition === 'left' && emotion.css(_templateObject6 || (_templateObject6 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-left: 36px;\n\t\t"])));
31
+ }, function (props) {
32
+ return props.showIcon && props.iconPosition === 'right' && emotion.css(_templateObject7 || (_templateObject7 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 36px;\n\t\t"])));
33
+ }, function (props) {
34
+ return (
35
+ // for clear icon
36
+ props.showClear && emotion.css(_templateObject8 || (_templateObject8 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 36px;\n\t\t"])))
37
+ );
38
+ }, function (props) {
39
+ return (
40
+ // for voice search icon
41
+ props.showVoiceSearch && emotion.css(_templateObject9 || (_templateObject9 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 36px;\n\t\t"])))
42
+ );
43
+ }, function (props) {
44
+ return (
45
+ // for clear icon with search icon
46
+ props.showClear && props.showIcon && props.iconPosition === 'right' && emotion.css(_templateObject10 || (_templateObject10 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 66px;\n\t\t"])))
47
+ );
48
+ }, function (props) {
49
+ return (
50
+ // for voice search icon with search icon
51
+ props.showVoiceSearch && props.showIcon && props.iconPosition === 'right' && emotion.css(_templateObject11 || (_templateObject11 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 66px;\n\t\t"])))
52
+ );
53
+ }, function (props) {
54
+ return (
55
+ // for voice search icon with clear icon
56
+ props.showVoiceSearch && props.showIcon && emotion.css(_templateObject12 || (_templateObject12 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 66px;\n\t\t"])))
57
+ );
58
+ }, function (props) {
59
+ return (
60
+ // for clear icon with search icon and voice search
61
+ props.showClear && props.showIcon && props.showVoiceSearch && props.iconPosition === 'right' && emotion.css(_templateObject13 || (_templateObject13 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\t\t\tpadding-right: 90px;\n\t\t"])))
62
+ );
63
+ }, function (props) {
64
+ return props.alert && alertBorder;
65
+ });
66
+ var suggestions = function suggestions(themePreset, theme) {
67
+ return emotion.css(_templateObject14 || (_templateObject14 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\twidth: 100%;\n\tborder: 1px solid #ccc;\n\tborder-top: none;\n\tbackground-color: #fff;\n\tfont-size: 0.9rem;\n\tz-index: 3;\n\tposition: absolute;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tmax-height: min(100vh, 402px);\n\toverflow-y: auto;\n\n\t&.small {\n\t\ttop: 30px;\n\t}\n\n\tli {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tcursor: pointer;\n\t\tpadding: 10px;\n\t\tuser-select: none;\n\n\t\t& > .trim {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tmax-height: 2.3rem;\n\t\t\tline-height: 1.2rem;\n\t\t\t-webkit-line-clamp: 2;\n\t\t\t-webkit-box-orient: vertical;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\twhite-space: nowrap;\n\t\t}\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbackground-color: #eee;\n\t\t}\n\t}\n\n\t", ";\n"])), themePreset === 'dark' && theme && dark(theme));
68
+ };
69
+ var suggestionsContainer = emotion.css(_templateObject15 || (_templateObject15 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tposition: relative;\n\t.cancel-icon {\n\t\tcursor: pointer;\n\t}\n"])));
70
+ var noSuggestions = function noSuggestions(themePreset, theme) {
71
+ return emotion.css(_templateObject16 || (_templateObject16 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\twidth: 100%;\n\tborder: 1px solid #ccc;\n\tborder-top: none;\n\tbackground-color: #fff;\n\tfont-size: 0.9rem;\n\tz-index: 3;\n\tposition: absolute;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\n\t&.small {\n\t\ttop: 30px;\n\t}\n\n\tli {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tpadding: 10px;\n\t\tuser-select: none;\n\n\t\t& > .trim {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tmax-height: 2.3rem;\n\t\t\tline-height: 1.2rem;\n\t\t\t-webkit-line-clamp: 2;\n\t\t\t-webkit-box-orient: vertical;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\twhite-space: nowrap;\n\t\t}\n\t}\n\n\t", "\n"])), themePreset === 'dark' && theme && dark(theme));
72
+ };
73
+
74
+ exports.Input = Input;
75
+ exports.noSuggestions = noSuggestions;
76
+ exports.suggestions = suggestions;
77
+ exports.suggestionsContainer = suggestionsContainer;