@empathyco/x-components 3.0.0-alpha.291 → 3.0.0-alpha.293
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.
- package/CHANGELOG.md +17 -0
- package/design-system/base.css +2 -2
- package/design-system/default-theme.css +32 -12
- package/design-system/deprecated-full-theme.css +72 -32
- package/design-system/facet-line.css +9 -3
- package/design-system/filter-default.css +3 -1
- package/design-system/full-theme.css +67 -36
- package/design-system/input-group-card.css +3 -1
- package/design-system/input-group-pill.css +7 -5
- package/design-system/tag-default.css +24 -8
- package/design-system/tag-ghost.css +6 -2
- package/docs/API-reference/api/x-types.booleanfiltermodelname.md +1 -1
- package/js/x-modules/facets/components/filters/editable-number-range-filter.vue.js.map +1 -1
- package/js/x-modules/facets/components/filters/editable-number-range-filter.vue_rollup-plugin-vue_script.vue.js.map +1 -1
- package/package.json +7 -7
- package/report/x-types.api.json +2 -2
- package/types/x-installer/api/api.types.d.ts.map +1 -1
- package/types/x-modules/facets/components/filters/editable-number-range-filter.vue.d.ts.map +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,23 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [3.0.0-alpha.293](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.292...@empathyco/x-components@3.0.0-alpha.293) (2023-01-23)
|
|
7
|
+
|
|
8
|
+
### Styling
|
|
9
|
+
|
|
10
|
+
- update prettier and format code (#1026)
|
|
11
|
+
([a18cc17](https://github.com/empathyco/x/commit/a18cc172b6638962d53192905cd466f12bccacac)),
|
|
12
|
+
closes [EX-7877](https://searchbroker.atlassian.net/browse/EX-7877)
|
|
13
|
+
|
|
14
|
+
## [3.0.0-alpha.292](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.291...@empathyco/x-components@3.0.0-alpha.292) (2023-01-23)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @empathyco/x-components
|
|
17
|
+
|
|
18
|
+
# Change Log
|
|
19
|
+
|
|
20
|
+
All notable changes to this project will be documented in this file. See
|
|
21
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
22
|
+
|
|
6
23
|
## [3.0.0-alpha.291](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.290...@empathyco/x-components@3.0.0-alpha.291) (2023-01-20)
|
|
7
24
|
|
|
8
25
|
### Build System
|
package/design-system/base.css
CHANGED
|
@@ -7,13 +7,13 @@
|
|
|
7
7
|
}
|
|
8
8
|
:root {
|
|
9
9
|
--x-color-base-lead: #243d48;
|
|
10
|
-
--x-color-base-auxiliary: #
|
|
10
|
+
--x-color-base-auxiliary: #bfe1ec;
|
|
11
11
|
--x-color-base-neutral-10: #1a1a1a;
|
|
12
12
|
--x-color-base-neutral-35: #595959;
|
|
13
13
|
--x-color-base-neutral-70: #b3b3b3;
|
|
14
14
|
--x-color-base-neutral-95: #f2f2f2;
|
|
15
15
|
--x-color-base-neutral-100: #ffffff;
|
|
16
|
-
--x-color-base-accent: #
|
|
16
|
+
--x-color-base-accent: #0086b2;
|
|
17
17
|
--x-color-base-enable: #00705c;
|
|
18
18
|
--x-color-base-disable: #e11f26;
|
|
19
19
|
--x-color-base-transparent: transparent;
|
|
@@ -559,7 +559,9 @@
|
|
|
559
559
|
--x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
|
|
560
560
|
--x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
|
|
561
561
|
--x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
|
|
562
|
-
--x-number-font-weight-filter-count-default-selected: var(
|
|
562
|
+
--x-number-font-weight-filter-count-default-selected: var(
|
|
563
|
+
--x-number-font-weight-filter-count-default
|
|
564
|
+
);
|
|
563
565
|
--x-size-line-height-filter-default: var(--x-size-line-height-text);
|
|
564
566
|
}
|
|
565
567
|
|
|
@@ -670,7 +672,9 @@
|
|
|
670
672
|
--x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
|
|
671
673
|
--x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
|
|
672
674
|
--x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
|
|
673
|
-
--x-number-font-weight-filter-count-default-selected: var(
|
|
675
|
+
--x-number-font-weight-filter-count-default-selected: var(
|
|
676
|
+
--x-number-font-weight-filter-count-default
|
|
677
|
+
);
|
|
674
678
|
--x-size-line-height-filter-default: var(--x-size-line-height-text);
|
|
675
679
|
}
|
|
676
680
|
:root {
|
|
@@ -2130,10 +2134,18 @@
|
|
|
2130
2134
|
--x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
|
|
2131
2135
|
--x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
|
|
2132
2136
|
--x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
|
|
2133
|
-
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
2134
|
-
|
|
2135
|
-
|
|
2136
|
-
--x-size-border-radius-
|
|
2137
|
+
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
2138
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
2139
|
+
);
|
|
2140
|
+
--x-size-border-radius-bottom-left-suggestion-default: var(
|
|
2141
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
2142
|
+
);
|
|
2143
|
+
--x-size-border-radius-top-right-suggestion-default: var(
|
|
2144
|
+
--x-size-border-radius-top-right-tag-default
|
|
2145
|
+
);
|
|
2146
|
+
--x-size-border-radius-top-left-suggestion-default: var(
|
|
2147
|
+
--x-size-border-radius-top-left-tag-default
|
|
2148
|
+
);
|
|
2137
2149
|
--x-font-family-suggestion-default: var(--x-font-family-tag-default);
|
|
2138
2150
|
--x-size-font-suggestion-default: var(--x-size-font-tag-default);
|
|
2139
2151
|
--x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
|
|
@@ -2153,10 +2165,18 @@
|
|
|
2153
2165
|
--x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
2154
2166
|
--x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
2155
2167
|
--x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
2156
|
-
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
--x-size-border-radius-
|
|
2168
|
+
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
2169
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
2170
|
+
);
|
|
2171
|
+
--x-size-border-radius-bottom-left-suggestion-group-default: var(
|
|
2172
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
2173
|
+
);
|
|
2174
|
+
--x-size-border-radius-top-right-suggestion-group-default: var(
|
|
2175
|
+
--x-size-border-radius-top-right-tag-default
|
|
2176
|
+
);
|
|
2177
|
+
--x-size-border-radius-top-left-suggestion-group-default: var(
|
|
2178
|
+
--x-size-border-radius-top-left-tag-default
|
|
2179
|
+
);
|
|
2160
2180
|
--x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
|
|
2161
2181
|
--x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
|
|
2162
2182
|
--x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
|
|
@@ -2267,13 +2287,13 @@
|
|
|
2267
2287
|
}
|
|
2268
2288
|
:root {
|
|
2269
2289
|
--x-color-base-lead: #243d48;
|
|
2270
|
-
--x-color-base-auxiliary: #
|
|
2290
|
+
--x-color-base-auxiliary: #bfe1ec;
|
|
2271
2291
|
--x-color-base-neutral-10: #1a1a1a;
|
|
2272
2292
|
--x-color-base-neutral-35: #595959;
|
|
2273
2293
|
--x-color-base-neutral-70: #b3b3b3;
|
|
2274
2294
|
--x-color-base-neutral-95: #f2f2f2;
|
|
2275
2295
|
--x-color-base-neutral-100: #ffffff;
|
|
2276
|
-
--x-color-base-accent: #
|
|
2296
|
+
--x-color-base-accent: #0086b2;
|
|
2277
2297
|
--x-color-base-enable: #00705c;
|
|
2278
2298
|
--x-color-base-disable: #e11f26;
|
|
2279
2299
|
--x-color-base-transparent: transparent;
|
|
@@ -140,13 +140,13 @@
|
|
|
140
140
|
--x-size-border-radius-button-default: var(--x-size-border-radius-button-pill);
|
|
141
141
|
--x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-pill);
|
|
142
142
|
--x-size-border-radius-top-right-button-default: var(
|
|
143
|
-
|
|
143
|
+
--x-size-border-radius-top-right-button-pill
|
|
144
144
|
);
|
|
145
145
|
--x-size-border-radius-bottom-right-button-default: var(
|
|
146
|
-
|
|
146
|
+
--x-size-border-radius-bottom-right-button-pill
|
|
147
147
|
);
|
|
148
148
|
--x-size-border-radius-bottom-left-button-default: var(
|
|
149
|
-
|
|
149
|
+
--x-size-border-radius-bottom-left-button-pill
|
|
150
150
|
);
|
|
151
151
|
}
|
|
152
152
|
:root {
|
|
@@ -239,7 +239,9 @@
|
|
|
239
239
|
}
|
|
240
240
|
:root {
|
|
241
241
|
--x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
|
|
242
|
-
--x-color-text-suggestion-group-matching-part-default: var(
|
|
242
|
+
--x-color-text-suggestion-group-matching-part-default: var(
|
|
243
|
+
--x-color-text-suggestion-matching-part-default
|
|
244
|
+
);
|
|
243
245
|
--x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
|
|
244
246
|
--x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
|
|
245
247
|
--x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
|
|
@@ -249,14 +251,28 @@
|
|
|
249
251
|
--x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
|
|
250
252
|
--x-size-border-width-suggestion-group-default: 0;
|
|
251
253
|
--x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
|
|
252
|
-
--x-size-border-width-right-suggestion-group-default: var(
|
|
253
|
-
|
|
254
|
-
|
|
254
|
+
--x-size-border-width-right-suggestion-group-default: var(
|
|
255
|
+
--x-size-border-width-suggestion-default
|
|
256
|
+
);
|
|
257
|
+
--x-size-border-width-bottom-suggestion-group-default: var(
|
|
258
|
+
--x-size-border-width-suggestion-default
|
|
259
|
+
);
|
|
260
|
+
--x-size-border-width-left-suggestion-group-default: var(
|
|
261
|
+
--x-size-border-width-suggestion-default
|
|
262
|
+
);
|
|
255
263
|
--x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
|
|
256
|
-
--x-size-border-radius-top-left-suggestion-group-default: var(
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
--x-size-border-radius-
|
|
264
|
+
--x-size-border-radius-top-left-suggestion-group-default: var(
|
|
265
|
+
--x-size-border-radius-suggestion-default
|
|
266
|
+
);
|
|
267
|
+
--x-size-border-radius-top-right-suggestion-group-default: var(
|
|
268
|
+
--x-size-border-radius-suggestion-default
|
|
269
|
+
);
|
|
270
|
+
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
271
|
+
--x-size-border-radius-suggestion-default
|
|
272
|
+
);
|
|
273
|
+
--x-size-border-radius-bottom-left-suggestion-group-default: var(
|
|
274
|
+
--x-size-border-radius-suggestion-default
|
|
275
|
+
);
|
|
260
276
|
--x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
|
|
261
277
|
--x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
|
|
262
278
|
--x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
|
|
@@ -346,8 +362,12 @@
|
|
|
346
362
|
--x-color-background-suggestion-default: transparent;
|
|
347
363
|
--x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
|
|
348
364
|
--x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
|
|
349
|
-
--x-color-text-suggestion-matching-part-default-curated: var(
|
|
350
|
-
|
|
365
|
+
--x-color-text-suggestion-matching-part-default-curated: var(
|
|
366
|
+
--x-color-text-suggestion-matching-part-default
|
|
367
|
+
);
|
|
368
|
+
--x-color-text-suggestion-default-matching-curated: var(
|
|
369
|
+
--x-color-text-suggestion-default-matching
|
|
370
|
+
);
|
|
351
371
|
--x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
|
|
352
372
|
--x-color-border-suggestion-default-curated: var(--x-color-border-suggestion-default);
|
|
353
373
|
--x-size-padding-top-suggestion-default: var(--x-size-base-01);
|
|
@@ -361,10 +381,18 @@
|
|
|
361
381
|
--x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-suggestion-default);
|
|
362
382
|
--x-size-border-width-left-suggestion-default: var(--x-size-border-width-suggestion-default);
|
|
363
383
|
--x-size-border-radius-suggestion-default: var(--x-size-border-radius-base-none);
|
|
364
|
-
--x-size-border-radius-top-left-suggestion-default: var(
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
--x-size-border-radius-
|
|
384
|
+
--x-size-border-radius-top-left-suggestion-default: var(
|
|
385
|
+
--x-size-border-radius-suggestion-default
|
|
386
|
+
);
|
|
387
|
+
--x-size-border-radius-top-right-suggestion-default: var(
|
|
388
|
+
--x-size-border-radius-suggestion-default
|
|
389
|
+
);
|
|
390
|
+
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
391
|
+
--x-size-border-radius-suggestion-default
|
|
392
|
+
);
|
|
393
|
+
--x-size-border-radius-bottom-left-suggestion-default: var(
|
|
394
|
+
--x-size-border-radius-suggestion-default
|
|
395
|
+
);
|
|
368
396
|
--x-font-family-suggestion-default: var(--x-font-family-text);
|
|
369
397
|
--x-size-font-suggestion-default: var(--x-size-font-text);
|
|
370
398
|
--x-size-line-height-suggestion-default: var(--x-size-line-height-text);
|
|
@@ -386,29 +414,33 @@
|
|
|
386
414
|
--x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
|
|
387
415
|
--x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
|
|
388
416
|
--x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
|
|
389
|
-
--x-number-font-weight-suggestion-filter-default: var(
|
|
390
|
-
--x-number-font-weight-suggestion-default
|
|
391
|
-
);
|
|
417
|
+
--x-number-font-weight-suggestion-filter-default: var(--x-number-font-weight-suggestion-default);
|
|
392
418
|
--x-text-transform-suggestion-filter-default: none;
|
|
393
419
|
--x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
|
|
394
420
|
--x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
|
|
395
421
|
--x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
|
|
396
422
|
--x-number-font-weight-suggestion-default-curated: var(--x-number-font-weight-suggestion-default);
|
|
397
|
-
--x-font-family-suggestion-matching-part-default-curated: var(
|
|
398
|
-
|
|
423
|
+
--x-font-family-suggestion-matching-part-default-curated: var(
|
|
424
|
+
--x-font-family-suggestion-matching-part-default
|
|
425
|
+
);
|
|
426
|
+
--x-size-font-suggestion-matching-part-default-curated: var(
|
|
427
|
+
--x-size-font-suggestion-matching-part-default
|
|
428
|
+
);
|
|
399
429
|
--x-size-line-height-suggestion-matching-part-default-curated: var(
|
|
400
|
-
|
|
430
|
+
--x-size-line-height-suggestion-matching-part-default
|
|
401
431
|
);
|
|
402
432
|
--x-number-font-weight-suggestion-matching-part-default-curated: var(
|
|
403
|
-
|
|
433
|
+
--x-number-font-weight-suggestion-matching-part-default
|
|
434
|
+
);
|
|
435
|
+
--x-font-family-suggestion-default-matching-curated: var(
|
|
436
|
+
--x-font-family-suggestion-default-matching
|
|
404
437
|
);
|
|
405
|
-
--x-font-family-suggestion-default-matching-curated: var(--x-font-family-suggestion-default-matching);
|
|
406
438
|
--x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
|
|
407
439
|
--x-size-line-height-suggestion-default-matching-curated: var(
|
|
408
|
-
|
|
440
|
+
--x-size-line-height-suggestion-default-matching
|
|
409
441
|
);
|
|
410
442
|
--x-number-font-weight-suggestion-default-matching-curated: var(
|
|
411
|
-
|
|
443
|
+
--x-number-font-weight-suggestion-default-matching
|
|
412
444
|
);
|
|
413
445
|
}
|
|
414
446
|
|
|
@@ -527,13 +559,21 @@
|
|
|
527
559
|
color: var(--x-color-text-suggestion-matching-part-default-curated);
|
|
528
560
|
}
|
|
529
561
|
.x-suggestion.x-suggestion.x-suggestion--is-curated.x-suggestion--matching {
|
|
530
|
-
--x-font-family-suggestion-default-curated: var(
|
|
531
|
-
|
|
532
|
-
|
|
562
|
+
--x-font-family-suggestion-default-curated: var(
|
|
563
|
+
--x-font-family-suggestion-default-matching-curated
|
|
564
|
+
);
|
|
565
|
+
--x-size-font-suggestion-default-curated: var(
|
|
566
|
+
--x-size-font-suggestion-default-matching-curated
|
|
567
|
+
);
|
|
568
|
+
--x-size-line-height-suggestion-default-curated: var(
|
|
569
|
+
--x-size-line-height-suggestion-default-matching-curated
|
|
570
|
+
);
|
|
533
571
|
--x-number-font-weight-suggestion-default-curated: var(
|
|
534
|
-
|
|
572
|
+
--x-number-font-weight-suggestion-default-matching-curated
|
|
573
|
+
);
|
|
574
|
+
--x-color-text-suggestion-default-curated: var(
|
|
575
|
+
--x-color-text-suggestion-default-matching-curated
|
|
535
576
|
);
|
|
536
|
-
--x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default-matching-curated);
|
|
537
577
|
}
|
|
538
578
|
.x-text--accent {
|
|
539
579
|
--x-color-text-default: var(--x-color-text-accent);
|
|
@@ -12,7 +12,13 @@
|
|
|
12
12
|
--x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
|
|
13
13
|
--x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
|
|
14
14
|
--x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
|
|
15
|
-
--x-size-border-width-right-facet-header-default: var(
|
|
16
|
-
|
|
17
|
-
|
|
15
|
+
--x-size-border-width-right-facet-header-default: var(
|
|
16
|
+
--x-size-border-width-right-facet-header-line
|
|
17
|
+
);
|
|
18
|
+
--x-size-border-width-bottom-facet-header-default: var(
|
|
19
|
+
--x-size-border-width-bottom-facet-header-line
|
|
20
|
+
);
|
|
21
|
+
--x-size-border-width-left-facet-header-default: var(
|
|
22
|
+
--x-size-border-width-left-facet-header-line
|
|
23
|
+
);
|
|
18
24
|
}
|
|
@@ -25,7 +25,9 @@
|
|
|
25
25
|
--x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
|
|
26
26
|
--x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
|
|
27
27
|
--x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
|
|
28
|
-
--x-number-font-weight-filter-count-default-selected: var(
|
|
28
|
+
--x-number-font-weight-filter-count-default-selected: var(
|
|
29
|
+
--x-number-font-weight-filter-count-default
|
|
30
|
+
);
|
|
29
31
|
--x-size-line-height-filter-default: var(--x-size-line-height-text);
|
|
30
32
|
}
|
|
31
33
|
|
|
@@ -7,13 +7,13 @@
|
|
|
7
7
|
}
|
|
8
8
|
:root {
|
|
9
9
|
--x-color-base-lead: #243d48;
|
|
10
|
-
--x-color-base-auxiliary: #
|
|
10
|
+
--x-color-base-auxiliary: #bfe1ec;
|
|
11
11
|
--x-color-base-neutral-10: #1a1a1a;
|
|
12
12
|
--x-color-base-neutral-35: #595959;
|
|
13
13
|
--x-color-base-neutral-70: #b3b3b3;
|
|
14
14
|
--x-color-base-neutral-95: #f2f2f2;
|
|
15
15
|
--x-color-base-neutral-100: #ffffff;
|
|
16
|
-
--x-color-base-accent: #
|
|
16
|
+
--x-color-base-accent: #0086b2;
|
|
17
17
|
--x-color-base-enable: #00705c;
|
|
18
18
|
--x-color-base-disable: #e11f26;
|
|
19
19
|
--x-color-base-transparent: transparent;
|
|
@@ -115,6 +115,19 @@
|
|
|
115
115
|
--x-size-border-width-left-dropdown-list-card
|
|
116
116
|
);
|
|
117
117
|
}
|
|
118
|
+
:root {
|
|
119
|
+
--x-size-gap-dropdown-card: var(--x-size-base-03);
|
|
120
|
+
--x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
|
|
121
|
+
--x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
122
|
+
--x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
123
|
+
--x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
124
|
+
--x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
125
|
+
--x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
|
|
126
|
+
--x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
127
|
+
--x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
128
|
+
--x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
129
|
+
--x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
130
|
+
}
|
|
118
131
|
.x-dropdown {
|
|
119
132
|
box-sizing: border-box;
|
|
120
133
|
position: relative;
|
|
@@ -636,9 +649,15 @@
|
|
|
636
649
|
--x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
|
|
637
650
|
--x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
|
|
638
651
|
--x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
|
|
639
|
-
--x-size-border-width-right-facet-header-default: var(
|
|
640
|
-
|
|
641
|
-
|
|
652
|
+
--x-size-border-width-right-facet-header-default: var(
|
|
653
|
+
--x-size-border-width-right-facet-header-line
|
|
654
|
+
);
|
|
655
|
+
--x-size-border-width-bottom-facet-header-default: var(
|
|
656
|
+
--x-size-border-width-bottom-facet-header-line
|
|
657
|
+
);
|
|
658
|
+
--x-size-border-width-left-facet-header-default: var(
|
|
659
|
+
--x-size-border-width-left-facet-header-line
|
|
660
|
+
);
|
|
642
661
|
}
|
|
643
662
|
:root {
|
|
644
663
|
--x-color-border-facet-header-line: var(--x-color-base-neutral-10);
|
|
@@ -774,7 +793,9 @@
|
|
|
774
793
|
--x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
|
|
775
794
|
--x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
|
|
776
795
|
--x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
|
|
777
|
-
--x-number-font-weight-filter-count-default-selected: var(
|
|
796
|
+
--x-number-font-weight-filter-count-default-selected: var(
|
|
797
|
+
--x-number-font-weight-filter-count-default
|
|
798
|
+
);
|
|
778
799
|
--x-size-line-height-filter-default: var(--x-size-line-height-text);
|
|
779
800
|
}
|
|
780
801
|
.x-hierarchical-filter-container {
|
|
@@ -928,7 +949,9 @@
|
|
|
928
949
|
--x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
|
|
929
950
|
--x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
930
951
|
--x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
931
|
-
--x-size-border-radius-bottom-right-input-group-card: var(
|
|
952
|
+
--x-size-border-radius-bottom-right-input-group-card: var(
|
|
953
|
+
--x-size-border-radius-input-group-card
|
|
954
|
+
);
|
|
932
955
|
--x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
933
956
|
}
|
|
934
957
|
[dir="ltr"] .x-input-group {
|
|
@@ -1157,23 +1180,25 @@
|
|
|
1157
1180
|
.x-input-group--pill .x-input-group {
|
|
1158
1181
|
--x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
|
|
1159
1182
|
--x-size-border-radius-top-left-input-group-default: var(
|
|
1160
|
-
|
|
1183
|
+
--x-size-border-radius-top-left-input-group-pill
|
|
1161
1184
|
);
|
|
1162
1185
|
--x-size-border-radius-top-right-input-group-default: var(
|
|
1163
|
-
|
|
1186
|
+
--x-size-border-radius-top-right-input-group-pill
|
|
1164
1187
|
);
|
|
1165
1188
|
--x-size-border-radius-bottom-right-input-group-default: var(
|
|
1166
|
-
|
|
1189
|
+
--x-size-border-radius-bottom-right-input-group-pill
|
|
1167
1190
|
);
|
|
1168
1191
|
--x-size-border-radius-bottom-left-input-group-default: var(
|
|
1169
|
-
|
|
1192
|
+
--x-size-border-radius-bottom-left-input-group-pill
|
|
1170
1193
|
);
|
|
1171
1194
|
}
|
|
1172
1195
|
:root {
|
|
1173
1196
|
--x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
|
|
1174
1197
|
--x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
1175
1198
|
--x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
1176
|
-
--x-size-border-radius-bottom-right-input-group-pill: var(
|
|
1199
|
+
--x-size-border-radius-bottom-right-input-group-pill: var(
|
|
1200
|
+
--x-size-border-radius-input-group-pill
|
|
1201
|
+
);
|
|
1177
1202
|
--x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
1178
1203
|
}
|
|
1179
1204
|
.x-input--card.x-input,
|
|
@@ -3371,10 +3396,18 @@
|
|
|
3371
3396
|
--x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
|
|
3372
3397
|
--x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
|
|
3373
3398
|
--x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
|
|
3374
|
-
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
3375
|
-
|
|
3376
|
-
|
|
3377
|
-
--x-size-border-radius-
|
|
3399
|
+
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
3400
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
3401
|
+
);
|
|
3402
|
+
--x-size-border-radius-bottom-left-suggestion-default: var(
|
|
3403
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
3404
|
+
);
|
|
3405
|
+
--x-size-border-radius-top-right-suggestion-default: var(
|
|
3406
|
+
--x-size-border-radius-top-right-tag-default
|
|
3407
|
+
);
|
|
3408
|
+
--x-size-border-radius-top-left-suggestion-default: var(
|
|
3409
|
+
--x-size-border-radius-top-left-tag-default
|
|
3410
|
+
);
|
|
3378
3411
|
--x-font-family-suggestion-default: var(--x-font-family-tag-default);
|
|
3379
3412
|
--x-size-font-suggestion-default: var(--x-size-font-tag-default);
|
|
3380
3413
|
--x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
|
|
@@ -3394,10 +3427,18 @@
|
|
|
3394
3427
|
--x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
3395
3428
|
--x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
3396
3429
|
--x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
3397
|
-
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
3398
|
-
|
|
3399
|
-
|
|
3400
|
-
--x-size-border-radius-
|
|
3430
|
+
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
3431
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
3432
|
+
);
|
|
3433
|
+
--x-size-border-radius-bottom-left-suggestion-group-default: var(
|
|
3434
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
3435
|
+
);
|
|
3436
|
+
--x-size-border-radius-top-right-suggestion-group-default: var(
|
|
3437
|
+
--x-size-border-radius-top-right-tag-default
|
|
3438
|
+
);
|
|
3439
|
+
--x-size-border-radius-top-left-suggestion-group-default: var(
|
|
3440
|
+
--x-size-border-radius-top-left-tag-default
|
|
3441
|
+
);
|
|
3401
3442
|
--x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
|
|
3402
3443
|
--x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
|
|
3403
3444
|
--x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
|
|
@@ -3507,10 +3548,14 @@
|
|
|
3507
3548
|
--x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
|
|
3508
3549
|
--x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
|
|
3509
3550
|
--x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
|
|
3510
|
-
--x-color-background-tag-default-curated-selected: var(
|
|
3551
|
+
--x-color-background-tag-default-curated-selected: var(
|
|
3552
|
+
--x-color-background-tag-curated-selected-ghost
|
|
3553
|
+
);
|
|
3511
3554
|
--x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
|
|
3512
3555
|
--x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
|
|
3513
|
-
--x-number-font-weight-tag-default-curated-selected: var(
|
|
3556
|
+
--x-number-font-weight-tag-default-curated-selected: var(
|
|
3557
|
+
--x-number-font-weight-tag-curated-selected-ghost
|
|
3558
|
+
);
|
|
3514
3559
|
}
|
|
3515
3560
|
:root {
|
|
3516
3561
|
--x-color-background-tag-ghost: transparent;
|
|
@@ -6656,17 +6701,3 @@
|
|
|
6656
6701
|
.x-sticky {
|
|
6657
6702
|
position: sticky !important;
|
|
6658
6703
|
}
|
|
6659
|
-
|
|
6660
|
-
:root {
|
|
6661
|
-
--x-size-gap-dropdown-card: var(--x-size-base-03);
|
|
6662
|
-
--x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
|
|
6663
|
-
--x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
6664
|
-
--x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
6665
|
-
--x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
6666
|
-
--x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
|
|
6667
|
-
--x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
|
|
6668
|
-
--x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
6669
|
-
--x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
6670
|
-
--x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
6671
|
-
--x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
|
|
6672
|
-
}
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
--x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
|
|
3
3
|
--x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
4
4
|
--x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
5
|
-
--x-size-border-radius-bottom-right-input-group-card: var(
|
|
5
|
+
--x-size-border-radius-bottom-right-input-group-card: var(
|
|
6
|
+
--x-size-border-radius-input-group-card
|
|
7
|
+
);
|
|
6
8
|
--x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
|
|
7
9
|
}
|
|
8
10
|
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
--x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
|
|
3
3
|
--x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
4
4
|
--x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
5
|
-
--x-size-border-radius-bottom-right-input-group-pill: var(
|
|
5
|
+
--x-size-border-radius-bottom-right-input-group-pill: var(
|
|
6
|
+
--x-size-border-radius-input-group-pill
|
|
7
|
+
);
|
|
6
8
|
--x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
|
|
7
9
|
}
|
|
8
10
|
|
|
@@ -10,15 +12,15 @@
|
|
|
10
12
|
.x-input-group--pill .x-input-group {
|
|
11
13
|
--x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
|
|
12
14
|
--x-size-border-radius-top-left-input-group-default: var(
|
|
13
|
-
|
|
15
|
+
--x-size-border-radius-top-left-input-group-pill
|
|
14
16
|
);
|
|
15
17
|
--x-size-border-radius-top-right-input-group-default: var(
|
|
16
|
-
|
|
18
|
+
--x-size-border-radius-top-right-input-group-pill
|
|
17
19
|
);
|
|
18
20
|
--x-size-border-radius-bottom-right-input-group-default: var(
|
|
19
|
-
|
|
21
|
+
--x-size-border-radius-bottom-right-input-group-pill
|
|
20
22
|
);
|
|
21
23
|
--x-size-border-radius-bottom-left-input-group-default: var(
|
|
22
|
-
|
|
24
|
+
--x-size-border-radius-bottom-left-input-group-pill
|
|
23
25
|
);
|
|
24
26
|
}
|
|
@@ -121,10 +121,18 @@
|
|
|
121
121
|
--x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
|
|
122
122
|
--x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
|
|
123
123
|
--x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
|
|
124
|
-
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
--x-size-border-radius-
|
|
124
|
+
--x-size-border-radius-bottom-right-suggestion-default: var(
|
|
125
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
126
|
+
);
|
|
127
|
+
--x-size-border-radius-bottom-left-suggestion-default: var(
|
|
128
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
129
|
+
);
|
|
130
|
+
--x-size-border-radius-top-right-suggestion-default: var(
|
|
131
|
+
--x-size-border-radius-top-right-tag-default
|
|
132
|
+
);
|
|
133
|
+
--x-size-border-radius-top-left-suggestion-default: var(
|
|
134
|
+
--x-size-border-radius-top-left-tag-default
|
|
135
|
+
);
|
|
128
136
|
--x-font-family-suggestion-default: var(--x-font-family-tag-default);
|
|
129
137
|
--x-size-font-suggestion-default: var(--x-size-font-tag-default);
|
|
130
138
|
--x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
|
|
@@ -144,10 +152,18 @@
|
|
|
144
152
|
--x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
145
153
|
--x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
146
154
|
--x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
|
|
147
|
-
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
--x-size-border-radius-
|
|
155
|
+
--x-size-border-radius-bottom-right-suggestion-group-default: var(
|
|
156
|
+
--x-size-border-radius-bottom-right-tag-default
|
|
157
|
+
);
|
|
158
|
+
--x-size-border-radius-bottom-left-suggestion-group-default: var(
|
|
159
|
+
--x-size-border-radius-bottom-leftt-tag-default
|
|
160
|
+
);
|
|
161
|
+
--x-size-border-radius-top-right-suggestion-group-default: var(
|
|
162
|
+
--x-size-border-radius-top-right-tag-default
|
|
163
|
+
);
|
|
164
|
+
--x-size-border-radius-top-left-suggestion-group-default: var(
|
|
165
|
+
--x-size-border-radius-top-left-tag-default
|
|
166
|
+
);
|
|
151
167
|
--x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
|
|
152
168
|
--x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
|
|
153
169
|
--x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
|
|
@@ -19,8 +19,12 @@
|
|
|
19
19
|
--x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
|
|
20
20
|
--x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
|
|
21
21
|
--x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
|
|
22
|
-
--x-color-background-tag-default-curated-selected: var(
|
|
22
|
+
--x-color-background-tag-default-curated-selected: var(
|
|
23
|
+
--x-color-background-tag-curated-selected-ghost
|
|
24
|
+
);
|
|
23
25
|
--x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
|
|
24
26
|
--x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
|
|
25
|
-
--x-number-font-weight-tag-default-curated-selected: var(
|
|
27
|
+
--x-number-font-weight-tag-default-curated-selected: var(
|
|
28
|
+
--x-number-font-weight-tag-curated-selected-ghost
|
|
29
|
+
);
|
|
26
30
|
}
|
|
@@ -9,7 +9,7 @@ Type to ease the usage of a model name in a [BooleanFilter](./x-types.booleanfil
|
|
|
9
9
|
<b>Signature:</b>
|
|
10
10
|
|
|
11
11
|
```typescript
|
|
12
|
-
export declare type BooleanFilterModelName = typeof BooleanFilterModelNames[number];
|
|
12
|
+
export declare type BooleanFilterModelName = (typeof BooleanFilterModelNames)[number];
|
|
13
13
|
```
|
|
14
14
|
<b>References:</b> [BooleanFilterModelNames](./x-types.booleanfiltermodelnames.md)
|
|
15
15
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editable-number-range-filter.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue"],"sourcesContent":["<template>\n <div\n class=\"x-editable-number-range-filter\"\n :class=\"cssClasses\"\n data-test=\"editable-number-range-filter\"\n >\n <!--\n @slot Empty slot used to customize the whole component.\n @binding {min} number - Component min value.\n @binding {max} number - Component max value.\n @binding {setMin} function - Component min setter.\n @binding {setMax} function - Component max setter.\n @binding {emitUserModifiedFilter} function - It emits the\n `UserModifiedEditableNumberRangeFilter` X event.\n @binding {clearValues} function - It sets component min and max values to null.\n @binding {hasError} boolean - Returns true when there is an error with component values.\n -->\n <slot v-bind=\"{ min, max, setMin, setMax, emitUserModifiedFilter, clearValues, hasError }\">\n <!-- eslint-disable max-len -->\n <input\n @change=\"setMin($event.target.valueAsNumber)\"\n name=\"min\"\n type=\"number\"\n class=\"\n x-input\n x-editable-number-range-filter__input x-editable-number-range-filter__input--min\n \"\n :value=\"min\"\n data-test=\"range-min\"\n :aria-label=\"rangeFilterMin\"\n />\n\n <input\n @change=\"setMax($event.target.valueAsNumber)\"\n name=\"max\"\n type=\"number\"\n class=\"\n x-input\n x-editable-number-range-filter__input x-editable-number-range-filter__input--max\n \"\n :value=\"max\"\n data-test=\"range-max\"\n :aria-label=\"rangeFilterMax\"\n />\n <!-- eslint-enable max-len -->\n\n <button\n v-if=\"!isInstant\"\n @click=\"emitUserModifiedFilter\"\n class=\"x-button x-editable-number-range-filter__apply\"\n :disabled=\"hasError\"\n data-test=\"range-apply\"\n >\n <!--\n @slot Slot used to customize the apply button content.\n -->\n <slot name=\"apply-content\">✓</slot>\n </button>\n\n <button\n v-if=\"renderClearButton\"\n @click=\"clearValues\"\n class=\"x-button x-editable-number-range-filter__clear\"\n data-test=\"range-clear\"\n >\n <!--\n @slot Slot used to customize the clear button content.\n -->\n <slot name=\"clear-content\">𐄂</slot>\n </button>\n </slot>\n </div>\n</template>\n\n<script lang=\"ts\">\n import {\n EditableNumberRangeFilter as EditableNumberRangeFilterModel,\n RangeValue\n } from '@empathyco/x-types';\n import { Component, Prop, Vue, Watch } from 'vue-property-decorator';\n import { VueCSSClasses } from '../../../../utils/types';\n import { facetsXModule } from '../../x-module';\n import { xComponentMixin } from '../../../../components/x-component.mixin';\n\n /**\n * Renders an editable number range filter. It has two input fields to handle min and max values,\n * emitting the needed events when clicked.\n *\n * It provides a default slot, with some utils bind, to customize the whole component; and two\n * named slots `apply-content` and `clear-content` to override each button content.\n *\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(facetsXModule)]\n })\n export default class EditableNumberRangeFilter extends Vue {\n /**\n * Component min value.\n *\n * @internal\n */\n protected min: RangeValue['min'] = null;\n /**\n * Component max value.\n *\n * @internal\n */\n protected max: RangeValue['max'] = null;\n\n /**\n * The filter data to render and edit.\n *\n * @public\n */\n @Prop({ required: true })\n public filter!: EditableNumberRangeFilterModel;\n\n /**\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * @public\n */\n @Prop({ default: false })\n public isInstant!: boolean;\n\n /**\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Prop({ default: true })\n public hasClearButton!: boolean;\n\n /**\n * It watches the filter range values passed as property and updates component range values if\n * they change.\n *\n * @param newRange - New range value.\n *\n * @internal\n */\n @Watch('filter.range', { immediate: true, deep: true })\n onFilterChanged(newRange: RangeValue): void {\n this.min = newRange.min;\n this.max = newRange.max;\n }\n\n /**\n * It watches range values in order to emit the event with the change if `isInstant`\n * property is true.\n *\n * @internal\n */\n @Watch('range', { deep: true })\n protected instantEmitUserModifiedFilter(): void {\n if (this.isInstant) {\n this.emitUserModifiedFilter();\n }\n }\n\n /**\n * Dynamic CSS classes.\n *\n * @returns Object which contains dynamic CSS classes.\n *\n * @internal\n */\n protected get cssClasses(): VueCSSClasses {\n return { 'x-editable-number-range-filter--error': this.hasError };\n }\n\n /**\n * Returns {@link @empathyco/x-types#RangeValue | RangeValue} with component min and max\n * values.\n *\n * @returns Range value object with component values.\n *\n * @internal\n */\n protected get range(): RangeValue {\n return { min: this.min, max: this.max };\n }\n\n /**\n * It returns true if the property `hasClearButton` is true and there are values to clear.\n *\n * @returns True if the clear button has to be rendered.\n *\n * @internal\n */\n protected get renderClearButton(): boolean {\n return this.hasClearButton && (this.min !== null || this.max !== null);\n }\n\n /**\n * It checks if component min and max values are valid.\n *\n * @returns True if there is any error in the component min and max values.\n *\n * @internal\n */\n protected get hasError(): boolean {\n return this.min !== null && this.max !== null && this.min > this.max;\n }\n\n /**\n * It checks if component min and max values are different than the ones within the filter\n * provided as property.\n *\n * @returns True if they are different.\n *\n * @internal\n */\n protected get areValuesDifferent(): boolean {\n return this.min !== this.filter.range.min || this.max !== this.filter.range.max;\n }\n\n /**\n * It returns the number if possible or null otherwise.\n *\n * @param value - Value.\n * @returns The element value as a number if possible or null.\n *\n * @internal\n */\n protected parseRangeValue(value: number): number | null {\n return isNaN(value) ? null : value;\n }\n\n /**\n * `min` setter.\n *\n * @param value - The component `min` value to be set.\n *\n * @internal\n */\n protected setMin(value: number): void {\n this.min = this.parseRangeValue(value);\n }\n\n /**\n * `max` setter.\n *\n * @param value - The component `max` value to be set.\n *\n * @internal\n */\n protected setMax(value: number): void {\n this.max = this.parseRangeValue(value);\n }\n\n /**\n * It sets component `min` and `max` values to null and it emits the change if component is\n * working in instant mode.\n *\n * @internal\n */\n protected clearValues(): void {\n this.min = null;\n this.max = null;\n }\n\n /**\n * It emits {@link FacetsXEvents.UserModifiedEditableNumberRangeFilter} event if there are no\n * errors and component `min` and `max` values are different than `filter.range` ones.\n *\n * @internal\n */\n protected emitUserModifiedFilter(): void {\n if (!this.hasError && this.areValuesDifferent) {\n this.$x.emit('UserModifiedEditableNumberRangeFilter', {\n ...this.filter,\n range: this.range\n });\n }\n }\n\n protected rangeFilterMin = 'minimum amount';\n protected rangeFilterMax = 'maximum amount';\n }\n</script>\n\n<style lang=\"scss\">\n .x-editable-number-range-filter {\n &--error {\n .x-editable-number-range-filter__input {\n border-color: red;\n }\n }\n }\n</style>\n\n<docs lang=\"mdx\">\n## Example\n\nRenders an editable number range filter. It has two input fields to handle min and max values,\nemitting the needed events when clicked.\n\nIt provides a default slot, with some utils bind, to customize the whole component; and two named\nslots `apply-content` and `clear-content` to override each button content.\n\nIf `instant` prop is true, the needed events are emitted immediately; else, apply button is rendered\nto confirm to do it. False by default.\n\nIf `clear` prop is true, clear button, which sets to null component min and max values, is rendered.\nTrue by default.\n\n### Basic usage\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\" />\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Properties\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\" :isInstant=\"true\" :hasClearButton=\"false\" />\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Customizing content slots\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\">\n <template name=\"apply-content\">Apply</template>\n <template name=\"clear-content\">Clear</template>\n </EditableNumberRangeFilter>\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Customizing default slot\n\n```vue\n<template>\n <EditableNumberRangeFilter\n :filter=\"editableFilter\"\n #default=\"{ min, max, setMin, setMax, emitUserModifiedFilter, clearValues, hasError }\"\n >\n <button @click=\"emitUserModifiedFilter\">✅ Apply!</button>\n <button @click=\"clearValues\">🗑 Clear!</button>\n <input :value=\"min\" @change=\"setMin($event.target.valueAsNumber)\" />\n <input :value=\"max\" @change=\"setMax($event.target.valueAsNumber)\" />\n <div class=\"has-error\" v-if=\"hasError\">⚠️ Invalid range values</div>\n </EditableNumberRangeFilter>\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserModifiedEditableNumberRangeFilter`: this event is emitted instantly after typing the value or\n clicking the submit button. The event payload in both cases is an object containing the filter and\n the new value for the range.\n</docs>\n"],"names":[],"mappings":";;;;;AAEA,MAAc,cAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"editable-number-range-filter.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue"],"sourcesContent":["<template>\n <div\n class=\"x-editable-number-range-filter\"\n :class=\"cssClasses\"\n data-test=\"editable-number-range-filter\"\n >\n <!--\n @slot Empty slot used to customize the whole component.\n @binding {min} number - Component min value.\n @binding {max} number - Component max value.\n @binding {setMin} function - Component min setter.\n @binding {setMax} function - Component max setter.\n @binding {emitUserModifiedFilter} function - It emits the\n `UserModifiedEditableNumberRangeFilter` X event.\n @binding {clearValues} function - It sets component min and max values to null.\n @binding {hasError} boolean - Returns true when there is an error with component values.\n -->\n <slot v-bind=\"{ min, max, setMin, setMax, emitUserModifiedFilter, clearValues, hasError }\">\n <!-- eslint-disable max-len -->\n <input\n @change=\"setMin($event.target.valueAsNumber)\"\n name=\"min\"\n type=\"number\"\n class=\"x-input x-editable-number-range-filter__input x-editable-number-range-filter__input--min\"\n :value=\"min\"\n data-test=\"range-min\"\n :aria-label=\"rangeFilterMin\"\n />\n\n <input\n @change=\"setMax($event.target.valueAsNumber)\"\n name=\"max\"\n type=\"number\"\n class=\"x-input x-editable-number-range-filter__input x-editable-number-range-filter__input--max\"\n :value=\"max\"\n data-test=\"range-max\"\n :aria-label=\"rangeFilterMax\"\n />\n <!-- eslint-enable max-len -->\n\n <button\n v-if=\"!isInstant\"\n @click=\"emitUserModifiedFilter\"\n class=\"x-button x-editable-number-range-filter__apply\"\n :disabled=\"hasError\"\n data-test=\"range-apply\"\n >\n <!--\n @slot Slot used to customize the apply button content.\n -->\n <slot name=\"apply-content\">✓</slot>\n </button>\n\n <button\n v-if=\"renderClearButton\"\n @click=\"clearValues\"\n class=\"x-button x-editable-number-range-filter__clear\"\n data-test=\"range-clear\"\n >\n <!--\n @slot Slot used to customize the clear button content.\n -->\n <slot name=\"clear-content\">𐄂</slot>\n </button>\n </slot>\n </div>\n</template>\n\n<script lang=\"ts\">\n import {\n EditableNumberRangeFilter as EditableNumberRangeFilterModel,\n RangeValue\n } from '@empathyco/x-types';\n import { Component, Prop, Vue, Watch } from 'vue-property-decorator';\n import { VueCSSClasses } from '../../../../utils/types';\n import { facetsXModule } from '../../x-module';\n import { xComponentMixin } from '../../../../components/x-component.mixin';\n\n /**\n * Renders an editable number range filter. It has two input fields to handle min and max values,\n * emitting the needed events when clicked.\n *\n * It provides a default slot, with some utils bind, to customize the whole component; and two\n * named slots `apply-content` and `clear-content` to override each button content.\n *\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(facetsXModule)]\n })\n export default class EditableNumberRangeFilter extends Vue {\n /**\n * Component min value.\n *\n * @internal\n */\n protected min: RangeValue['min'] = null;\n /**\n * Component max value.\n *\n * @internal\n */\n protected max: RangeValue['max'] = null;\n\n /**\n * The filter data to render and edit.\n *\n * @public\n */\n @Prop({ required: true })\n public filter!: EditableNumberRangeFilterModel;\n\n /**\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * @public\n */\n @Prop({ default: false })\n public isInstant!: boolean;\n\n /**\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Prop({ default: true })\n public hasClearButton!: boolean;\n\n /**\n * It watches the filter range values passed as property and updates component range values if\n * they change.\n *\n * @param newRange - New range value.\n *\n * @internal\n */\n @Watch('filter.range', { immediate: true, deep: true })\n onFilterChanged(newRange: RangeValue): void {\n this.min = newRange.min;\n this.max = newRange.max;\n }\n\n /**\n * It watches range values in order to emit the event with the change if `isInstant`\n * property is true.\n *\n * @internal\n */\n @Watch('range', { deep: true })\n protected instantEmitUserModifiedFilter(): void {\n if (this.isInstant) {\n this.emitUserModifiedFilter();\n }\n }\n\n /**\n * Dynamic CSS classes.\n *\n * @returns Object which contains dynamic CSS classes.\n *\n * @internal\n */\n protected get cssClasses(): VueCSSClasses {\n return { 'x-editable-number-range-filter--error': this.hasError };\n }\n\n /**\n * Returns {@link @empathyco/x-types#RangeValue | RangeValue} with component min and max\n * values.\n *\n * @returns Range value object with component values.\n *\n * @internal\n */\n protected get range(): RangeValue {\n return { min: this.min, max: this.max };\n }\n\n /**\n * It returns true if the property `hasClearButton` is true and there are values to clear.\n *\n * @returns True if the clear button has to be rendered.\n *\n * @internal\n */\n protected get renderClearButton(): boolean {\n return this.hasClearButton && (this.min !== null || this.max !== null);\n }\n\n /**\n * It checks if component min and max values are valid.\n *\n * @returns True if there is any error in the component min and max values.\n *\n * @internal\n */\n protected get hasError(): boolean {\n return this.min !== null && this.max !== null && this.min > this.max;\n }\n\n /**\n * It checks if component min and max values are different than the ones within the filter\n * provided as property.\n *\n * @returns True if they are different.\n *\n * @internal\n */\n protected get areValuesDifferent(): boolean {\n return this.min !== this.filter.range.min || this.max !== this.filter.range.max;\n }\n\n /**\n * It returns the number if possible or null otherwise.\n *\n * @param value - Value.\n * @returns The element value as a number if possible or null.\n *\n * @internal\n */\n protected parseRangeValue(value: number): number | null {\n return isNaN(value) ? null : value;\n }\n\n /**\n * `min` setter.\n *\n * @param value - The component `min` value to be set.\n *\n * @internal\n */\n protected setMin(value: number): void {\n this.min = this.parseRangeValue(value);\n }\n\n /**\n * `max` setter.\n *\n * @param value - The component `max` value to be set.\n *\n * @internal\n */\n protected setMax(value: number): void {\n this.max = this.parseRangeValue(value);\n }\n\n /**\n * It sets component `min` and `max` values to null and it emits the change if component is\n * working in instant mode.\n *\n * @internal\n */\n protected clearValues(): void {\n this.min = null;\n this.max = null;\n }\n\n /**\n * It emits {@link FacetsXEvents.UserModifiedEditableNumberRangeFilter} event if there are no\n * errors and component `min` and `max` values are different than `filter.range` ones.\n *\n * @internal\n */\n protected emitUserModifiedFilter(): void {\n if (!this.hasError && this.areValuesDifferent) {\n this.$x.emit('UserModifiedEditableNumberRangeFilter', {\n ...this.filter,\n range: this.range\n });\n }\n }\n\n protected rangeFilterMin = 'minimum amount';\n protected rangeFilterMax = 'maximum amount';\n }\n</script>\n\n<style lang=\"scss\">\n .x-editable-number-range-filter {\n &--error {\n .x-editable-number-range-filter__input {\n border-color: red;\n }\n }\n }\n</style>\n\n<docs lang=\"mdx\">\n## Example\n\nRenders an editable number range filter. It has two input fields to handle min and max values,\nemitting the needed events when clicked.\n\nIt provides a default slot, with some utils bind, to customize the whole component; and two named\nslots `apply-content` and `clear-content` to override each button content.\n\nIf `instant` prop is true, the needed events are emitted immediately; else, apply button is rendered\nto confirm to do it. False by default.\n\nIf `clear` prop is true, clear button, which sets to null component min and max values, is rendered.\nTrue by default.\n\n### Basic usage\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\" />\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Properties\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\" :isInstant=\"true\" :hasClearButton=\"false\" />\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Customizing content slots\n\n```vue\n<template>\n <EditableNumberRangeFilter :filter=\"editableFilter\">\n <template name=\"apply-content\">Apply</template>\n <template name=\"clear-content\">Clear</template>\n </EditableNumberRangeFilter>\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n### Customizing default slot\n\n```vue\n<template>\n <EditableNumberRangeFilter\n :filter=\"editableFilter\"\n #default=\"{ min, max, setMin, setMax, emitUserModifiedFilter, clearValues, hasError }\"\n >\n <button @click=\"emitUserModifiedFilter\">✅ Apply!</button>\n <button @click=\"clearValues\">🗑 Clear!</button>\n <input :value=\"min\" @change=\"setMin($event.target.valueAsNumber)\" />\n <input :value=\"max\" @change=\"setMax($event.target.valueAsNumber)\" />\n <div class=\"has-error\" v-if=\"hasError\">⚠️ Invalid range values</div>\n </EditableNumberRangeFilter>\n</template>\n\n<script>\n import { EditableNumberRangeFilter } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n EditableNumberRangeFilter\n },\n data() {\n return {\n editableFilter: {\n facetId: 'age',\n id: 'age:primary',\n label: 'primary',\n modelName: 'EditableNumberRangeFilter',\n range: {\n min: null,\n max: null\n }\n }\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserModifiedEditableNumberRangeFilter`: this event is emitted instantly after typing the value or\n clicking the submit button. The event payload in both cases is an object containing the filter and\n the new value for the range.\n</docs>\n"],"names":[],"mappings":";;;;;AAEA,MAAc,cAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editable-number-range-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
|
|
1
|
+
{"version":3,"file":"editable-number-range-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n import {\n EditableNumberRangeFilter as EditableNumberRangeFilterModel,\n RangeValue\n } from '@empathyco/x-types';\n import { Component, Prop, Vue, Watch } from 'vue-property-decorator';\n import { VueCSSClasses } from '../../../../utils/types';\n import { facetsXModule } from '../../x-module';\n import { xComponentMixin } from '../../../../components/x-component.mixin';\n\n /**\n * Renders an editable number range filter. It has two input fields to handle min and max values,\n * emitting the needed events when clicked.\n *\n * It provides a default slot, with some utils bind, to customize the whole component; and two\n * named slots `apply-content` and `clear-content` to override each button content.\n *\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(facetsXModule)]\n })\n export default class EditableNumberRangeFilter extends Vue {\n /**\n * Component min value.\n *\n * @internal\n */\n protected min: RangeValue['min'] = null;\n /**\n * Component max value.\n *\n * @internal\n */\n protected max: RangeValue['max'] = null;\n\n /**\n * The filter data to render and edit.\n *\n * @public\n */\n @Prop({ required: true })\n public filter!: EditableNumberRangeFilterModel;\n\n /**\n * If `instant` prop is true, the needed events are emitted immediately; else, apply button is\n * rendered to confirm to do it. False by default.\n *\n * @public\n */\n @Prop({ default: false })\n public isInstant!: boolean;\n\n /**\n * If `clear` prop is true, clear button, which sets to null component min and max values, is\n * rendered. True by default.\n *\n * @public\n */\n @Prop({ default: true })\n public hasClearButton!: boolean;\n\n /**\n * It watches the filter range values passed as property and updates component range values if\n * they change.\n *\n * @param newRange - New range value.\n *\n * @internal\n */\n @Watch('filter.range', { immediate: true, deep: true })\n onFilterChanged(newRange: RangeValue): void {\n this.min = newRange.min;\n this.max = newRange.max;\n }\n\n /**\n * It watches range values in order to emit the event with the change if `isInstant`\n * property is true.\n *\n * @internal\n */\n @Watch('range', { deep: true })\n protected instantEmitUserModifiedFilter(): void {\n if (this.isInstant) {\n this.emitUserModifiedFilter();\n }\n }\n\n /**\n * Dynamic CSS classes.\n *\n * @returns Object which contains dynamic CSS classes.\n *\n * @internal\n */\n protected get cssClasses(): VueCSSClasses {\n return { 'x-editable-number-range-filter--error': this.hasError };\n }\n\n /**\n * Returns {@link @empathyco/x-types#RangeValue | RangeValue} with component min and max\n * values.\n *\n * @returns Range value object with component values.\n *\n * @internal\n */\n protected get range(): RangeValue {\n return { min: this.min, max: this.max };\n }\n\n /**\n * It returns true if the property `hasClearButton` is true and there are values to clear.\n *\n * @returns True if the clear button has to be rendered.\n *\n * @internal\n */\n protected get renderClearButton(): boolean {\n return this.hasClearButton && (this.min !== null || this.max !== null);\n }\n\n /**\n * It checks if component min and max values are valid.\n *\n * @returns True if there is any error in the component min and max values.\n *\n * @internal\n */\n protected get hasError(): boolean {\n return this.min !== null && this.max !== null && this.min > this.max;\n }\n\n /**\n * It checks if component min and max values are different than the ones within the filter\n * provided as property.\n *\n * @returns True if they are different.\n *\n * @internal\n */\n protected get areValuesDifferent(): boolean {\n return this.min !== this.filter.range.min || this.max !== this.filter.range.max;\n }\n\n /**\n * It returns the number if possible or null otherwise.\n *\n * @param value - Value.\n * @returns The element value as a number if possible or null.\n *\n * @internal\n */\n protected parseRangeValue(value: number): number | null {\n return isNaN(value) ? null : value;\n }\n\n /**\n * `min` setter.\n *\n * @param value - The component `min` value to be set.\n *\n * @internal\n */\n protected setMin(value: number): void {\n this.min = this.parseRangeValue(value);\n }\n\n /**\n * `max` setter.\n *\n * @param value - The component `max` value to be set.\n *\n * @internal\n */\n protected setMax(value: number): void {\n this.max = this.parseRangeValue(value);\n }\n\n /**\n * It sets component `min` and `max` values to null and it emits the change if component is\n * working in instant mode.\n *\n * @internal\n */\n protected clearValues(): void {\n this.min = null;\n this.max = null;\n }\n\n /**\n * It emits {@link FacetsXEvents.UserModifiedEditableNumberRangeFilter} event if there are no\n * errors and component `min` and `max` values are different than `filter.range` ones.\n *\n * @internal\n */\n protected emitUserModifiedFilter(): void {\n if (!this.hasError && this.areValuesDifferent) {\n this.$x.emit('UserModifiedEditableNumberRangeFilter', {\n ...this.filter,\n range: this.range\n });\n }\n }\n\n protected rangeFilterMin = 'minimum amount';\n protected rangeFilterMax = 'maximum amount';\n }\n"],"names":[],"mappings":";;;;;AA8EE;;;;;;;;;;;;;;AAcG;AAIH,IAAqB,yBAAyB,GAA9C,MAAqB,yBAA0B,SAAQ,GAAG,CAAA;AAA1D,IAAA,WAAA,GAAA;;AACE;;;;AAIG;QACO,IAAG,CAAA,GAAA,GAAsB,IAAI,CAAC;AACxC;;;;AAIG;QACO,IAAG,CAAA,GAAA,GAAsB,IAAI,CAAC;QA4K9B,IAAc,CAAA,cAAA,GAAG,gBAAgB,CAAC;QAClC,IAAc,CAAA,cAAA,GAAG,gBAAgB,CAAC;KAC7C;AAlJC;;;;;;;AAOG;AAEH,IAAA,eAAe,CAAC,QAAoB,EAAA;AAClC,QAAA,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC;AACxB,QAAA,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC;KACzB;AAED;;;;;AAKG;IAEO,6BAA6B,GAAA;QACrC,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,sBAAsB,EAAE,CAAC;AAC/B,SAAA;KACF;AAED;;;;;;AAMG;AACH,IAAA,IAAc,UAAU,GAAA;AACtB,QAAA,OAAO,EAAE,uCAAuC,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;KACnE;AAED;;;;;;;AAOG;AACH,IAAA,IAAc,KAAK,GAAA;AACjB,QAAA,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC;KACzC;AAED;;;;;;AAMG;AACH,IAAA,IAAc,iBAAiB,GAAA;AAC7B,QAAA,OAAO,IAAI,CAAC,cAAc,KAAK,IAAI,CAAC,GAAG,KAAK,IAAI,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC;KACxE;AAED;;;;;;AAMG;AACH,IAAA,IAAc,QAAQ,GAAA;AACpB,QAAA,OAAO,IAAI,CAAC,GAAG,KAAK,IAAI,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI,IAAI,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;KACtE;AAED;;;;;;;AAOG;AACH,IAAA,IAAc,kBAAkB,GAAA;QAC9B,OAAO,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC;KACjF;AAED;;;;;;;AAOG;AACO,IAAA,eAAe,CAAC,KAAa,EAAA;AACrC,QAAA,OAAO,KAAK,CAAC,KAAK,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC;KACpC;AAED;;;;;;AAMG;AACO,IAAA,MAAM,CAAC,KAAa,EAAA;QAC5B,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;KACxC;AAED;;;;;;AAMG;AACO,IAAA,MAAM,CAAC,KAAa,EAAA;QAC5B,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;KACxC;AAED;;;;;AAKG;IACO,WAAW,GAAA;AACnB,QAAA,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;AAChB,QAAA,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;KACjB;AAED;;;;;AAKG;IACO,sBAAsB,GAAA;QAC9B,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,kBAAkB,EAAE;AAC7C,YAAA,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,uCAAuC,EAAE;gBACpD,GAAG,IAAI,CAAC,MAAM;gBACd,KAAK,EAAE,IAAI,CAAC,KAAK;AAClB,aAAA,CAAC,CAAC;AACJ,SAAA;KACF;CAIF,CAAA;AAtKC,UAAA,CAAA;AADC,IAAA,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AACsB,CAAA,EAAA,yBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAS/C,UAAA,CAAA;AADC,IAAA,IAAI,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AACE,CAAA,EAAA,yBAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAS3B,UAAA,CAAA;AADC,IAAA,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACQ,CAAA,EAAA,yBAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAWhC,UAAA,CAAA;AADC,IAAA,KAAK,CAAC,cAAc,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;AAItD,CAAA,EAAA,yBAAA,CAAA,SAAA,EAAA,iBAAA,EAAA,IAAA,CAAA,CAAA;AASD,UAAA,CAAA;IADC,KAAK,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;AAK9B,CAAA,EAAA,yBAAA,CAAA,SAAA,EAAA,+BAAA,EAAA,IAAA,CAAA,CAAA;AAjEkB,yBAAyB,GAAA,UAAA,CAAA;AAH7C,IAAA,SAAS,CAAC;AACT,QAAA,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;AACmB,CAAA,EAAA,yBAAyB,CA0L7C,CAAA;aA1LoB,yBAAyB;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@empathyco/x-components",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.293",
|
|
4
4
|
"description": "Empathy X Components",
|
|
5
5
|
"author": "Empathy Systems Corporation S.L.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -66,11 +66,11 @@
|
|
|
66
66
|
"cypress:open:component:firefox": "cypress open --component --browser firefox"
|
|
67
67
|
},
|
|
68
68
|
"dependencies": {
|
|
69
|
-
"@empathyco/x-adapter": "^8.0.0-alpha.
|
|
70
|
-
"@empathyco/x-deep-merge": "^1.3.0-alpha.
|
|
69
|
+
"@empathyco/x-adapter": "^8.0.0-alpha.22",
|
|
70
|
+
"@empathyco/x-deep-merge": "^1.3.0-alpha.29",
|
|
71
71
|
"@empathyco/x-logger": "^1.2.0-alpha.6",
|
|
72
72
|
"@empathyco/x-storage-service": "^2.0.0-alpha.6",
|
|
73
|
-
"@empathyco/x-types": "^10.0.0-alpha.
|
|
73
|
+
"@empathyco/x-types": "^10.0.0-alpha.56",
|
|
74
74
|
"@empathyco/x-utils": "^1.0.0-alpha.14",
|
|
75
75
|
"@vue/devtools-api": "~6.4.5",
|
|
76
76
|
"rxjs": "~7.8.0",
|
|
@@ -88,8 +88,8 @@
|
|
|
88
88
|
"@badeball/cypress-cucumber-preprocessor": "~15.0.0",
|
|
89
89
|
"@bahmutov/cypress-esbuild-preprocessor": "~2.1.5",
|
|
90
90
|
"@cypress/vue": "~2.2.4",
|
|
91
|
-
"@empathyco/x-adapter-platform": "^1.0.0-alpha.
|
|
92
|
-
"@empathyco/x-tailwindcss": "^0.2.0-alpha.
|
|
91
|
+
"@empathyco/x-adapter-platform": "^1.0.0-alpha.59",
|
|
92
|
+
"@empathyco/x-tailwindcss": "^0.2.0-alpha.54",
|
|
93
93
|
"@microsoft/api-documenter": "~7.19.27",
|
|
94
94
|
"@microsoft/api-extractor": "~7.33.7",
|
|
95
95
|
"@rollup/plugin-commonjs": "~24.0.0",
|
|
@@ -138,5 +138,5 @@
|
|
|
138
138
|
"access": "public",
|
|
139
139
|
"directory": "dist"
|
|
140
140
|
},
|
|
141
|
-
"gitHead": "
|
|
141
|
+
"gitHead": "bb92e0826e5b29ddd2a7d95480b88be02e5a761d"
|
|
142
142
|
}
|
package/report/x-types.api.json
CHANGED
|
@@ -491,7 +491,7 @@
|
|
|
491
491
|
},
|
|
492
492
|
{
|
|
493
493
|
"kind": "Content",
|
|
494
|
-
"text": "typeof "
|
|
494
|
+
"text": "(typeof "
|
|
495
495
|
},
|
|
496
496
|
{
|
|
497
497
|
"kind": "Reference",
|
|
@@ -500,7 +500,7 @@
|
|
|
500
500
|
},
|
|
501
501
|
{
|
|
502
502
|
"kind": "Content",
|
|
503
|
-
"text": "[number]"
|
|
503
|
+
"text": ")[number]"
|
|
504
504
|
},
|
|
505
505
|
{
|
|
506
506
|
"kind": "Content",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"api.types.d.ts","sourceRoot":"","sources":["../../../../src/x-installer/api/api.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD;;;;;GAKG;AACH,MAAM,WAAW,IAAI;IACnB;;;;;;;OAOG;IACH,gBAAgB,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3C;;;;;OAKG;IACH,MAAM,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IAExB;;;;;;;OAOG;IACH,eAAe,CAAC,YAAY,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,GAAG,IAAI,CAAC;IAErE;;;;;;OAMG;IACH,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC;IAEvD;;;;;;OAMG;IACH,wBAAwB,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,GAAG,IAAI,CAAC;IAEnF;;;;;;OAMG;IACH,MAAM,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;;;;;OAMG;IACH,IAAI,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,CAAC;CACnC;AAED;;;;GAIG;AACH,oBAAY,eAAe,GAAG,OAAO,
|
|
1
|
+
{"version":3,"file":"api.types.d.ts","sourceRoot":"","sources":["../../../../src/x-installer/api/api.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD;;;;;GAKG;AACH,MAAM,WAAW,IAAI;IACnB;;;;;;;OAOG;IACH,gBAAgB,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3C;;;;;OAKG;IACH,MAAM,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IAExB;;;;;;;OAOG;IACH,eAAe,CAAC,YAAY,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,IAAI,GAAG,IAAI,CAAC;IAErE;;;;;;OAMG;IACH,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC;IAEvD;;;;;;OAMG;IACH,wBAAwB,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,GAAG,IAAI,CAAC;IAEnF;;;;;;OAMG;IACH,MAAM,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;;;;;OAMG;IACH,IAAI,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,CAAC;CACnC;AAED;;;;GAIG;AACH,oBAAY,eAAe,GAAG,OAAO,CAAC;KACnC,KAAK,IAAI,MAAM,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,KAAK,CAAC,EAAE,QAAQ,EAAE,YAAY,KAAK,OAAO;CACtF,CAAC,CAAC;AAEH;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAC5B,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,oCAAoC;IACpC,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,wFAAwF;IACxF,IAAI,EAAE,MAAM,CAAC;IACb,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yBAAyB;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0BAA0B;IAC1B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,+FAA+F;IAC/F,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,wEAAwE;IACxE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,kCAAkC;IAClC,cAAc,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACpC,oDAAoD;IACpD,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B;AAED;;;;GAIG;AACH,oBAAY,uBAAuB,GAAG,kBAAkB,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;AAElF;;;;GAIG;AACH,MAAM,WAAW,gBAAgB;IAC/B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mEAAmE;IACnE,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editable-number-range-filter.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"editable-number-range-filter.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../../../src/x-modules/facets/components/filters/editable-number-range-filter.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"AAqEE,OAAO,EACL,yBAAyB,IAAI,8BAA8B,EAC3D,UAAU,EACX,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAmB,GAAG,EAAS,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAIxD;;;;;;;;;;;;;;GAcG;AAIH,MAAM,CAAC,OAAO,OAAO,yBAA0B,SAAQ,GAAG;IACxD;;;;OAIG;IACH,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,CAAC,CAAQ;IACxC;;;;OAIG;IACH,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,KAAK,CAAC,CAAQ;IAExC;;;;OAIG;IAEI,MAAM,EAAG,8BAA8B,CAAC;IAE/C;;;;;OAKG;IAEI,SAAS,EAAG,OAAO,CAAC;IAE3B;;;;;OAKG;IAEI,cAAc,EAAG,OAAO,CAAC;IAEhC;;;;;;;OAOG;IAEH,eAAe,CAAC,QAAQ,EAAE,UAAU,GAAG,IAAI;IAK3C;;;;;OAKG;IAEH,SAAS,CAAC,6BAA6B,IAAI,IAAI;IAM/C;;;;;;OAMG;IACH,SAAS,KAAK,UAAU,IAAI,aAAa,CAExC;IAED;;;;;;;OAOG;IACH,SAAS,KAAK,KAAK,IAAI,UAAU,CAEhC;IAED;;;;;;OAMG;IACH,SAAS,KAAK,iBAAiB,IAAI,OAAO,CAEzC;IAED;;;;;;OAMG;IACH,SAAS,KAAK,QAAQ,IAAI,OAAO,CAEhC;IAED;;;;;;;OAOG;IACH,SAAS,KAAK,kBAAkB,IAAI,OAAO,CAE1C;IAED;;;;;;;OAOG;IACH,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI;IAIvD;;;;;;OAMG;IACH,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAIrC;;;;;;OAMG;IACH,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAIrC;;;;;OAKG;IACH,SAAS,CAAC,WAAW,IAAI,IAAI;IAK7B;;;;;OAKG;IACH,SAAS,CAAC,sBAAsB,IAAI,IAAI;IASxC,SAAS,CAAC,cAAc,SAAoB;IAC5C,SAAS,CAAC,cAAc,SAAoB;CAC7C"}
|