@brightspace-ui/core 2.15.4 → 2.16.0

package/components/filter/README.md

@@ -159,7 +159,8 @@ The filter will announce changes to filter selections, search results, and when
 | Property | Type | Description |
 |---|---|---|
 | `disabled` | Boolean, default: `false` | Disables the dropdown opener for the filter |
-| `opened` | Boolean, default: `false` | Whether or not the filter is open  |
+| `opened` | Boolean, default: `false` | Whether or not the filter is open |
+| `text` | String | Optional override for the button text used for a multi-dimensional filter |
 
 ### Events
 * `d2l-filter-change`: dispatched when any filter value has changed (may contain info about multiple dimensions and multiple changes in each)

package/components/filter/demo/filter.html

@@ -92,7 +92,7 @@
 				<d2l-filter>
 					<d2l-filter-dimension-set key="course" text="Course" loading select-all>
 						<d2l-filter-dimension-set-value key="art" text="Art"></d2l-filter-dimension-set-value>
-						<d2l-filter-dimension-set-value key="astronomy" text="Astronomy" selected></d2l-filter-dimension-set-value>
+						<d2l-filter-dimension-set-value key="astronomy" text="Astronomy"></d2l-filter-dimension-set-value>
 						<d2l-filter-dimension-set-value key="biology" text="Biology"></d2l-filter-dimension-set-value>
 						<d2l-filter-dimension-set-value key="chemistry" text="Chemistry"></d2l-filter-dimension-set-value>
 						<d2l-filter-dimension-set-value key="drama" text="Drama"></d2l-filter-dimension-set-value>
@@ -105,9 +105,13 @@
 					</d2l-filter-dimension-set>
 					
 				</d2l-filter>
-				<d2l-filter>
+				<d2l-filter text="More Filters">
 					<d2l-filter-dimension-set key="course" text="Course" loading select-all></d2l-filter-dimension-set>
-					<d2l-filter-dimension-set key="role" text="Role" loading></d2l-filter-dimension-set>
+					<d2l-filter-dimension-set key="role" text="Role" loading>
+						<d2l-filter-dimension-set-value key="admin" text="Admin"></d2l-filter-dimension-set-value>
+						<d2l-filter-dimension-set-value key="instructor" text="Instructor"></d2l-filter-dimension-set-value>
+						<d2l-filter-dimension-set-value key="student" text="Student"></d2l-filter-dimension-set-value>
+					</d2l-filter-dimension-set>
 					<d2l-filter-dimension-set key="semester" text="Semester" loading selection-single></d2l-filter-dimension-set>
 				</d2l-filter>
 				<d2l-button id="finish-loading">Finish loading (in 5 seconds)</d2l-button>

package/components/filter/filter.js

@@ -52,6 +52,11 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 			 * @type {boolean}
 			 */
 			opened: { type: Boolean, reflect: true },
+			/**
+			 * Optional override for the button text used for a multi-dimensional filter
+			 * @type {string}
+			 */
+			text: { type: String },
 			_activeDimensionKey: { type: String, attribute: false },
 			_dimensions: { type: Array, attribute: false },
 			_totalAppliedCount: { type: Number, attribute: false }
@@ -175,7 +180,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 		const dimensions = this._buildDimensions(singleDimension);
 
 		const filterCount = this._formatFilterCount(this._totalAppliedCount);
-		let buttonText = singleDimension ? this._dimensions[0].text : this.localize('components.filter.filters');
+		let buttonText = singleDimension ? this._dimensions[0].text : (this.text || this.localize('components.filter.filters'));
 		if (filterCount) buttonText = `${buttonText} (${filterCount})`;
 
 		let description = singleDimension ? this.localize('components.filter.singleDimensionDescription', { filterName: this._dimensions[0].text }) : this.localize('components.filter.filters');

package/custom-elements.json

@@ -3146,6 +3146,11 @@
       "path": "./components/filter/filter.js",
       "description": "A filter component that contains one or more dimensions a user can filter by.\nThis component is in charge of all rendering.",
       "attributes": [
+        {
+          "name": "text",
+          "description": "Optional override for the button text used for a multi-dimensional filter",
+          "type": "string"
+        },
         {
           "name": "disabled",
           "description": "Disables the dropdown opener for the filter",
@@ -3160,6 +3165,12 @@
         }
       ],
       "properties": [
+        {
+          "name": "text",
+          "attribute": "text",
+          "description": "Optional override for the button text used for a multi-dimensional filter",
+          "type": "string"
+        },
         {
           "name": "disabled",
           "attribute": "disabled",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "2.15.4",
+  "version": "2.16.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",