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

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.
@@ -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')
@@ -110,21 +110,17 @@ const QueryBarGenerator = function QueryBarGenerator() {
110
110
  }
111
111
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
112
112
  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, {
113
+ }, /*#__PURE__*/_react.default.createElement(_core.Button, {
117
114
  className: classes.clearQueryButton,
118
115
  color: "primary",
119
116
  variant: "outlined",
120
- onClick: clearAll,
121
- size: "small"
122
- }, "Clear"), /*#__PURE__*/_react.default.createElement("span", {
117
+ onClick: clearAll
118
+ }, "Clear Query"), /*#__PURE__*/_react.default.createElement("span", {
123
119
  className: classes.divider
124
120
  }), /*#__PURE__*/_react.default.createElement("span", {
125
121
  className: classes.queryContainer
126
122
  }, 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),
123
+ className: (0, _clsx.default)(classes.filterCheckboxes, classes.localFindBackground),
128
124
  onClick: clearUpload
129
125
  }, "INPUT CASE SET") : null, autocomplete.length ? /*#__PURE__*/_react.default.createElement("span", null, ' ', /*#__PURE__*/_react.default.createElement("span", {
130
126
  className: (0, _clsx.default)(classes.filterName, classes.localFindBackground),
@@ -161,12 +157,12 @@ const QueryBarGenerator = function QueryBarGenerator() {
161
157
  classes: classes,
162
158
  onSectionClick: filter.type === CHECKBOX ? resetFacetSection : resetFacetSlider,
163
159
  onItemClick: filter.type === CHECKBOX ? resetFacetCheckbox : resetFacetSlider
164
- }))))), viewQueryURL && queryURLRootPath && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_QueryUrl.default, {
160
+ })))), viewQueryURL && queryURLRootPath && /*#__PURE__*/_react.default.createElement(_QueryUrl.default, {
165
161
  classes: classes,
166
162
  localFind: localFind,
167
163
  filterItems: mappedInputs,
168
164
  rootPath: queryURLRootPath
169
- }))));
165
+ })));
170
166
  })
171
167
  };
172
168
  };
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.17",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
@@ -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')}
@@ -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';
@@ -118,155 +117,137 @@ export const QueryBarGenerator = (uiConfig = DEFAULT_CONFIG) => {
118
117
  return (
119
118
  <>
120
119
  <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) ? (
120
+ <Button
121
+ className={classes.clearQueryButton}
122
+ color="primary"
123
+ variant="outlined"
124
+ onClick={clearAll}
125
+ >
126
+ Clear Query
127
+ </Button>
128
+ <span className={classes.divider} />
129
+ <span className={classes.queryContainer}>
130
+ {/* Local Find Selections */}
131
+ {/* TODO: Refactor this into a separate component */}
132
+ {(autocomplete.length || upload.length) ? (
133
+ <span>
134
+ {/* Standalone case set button */}
135
+ {(upload.length && !autocomplete.length)
136
+ ? (
137
+ <span
138
+ className={clsx(classes.filterCheckboxes, classes.localFindBackground)}
139
+ onClick={clearUpload}
140
+ >
141
+ INPUT CASE SET
142
+ </span>
143
+ ) : null}
144
+ {autocomplete.length
145
+ ? (
146
+ <span>
147
+ {' '}
148
+ <span
149
+ className={clsx(classes.filterName, classes.localFindBackground)}
150
+ onClick={clearAutocomplete}
151
+ >
152
+ Case ID
153
+ </span>
154
+ {' '}
155
+ {' '}
156
+ <span className={classes.operators}>
157
+ {(autocomplete.length === 1 && !upload.length) ? 'IS ' : 'IN '}
158
+ </span>
159
+ </span>
160
+ ) : null}
143
161
  <span>
144
- {/* Standalone case set button */}
145
- {(upload.length && !autocomplete.length)
146
- ? (
162
+ {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
163
+ ? <span className={classes.bracketsOpen}>(</span>
164
+ : null}
165
+ {upload.length && autocomplete.length ? (
166
+ <>
167
+ {' '}
147
168
  <span
148
- className={
149
- clsx(
150
- classes.filterCheckboxes,
151
- classes.localFindBackground,
152
- classes.standAloneInputSet,
153
- )
154
- }
169
+ className={clsx(classes.filterCheckboxes, classes.localFind)}
155
170
  onClick={clearUpload}
156
171
  >
157
172
  INPUT CASE SET
158
173
  </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>
175
- </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) && (
174
+ {' '}
175
+ </>
176
+ ) : null}
177
+ {autocomplete.slice(0, noOfItems).map((d, idx) => (
178
+ <>
222
179
  <span
223
- className={classes.collapseBtn}
224
- onClick={() => setExpand(!expand)}
180
+ className={clsx(classes.filterCheckboxes, classes.facetSectionCases)}
181
+ key={idx}
182
+ onClick={() => deleteAutocompleteItem(d.title)}
225
183
  >
226
- {' LESS'}
184
+ {d.title}
227
185
  </span>
228
- )}
229
- {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
230
- ? <span className={classes.bracketsClose}>)</span>
231
- : null}
232
- </span>
186
+ {idx === (noOfItems - 1) ? null : ' '}
187
+ </>
188
+ ))}
189
+ {autocomplete.length > maxItems && (
190
+ <>
191
+ {
192
+ displayAllActiveFilters
193
+ ? (
194
+ <span
195
+ className={classes.expandBtn}
196
+ onClick={() => setExpand(!expand)}
197
+ >
198
+ ...
199
+ </span>
200
+ )
201
+ : '...'
202
+ }
203
+ </>
204
+ )}
205
+ {(expand && autocomplete.length > maxItems) && (
206
+ <span
207
+ className={classes.collapseBtn}
208
+ onClick={() => setExpand(!expand)}
209
+ >
210
+ {' LESS'}
211
+ </span>
212
+ )}
213
+ {(((upload.length > 0 ? 1 : 0) + autocomplete.length) > 1)
214
+ ? <span className={classes.bracketsClose}>)</span>
215
+ : null}
233
216
  </span>
234
- ) : null}
217
+ </span>
218
+ ) : null}
235
219
 
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
- />
256
- </span>
257
- ))}
258
- </span>
259
- </div>
260
- {
261
- (viewQueryURL && queryURLRootPath) && (
262
- <div>
263
- <QueryUrl
220
+ {/* Facet Sidebar Selections */}
221
+ {((autocomplete.length || upload.length) && mappedInputs.length)
222
+ ? <span className={classes.operators}> AND </span>
223
+ : null}
224
+ {mappedInputs.map((filter, index) => (
225
+ <span className={clsName(filter.section)}>
226
+ <Filter
227
+ index={index}
228
+ type={filter.type}
229
+ data={filter}
230
+ maxItems={maxItems}
231
+ displayAllActiveFilters={displayAllActiveFilters}
264
232
  classes={classes}
265
- localFind={localFind}
266
- filterItems={mappedInputs}
267
- rootPath={queryURLRootPath}
233
+ onSectionClick={filter.type === CHECKBOX
234
+ ? resetFacetSection
235
+ : resetFacetSlider}
236
+ onItemClick={filter.type === CHECKBOX
237
+ ? resetFacetCheckbox
238
+ : resetFacetSlider}
268
239
  />
269
- </div>
240
+ </span>
241
+ ))}
242
+ </span>
243
+ {
244
+ (viewQueryURL && queryURLRootPath) && (
245
+ <QueryUrl
246
+ classes={classes}
247
+ localFind={localFind}
248
+ filterItems={mappedInputs}
249
+ rootPath={queryURLRootPath}
250
+ />
270
251
  )
271
252
  }
272
253
  </div>