@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(
|
|
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
|
-
|
|
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
|
|
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
|
-
}))))
|
|
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,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
|
-
<
|
|
122
|
-
{
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
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
|
-
{
|
|
145
|
-
|
|
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
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
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.
|
|
224
|
-
|
|
180
|
+
className={clsx(classes.filterCheckboxes, classes.facetSectionCases)}
|
|
181
|
+
key={idx}
|
|
182
|
+
onClick={() => deleteAutocompleteItem(d.title)}
|
|
225
183
|
>
|
|
226
|
-
{
|
|
184
|
+
{d.title}
|
|
227
185
|
</span>
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
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
|
-
|
|
217
|
+
</span>
|
|
218
|
+
) : null}
|
|
235
219
|
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
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
|
-
|
|
266
|
-
|
|
267
|
-
|
|
233
|
+
onSectionClick={filter.type === CHECKBOX
|
|
234
|
+
? resetFacetSection
|
|
235
|
+
: resetFacetSlider}
|
|
236
|
+
onItemClick={filter.type === CHECKBOX
|
|
237
|
+
? resetFacetCheckbox
|
|
238
|
+
: resetFacetSlider}
|
|
268
239
|
/>
|
|
269
|
-
</
|
|
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>
|