@brightspace-ui/core 3.149.1 → 3.150.0

package/README.md

@@ -50,6 +50,7 @@ npm install @brightspace-ui/core
   * [Selection](components/selection/): components for selection and bulk actions
   * [Scroll Wrapper](components/scroll-wrapper/): arrows to scroll content horizontally
   * [Skeleton](components/skeleton/): apply low-fidelity skeletons to your application as it loads
+  * [Sort](components/sorting/): menu for adjusting the sort order of data in a list
   * [Status Indicator](components/status-indicator/): status-indicator components
   * [Switch](components/switch/): switch component with on/off semantics
   * [Table](components/table/): table styles, column sorting and overflow handling

package/components/menu/menu-item-radio.js

@@ -7,7 +7,7 @@ import { menuItemSelectableStyles } from './menu-item-selectable-styles.js';
  * A menu item component used for radio selection. Only one radio item in a given d2l-menu may be selected at once (i.e., selecting one option will deselect the other selected "d2l-menu-item-radio" item).
  * @slot supporting - Allows supporting information to be displayed on the right-most side of the menu item
  */
-class MenuItemRadio extends MenuItemRadioMixin(LitElement) {
+export class MenuItemRadio extends MenuItemRadioMixin(LitElement) {
 
 	static get styles() {
 		return menuItemSelectableStyles;

package/components/menu/menu-item-selectable-styles.js

@@ -1,4 +1,3 @@
-import '../colors/colors.js';
 import { css } from 'lit';
 import { menuItemStyles } from './menu-item-styles.js';
 

package/components/sorting/README.md

@@ -0,0 +1,89 @@
+# Sorting
+
+The sort menu allows the user to adjust the sort order of data in a list.
+
+<!-- docs: demo align:flex-start autoOpen:true autoSize:false size:medium -->
+```html
+<script type="module">
+  import '@brightspace-ui/core/components/sorting/sort.js';
+  import '@brightspace-ui/core/components/sorting/sort-item.js';
+</script>
+<d2l-sort>
+	<d2l-sort-item text="Most Relevant" selected></d2l-sort-item>
+	<d2l-sort-item text="Recently Updated"></d2l-sort-item>
+	<d2l-sort-item text="Highest Rated"></d2l-sort-item>
+</d2l-sort>
+```
+
+## Best Practices
+
+<!-- docs: start best practices -->
+<!-- docs: start dos -->
+* Make the Sort the right-most component in a group of Search, Filters & Sort controls
+* Carefully consider the user’s workflow before adding a reversible order to the sort. Most sort options do not need to be reversible.
+* Write Sort option labels in Title Case
+* Make Sort labels specific rather than general — “Sort: Course Title” is better than “Sort: Alphabetical”.
+<!-- docs: end dos -->
+
+<!-- docs: start donts -->
+* Don’t include an excessive number of sorting options — every additional option increases the cognitive load on the user when making a decision
+* Don’t make phrasings too similar — the first word of the option should be unique (“Last Accessed”, “Enrolment Date”, “Date Pinned”)
+* Don’t use when sorting table data. If the data is presented with table column headers, use [Sortable Column Buttons](../table#d2l-table-col-sort-button) to apply sorting.
+<!-- docs: end donts -->
+<!-- docs: end best practices -->
+
+## Sort [d2l-sort]
+
+The `<d2l-sort>` element is a required wrapper around multiple `<d2l-sort-item>` elements.
+
+<!-- docs: demo code properties name:d2l-sort sandboxTitle:'Sort' align:flex-start autoSize:false size:medium -->
+```html
+<script type="module">
+  import '@brightspace-ui/core/components/sorting/sort.js';
+  import '@brightspace-ui/core/components/sorting/sort-item.js';
+</script>
+<d2l-sort>
+	<d2l-sort-item text="Most Relevant" value="relevant" selected></d2l-sort-item>
+	<d2l-sort-item text="Recently Updated" value="updated"></d2l-sort-item>
+	<d2l-sort-item text="Highest Rated" value="rating"></d2l-sort-item>
+</d2l-sort>
+```
+
+<!-- docs: start hidden content -->
+### Properties
+
+| Property | Type | Description |
+|---|---|---|
+| `disabled` | Boolean | Disables the sort |
+
+### Events
+
+- `d2l-sort-change`: dispatched when the selected sort item changes
+<!-- docs: end hidden content -->
+
+## Sort Item [d2l-sort-item]
+
+The `<d2l-sort-item>` element represents an option within its parent `<d2l-sort>`.
+
+<!-- docs: demo code properties name:d2l-sort-item sandboxTitle:'Sort Item' align:flex-start autoSize:false size:medium -->
+```html
+<script type="module">
+  import '@brightspace-ui/core/components/sorting/sort.js';
+  import '@brightspace-ui/core/components/sorting/sort-item.js';
+</script>
+<d2l-sort opened>
+	<d2l-sort-item text="Most Relevant" value="relevant" selected></d2l-sort-item>
+	<d2l-sort-item text="Recently Updated" value="updated"></d2l-sort-item>
+	<d2l-sort-item text="Highest Rated" value="rating"></d2l-sort-item>
+</d2l-sort>
+```
+
+<!-- docs: start hidden content -->
+### Properties
+
+| Property | Type | Description |
+|---|---|---|
+| `text` | String, required | Option text |
+| `value` | String, required | Value of the option |
+| `selected` | Boolean | Whether this is the selected sort option |
+<!-- docs: end hidden content -->

package/components/sorting/demo/sort.html

@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<meta charset="UTF-8">
+		<link rel="stylesheet" href="../../demo/styles.css" type="text/css">
+		<script type="module">
+			import '../../demo/demo-page.js';
+			import '../sort.js';
+			import '../sort-item.js';
+		</script>
+	</head>
+	<body unresolved>
+		<d2l-demo-page page-title="Sorting">
+			<h2>Default</h2>
+			<d2l-demo-snippet>
+				<template>
+					<d2l-sort>
+						<d2l-sort-item text="Most Relevant" value="relevant"></d2l-sort-item>
+						<d2l-sort-item text="Recently Updated" value="updated"></d2l-sort-item>
+						<d2l-sort-item text="Highest Rated" value="rating"></d2l-sort-item>
+					</d2l-sort>
+				</template>
+			</d2l-demo-snippet>
+			<h2>Disabled</h2>
+			<d2l-demo-snippet>
+				<template>
+					<d2l-sort disabled>
+						<d2l-sort-item text="Most Relevant" value="relevant"></d2l-sort-item>
+						<d2l-sort-item text="Recently Updated" value="updated"></d2l-sort-item>
+						<d2l-sort-item text="Highest Rated" value="rating"></d2l-sort-item>
+					</d2l-sort>
+				</template>
+			</d2l-demo-snippet>
+		</d2l-demo-page>
+	</body>
+</html>

package/components/sorting/sort-item.js

@@ -0,0 +1,22 @@
+import { MenuItemRadio } from '../menu/menu-item-radio.js';
+
+/**
+ * An item within a <d2l-sort> component.
+ */
+class SortItem extends MenuItemRadio {
+
+	updated(changedProperties) {
+		super.updated(changedProperties);
+		// handles case where the text loads after initial render
+		if (changedProperties.has('text') && this.selected) {
+			/** @ignore */
+			this.dispatchEvent(new CustomEvent('d2l-sort-item-selected-text-change', {
+				bubbles: true,
+				composed: false
+			}));
+		}
+	}
+
+}
+
+customElements.define('d2l-sort-item', SortItem);

package/components/sorting/sort.js

@@ -0,0 +1,110 @@
+import '../dropdown/dropdown-button-subtle.js';
+import '../dropdown/dropdown-menu.js';
+import '../menu/menu.js';
+import { css, html, LitElement } from 'lit';
+import { FocusMixin } from '../../mixins/focus/focus-mixin.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
+
+/**
+ * Allows the user to adjust the sort order of data in a list.
+ * @slot - Sort item components
+ * @fires d2l-sort-change - Dispatched when the selected sort item changes
+ */
+class Sort extends FocusMixin(LocalizeCoreElement(LitElement)) {
+
+	static properties = {
+		/**
+		 * Disables the sort
+		 * @type {boolean}
+		 */
+		disabled: { type: Boolean, reflect: true },
+		/** @ignore */
+		opened: { type: Boolean, reflect: true },
+		_selectedItemText: { state: true },
+		_selectedItemValue: { state: true },
+	};
+
+	static get styles() {
+		return css`
+			:host {
+				display: inline-block;
+			}
+			:host([hidden]) {
+				display: none;
+			}
+			::slotted(:not(d2l-sort-item)) {
+				display: none;
+			}
+		`;
+	}
+
+	constructor() {
+		super();
+		this.disabled = false;
+		this.opened = false;
+		this._selectedItemText = '';
+		this._selectedItemValue = '';
+	}
+
+	static get focusElementSelector() {
+		return 'd2l-dropdown-button-subtle';
+	}
+
+	render() {
+		return html`
+			<d2l-dropdown-button-subtle
+				?disabled="${this.disabled}"
+				text="${this.localize('components.sort.text', { selectedItemText: this._selectedItemText })}">
+				<d2l-dropdown-menu class="vdiff-target" ?opened="${this.opened}">
+					<d2l-menu
+						label="${this.localize('components.sort.label')}"
+						@d2l-menu-item-change="${this.#handleMenuItemChange}">
+						<slot
+							@d2l-sort-item-selected-text-change="${this.#recalculateState}"
+							@slotchange="${this.#handleSlotChange}"></slot>
+					</d2l-menu>
+				</d2l-dropdown-menu>
+			</d2l-dropdown-button-subtle>
+		`;
+	}
+
+	#getItems() {
+		const elems = this.shadowRoot?.querySelector('slot')?.assignedElements();
+		if (!elems) return [];
+		return elems.filter(el => el.tagName === 'D2L-SORT-ITEM');
+	}
+
+	#handleMenuItemChange(e) {
+		if (this._selectedItemValue === e.target.value) return;
+
+		this._selectedItemText = e.target.text;
+		this._selectedItemValue = e.target;
+		this.dispatchEvent(new CustomEvent(
+			'd2l-sort-change', {
+				detail: { value: e.detail.value }
+			}
+		));
+	}
+
+	#handleSlotChange() {
+		this.#recalculateState();
+	}
+
+	#recalculateState() {
+		const items = this.#getItems();
+		if (items.length === 0) return;
+
+		const selectedItems = items.filter(i => i.selected);
+		if (selectedItems.length === 0) {
+			items[0].selected = true;
+			selectedItems.push(items[0]);
+		}
+
+		const selectedItem = selectedItems[selectedItems.length - 1];
+		this._selectedItemText = selectedItem.text;
+		this._selectedItemValue = selectedItem.value;
+	}
+
+}
+
+customElements.define('d2l-sort', Sort);

package/custom-elements.json

@@ -12965,6 +12965,141 @@
         }
       ]
     },
+    {
+      "name": "d2l-sort-item",
+      "path": "./components/sorting/sort-item.js",
+      "description": "An item within a <d2l-sort> component.",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "REQUIRED: The selectable item's value",
+          "type": "string"
+        },
+        {
+          "name": "selected",
+          "description": "This will set the item to be selected by default",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "text",
+          "description": "REQUIRED: Text displayed by the menu item",
+          "type": "string"
+        },
+        {
+          "name": "description",
+          "description": "ACCESSIBILITY: A description of the menu item that will be used by screen readers for additional context",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the menu item",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "lines",
+          "description": "The number of lines to display before truncating text with an ellipsis. Defaults to 2.",
+          "type": "number",
+          "default": "2"
+        }
+      ],
+      "properties": [
+        {
+          "name": "value",
+          "attribute": "value",
+          "description": "REQUIRED: The selectable item's value",
+          "type": "string"
+        },
+        {
+          "name": "selected",
+          "attribute": "selected",
+          "description": "This will set the item to be selected by default",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "text",
+          "attribute": "text",
+          "description": "REQUIRED: Text displayed by the menu item",
+          "type": "string"
+        },
+        {
+          "name": "description",
+          "attribute": "description",
+          "description": "ACCESSIBILITY: A description of the menu item that will be used by screen readers for additional context",
+          "type": "string"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "description": "Disables the menu item",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "lines",
+          "attribute": "lines",
+          "description": "The number of lines to display before truncating text with an ellipsis. Defaults to 2.",
+          "type": "number",
+          "default": "2"
+        }
+      ],
+      "events": [
+        {
+          "name": "d2l-menu-item-change",
+          "description": "Dispatched when the selected menu item changes"
+        },
+        {
+          "name": "d2l-menu-item-select",
+          "description": "Dispatched when the menu item is selected"
+        },
+        {
+          "name": "d2l-menu-item-visibility-change",
+          "description": "Dispatched when the visibility of the menu item changes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "supporting",
+          "description": "Allows supporting information to be displayed on the right-most side of the menu item"
+        }
+      ]
+    },
+    {
+      "name": "d2l-sort",
+      "path": "./components/sorting/sort.js",
+      "description": "Allows the user to adjust the sort order of data in a list.",
+      "properties": [
+        {
+          "name": "properties",
+          "type": "{ disabled: boolean; opened: { type: BooleanConstructor; reflect: boolean; }; _selectedItemText: { state: boolean; }; _selectedItemValue: { state: boolean; }; }",
+          "default": "{\"disabled\":{\"type\":\"Boolean\",\"reflect\":true},\"opened\":{\"type\":\"Boolean\",\"reflect\":true},\"_selectedItemText\":{\"state\":true},\"_selectedItemValue\":{\"state\":true}}"
+        },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "opened",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "events": [
+        {
+          "name": "d2l-sort-change",
+          "description": "Dispatched when the selected sort item changes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Sort item components"
+        }
+      ]
+    },
     {
       "name": "d2l-status-indicator",
       "path": "./components/status-indicator/status-indicator.js",

package/lang/ar.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "تم تحديد {count}",
 	"components.selection.selected-plus": "تم تحديد {count}+‎",
 	"components.selection-controls.label": "إجراءات التحديد",
+	"components.sort.label": "فرز",
+	"components.sort.text": "فرز: {selectedItemText}",
 	"components.switch.conditions": "يجب استيفاء الشروط",
 	"components.switch.hidden": "مخفي",
 	"components.switch.visible": "مرئي",

package/lang/cy.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} wedi’u dewis.",
 	"components.selection.selected-plus": "{count}+ wedi’u dewis",
 	"components.selection-controls.label": "Camau gweithredu ar gyfer detholiad",
+	"components.sort.label": "Trefnu",
+	"components.sort.text": "Trefnu: {selectedItemText}",
 	"components.switch.conditions": "Rhaid bodloni’r amodau",
 	"components.switch.hidden": "Cudd",
 	"components.switch.visible": "Gweladwy",

package/lang/da.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} valgt",
 	"components.selection.selected-plus": "{count}+ valgt",
 	"components.selection-controls.label": "Handlinger for valg",
+	"components.sort.label": "Sortér",
+	"components.sort.text": "Sortér: {selectedItemText}",
 	"components.switch.conditions": "Betingelserne skal være opfyldt",
 	"components.switch.hidden": "Skjult",
 	"components.switch.visible": "Synlig",

package/lang/de.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} ausgewählt",
 	"components.selection.selected-plus": "{count}+ ausgewählt",
 	"components.selection-controls.label": "Aktionen für Auswahl",
+	"components.sort.label": "Sortieren",
+	"components.sort.text": "Sortieren: {selectedItemText}",
 	"components.switch.conditions": "Bedingungen müssen erfüllt sein",
 	"components.switch.hidden": "Ausgeblendet",
 	"components.switch.visible": "Sichtbar",

package/lang/en-gb.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} selected",
 	"components.selection.selected-plus": "{count}+ selected",
 	"components.selection-controls.label": "Actions for selection",
+	"components.sort.label": "Sort",
+	"components.sort.text": "Sort: {selectedItemText}",
 	"components.switch.conditions": "Conditions must be met",
 	"components.switch.hidden": "Hidden",
 	"components.switch.visible": "Visible",

package/lang/en.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} selected",
 	"components.selection.selected-plus": "{count}+ selected",
 	"components.selection-controls.label": "Actions for selection",
+	"components.sort.label": "Sort",
+	"components.sort.text": "Sort: {selectedItemText}",
 	"components.switch.conditions": "Conditions must be met",
 	"components.switch.hidden": "Hidden",
 	"components.switch.visible": "Visible",

package/lang/es-es.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} seleccionados",
 	"components.selection.selected-plus": "{count}+ seleccionados",
 	"components.selection-controls.label": "Acciones para la selección",
+	"components.sort.label": "Ordenar",
+	"components.sort.text": "Ordenar: {selectedItemText}",
 	"components.switch.conditions": "Deben cumplirse las condiciones",
 	"components.switch.hidden": "Oculto",
 	"components.switch.visible": "Visible",

package/lang/es.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} seleccionados",
 	"components.selection.selected-plus": "Más de {count} seleccionados",
 	"components.selection-controls.label": "Acciones para la selección",
+	"components.sort.label": "Ordenar",
+	"components.sort.text": "Ordenar: {selectedItemText}",
 	"components.switch.conditions": "Se deben cumplir las condiciones",
 	"components.switch.hidden": "Oculto",
 	"components.switch.visible": "Visible",

package/lang/fr-fr.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} sélectionnés",
 	"components.selection.selected-plus": "{count}+ sélectionné(e)(s)",
 	"components.selection-controls.label": "Actions pour la sélection",
+	"components.sort.label": "Trier",
+	"components.sort.text": "Trier : {selectedItemText}",
 	"components.switch.conditions": "Les conditions doivent être remplies",
 	"components.switch.hidden": "Masqué",
 	"components.switch.visible": "Visible",

package/lang/fr.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} sélectionné(s)",
 	"components.selection.selected-plus": "{count}+ sélectionné",
 	"components.selection-controls.label": "Actions à sélectionner",
+	"components.sort.label": "Trier",
+	"components.sort.text": "Trier : {selectedItemText}",
 	"components.switch.conditions": "Les conditions doivent être remplies",
 	"components.switch.hidden": "Masqué",
 	"components.switch.visible": "Visible",

package/lang/haw.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} koho",
 	"components.selection.selected-plus": "{count}+ i koho ʻia",
 	"components.selection-controls.label": "Nā hana no ke koho",
+	"components.sort.label": "Hoʻokaʻawale",
+	"components.sort.text": "Hoʻokaʻawale: {selectedItemText}",
 	"components.switch.conditions": "Pono e hoʻokō i nā kūlana",
 	"components.switch.hidden": "Huna",
 	"components.switch.visible": "ʻIke ʻia",

package/lang/hi.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} चयनित",
 	"components.selection.selected-plus": "{count} से अधिक चयनित",
 	"components.selection-controls.label": "चयन के लिए क्रियाएँ",
+	"components.sort.label": "सॉर्ट करें",
+	"components.sort.text": "सॉर्ट करें: {selectedItemText}",
 	"components.switch.conditions": "शर्तें पूरी होनी चाहिए",
 	"components.switch.hidden": "छुपा हुआ",
 	"components.switch.visible": "दृश्यमान",

package/lang/ja.js

@@ -164,6 +164,8 @@ export default {
 	"components.selection.selected": "{count} 個を選択済み",
 	"components.selection.selected-plus": "{count} 個以上を選択済み",
 	"components.selection-controls.label": "選択のアクション",
+	"components.sort.label": "並べ替え",
+	"components.sort.text": "並べ替え: {selectedItemText}",
 	"components.switch.conditions": "条件が一致する必要があります",
 	"components.switch.hidden": "非表示",
 	"components.switch.visible": "表示",

package/lang/ko.js

@@ -164,6 +164,8 @@ export default {
 	"components.selection.selected": "{count}개 선택됨",
 	"components.selection.selected-plus": "{count}+개 선택됨",
 	"components.selection-controls.label": "선택 작업",
+	"components.sort.label": "정렬",
+	"components.sort.text": "정렬: {selectedItemText}",
 	"components.switch.conditions": "조건을 충족해야 합니다",
 	"components.switch.hidden": "숨김",
 	"components.switch.visible": "표시",

package/lang/mi.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} kua tīpakohia",
 	"components.selection.selected-plus": "{count}+ kua tīpakohia",
 	"components.selection-controls.label": "Ngā mahinga mō te tīpakonga",
+	"components.sort.label": "Kōmaka",
+	"components.sort.text": "Kōmaka: {selectedItemText}",
 	"components.switch.conditions": "Me tutuki ngā here",
 	"components.switch.hidden": "Hunaia",
 	"components.switch.visible": "Ka taea te kite",

package/lang/nl.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} geselecteerd",
 	"components.selection.selected-plus": "Meer dan {count} geselecteerd",
 	"components.selection-controls.label": "Acties voor selectie",
+	"components.sort.label": "Sorteren",
+	"components.sort.text": "Sorteren: {selectedItemText}",
 	"components.switch.conditions": "Er moet aan de voorwaarden worden voldaan",
 	"components.switch.hidden": "Verborgen",
 	"components.switch.visible": "Zichtbaar",

package/lang/pt.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} selecionados",
 	"components.selection.selected-plus": "Mais de {count} selecionados",
 	"components.selection-controls.label": "Ações para seleção",
+	"components.sort.label": "Classificar",
+	"components.sort.text": "Classificação: {selectedItemText}",
 	"components.switch.conditions": "As condições devem ser atendidas",
 	"components.switch.hidden": "Oculto",
 	"components.switch.visible": "Visível",

package/lang/sv.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} valda",
 	"components.selection.selected-plus": "Över {count} valda",
 	"components.selection-controls.label": "Åtgärder för val",
+	"components.sort.label": "Sortera",
+	"components.sort.text": "Sortera: {selectedItemText}",
 	"components.switch.conditions": "Villkoren måste uppfyllas",
 	"components.switch.hidden": "Dold",
 	"components.switch.visible": "Synlig",

package/lang/tr.js

@@ -172,6 +172,8 @@ export default {
 	"components.selection.selected": "{count} öğe seçildi",
 	"components.selection.selected-plus": "{count}+ öğe seçildi",
 	"components.selection-controls.label": "Seçim için eylemler",
+	"components.sort.label": "Sırala",
+	"components.sort.text": "Sırala: {selectedItemText}",
 	"components.switch.conditions": "Koşullar karşılanmalıdır",
 	"components.switch.hidden": "Gizli",
 	"components.switch.visible": "Görünür",

package/lang/zh-cn.js

@@ -164,6 +164,8 @@ export default {
 	"components.selection.selected": "已选 {count}",
 	"components.selection.selected-plus": "已选 + {count}",
 	"components.selection-controls.label": "针对所选内容的操作",
+	"components.sort.label": "排序",
+	"components.sort.text": "排序：{selectedItemText}",
 	"components.switch.conditions": "必须符合条件",
 	"components.switch.hidden": "隐藏",
 	"components.switch.visible": "可见",

package/lang/zh-tw.js

@@ -165,6 +165,8 @@ export default {
 	"components.selection.selected": "已選取 {count} 個",
 	"components.selection.selected-plus": "已選取 {count}+ 個",
 	"components.selection-controls.label": "選擇的動作",
+	"components.sort.label": "排序",
+	"components.sort.text": "排序：{selectedItemText}",
 	"components.switch.conditions": "必須符合條件",
 	"components.switch.hidden": "隱藏",
 	"components.switch.visible": "可見",

package/package.json

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