@brightspace-ui-labs/facet-filter-sort 5.2.1 → 5.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -57,30 +57,11 @@ To Do
|
|
|
57
57
|
|
|
58
58
|
To Do
|
|
59
59
|
|
|
60
|
-
### d2l-labs-applied-core-filters
|
|
61
|
-
|
|
62
|
-
The same design as the deprecated `d2l-labs-applied-filters` below, but this version works with the `d2l-filter` component in `core`. It supports hooking up to multiple filters and will be migrated to `core` once designs are finalized.
|
|
63
|
-
|
|
64
|
-
#### Attributes
|
|
65
|
-
|
|
66
|
-
- `filter-ids`: Ids (space-delimited) of the filter components to subscribe to
|
|
67
|
-
- `label-text` (optional): The text displayed in this component's label. Defaults to "Applied Filters:".
|
|
68
|
-
|
|
69
|
-
#### Usage
|
|
70
|
-
|
|
71
|
-
Set the `filter-ids` param to the ids of the `d2l-filter`s that you want to track.
|
|
72
|
-
The `d2l-filter`s must be in the same DOM scope.
|
|
73
|
-
|
|
74
|
-
```html
|
|
75
|
-
<d2l-filter id="course"> ... </d2l-filter>
|
|
76
|
-
<d2l-filter id="role"> ... </d2l-filter>
|
|
77
|
-
<d2l-labs-applied-core-filters filter-ids="course role"></d2l-labs-applied-core-filters>
|
|
78
|
-
```
|
|
79
|
-
|
|
80
60
|
## Deprecated Components
|
|
81
61
|
|
|
82
62
|
- [d2l-labs-filter-dropdown](#d2l-labs-filter-dropdown)
|
|
83
63
|
- [d2l-labs-applied-filters](#d2l-labs-applied-filters)
|
|
64
|
+
- [d2l-labs-applied-core-filters](#d2l-labs-applied-core-filters)
|
|
84
65
|
|
|
85
66
|
### d2l-labs-filter-dropdown
|
|
86
67
|
|
|
@@ -197,6 +178,28 @@ This also works if the `d2l-labs-filter-dropdown` is a child in the shadow-dom o
|
|
|
197
178
|
<d2l-labs-filter-dropdown id="filter"> ... </d2l-labs-filter-dropdown>
|
|
198
179
|
```
|
|
199
180
|
|
|
181
|
+
### d2l-labs-applied-core-filters
|
|
182
|
+
|
|
183
|
+
**DEPRECATED: Use [`d2l-filter-tags`](https://github.com/BrightspaceUI/core/tree/main/components/filter#tags-for-applied-filters-d2l-filter-tags) in `BrightspaceUI/core`.**
|
|
184
|
+
|
|
185
|
+
The same design as the deprecated `d2l-labs-applied-filters` above, but this version works with the `d2l-filter` component in `core`. It supports hooking up to multiple filters and will be migrated to `core` once designs are finalized.
|
|
186
|
+
|
|
187
|
+
#### Attributes
|
|
188
|
+
|
|
189
|
+
- `filter-ids`: Ids (space-delimited) of the filter components to subscribe to
|
|
190
|
+
- `label-text` (optional): The text displayed in this component's label. Defaults to "Applied Filters:".
|
|
191
|
+
|
|
192
|
+
#### Usage
|
|
193
|
+
|
|
194
|
+
Set the `filter-ids` param to the ids of the `d2l-filter`s that you want to track.
|
|
195
|
+
The `d2l-filter`s must be in the same DOM scope.
|
|
196
|
+
|
|
197
|
+
```html
|
|
198
|
+
<d2l-filter id="course"> ... </d2l-filter>
|
|
199
|
+
<d2l-filter id="role"> ... </d2l-filter>
|
|
200
|
+
<d2l-labs-applied-core-filters filter-ids="course role"></d2l-labs-applied-core-filters>
|
|
201
|
+
```
|
|
202
|
+
|
|
200
203
|
## Developing
|
|
201
204
|
|
|
202
205
|
After cloning the repo, run `npm install` to install dependencies.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '@brightspace-ui/core/components/colors/colors.js';
|
|
2
2
|
import '@brightspace-ui/core/components/inputs/input-checkbox-spacer.js';
|
|
3
|
-
import '
|
|
3
|
+
import '@brightspace-ui/typography/d2l-typography-shared-styles.js';
|
|
4
4
|
import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
|
|
5
5
|
import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
|
|
6
6
|
import { LocalizeBehavior } from '../localize-behavior.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import '@brightspace-ui/core/components/inputs/input-checkbox.js';
|
|
2
|
-
import '
|
|
2
|
+
import '@brightspace-ui/localize-behavior/d2l-localize-behavior.js';
|
|
3
3
|
import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
|
|
4
4
|
import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
|
|
5
5
|
|
package/custom-elements.json
CHANGED
|
@@ -100,6 +100,23 @@
|
|
|
100
100
|
"description": "The number of selected filter options for that filter category. When options are selected and de-selected, the consumer is responsible for updating this number after updating its own data store.",
|
|
101
101
|
"type": "number",
|
|
102
102
|
"default": "0"
|
|
103
|
+
},
|
|
104
|
+
{
|
|
105
|
+
"name": "text",
|
|
106
|
+
"description": "REQUIRED: The text used for the tab, as well as labelling the panel",
|
|
107
|
+
"type": "string"
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
"name": "no-padding",
|
|
111
|
+
"description": "Opt out of default padding/whitespace around the panel",
|
|
112
|
+
"type": "boolean",
|
|
113
|
+
"default": "false"
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
"name": "selected",
|
|
117
|
+
"description": "Use to select the tab",
|
|
118
|
+
"type": "boolean",
|
|
119
|
+
"default": "false"
|
|
103
120
|
}
|
|
104
121
|
],
|
|
105
122
|
"properties": [
|
|
@@ -136,6 +153,26 @@
|
|
|
136
153
|
"description": "The number of selected filter options for that filter category. When options are selected and de-selected, the consumer is responsible for updating this number after updating its own data store.",
|
|
137
154
|
"type": "number",
|
|
138
155
|
"default": "0"
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
"name": "text",
|
|
159
|
+
"attribute": "text",
|
|
160
|
+
"description": "REQUIRED: The text used for the tab, as well as labelling the panel",
|
|
161
|
+
"type": "string"
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
"name": "noPadding",
|
|
165
|
+
"attribute": "no-padding",
|
|
166
|
+
"description": "Opt out of default padding/whitespace around the panel",
|
|
167
|
+
"type": "boolean",
|
|
168
|
+
"default": "false"
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
"name": "selected",
|
|
172
|
+
"attribute": "selected",
|
|
173
|
+
"description": "Use to select the tab",
|
|
174
|
+
"type": "boolean",
|
|
175
|
+
"default": "false"
|
|
139
176
|
}
|
|
140
177
|
],
|
|
141
178
|
"events": [
|
|
@@ -154,6 +191,14 @@
|
|
|
154
191
|
{
|
|
155
192
|
"name": "d2l-labs-filter-dropdown-option-change",
|
|
156
193
|
"description": "Dispatched when a filter option is selected"
|
|
194
|
+
},
|
|
195
|
+
{
|
|
196
|
+
"name": "d2l-tab-panel-selected",
|
|
197
|
+
"description": "Dispatched when a tab is selected"
|
|
198
|
+
},
|
|
199
|
+
{
|
|
200
|
+
"name": "d2l-tab-panel-text-changed",
|
|
201
|
+
"description": "Dispatched when the text attribute is changed"
|
|
157
202
|
}
|
|
158
203
|
],
|
|
159
204
|
"slots": [
|
|
@@ -167,16 +212,86 @@
|
|
|
167
212
|
"name": "d2l-labs-filter-dropdown-option",
|
|
168
213
|
"path": "./components/filter-dropdown/filter-dropdown-option.js",
|
|
169
214
|
"description": "A filter menu item component.",
|
|
215
|
+
"attributes": [
|
|
216
|
+
{
|
|
217
|
+
"name": "value",
|
|
218
|
+
"description": "REQUIRED: The selectable item's value",
|
|
219
|
+
"type": "string"
|
|
220
|
+
},
|
|
221
|
+
{
|
|
222
|
+
"name": "selected",
|
|
223
|
+
"description": "This will set the item to be selected by default",
|
|
224
|
+
"type": "boolean",
|
|
225
|
+
"default": "false"
|
|
226
|
+
},
|
|
227
|
+
{
|
|
228
|
+
"name": "text",
|
|
229
|
+
"description": "REQUIRED: Text displayed by the menu item",
|
|
230
|
+
"type": "string"
|
|
231
|
+
},
|
|
232
|
+
{
|
|
233
|
+
"name": "description",
|
|
234
|
+
"description": "Provide a description for the menu item that will be used by screen readers",
|
|
235
|
+
"type": "string"
|
|
236
|
+
},
|
|
237
|
+
{
|
|
238
|
+
"name": "disabled",
|
|
239
|
+
"description": "Disables the menu item",
|
|
240
|
+
"type": "boolean",
|
|
241
|
+
"default": "false"
|
|
242
|
+
}
|
|
243
|
+
],
|
|
170
244
|
"properties": [
|
|
171
245
|
{
|
|
172
246
|
"name": "role",
|
|
173
247
|
"type": "string",
|
|
174
248
|
"default": "\"menuitemcheckbox\""
|
|
249
|
+
},
|
|
250
|
+
{
|
|
251
|
+
"name": "value",
|
|
252
|
+
"attribute": "value",
|
|
253
|
+
"description": "REQUIRED: The selectable item's value",
|
|
254
|
+
"type": "string"
|
|
255
|
+
},
|
|
256
|
+
{
|
|
257
|
+
"name": "selected",
|
|
258
|
+
"attribute": "selected",
|
|
259
|
+
"description": "This will set the item to be selected by default",
|
|
260
|
+
"type": "boolean",
|
|
261
|
+
"default": "false"
|
|
262
|
+
},
|
|
263
|
+
{
|
|
264
|
+
"name": "text",
|
|
265
|
+
"attribute": "text",
|
|
266
|
+
"description": "REQUIRED: Text displayed by the menu item",
|
|
267
|
+
"type": "string"
|
|
268
|
+
},
|
|
269
|
+
{
|
|
270
|
+
"name": "description",
|
|
271
|
+
"attribute": "description",
|
|
272
|
+
"description": "Provide a description for the menu item that will be used by screen readers",
|
|
273
|
+
"type": "string"
|
|
274
|
+
},
|
|
275
|
+
{
|
|
276
|
+
"name": "disabled",
|
|
277
|
+
"attribute": "disabled",
|
|
278
|
+
"description": "Disables the menu item",
|
|
279
|
+
"type": "boolean",
|
|
280
|
+
"default": "false"
|
|
175
281
|
}
|
|
176
282
|
],
|
|
177
283
|
"events": [
|
|
178
284
|
{
|
|
179
|
-
"name": "d2l-menu-item-select"
|
|
285
|
+
"name": "d2l-menu-item-select",
|
|
286
|
+
"description": "Dispatched when the menu item is selected"
|
|
287
|
+
},
|
|
288
|
+
{
|
|
289
|
+
"name": "d2l-menu-item-change",
|
|
290
|
+
"description": "Dispatched when the selected menu item changes"
|
|
291
|
+
},
|
|
292
|
+
{
|
|
293
|
+
"name": "d2l-menu-item-visibility-change",
|
|
294
|
+
"description": "Dispatched when the visibility of the menu item changes"
|
|
180
295
|
}
|
|
181
296
|
]
|
|
182
297
|
},
|
|
@@ -314,6 +429,25 @@
|
|
|
314
429
|
"attribute": "no-padding-footer",
|
|
315
430
|
"type": "boolean",
|
|
316
431
|
"default": "false"
|
|
432
|
+
},
|
|
433
|
+
{
|
|
434
|
+
"name": "rootPath",
|
|
435
|
+
"type": "string"
|
|
436
|
+
},
|
|
437
|
+
{
|
|
438
|
+
"name": "importPath",
|
|
439
|
+
"type": "string"
|
|
440
|
+
},
|
|
441
|
+
{
|
|
442
|
+
"name": "root",
|
|
443
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
444
|
+
},
|
|
445
|
+
{
|
|
446
|
+
"name": "$",
|
|
447
|
+
"type": "{ [key: string]: Element; }"
|
|
448
|
+
},
|
|
449
|
+
{
|
|
450
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
317
451
|
}
|
|
318
452
|
],
|
|
319
453
|
"events": [
|
|
@@ -382,6 +516,25 @@
|
|
|
382
516
|
"description": "The value of the grouping name",
|
|
383
517
|
"type": "string",
|
|
384
518
|
"default": "\"\""
|
|
519
|
+
},
|
|
520
|
+
{
|
|
521
|
+
"name": "rootPath",
|
|
522
|
+
"type": "string"
|
|
523
|
+
},
|
|
524
|
+
{
|
|
525
|
+
"name": "importPath",
|
|
526
|
+
"type": "string"
|
|
527
|
+
},
|
|
528
|
+
{
|
|
529
|
+
"name": "root",
|
|
530
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
531
|
+
},
|
|
532
|
+
{
|
|
533
|
+
"name": "$",
|
|
534
|
+
"type": "{ [key: string]: Element; }"
|
|
535
|
+
},
|
|
536
|
+
{
|
|
537
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
385
538
|
}
|
|
386
539
|
],
|
|
387
540
|
"events": [
|
|
@@ -468,6 +621,25 @@
|
|
|
468
621
|
"description": "The value of this option",
|
|
469
622
|
"type": "string",
|
|
470
623
|
"default": "\"\""
|
|
624
|
+
},
|
|
625
|
+
{
|
|
626
|
+
"name": "rootPath",
|
|
627
|
+
"type": "string"
|
|
628
|
+
},
|
|
629
|
+
{
|
|
630
|
+
"name": "importPath",
|
|
631
|
+
"type": "string"
|
|
632
|
+
},
|
|
633
|
+
{
|
|
634
|
+
"name": "root",
|
|
635
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
636
|
+
},
|
|
637
|
+
{
|
|
638
|
+
"name": "$",
|
|
639
|
+
"type": "{ [key: string]: Element; }"
|
|
640
|
+
},
|
|
641
|
+
{
|
|
642
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
471
643
|
}
|
|
472
644
|
],
|
|
473
645
|
"events": [
|
|
@@ -481,6 +653,27 @@
|
|
|
481
653
|
"name": "d2l-labs-search-facets",
|
|
482
654
|
"path": "./components/search-facets/search-facets.js",
|
|
483
655
|
"description": "Polymer-based web component for D2L search facets.",
|
|
656
|
+
"properties": [
|
|
657
|
+
{
|
|
658
|
+
"name": "rootPath",
|
|
659
|
+
"type": "string"
|
|
660
|
+
},
|
|
661
|
+
{
|
|
662
|
+
"name": "importPath",
|
|
663
|
+
"type": "string"
|
|
664
|
+
},
|
|
665
|
+
{
|
|
666
|
+
"name": "root",
|
|
667
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
668
|
+
},
|
|
669
|
+
{
|
|
670
|
+
"name": "$",
|
|
671
|
+
"type": "{ [key: string]: Element; }"
|
|
672
|
+
},
|
|
673
|
+
{
|
|
674
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
675
|
+
}
|
|
676
|
+
],
|
|
484
677
|
"events": [
|
|
485
678
|
{
|
|
486
679
|
"name": "d2l-labs-search-facets-change",
|
|
@@ -542,13 +735,109 @@
|
|
|
542
735
|
"description": "Search query",
|
|
543
736
|
"type": "string",
|
|
544
737
|
"default": "\"\""
|
|
738
|
+
},
|
|
739
|
+
{
|
|
740
|
+
"name": "rootPath",
|
|
741
|
+
"type": "string"
|
|
742
|
+
},
|
|
743
|
+
{
|
|
744
|
+
"name": "importPath",
|
|
745
|
+
"type": "string"
|
|
746
|
+
},
|
|
747
|
+
{
|
|
748
|
+
"name": "root",
|
|
749
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
750
|
+
},
|
|
751
|
+
{
|
|
752
|
+
"name": "$",
|
|
753
|
+
"type": "{ [key: string]: Element; }"
|
|
754
|
+
},
|
|
755
|
+
{
|
|
756
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
545
757
|
}
|
|
546
758
|
]
|
|
547
759
|
},
|
|
548
760
|
{
|
|
549
761
|
"name": "d2l-labs-sort-by-dropdown-option",
|
|
550
762
|
"path": "./components/sort-by-dropdown/sort-by-dropdown-option.js",
|
|
551
|
-
"description": "A dropdown option menu item component."
|
|
763
|
+
"description": "A dropdown option menu item component.",
|
|
764
|
+
"attributes": [
|
|
765
|
+
{
|
|
766
|
+
"name": "value",
|
|
767
|
+
"description": "REQUIRED: The selectable item's value",
|
|
768
|
+
"type": "string"
|
|
769
|
+
},
|
|
770
|
+
{
|
|
771
|
+
"name": "selected",
|
|
772
|
+
"description": "This will set the item to be selected by default",
|
|
773
|
+
"type": "boolean",
|
|
774
|
+
"default": "false"
|
|
775
|
+
},
|
|
776
|
+
{
|
|
777
|
+
"name": "text",
|
|
778
|
+
"description": "REQUIRED: Text displayed by the menu item",
|
|
779
|
+
"type": "string"
|
|
780
|
+
},
|
|
781
|
+
{
|
|
782
|
+
"name": "description",
|
|
783
|
+
"description": "Provide a description for the menu item that will be used by screen readers",
|
|
784
|
+
"type": "string"
|
|
785
|
+
},
|
|
786
|
+
{
|
|
787
|
+
"name": "disabled",
|
|
788
|
+
"description": "Disables the menu item",
|
|
789
|
+
"type": "boolean",
|
|
790
|
+
"default": "false"
|
|
791
|
+
}
|
|
792
|
+
],
|
|
793
|
+
"properties": [
|
|
794
|
+
{
|
|
795
|
+
"name": "value",
|
|
796
|
+
"attribute": "value",
|
|
797
|
+
"description": "REQUIRED: The selectable item's value",
|
|
798
|
+
"type": "string"
|
|
799
|
+
},
|
|
800
|
+
{
|
|
801
|
+
"name": "selected",
|
|
802
|
+
"attribute": "selected",
|
|
803
|
+
"description": "This will set the item to be selected by default",
|
|
804
|
+
"type": "boolean",
|
|
805
|
+
"default": "false"
|
|
806
|
+
},
|
|
807
|
+
{
|
|
808
|
+
"name": "text",
|
|
809
|
+
"attribute": "text",
|
|
810
|
+
"description": "REQUIRED: Text displayed by the menu item",
|
|
811
|
+
"type": "string"
|
|
812
|
+
},
|
|
813
|
+
{
|
|
814
|
+
"name": "description",
|
|
815
|
+
"attribute": "description",
|
|
816
|
+
"description": "Provide a description for the menu item that will be used by screen readers",
|
|
817
|
+
"type": "string"
|
|
818
|
+
},
|
|
819
|
+
{
|
|
820
|
+
"name": "disabled",
|
|
821
|
+
"attribute": "disabled",
|
|
822
|
+
"description": "Disables the menu item",
|
|
823
|
+
"type": "boolean",
|
|
824
|
+
"default": "false"
|
|
825
|
+
}
|
|
826
|
+
],
|
|
827
|
+
"events": [
|
|
828
|
+
{
|
|
829
|
+
"name": "d2l-menu-item-change",
|
|
830
|
+
"description": "Dispatched when the selected menu item changes"
|
|
831
|
+
},
|
|
832
|
+
{
|
|
833
|
+
"name": "d2l-menu-item-select",
|
|
834
|
+
"description": "Dispatched when the menu item is selected"
|
|
835
|
+
},
|
|
836
|
+
{
|
|
837
|
+
"name": "d2l-menu-item-visibility-change",
|
|
838
|
+
"description": "Dispatched when the visibility of the menu item changes"
|
|
839
|
+
}
|
|
840
|
+
]
|
|
552
841
|
},
|
|
553
842
|
{
|
|
554
843
|
"name": "d2l-labs-sort-by-dropdown",
|
|
@@ -619,6 +908,25 @@
|
|
|
619
908
|
"attribute": "value",
|
|
620
909
|
"description": "The value of the currently selected option",
|
|
621
910
|
"type": "string"
|
|
911
|
+
},
|
|
912
|
+
{
|
|
913
|
+
"name": "rootPath",
|
|
914
|
+
"type": "string"
|
|
915
|
+
},
|
|
916
|
+
{
|
|
917
|
+
"name": "importPath",
|
|
918
|
+
"type": "string"
|
|
919
|
+
},
|
|
920
|
+
{
|
|
921
|
+
"name": "root",
|
|
922
|
+
"type": "HTMLElement | StampedTemplate | ShadowRoot | null"
|
|
923
|
+
},
|
|
924
|
+
{
|
|
925
|
+
"name": "$",
|
|
926
|
+
"type": "{ [key: string]: Element; }"
|
|
927
|
+
},
|
|
928
|
+
{
|
|
929
|
+
"name": "PROPERTY_EFFECT_TYPES"
|
|
622
930
|
}
|
|
623
931
|
],
|
|
624
932
|
"events": [
|
package/package.json
CHANGED
|
@@ -44,12 +44,12 @@
|
|
|
44
44
|
"sinon": "^13",
|
|
45
45
|
"stylelint": "^14"
|
|
46
46
|
},
|
|
47
|
-
"version": "5.
|
|
47
|
+
"version": "5.3.0",
|
|
48
48
|
"dependencies": {
|
|
49
49
|
"@brightspace-ui/core": "^2",
|
|
50
|
-
"
|
|
50
|
+
"@brightspace-ui/localize-behavior": "^2",
|
|
51
|
+
"@brightspace-ui/typography": "^8",
|
|
51
52
|
"@brightspace-ui-labs/multi-select": "^6",
|
|
52
|
-
"d2l-typography": "BrightspaceUI/typography#semver:^8",
|
|
53
53
|
"lit-element": "^3",
|
|
54
54
|
"lit-html": "^2",
|
|
55
55
|
"@polymer/polymer": "^3"
|