@brightspace-ui/core 2.2.0 → 2.2.1
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/components/filter/README.md +19 -0
- package/package.json +1 -1
|
@@ -131,6 +131,25 @@ Filter with a single dimension:
|
|
|
131
131
|
</div>
|
|
132
132
|
```
|
|
133
133
|
|
|
134
|
+
### Iterating Over Dimensions and Values
|
|
135
|
+
|
|
136
|
+
Lit tries to reuse DOM nodes when it can to help with performance, but in this case we don't want unique dimensions and values to be reused - otherwise we can't detect additions/removals properly.
|
|
137
|
+
|
|
138
|
+
If you are going to be constructing your dimensions and/or dimension values by iterating over an array or object (using `forEach,` , `map`, etc.), you'll want to use the [Lit `repeat` directive with a `KeyFn` set](https://lit.dev/docs/templates/directives/#repeat) instead to tell Lit not to reuse a DOM node if the `key` has changed:
|
|
139
|
+
```js
|
|
140
|
+
import { repeat } from 'lit-html/directives/repeat.js';
|
|
141
|
+
...
|
|
142
|
+
return html`<d2l-filter>
|
|
143
|
+
${repeat(this._dimensions, (dim) => dim.key, dim => html`
|
|
144
|
+
<d2l-filter-dimension-set key="${dim.key}" text=${dim.text}>
|
|
145
|
+
${repeat(dim._values, (value) => value.key, value => html`
|
|
146
|
+
<d2l-filter-dimension-set-value key="${value.kay}" text="${value.text}" ?selected="${value.selected}"></d2l-filter-dimension-set-value>
|
|
147
|
+
`)}
|
|
148
|
+
</d2l-filter-dimension-set>
|
|
149
|
+
`)}
|
|
150
|
+
</d2l-filter>`;
|
|
151
|
+
```
|
|
152
|
+
|
|
134
153
|
### Accessibility
|
|
135
154
|
The filter will announce changes to filter selections, search results, and when filters are being cleared. It is up to the consumer to then announce when these changes have propagated and resulted in new/loaded/updated data on the page. This is very important for screenreader users who are not able to visually see the page changing behind the filter control as selections are made.
|
|
136
155
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brightspace-ui/core",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.1",
|
|
4
4
|
"description": "A collection of accessible, free, open-source web components for building Brightspace applications",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": "https://github.com/BrightspaceUI/core.git",
|