@m3e/chips 1.0.0-rc.3 → 1.0.0-rc.4

package/README.md

@@ -27,7 +27,7 @@ Alternately, you can explicitly reference the `html-custom-data.json` and `css-c
 }
 ```
 
-## 🚀 Browser Usage
+## 🚀 Native Module Support
 
 This package uses [JavaScript Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#module_specifiers). To use it directly in a browser without a bundler, use a module script similar to the following.
 

package/dist/custom-elements.json

@@ -2100,6 +2100,57 @@
               "description": "The selected value(s) of the set.",
               "readonly": true
             },
+            {
+              "kind": "method",
+              "name": "#handleSlotChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "#handleKeyDown",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "#handleChange",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "#updateChipRole",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
             {
               "kind": "field",
               "name": "formAssociated",
@@ -2138,20 +2189,6 @@
                 "module": "../core/src/shared/mixins/FormAssociated.ts"
               }
             },
-            {
-              "kind": "method",
-              "name": "[_updateLabels]",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "inheritedFrom": {
-                "name": "Labelled",
-                "module": "../core/src/shared/mixins/Labelled.ts"
-              }
-            },
             {
               "kind": "field",
               "name": "dirty",
@@ -6738,6 +6775,11 @@
       "kind": "javascript-module",
       "path": "../core/src/shared/mixins/Labelled.ts",
       "declarations": [
+        {
+          "kind": "variable",
+          "name": "updateLabels",
+          "description": "A symbol through which to update labels to reflect a control's current state."
+        },
         {
           "kind": "function",
           "name": "isLabelledMixin",
@@ -6787,16 +6829,6 @@
               },
               "description": "The label elements that the element is associated with.",
               "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "[_updateLabels]",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
             }
           ],
           "parameters": [
@@ -6811,6 +6843,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "updateLabels",
+          "declaration": {
+            "name": "updateLabels",
+            "module": "../core/src/shared/mixins/Labelled.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "isLabelledMixin",

package/dist/index.js

@@ -623,7 +623,7 @@ var _M3eFilterChipElement_instances, _M3eFilterChipElement_clickHandler, _M3eFil
  * @cssprop --m3e-chip-unselected-leading-icon-color - Leading icon color in unselected state.
  * @cssprop --m3e-chip-unselected-trailing-icon-color - Trailing icon color in unselected state.
  */
-let M3eFilterChipElement = class M3eFilterChipElement extends Selected(KeyboardClick(Focusable(DisabledInteractive(Disabled(AttachInternals(Role(M3eChipElement, "option"), true)))))) {
+let M3eFilterChipElement = class M3eFilterChipElement extends Selected(KeyboardClick(Focusable(DisabledInteractive(Disabled(AttachInternals(Role(M3eChipElement, "radio"), true)))))) {
     constructor() {
         super(...arguments);
         _M3eFilterChipElement_instances.add(this);
@@ -783,7 +783,7 @@ M3eFilterChipElement = __decorate([
     t$2("m3e-filter-chip")
 ], M3eFilterChipElement);
 
-var _M3eFilterChipSetElement_instances, _M3eFilterChipSetElement_handleSlotChange, _M3eFilterChipSetElement_handleKeyDown, _M3eFilterChipSetElement_handleChange, _a;
+var _M3eFilterChipSetElement_instances, _M3eFilterChipSetElement_handleSlotChange, _M3eFilterChipSetElement_handleKeyDown, _M3eFilterChipSetElement_handleChange, _M3eFilterChipSetElement_updateChipRole, _a;
 /**
  * A container that organizes filter chips into a cohesive group, enabling selection and
  * deselection of values used to refine content or trigger contextual behavior.
@@ -821,7 +821,7 @@ var _M3eFilterChipSetElement_instances, _M3eFilterChipSetElement_handleSlotChang
  *
  * @cssprop --m3e-chip-set-spacing - The spacing (gap) between chips in the set.
  */
-let M3eFilterChipSetElement = class M3eFilterChipSetElement extends Labelled(Dirty(Touched(FormAssociated(Disabled(AttachInternals(Role(M3eChipSetElement, "listbox"))))))) {
+let M3eFilterChipSetElement = class M3eFilterChipSetElement extends Labelled(Dirty(Touched(FormAssociated(Disabled(AttachInternals(Role(M3eChipSetElement, "radiogroup"))))))) {
     constructor() {
         super(...arguments);
         _M3eFilterChipSetElement_instances.add(this);
@@ -882,10 +882,15 @@ let M3eFilterChipSetElement = class M3eFilterChipSetElement extends Labelled(Dir
             this[selectionManager].disabled = this.disabled;
         }
         if (changedProperties.has("multi")) {
-            this.ariaMultiSelectable = `${this.multi}`;
+            this.role = this.multi ? "group" : "radiogroup";
+            __classPrivateFieldGet(this, _M3eFilterChipSetElement_instances, "m", _M3eFilterChipSetElement_updateChipRole).call(this);
             this[selectionManager].multi = this.multi;
             this[selectionManager].disableRovingTabIndex(this.multi);
         }
+        if (changedProperties.has("multi") || changedProperties.has("disabled")) {
+            // aria-disabled is not supported on radiogroup roles.
+            this.ariaDisabled = this.multi && this.disabled ? "true" : null;
+        }
         if (changedProperties.has("hideSelectionIndicator")) {
             this.chips.forEach((x) => x.classList.toggle("-hide-selection", this.hideSelectionIndicator));
         }
@@ -902,6 +907,7 @@ let M3eFilterChipSetElement = class M3eFilterChipSetElement extends Labelled(Dir
 _M3eFilterChipSetElement_handleSlotChange = function _M3eFilterChipSetElement_handleSlotChange() {
     const { added } = this[selectionManager].setItems([...this.querySelectorAll("m3e-filter-chip")]);
     added.forEach((x) => x.classList.toggle("-hide-selection", this.hideSelectionIndicator));
+    __classPrivateFieldGet(this, _M3eFilterChipSetElement_instances, "m", _M3eFilterChipSetElement_updateChipRole).call(this);
 };
 _M3eFilterChipSetElement_handleKeyDown = function _M3eFilterChipSetElement_handleKeyDown(e) {
     if (!this.multi) {
@@ -912,6 +918,9 @@ _M3eFilterChipSetElement_handleChange = function _M3eFilterChipSetElement_handle
     e.stopPropagation();
     this.dispatchEvent(new Event("change", { bubbles: true }));
 };
+_M3eFilterChipSetElement_updateChipRole = function _M3eFilterChipSetElement_updateChipRole() {
+    this.chips.forEach((x) => (x.role = this.multi ? "button" : "radio"));
+};
 __decorate([
     n$1({ type: Boolean })
 ], M3eFilterChipSetElement.prototype, "multi", void 0);