@bento-core/query-bar 1.0.1-icdc.16 → 1.0.1-icdc.18

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 (10) hide show
  1. package/README.md +1 -21
  2. package/dist/components/CheckboxFilter.js +4 -10
  3. package/dist/components/QueryUrl.js +1 -0
  4. package/dist/generators/QueryBarGenerator.js +9 -28
  5. package/dist/generators/config.js +0 -14
  6. package/package.json +1 -1
  7. package/src/components/CheckboxFilter.js +8 -21
  8. package/src/components/QueryUrl.js +1 -0
  9. package/src/generators/QueryBarGenerator.js +111 -153
  10. package/src/generators/config.js +0 -14
package/README.md CHANGED
@@ -63,25 +63,6 @@ const CONFIG = {
63
63
  * @var {boolean}
64
64
  */
65
65
  displayAllActiveFilters: false,
66
- /**
67
- * key to access label text
68
- * @var {boolean}
69
- */
70
- group: 'group',
71
-
72
- /**
73
- * root path of bento app {window.location.href} or react PUBLIC_URL
74
- * PR (https://github.com/CBIIT/bento-icdc-frontend/pull/953)
75
- * @var {string}
76
- */
77
- rootPath: null,
78
- /**
79
- * display query URL
80
- * @var {boolean}
81
- * PR (https://github.com/CBIIT/bento-icdc-frontend/pull/953)
82
- */
83
- viewQueryURL: false,
84
-
85
66
  },
86
67
 
87
68
  /* Component Helper Functions */
@@ -139,7 +120,6 @@ const CONFIG = {
139
120
  * @returns {void}
140
121
  */
141
122
  resetFacetSlider: (section) => {},
142
-
143
123
  },
144
124
  };
145
125
  ```
@@ -164,4 +144,4 @@ This component, which is generated by the provided generator, accepts the follow
164
144
  />
165
145
  ```
166
146
 
167
- > **Warning**: The `statusReducer` prop requires the dashboard API data merged with the `facetsConfig` property. Please see the example in the demo implementation [here](https://github.com/CBIIT/bento-frontend/blob/7efd62cd3da0c29326e523055d30118244dc2f2f/packages/bento-frontend/src/pages/dashTemplate/filterQueryBar/QueryBarView.js#LL20C14-L20C14).
147
+ > **Warning**: The `statusReducer` prop requires the dashboard API data merged with the `facetsConfig` property. Please see the example in the demo implementation [here](https://github.com/CBIIT/bento-frontend/blob/7efd62cd3da0c29326e523055d30118244dc2f2f/packages/bento-frontend/src/pages/dashTemplate/filterQueryBar/QueryBarView.js#LL20C14-L20C14).
package/dist/components/CheckboxFilter.js CHANGED
@@ -16,20 +16,14 @@ var _default = _ref => {
16
16
  classes,
17
17
  maxItems,
18
18
  onSectionClick,
19
- onItemClick,
20
- displayAllActiveFilters
19
+ onItemClick
21
20
  } = _ref;
22
21
  const {
23
22
  items,
24
23
  section
25
24
  } = data;
26
- const [expand, setExpand] = (0, _react.useState)(false);
25
+ const [expand, setExpand] = (0, _react.useState)(true);
27
26
  const noOfItems = expand ? items.length : maxItems;
28
- (0, _react.useEffect)(() => {
29
- if (items.length <= maxItems && expand) {
30
- setExpand(!expand);
31
- }
32
- }, [items]);
33
27
  const clsName = function clsName() {
34
28
  let text = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
35
29
  let attr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -48,10 +42,10 @@ var _default = _ref => {
48
42
  className: (0, _clsx.default)(classes.filterCheckboxes, classes[clsName(section)]),
49
43
  key: idx,
50
44
  onClick: () => onItemClick(data, d)
51
- }, d), idx === maxItems - 1 ? null : ' ')), items.length > maxItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, displayAllActiveFilters ? /*#__PURE__*/_react.default.createElement("span", {
45
+ }, d), idx === maxItems - 1 ? null : ' ')), items.length > maxItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
52
46
  className: classes.expandBtn,
53
47
  onClick: () => setExpand(!expand)
54
- }, "...") : '...'), expand && items.length > maxItems && /*#__PURE__*/_react.default.createElement("span", {
48
+ }, "...")), expand && items.length > maxItems && /*#__PURE__*/_react.default.createElement("span", {
55
49
  className: classes.collapseBtn,
56
50
  onClick: () => setExpand(!expand)
57
51
  }, ' LESS'), items.length > 1 && /*#__PURE__*/_react.default.createElement("span", {
package/dist/components/QueryUrl.js CHANGED
@@ -112,6 +112,7 @@ const QueryUrl = _ref2 => {
112
112
  alt: "copy icon"
113
113
  }))))), /*#__PURE__*/_react.default.createElement(_core.Dialog, {
114
114
  open: open,
115
+ onClose: () => toggleOpen(!open),
115
116
  "aria-labelledby": "alert-dialog-title",
116
117
  "aria-describedby": "alert-dialog-description",
117
118
  className: (0, _clsx.default)(classes.dialogBox, 'dialogBox')
package/dist/generators/QueryBarGenerator.js CHANGED
@@ -40,11 +40,6 @@ const QueryBarGenerator = function QueryBarGenerator() {
40
40
  const maxItems = config && typeof config.maxItems === 'number' ? config.maxItems : _config.default.config.maxItems;
41
41
  const queryURLRootPath = config && typeof config.rootPath === 'string' ? config.rootPath : _config.default.config.rootPath;
42
42
  const viewQueryURL = config && typeof config.viewQueryURL === 'boolean' ? config.viewQueryURL : _config.default.config.viewQueryURL;
43
- const displayAllActiveFilters = config && typeof config.displayAllActiveFilters === 'boolean' ? config.displayAllActiveFilters : _config.default.config.displayAllActiveFilters;
44
-
45
- // const group = config && typeof config.group === 'string'
46
- // ? config.group : DEFAULT_CONFIG.config.group;
47
-
48
43
  const clearAll = functions && typeof functions.clearAll === 'function' ? functions.clearAll : _config.default.functions.clearAll;
49
44
  const clearUpload = functions && typeof functions.clearUpload === 'function' ? functions.clearUpload : _config.default.functions.clearUpload;
50
45
  const clearAutocomplete = functions && typeof functions.clearAutocomplete === 'function' ? functions.clearAutocomplete : _config.default.functions.clearAutocomplete;
@@ -69,7 +64,7 @@ const QueryBarGenerator = function QueryBarGenerator() {
69
64
  autocomplete,
70
65
  upload
71
66
  } = localFind;
72
- const [expand, setExpand] = (0, _react.useState)(false);
67
+ const [expand, setExpand] = (0, _react.useState)(true);
73
68
  const noOfItems = expand ? autocomplete.length : maxItems;
74
69
  (0, _react.useEffect)(() => {
75
70
  if (autocomplete.length <= maxItems && expand) {
@@ -88,16 +83,7 @@ const QueryBarGenerator = function QueryBarGenerator() {
88
83
  const itemKeys = Object.keys(items);
89
84
  itemKeys.sort((a, b) => a.localeCompare(b));
90
85
 
91
- /* Find any SELECTED CHECKBOXES that do NOT have any data
92
- * and remove them from the list of selected checkboxes artificially */
93
- // itemKeys.forEach((item) => {
94
- // if (data.findIndex((d) => d.group === item) < 0) {
95
- // itemKeys.splice(itemKeys.indexOf(item), 1);
96
- // }
97
- // });
98
-
99
86
  /**
100
- * commenting out line 89-93
101
87
  * to display all the active filters in the query bar
102
88
  * ICDC-3287
103
89
  */
@@ -110,21 +96,17 @@ const QueryBarGenerator = function QueryBarGenerator() {
110
96
  }
111
97
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
112
98
  className: classes.queryWrapper
113
- }, /*#__PURE__*/_react.default.createElement("div", null, config.useSpanForClearButton ? /*#__PURE__*/_react.default.createElement("span", {
114
- className: classes.clearQueryButton,
115
- onClick: clearAll
116
- }, "Clear") : /*#__PURE__*/_react.default.createElement(_core.Button, {
99
+ }, /*#__PURE__*/_react.default.createElement(_core.Button, {
117
100
  className: classes.clearQueryButton,
118
101
  color: "primary",
119
102
  variant: "outlined",
120
- onClick: clearAll,
121
- size: "small"
122
- }, "Clear"), /*#__PURE__*/_react.default.createElement("span", {
103
+ onClick: clearAll
104
+ }, "Clear Query"), /*#__PURE__*/_react.default.createElement("span", {
123
105
  className: classes.divider
124
106
  }), /*#__PURE__*/_react.default.createElement("span", {
125
107
  className: classes.queryContainer
126
108
  }, autocomplete.length || upload.length ? /*#__PURE__*/_react.default.createElement("span", null, upload.length && !autocomplete.length ? /*#__PURE__*/_react.default.createElement("span", {
127
- className: (0, _clsx.default)(classes.filterCheckboxes, classes.localFindBackground, classes.standAloneInputSet),
109
+ className: (0, _clsx.default)(classes.filterCheckboxes, classes.localFindBackground),
128
110
  onClick: clearUpload
129
111
  }, "INPUT CASE SET") : null, autocomplete.length ? /*#__PURE__*/_react.default.createElement("span", null, ' ', /*#__PURE__*/_react.default.createElement("span", {
130
112
  className: (0, _clsx.default)(classes.filterName, classes.localFindBackground),
@@ -140,10 +122,10 @@ const QueryBarGenerator = function QueryBarGenerator() {
140
122
  className: (0, _clsx.default)(classes.filterCheckboxes, classes.facetSectionCases),
141
123
  key: idx,
142
124
  onClick: () => deleteAutocompleteItem(d.title)
143
- }, d.title), idx === noOfItems - 1 ? null : ' ')), autocomplete.length > maxItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, displayAllActiveFilters ? /*#__PURE__*/_react.default.createElement("span", {
125
+ }, d.title), idx === noOfItems - 1 ? null : ' ')), autocomplete.length > maxItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
144
126
  className: classes.expandBtn,
145
127
  onClick: () => setExpand(!expand)
146
- }, "...") : '...'), expand && autocomplete.length > maxItems && /*#__PURE__*/_react.default.createElement("span", {
128
+ }, "...")), expand && autocomplete.length > maxItems && /*#__PURE__*/_react.default.createElement("span", {
147
129
  className: classes.collapseBtn,
148
130
  onClick: () => setExpand(!expand)
149
131
  }, ' LESS'), (upload.length > 0 ? 1 : 0) + autocomplete.length > 1 ? /*#__PURE__*/_react.default.createElement("span", {
@@ -157,16 +139,15 @@ const QueryBarGenerator = function QueryBarGenerator() {
157
139
  type: filter.type,
158
140
  data: filter,
159
141
  maxItems: maxItems,
160
- displayAllActiveFilters: displayAllActiveFilters,
161
142
  classes: classes,
162
143
  onSectionClick: filter.type === CHECKBOX ? resetFacetSection : resetFacetSlider,
163
144
  onItemClick: filter.type === CHECKBOX ? resetFacetCheckbox : resetFacetSlider
164
- }))))), viewQueryURL && queryURLRootPath && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_QueryUrl.default, {
145
+ })))), viewQueryURL && queryURLRootPath && /*#__PURE__*/_react.default.createElement(_QueryUrl.default, {
165
146
  classes: classes,
166
147
  localFind: localFind,
167
148
  filterItems: mappedInputs,
168
149
  rootPath: queryURLRootPath
169
- }))));
150
+ })));
170
151
  })
171
152
  };
172
153
  };
package/dist/generators/config.js CHANGED
@@ -18,20 +18,6 @@ var _default = {
18
18
  * @var {boolean}
19
19
  */
20
20
  displayAllActiveFilters: false,
21
- /**
22
- * key to access label text
23
- * @var {boolean}
24
- */
25
- group: 'group',
26
- /**
27
- * root path of bento app
28
- * @var {boolean}
29
- */
30
- rootPath: null,
31
- /**
32
- * display query URL
33
- * @var {boolean}
34
- */
35
21
  viewQueryURL: false
36
22
  },
37
23
  /* Component Helper Functions */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bento-core/query-bar",
3
- "version": "1.0.1-icdc.16",
3
+ "version": "1.0.1-icdc.18",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
package/src/components/CheckboxFilter.js CHANGED
@@ -1,21 +1,14 @@
1
- import React, { useEffect, useState } from 'react';
1
+ import React, { useState } from 'react';
2
2
  import clsx from 'clsx';
3
3
 
4
4
  export default ({
5
5
  index, data, classes, maxItems,
6
6
  onSectionClick, onItemClick,
7
- displayAllActiveFilters,
8
7
  }) => {
9
8
  const { items, section } = data;
10
- const [expand, setExpand] = useState(false);
9
+ const [expand, setExpand] = useState(true);
11
10
  const noOfItems = expand ? items.length : maxItems;
12
11
 
13
- useEffect(() => {
14
- if (items.length <= maxItems && expand) {
15
- setExpand(!expand);
16
- }
17
- }, [items]);
18
-
19
12
  const clsName = (text = '', attr = '') => `facetSection${text.replace(/\s+/g, '')}${attr}`;
20
13
 
21
14
  return (
@@ -51,18 +44,12 @@ export default ({
51
44
  ))}
52
45
  {items.length > maxItems && (
53
46
  <>
54
- {
55
- displayAllActiveFilters
56
- ? (
57
- <span
58
- className={classes.expandBtn}
59
- onClick={() => setExpand(!expand)}
60
- >
61
- ...
62
- </span>
63
- )
64
- : '...'
65
- }
47
+ <span
48
+ className={classes.expandBtn}
49
+ onClick={() => setExpand(!expand)}
50
+ >
51
+ ...
52
+ </span>
66
53
  </>
67
54
  )}
68
55
  {(expand && items.length > maxItems) && (
package/src/components/QueryUrl.js CHANGED
@@ -141,6 +141,7 @@ const QueryUrl = ({
141
141
  </div>
142
142
  <Dialog
143
143
  open={open}
144
+ onClose={() => toggleOpen(!open)}
144
145
  aria-labelledby="alert-dialog-title"
145
146
  aria-describedby="alert-dialog-description"
146
147
  className={clsx(classes.dialogBox, 'dialogBox')}
package/src/generators/QueryBarGenerator.js CHANGED
@@ -1,4 +1,3 @@
1
- /* eslint-disable */
2
1
  import React, { useState, useEffect } from 'react';
3
2
  import { withStyles, Button } from '@material-ui/core';
4
3
  import { InputTypes } from '@bento-core/facet-filter';
@@ -33,13 +32,6 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
33
32
  ? config.viewQueryURL
34
33
  : DEFAULT_CONFIG.config.viewQueryURL;
35
34
 
36
- const displayAllActiveFilters = config && typeof config.displayAllActiveFilters === 'boolean'
37
- ? config.displayAllActiveFilters
38
- : DEFAULT_CONFIG.config.displayAllActiveFilters;
39
-
40
- // const group = config && typeof config.group === 'string'
41
- // ? config.group : DEFAULT_CONFIG.config.group;
42
-
43
35
  const clearAll = functions && typeof functions.clearAll === 'function'
44
36
  ? functions.clearAll
45
37
  : DEFAULT_CONFIG.functions.clearAll;
@@ -76,7 +68,7 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
76
68
 
77
69
  const { autocomplete, upload } = localFind;
78
70
 
79
- const [expand, setExpand] = useState(false);
71
+ const [expand, setExpand] = useState(true);
80
72
  const noOfItems = expand ? autocomplete.length : maxItems;
81
73
 
82
74
  useEffect(() => {
@@ -94,16 +86,7 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
94
86
  const itemKeys = Object.keys(items);
95
87
  itemKeys.sort((a, b) => a.localeCompare(b));
96
88
 
97
- /* Find any SELECTED CHECKBOXES that do NOT have any data
98
- * and remove them from the list of selected checkboxes artificially */
99
- // itemKeys.forEach((item) => {
100
- // if (data.findIndex((d) => d.group === item) < 0) {
101
- // itemKeys.splice(itemKeys.indexOf(item), 1);
102
- // }
103
- // });
104
-
105
89
  /**
106
- * commenting out line 89-93
107
90
  * to display all the active filters in the query bar
108
91
  * ICDC-3287
109
92
  */
@@ -118,155 +101,130 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
118
101
  return (
119
102
  <>
120
103
  <div className={classes.queryWrapper}>
121
- <div>
122
- {
123
- config.useSpanForClearButton ? (
124
- <span className={classes.clearQueryButton} onClick={clearAll}>Clear</span>
125
- ) : (
126
- <Button
127
- className={classes.clearQueryButton}
128
- color="primary"
129
- variant="outlined"
130
- onClick={clearAll}
131
- size="small"
132
- >
133
- Clear
134
- </Button>
135
-
136
- )
137
- }
138
- <span className={classes.divider} />
139
- <span className={classes.queryContainer}>
140
- {/* Local Find Selections */}
141
- {/* TODO: Refactor this into a separate component */}
142
- {(autocomplete.length || upload.length) ? (
104
+ <Button
105
+ className={classes.clearQueryButton}
106
+ color="primary"
107
+ variant="outlined"
108
+ onClick={clearAll}
109
+ >
110
+ Clear Query
111
+ </Button>
112
+ <span className={classes.divider} />
113
+ <span className={classes.queryContainer}>
114
+ {/* Local Find Selections */}
115
+ {/* TODO: Refactor this into a separate component */}
116
+ {(autocomplete.length || upload.length) ? (
117
+ <span>
118
+ {/* Standalone case set button */}
119
+ {(upload.length && !autocomplete.length)
120
+ ? (
121
+ <span
122
+ className={clsx(classes.filterCheckboxes, classes.localFindBackground)}
123
+ onClick={clearUpload}
124
+ >
125
+ INPUT CASE SET
126
+ </span>
127
+ ) : null}
128
+ {autocomplete.length
129
+ ? (
130
+ <span>
131
+ {' '}
132
+ <span
133
+ className={clsx(classes.filterName, classes.localFindBackground)}
134
+ onClick={clearAutocomplete}
135
+ >
136
+ Case ID
137
+ </span>
138
+ {' '}
139
+ {' '}
140
+ <span className={classes.operators}>
141
+ {(autocomplete.length === 1 && !upload.length) ? 'IS ' : 'IN '}
142
+ </span>
143
+ </span>
144
+ ) : null}
143
145
  <span>
144
- {/* Standalone case set button */}
145
- {(upload.length && !autocomplete.length)
146
- ? (
146
+ {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
147
+ ? <span className={classes.bracketsOpen}>(</span>
148
+ : null}
149
+ {upload.length && autocomplete.length ? (
150
+ <>
151
+ {' '}
147
152
  <span
148
- className={
149
- clsx(
150
- classes.filterCheckboxes,
151
- classes.localFindBackground,
152
- classes.standAloneInputSet,
153
- )
154
- }
153
+ className={clsx(classes.filterCheckboxes, classes.localFind)}
155
154
  onClick={clearUpload}
156
155
  >
157
156
  INPUT CASE SET
158
157
  </span>
159
- ) : null}
160
- {autocomplete.length
161
- ? (
162
- <span>
163
- {' '}
164
- <span
165
- className={clsx(classes.filterName, classes.localFindBackground)}
166
- onClick={clearAutocomplete}
167
- >
168
- Case ID
169
- </span>
170
- {' '}
171
- {' '}
172
- <span className={classes.operators}>
173
- {(autocomplete.length === 1 && !upload.length) ? 'IS ' : 'IN '}
174
- </span>
158
+ {' '}
159
+ </>
160
+ ) : null}
161
+ {autocomplete.slice(0, noOfItems).map((d, idx) => (
162
+ <>
163
+ <span
164
+ className={clsx(classes.filterCheckboxes, classes.facetSectionCases)}
165
+ key={idx}
166
+ onClick={() => deleteAutocompleteItem(d.title)}
167
+ >
168
+ {d.title}
175
169
  </span>
176
- ) : null}
177
- <span>
178
- {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
179
- ? <span className={classes.bracketsOpen}>(</span>
180
- : null}
181
- {upload.length && autocomplete.length ? (
182
- <>
183
- {' '}
184
- <span
185
- className={clsx(classes.filterCheckboxes, classes.localFind)}
186
- onClick={clearUpload}
187
- >
188
- INPUT CASE SET
189
- </span>
190
- {' '}
191
- </>
192
- ) : null}
193
- {autocomplete.slice(0, noOfItems).map((d, idx) => (
194
- <>
195
- <span
196
- className={clsx(classes.filterCheckboxes, classes.facetSectionCases)}
197
- key={idx}
198
- onClick={() => deleteAutocompleteItem(d.title)}
199
- >
200
- {d.title}
201
- </span>
202
- {idx === (noOfItems - 1) ? null : ' '}
203
- </>
204
- ))}
205
- {autocomplete.length > maxItems && (
206
- <>
207
- {
208
- displayAllActiveFilters
209
- ? (
210
- <span
211
- className={classes.expandBtn}
212
- onClick={() => setExpand(!expand)}
213
- >
214
- ...
215
- </span>
216
- )
217
- : '...'
218
- }
219
- </>
220
- )}
221
- {(expand && autocomplete.length > maxItems) && (
170
+ {idx === (noOfItems - 1) ? null : ' '}
171
+ </>
172
+ ))}
173
+ {autocomplete.length > maxItems && (
174
+ <>
222
175
  <span
223
- className={classes.collapseBtn}
176
+ className={classes.expandBtn}
224
177
  onClick={() => setExpand(!expand)}
225
178
  >
226
- {' LESS'}
179
+ ...
227
180
  </span>
228
- )}
229
- {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
230
- ? <span className={classes.bracketsClose}>)</span>
231
- : null}
232
- </span>
233
- </span>
234
- ) : null}
235
-
236
- {/* Facet Sidebar Selections */}
237
- {((autocomplete.length || upload.length) && mappedInputs.length)
238
- ? <span className={classes.operators}> AND </span>
239
- : null}
240
- {mappedInputs.map((filter, index) => (
241
- <span className={clsName(filter.section)}>
242
- <Filter
243
- index={index}
244
- type={filter.type}
245
- data={filter}
246
- maxItems={maxItems}
247
- displayAllActiveFilters={displayAllActiveFilters}
248
- classes={classes}
249
- onSectionClick={filter.type === CHECKBOX
250
- ? resetFacetSection
251
- : resetFacetSlider}
252
- onItemClick={filter.type === CHECKBOX
253
- ? resetFacetCheckbox
254
- : resetFacetSlider}
255
- />
181
+ </>
182
+ )}
183
+ {(expand && autocomplete.length > maxItems) && (
184
+ <span
185
+ className={classes.collapseBtn}
186
+ onClick={() => setExpand(!expand)}
187
+ >
188
+ {' LESS'}
189
+ </span>
190
+ )}
191
+ {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
192
+ ? <span className={classes.bracketsClose}>)</span>
193
+ : null}
256
194
  </span>
257
- ))}
258
- </span>
259
- </div>
260
- {
261
- (viewQueryURL && queryURLRootPath) && (
262
- <div>
263
- <QueryUrl
195
+ </span>
196
+ ) : null}
197
+
198
+ {/* Facet Sidebar Selections */}
199
+ {((autocomplete.length || upload.length) && mappedInputs.length)
200
+ ? <span className={classes.operators}> AND </span>
201
+ : null}
202
+ {mappedInputs.map((filter, index) => (
203
+ <span className={clsName(filter.section)}>
204
+ <Filter
205
+ index={index}
206
+ type={filter.type}
207
+ data={filter}
208
+ maxItems={maxItems}
264
209
  classes={classes}
265
- localFind={localFind}
266
- filterItems={mappedInputs}
267
- rootPath={queryURLRootPath}
210
+ onSectionClick={filter.type === CHECKBOX
211
+ ? resetFacetSection
212
+ : resetFacetSlider}
213
+ onItemClick={filter.type === CHECKBOX
214
+ ? resetFacetCheckbox
215
+ : resetFacetSlider}
268
216
  />
269
- </div>
217
+ </span>
218
+ ))}
219
+ </span>
220
+ {
221
+ (viewQueryURL && queryURLRootPath) && (
222
+ <QueryUrl
223
+ classes={classes}
224
+ localFind={localFind}
225
+ filterItems={mappedInputs}
226
+ rootPath={queryURLRootPath}
227
+ />
270
228
  )
271
229
  }
272
230
  </div>
package/src/generators/config.js CHANGED
@@ -12,20 +12,6 @@ export default {
12
12
  * @var {boolean}
13
13
  */
14
14
  displayAllActiveFilters: false,
15
- /**
16
- * key to access label text
17
- * @var {boolean}
18
- */
19
- group: 'group',
20
- /**
21
- * root path of bento app
22
- * @var {boolean}
23
- */
24
- rootPath: null,
25
- /**
26
- * display query URL
27
- * @var {boolean}
28
- */
29
15
  viewQueryURL: false,
30
16
  },
31
17