@brightspace-ui/core 2.80.6 → 2.80.8

package/components/filter/filter.js

@@ -108,6 +108,8 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 				flex-grow: 1;
 				padding-right: calc(2rem + 2px);
 				text-align: center;
+				text-overflow: ellipsis;
+				white-space: nowrap;
 			}
 			:host([dir="rtl"]) .d2l-filter-dimension-header-text {
 				padding-left: calc(2rem + 2px);
@@ -117,8 +119,6 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 			.d2l-filter-dimension-header-text,
 			.d2l-filter-dimension-set-value-text {
 				overflow: hidden;
-				text-overflow: ellipsis;
-				white-space: nowrap;
 			}
 
 			.d2l-filter-dimension-set-value {
@@ -128,6 +128,14 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 				line-height: unset;
 				overflow: hidden;
 			}
+			
+			.d2l-filter-dimension-set-value-text {
+				-webkit-box-orient: vertical;
+				display: -webkit-box;
+				hyphens: auto;
+				-webkit-line-clamp: 2;
+				word-break: break-word;
+			}
 
 			d2l-list-item[disabled] .d2l-filter-dimension-set-value,
 			d2l-list-item[disabled] .d2l-body-small {

package/components/list/README.md

@@ -476,6 +476,7 @@ The `d2l-list-item-button` provides the same functionality as `d2l-list-item` ex
 | Property | Type | Description |
 |---|---|---|
 | `breakpoints` | Array | Breakpoints for responsiveness in pixels. There are four different breakpoints and only the four largest breakpoints will be used. |
+| `button-disabled` | Boolean | Disables the primary action button |
 | `disabled` | Boolean | Disables the input |
 | `draggable` |  Boolean | Whether the item is draggable |
 | `drag-handle-text` | String | The drag-handle label for assistive technology. If implementing drag & drop, you should change this to dynamically announce what the drag-handle is moving for assistive technology in keyboard mode. |

package/components/list/list-item-button-mixin.js

@@ -4,13 +4,30 @@ import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ListItemMixin } from './list-item-mixin.js';
 
 export const ListItemButtonMixin = superclass => class extends ListItemMixin(superclass) {
+	static get properties() {
+		return {
+			/**
+			 * Disables the primary action button
+			 * @type {boolean}
+			 */
+			buttonDisabled : { type: Boolean, attribute: 'button-disabled' }
+		};
+	}
 
 	static get styles() {
 
 		const styles = [ css`
-			:host {
+			:host(:not([button-disabled])) {
 				--d2l-list-item-content-text-color: var(--d2l-color-celestine);
 			}
+			:host([button-disabled][_hovering-primary-action]) .d2l-list-item-content,
+			:host([button-disabled][_focusing-primary-action]) .d2l-list-item-content {
+				--d2l-list-item-content-text-color: unset;
+				--d2l-list-item-content-text-decoration: none;
+			}
+			:host([button-disabled]) button {
+				cursor: default;
+			}
 			[slot="outside-control-container"] {
 				margin: 0 -12px;
 			}
@@ -51,6 +68,7 @@ export const ListItemButtonMixin = superclass => class extends ListItemMixin(sup
 	constructor() {
 		super();
 		this._primaryActionId = getUniqueId();
+		this.buttonDisabled = false;
 	}
 
 	_onButtonClick() {
@@ -59,7 +77,7 @@ export const ListItemButtonMixin = superclass => class extends ListItemMixin(sup
 	}
 
 	_renderPrimaryAction(labelledBy) {
-		return html`<button id="${this._primaryActionId}" aria-labelledby="${labelledBy}" @click="${this._onButtonClick}"></button>`;
+		return html`<button id="${this._primaryActionId}" aria-labelledby="${labelledBy}" @click="${this._onButtonClick}" ?disabled="${this.buttonDisabled}"></button>`;
 	}
 
 };

package/custom-elements.json

@@ -7742,6 +7742,12 @@
       "path": "./components/list/list-item-button.js",
       "description": "A component for a \"listitem\" child within a list. It provides semantics, basic layout, breakpoints for responsiveness, a link for navigation, and selection.",
       "attributes": [
+        {
+          "name": "button-disabled",
+          "description": "Disables the primary action button",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "drag-target-handle-only",
           "description": "Whether to allow the drag target to be the handle only rather than the entire cell",
@@ -7838,6 +7844,13 @@
         }
       ],
       "properties": [
+        {
+          "name": "buttonDisabled",
+          "attribute": "button-disabled",
+          "description": "Disables the primary action button",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "dragTargetHandleOnly",
           "attribute": "drag-target-handle-only",

package/lang/ar.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "إغلاق التنبيه",
 	"components.breadcrumbs.breadcrumb": "شريط التنقل",

package/lang/cy.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Cau Hysbysiad",
 	"components.breadcrumbs.breadcrumb": "Briwsionyn Bara",

package/lang/da.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Luk besked",
 	"components.breadcrumbs.breadcrumb": "Brødkrumme",

package/lang/de.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Benachrichtigung schließen",
 	"components.breadcrumbs.breadcrumb": "Brotkrümelnavigation",

package/lang/en.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Close Alert",
 	"components.breadcrumbs.breadcrumb": "Breadcrumb",

package/lang/es-es.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Cerrar alerta",
 	"components.breadcrumbs.breadcrumb": "Ruta de navegación",

package/lang/es.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Cerrar alerta",
 	"components.breadcrumbs.breadcrumb": "Ruta de navegación",

package/lang/fr-fr.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Fermer l'alerte",
 	"components.breadcrumbs.breadcrumb": "Chemin de navigation",

package/lang/fr.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Fermer l'alerte",
 	"components.breadcrumbs.breadcrumb": "Chemin de navigation",

package/lang/hi.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "अलर्ट बंद करें",
 	"components.breadcrumbs.breadcrumb": "ब्रेडक्रंब",

package/lang/ja.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "アラートを閉じる",
 	"components.breadcrumbs.breadcrumb": "階層",

package/lang/ko.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "경보 닫기",
 	"components.breadcrumbs.breadcrumb": "이동 경로",

package/lang/nl.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Waarschuwing sluiten",
 	"components.breadcrumbs.breadcrumb": "Broodkruimel",

package/lang/pt.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Fechar alerta",
 	"components.breadcrumbs.breadcrumb": "Auxiliar de navegação",

package/lang/sv.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Stängningsvarning",
 	"components.breadcrumbs.breadcrumb": "Sökväg",

package/lang/tr.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "Kapatma Uyarısı",
 	"components.breadcrumbs.breadcrumb": "İçerik Haritası",

package/lang/zh-cn.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "关闭提醒",
 	"components.breadcrumbs.breadcrumb": "痕迹导航",

package/lang/zh-tw.js

@@ -1,5 +1,3 @@
-/* eslint quotes: 0 */
-
 export default {
 	"components.alert.close": "關閉警示",
 	"components.breadcrumbs.breadcrumb": "導覽路徑",

package/package.json

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