@material/list - npm Package Compare versions

Comparing version 15.0.0-canary.a911b386b.0 to 15.0.0-canary.aa5ac7fe5.0

adapter.d.ts

@@ -45,4 +45,4 @@ /**
     /**
-     * Sets the tabindex to the value specified for all button/a element children of
-     * the list item at the index specified.
+     * Sets the tabindex to the value specified for all button/a element children
+     * of the list item at the index specified.
      */
@@ -49,0 +49,0 @@ setTabIndexForListItemChildren(listItemIndex: number, tabIndexValue: string): void;

CHANGELOG.md

@@ -6,3 +6,3 @@ # Change Log
 
-# [15.0.0-canary.a911b386b.0](https://github.com/material-components/material-components-web/compare/v14.0.0...v15.0.0-canary.a911b386b.0) (2022-11-28)
+# [15.0.0-canary.aa5ac7fe5.0](https://github.com/material-components/material-components-web/compare/v14.0.0...v15.0.0-canary.aa5ac7fe5.0) (2023-05-22)
 
@@ -12,5 +12,11 @@
 
+* **list:** Remove ripple styles for disabled items in deprecated list. ([f52358d](https://github.com/material-components/material-components-web/commit/f52358dd0796308919bb78deffc573d0d933c7de))
+* correct behavior of checkboxes/radios in a list. ([f771b09](https://github.com/material-components/material-components-web/commit/f771b091ce1e5b1b97b3a508f1459e4665008a80))
+* **list:** Allow alt + enter to select index for lists. ([113b1a3](https://github.com/material-components/material-components-web/commit/113b1a38e87337fdd00c7495fda3299df2dbc317))
 * **list:** behavior in case of changing focus from -1 to -1 with forceUpdate: true ([ae278a2](https://github.com/material-components/material-components-web/commit/ae278a2fe94fdb8c5d0716fb34cbe84a691d6146))
+* **list:** Fix list leading/trailing icon theming ([36a4cba](https://github.com/material-components/material-components-web/commit/36a4cba9944392b391b86d41405ee21fb97f4c22))
 * **list:** Fixes how list handles `CTRL-A` keyboard interactions for multi-selection lists when there are disabled list items. ([a911b38](https://github.com/material-components/material-components-web/commit/a911b386b2fded69e3468ef42e7ef25eb33fcd70))
 * **list:** Fixing css for calculating `$mdc-list-subheader-margin` param. ([357f2e5](https://github.com/material-components/material-components-web/commit/357f2e5f15f6374c9d93da135a8b070239ba7464))
+* **list:** Initialize selectedIndex as an array for checkbox list ([0347671](https://github.com/material-components/material-components-web/commit/034767110778aab3e5f0a3240937d8a07c21197e))
+* **list:** only set overflow hidden on mdc-list-item--with-leading-image ([033ae08](https://github.com/material-components/material-components-web/commit/033ae083aad9ad4376e64aa328df936c7adb5a32))
 * **list:** rolling back update of list styles since this is causing failures. ([eb103d4](https://github.com/material-components/material-components-web/commit/eb103d4b5d33e0d1535ea28ca0089d2c7002fab6))
@@ -21,9 +27,13 @@
 
-* add icon support to menu theming ([40b18d0](https://github.com/material-components/material-components-web/commit/40b18d04314549060c2b4a28ed425cba9976687b))
+* **list:** Add support for list-item-selected-container-color and list-item-selected-trailing-icon-color tokens. ([ece3e8d](https://github.com/material-components/material-components-web/commit/ece3e8d2155abd93bc1f9bdcf2dddea9e6eaab56))
 * **list:** Add support for several new tokens ([cec7fb9](https://github.com/material-components/material-components-web/commit/cec7fb9878e548f7f070c5b0f9572cf34e3cce36))
 * **list:** Added boilerplate code for list theming API implementation ([df47894](https://github.com/material-components/material-components-web/commit/df47894dbe5132b66af0df9c53a54d7d1030f397))
 * **list:** Added Theming API to MDC list ([b18a873](https://github.com/material-components/material-components-web/commit/b18a873dcb2800b3263d7636e829fa94b3c12d6d))
+* **list:** Changing default value of `areDisabledItemsFocusable` to false. ([65c4116](https://github.com/material-components/material-components-web/commit/65c411674c70291e64bf0deaca88f8b68586ba82))
 * **list:** Creates a `static-styles` mixin that holds all the non-themeable list styles. ([73ca9db](https://github.com/material-components/material-components-web/commit/73ca9dbb058c47c557aff16137277a7bd33d0b8c))
 * **list:** Creates a static-styles mixin that holds all the non-themeable list styles. ([58733ef](https://github.com/material-components/material-components-web/commit/58733ef418bf8641a5b3b7fd33e8e2bb1d0e7b97))
+* **list:** Fixes focus behavior on disabled list items when `areDisabledItemsFocusable` is set to `false`. ([2aa8050](https://github.com/material-components/material-components-web/commit/2aa8050b46b7b170ab9ecc2a1fe9686ac40d79cc))
+* **list:** Removes ripple styling on disabled list items. ([eaa0c3a](https://github.com/material-components/material-components-web/commit/eaa0c3a8603d70489b22b68a2b0e6ec4284de3a5))
+* add icon support to menu theming ([40b18d0](https://github.com/material-components/material-components-web/commit/40b18d04314549060c2b4a28ed425cba9976687b))
 * **list:** Defines a `theme` mixin for list component. Also adjusts the `theme-styles` mixin so that it emits custom properties. ([3cc30f6](https://github.com/material-components/material-components-web/commit/3cc30f6adb6a5496601dd458a8a9ef40ffef7ff6))
 * **menu:** working on theming API ([f1e0371](https://github.com/material-components/material-components-web/commit/f1e0371502ee9bfe48f3501a63f70a42bfd79cb8))

component.d.ts

@@ -26,6 +26,8 @@ /**
 import { MDCListIndex } from './types';
-export declare type MDCListFactory = (el: Element, foundation?: MDCListFoundation) => MDCList;
+/** MDC List Factory */
+export declare type MDCListFactory = (el: HTMLElement, foundation?: MDCListFoundation) => MDCList;
+/** MDC List */
 export declare class MDCList extends MDCComponent<MDCListFoundation> {
     set vertical(value: boolean);
-    get listElements(): Element[];
+    get listElements(): HTMLElement[];
     set wrapFocus(value: boolean);
@@ -45,3 +47,3 @@ /**
     set selectedIndex(index: MDCListIndex);
-    static attachTo(root: Element): MDCList;
+    static attachTo(root: HTMLElement): MDCList;
     private handleKeydown;
@@ -92,3 +94,3 @@ private handleClick;
     /**
-     * Used to figure out which list item this event is targetting. Or returns -1
+     * Used to figure out which list item this event is targeting. Or returns -1
      * if there is no list item
@@ -95,0 +97,0 @@ */

component.js

@@ -28,2 +28,3 @@ /**
 import { MDCListFoundation } from './foundation';
+/** MDC List */
 var MDCList = /** @class */ (function (_super) {
@@ -104,4 +105,3 @@ __extends(MDCList, _super);
     MDCList.prototype.initialSyncWithDOM = function () {
-        this.isEvolutionEnabled =
-            evolutionAttribute in this.root.dataset;
+        this.isEvolutionEnabled = evolutionAttribute in this.root.dataset;
         if (this.isEvolutionEnabled) {
@@ -238,6 +238,4 @@ this.classNameMap = evolutionClassNameMap;
             focusItemAtIndex: function (index) {
-                var element = _this.listElements[index];
-                if (element) {
-                    element.focus();
-                }
+                var _a;
+                (_a = _this.listElements[index]) === null || _a === void 0 ? void 0 : _a.focus();
             },
@@ -279,3 +277,4 @@ getAttributeForElementIndex: function (index, attr) {
             notifySelectionChange: function (changedIndices) {
-                _this.emit(strings.SELECTION_CHANGE_EVENT, { changedIndices: changedIndices }, /** shouldBubble */ true);
+                _this.emit(strings.SELECTION_CHANGE_EVENT, { changedIndices: changedIndices }, 
+                /** shouldBubble */ true);
             },
@@ -291,3 +290,3 @@ removeClassForElementIndex: function (index, className) {
                 if (element) {
-                    element.setAttribute(attr, value);
+                    _this.safeSetAttribute(element, attr, value);
                 }
@@ -307,3 +306,3 @@ },
                 Array.prototype.forEach.call(element.querySelectorAll(selector), function (el) {
-                    el.setAttribute('tabindex', tabIndexValue);
+                    el.tabIndex = Number(tabIndexValue);
                 });
@@ -343,3 +342,3 @@ },
     /**
-     * Used to figure out which list item this event is targetting. Or returns -1
+     * Used to figure out which list item this event is targeting. Or returns -1
      * if there is no list item
@@ -388,6 +387,3 @@ */
         var target = evt.target;
-        // Toggle the checkbox only if it's not the target of the event, or the
-        // checkbox will have 2 change events.
-        var toggleCheckbox = !matches(target, strings.CHECKBOX_RADIO_SELECTOR);
-        this.foundation.handleClick(index, toggleCheckbox, evt);
+        this.foundation.handleClick(index, matches(target, strings.CHECKBOX_RADIO_SELECTOR), evt);
     };
@@ -394,0 +390,0 @@ return MDCList;

foundation.d.ts

@@ -44,2 +44,3 @@ /**
 }
+/** MDC List Foundation */
 export declare class MDCListFoundation extends MDCFoundation<MDCListAdapter> {
@@ -56,2 +57,3 @@ static get strings(): {
         ARIA_ORIENTATION_HORIZONTAL: string;
+        /** MDC List Foundation */
         ARIA_ROLE_CHECKBOX_SELECTOR: string;
@@ -193,3 +195,3 @@ ARIA_SELECTED: string;
     /**
-     * Helper method for ensuring that the list of selected indicies remains
+     * Helper method for ensuring that the list of selected indices remains
      * accurate when calling setCheckboxAtIndex with omitDisabledItems set to
@@ -219,2 +221,3 @@ * true.
     private getFirstSelectedOrFocusedItemIndex;
+    private getFirstEnabledItem;
     private isIndexValid;
@@ -221,0 +224,0 @@ private isIndexInRange;

foundation.js

@@ -23,3 +23,3 @@ /**
  */
-import { __assign, __extends, __read, __spreadArray } from "tslib";
+import { __assign, __extends, __read, __spreadArray, __values } from "tslib";
 import { MDCFoundation } from '@material/base/foundation';
@@ -43,2 +43,3 @@ import { normalizeKey } from '@material/dom/keyboard';
 }
+/** MDC List Foundation */
 var MDCListFoundation = /** @class */ (function (_super) {
@@ -51,3 +52,3 @@ __extends(MDCListFoundation, _super);
         _this.isSingleSelectionList = false;
-        _this.areDisabledItemsFocusable = true;
+        _this.areDisabledItemsFocusable = false;
         _this.selectedIndex = numbers.UNSET_INDEX;
@@ -121,2 +122,3 @@ _this.focusedItemIndex = numbers.UNSET_INDEX;
             this.isCheckboxList = true;
+            this.selectedIndex = [];
         }
@@ -389,3 +391,4 @@ else if (this.adapter.hasRadioAtIndex(0)) {
         }
-        else if ((isEnter || isSpace) && eventHasModifiers([])) {
+        else if ((isEnter || isSpace) &&
+            (eventHasModifiers([]) || eventHasModifiers(['Alt']))) {
             if (isRootListItem) {
@@ -666,3 +669,3 @@ // Return early if enter key is pressed on anchor element which triggers
     /**
-     * Helper method for ensuring that the list of selected indicies remains
+     * Helper method for ensuring that the list of selected indices remains
      * accurate when calling setCheckboxAtIndex with omitDisabledItems set to
@@ -766,2 +769,4 @@ * true.
     MDCListFoundation.prototype.getFirstSelectedOrFocusedItemIndex = function () {
+        var e_1, _a;
+        var firstFocusableListItem = this.getFirstEnabledItem();
         if (this.adapter.getListItemCount() === 0) {
@@ -772,3 +777,3 @@ return numbers.UNSET_INDEX;
         if (!this.isSelectableList()) {
-            return Math.max(this.focusedItemIndex, 0);
+            return Math.max(this.focusedItemIndex, firstFocusableListItem);
         }
@@ -778,11 +783,43 @@ // Single-selection lists focus the selected item.
             this.selectedIndex !== numbers.UNSET_INDEX) {
-            return this.selectedIndex;
+            return this.areDisabledItemsFocusable &&
+                this.isIndexDisabled(this.selectedIndex) ?
+                firstFocusableListItem :
+                this.selectedIndex;
         }
-        // Multiple-selection lists focus the first selected item.
+        // Multiple-selection lists focus the first enabled selected item.
         if (isNumberArray(this.selectedIndex) && this.selectedIndex.length > 0) {
-            return this.selectedIndex.reduce(function (minIndex, currentIndex) { return Math.min(minIndex, currentIndex); });
+            var sorted = __spreadArray([], __read(this.selectedIndex)).sort(function (a, b) { return a - b; });
+            try {
+                for (var sorted_1 = __values(sorted), sorted_1_1 = sorted_1.next(); !sorted_1_1.done; sorted_1_1 = sorted_1.next()) {
+                    var index = sorted_1_1.value;
+                    if (this.isIndexDisabled(index) && !this.areDisabledItemsFocusable) {
+                        continue;
+                    }
+                    else {
+                        return index;
+                    }
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (sorted_1_1 && !sorted_1_1.done && (_a = sorted_1.return)) _a.call(sorted_1);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
         }
         // Selection lists without a selection focus the first item.
-        return 0;
+        return firstFocusableListItem;
     };
+    MDCListFoundation.prototype.getFirstEnabledItem = function () {
+        var listSize = this.adapter.getListItemCount();
+        var i = 0;
+        while (i < listSize) {
+            if (!this.isIndexDisabled(i)) {
+                break;
+            }
+            i++;
+        }
+        return i === listSize ? numbers.UNSET_INDEX : i;
+    };
     MDCListFoundation.prototype.isIndexValid = function (index, validateListType) {
@@ -789,0 +826,0 @@ var _this = this;

package.json

 {
   "name": "@material/list",
   "description": "The Material Components for the web list component",
-  "version": "15.0.0-canary.a911b386b.0",
+  "version": "15.0.0-canary.aa5ac7fe5.0",
   "license": "MIT",
@@ -20,15 +20,15 @@ "main": "dist/mdc.list.js",
   "dependencies": {
-    "@material/base": "15.0.0-canary.a911b386b.0",
-    "@material/density": "15.0.0-canary.a911b386b.0",
-    "@material/dom": "15.0.0-canary.a911b386b.0",
-    "@material/feature-targeting": "15.0.0-canary.a911b386b.0",
-    "@material/ripple": "15.0.0-canary.a911b386b.0",
-    "@material/rtl": "15.0.0-canary.a911b386b.0",
-    "@material/shape": "15.0.0-canary.a911b386b.0",
-    "@material/theme": "15.0.0-canary.a911b386b.0",
-    "@material/tokens": "15.0.0-canary.a911b386b.0",
-    "@material/typography": "15.0.0-canary.a911b386b.0",
+    "@material/base": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/density": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/dom": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/feature-targeting": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/ripple": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/rtl": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/shape": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/theme": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/tokens": "15.0.0-canary.aa5ac7fe5.0",
+    "@material/typography": "15.0.0-canary.aa5ac7fe5.0",
     "tslib": "^2.1.0"
   },
-  "gitHead": "2487492bf1103f4c82913b328eb64ca5b71b9f5b"
+  "gitHead": "83e86542dd6facc8ffe487d31111412ee18b5bde"
 }

typeahead.d.ts

@@ -51,3 +51,3 @@ /**
  * @return Map that maps the first character of the primary text to the full
- *     list text and it's index
+ *     list text and its index
  */
@@ -109,4 +109,4 @@ export declare function initSortedIndex(listItemCount: number, getPrimaryTextByItemIndex: (index: number) => string): Map<string, MDCListTextAndIndex[]>;
  * Given a keydown event, it calculates whether or not to automatically focus a
- * list item depending on what was typed mimicing the typeahead functionality of
- * a standard <select> element that is open.
+ * list item depending on what was typed mimicking the typeahead functionality
+ * of a standard <select> element that is open.
  *
@@ -123,4 +123,4 @@ * @param opts Options and accessors
  *
- * @returns index of the item matched by the keydown. -1 if not matched.
+ * @return index of the item matched by the keydown. -1 if not matched.
  */
 export declare function handleKeydown(opts: HandleKeydownOpts, state: TypeaheadState): number;

typeahead.js

@@ -52,3 +52,3 @@ /**
  * @return Map that maps the first character of the primary text to the full
- *     list text and it's index
+ *     list text and its index
  */
@@ -222,4 +222,4 @@ export function initSortedIndex(listItemCount, getPrimaryTextByItemIndex) {
  * Given a keydown event, it calculates whether or not to automatically focus a
- * list item depending on what was typed mimicing the typeahead functionality of
- * a standard <select> element that is open.
+ * list item depending on what was typed mimicking the typeahead functionality
+ * of a standard <select> element that is open.
  *
@@ -236,3 +236,3 @@ * @param opts Options and accessors
  *
- * @returns index of the item matched by the keydown. -1 if not matched.
+ * @return index of the item matched by the keydown. -1 if not matched.
  */
@@ -239,0 +239,0 @@ export function handleKeydown(opts, state) {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1738429

increased by21.78%

Lines of code

12466

increased by33.83%

Dependency changes

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• + Added@material/[e-mail]5ac7fe5.0(transitive)

• - Removed@material/animation@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/base@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/density@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/dom@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/elevation@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/feature-targeting@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/ripple@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/rtl@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/shape@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/theme@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/tokens@15.0.0-canary.a911b386b.0(transitive)

• - Removed@material/typography@15.0.0-canary.a911b386b.0(transitive)

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0

• Updated@material/[e-mail]5ac7fe5.0