@momentum-design/components 0.85.10 → 0.86.0

package/dist/components/menuitemcheckbox/menuitemcheckbox.component.d.ts

@@ -62,7 +62,7 @@ declare class MenuItemCheckbox extends MenuItem {
      * If the menuitemcheckbox is disabled, it does nothing.
      * If the menuitemcheckbox is not disabled, it toggles the `checked` state between `true` and `false`.
      */
-    private menuitemcheckboxHandleClick;
+    private handleMouseClick;
     update(changedProperties: PropertyValues): void;
     /**
      * Returns a static checkbox element if the indicator is set to checkbox.

package/dist/components/menuitemcheckbox/menuitemcheckbox.component.js

@@ -76,14 +76,14 @@ class MenuItemCheckbox extends MenuItem {
          * If the menuitemcheckbox is disabled, it does nothing.
          * If the menuitemcheckbox is not disabled, it toggles the `checked` state between `true` and `false`.
          */
-        this.menuitemcheckboxHandleClick = (event) => {
+        this.handleMouseClick = (event) => {
             event.stopPropagation();
             if (this.disabled)
                 return;
             this.checked = !this.checked;
             this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
         };
-        this.addEventListener('click', this.menuitemcheckboxHandleClick);
+        this.addEventListener('click', this.handleMouseClick);
     }
     connectedCallback() {
         super.connectedCallback();
@@ -101,16 +101,16 @@ class MenuItemCheckbox extends MenuItem {
      * @returns TemplateResult | typeof nothing
      */
     staticCheckbox() {
-        if (this.indicator !== INDICATOR.CHECKBOX) {
-            return nothing;
+        if (this.indicator === INDICATOR.CHECKBOX) {
+            return html `
+        <mdc-staticcheckbox
+          slot="leading-controls"
+          ?checked="${this.checked}"
+          ?disabled="${this.disabled}"
+        ></mdc-staticcheckbox>
+      `;
         }
-        return html `
-      <mdc-staticcheckbox
-        slot="leading-controls"
-        ?checked="${this.checked}"
-        ?disabled="${this.disabled}"
-      ></mdc-staticcheckbox>
-    `;
+        return nothing;
     }
     /**
      * Returns a static toggle element if the indicator is set to toggle.
@@ -120,17 +120,17 @@ class MenuItemCheckbox extends MenuItem {
      * @returns TemplateResult | typeof nothing
      */
     staticToggle() {
-        if (this.indicator !== INDICATOR.TOGGLE) {
-            return nothing;
+        if (this.indicator === INDICATOR.TOGGLE) {
+            return html `
+        <mdc-statictoggle
+          slot="trailing-controls"
+          ?checked="${this.checked}"
+          ?disabled="${this.disabled}"
+          size="${TOGGLE_SIZE.COMPACT}"
+        ></mdc-statictoggle>
+      `;
         }
-        return html `
-      <mdc-statictoggle
-        slot="trailing-controls"
-        ?checked="${this.checked}"
-        ?disabled="${this.disabled}"
-        size="${TOGGLE_SIZE.COMPACT}"
-      ></mdc-statictoggle>
-    `;
+        return nothing;
     }
     /**
      * Returns a checkmark icon if the indicator is set to checkmark and the checked state is true.

package/dist/components/menuitemradio/index.d.ts

@@ -1,3 +1,4 @@
+import '../icon';
 import '../staticradio';
 import '../text';
 import '../tooltip';

package/dist/components/menuitemradio/index.js

@@ -1,3 +1,4 @@
+import '../icon';
 import '../staticradio';
 import '../text';
 import '../tooltip';

package/dist/components/menuitemradio/menuitemradio.component.d.ts

@@ -27,8 +27,10 @@ import { Indicator } from './menuitemradio.types';
  * For example, you can use a custom icon or a different visual element to indicate the state of the menu item.
  * Make sure the new indicator is accessible.
  *
+ * @dependency mdc-icon
  * @dependency mdc-staticradio
  * @dependency mdc-text
+ * @dependency mdc-tooltip
  *
  * @tagname mdc-menuitemradio
  *
@@ -72,7 +74,7 @@ declare class MenuItemRadio extends MenuItem {
      * If the menuitemradio is not checked, it sets its checked state to `true`
      * and sets all other menuitemradio elements of the same group with checked state to `false`.
      */
-    private radioHandleClick;
+    private handleMouseClick;
     update(changedProperties: PropertyValues): void;
     /**
      * Returns a static checkbox element if the indicator is set to checkbox.

package/dist/components/menuitemradio/menuitemradio.component.js

@@ -42,8 +42,10 @@ import styles from './menuitemradio.styles';
  * For example, you can use a custom icon or a different visual element to indicate the state of the menu item.
  * Make sure the new indicator is accessible.
  *
+ * @dependency mdc-icon
  * @dependency mdc-staticradio
  * @dependency mdc-text
+ * @dependency mdc-tooltip
  *
  * @tagname mdc-menuitemradio
  *
@@ -77,7 +79,7 @@ class MenuItemRadio extends MenuItem {
          * If the menuitemradio is not checked, it sets its checked state to `true`
          * and sets all other menuitemradio elements of the same group with checked state to `false`.
          */
-        this.radioHandleClick = (event) => {
+        this.handleMouseClick = (event) => {
             event.stopPropagation();
             if (this.disabled || this.checked)
                 return;
@@ -85,7 +87,7 @@ class MenuItemRadio extends MenuItem {
             this.checked = true;
             this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
         };
-        this.addEventListener('click', this.radioHandleClick);
+        this.addEventListener('click', this.handleMouseClick);
     }
     connectedCallback() {
         super.connectedCallback();
@@ -108,9 +110,9 @@ class MenuItemRadio extends MenuItem {
     updateOtherRadiosCheckedState() {
         const radios = this.getAllRadiosWithinSameGroup();
         radios.forEach(radio => {
-            // eslint-disable-next-line no-param-reassign
-            if (radio !== this)
-                radio.checked = false;
+            if (radio !== this) {
+                radio.removeAttribute('checked');
+            }
         });
     }
     update(changedProperties) {
@@ -128,16 +130,16 @@ class MenuItemRadio extends MenuItem {
      * @returns TemplateResult | typeof nothing
      */
     renderStaticRadio() {
-        if (this.indicator !== INDICATOR.RADIO) {
-            return nothing;
+        if (this.indicator === INDICATOR.RADIO) {
+            return html `
+        <mdc-staticradio
+          slot="leading-controls"
+          ?checked="${this.checked}"
+          ?disabled="${this.disabled}"
+        ></mdc-staticradio>
+      `;
         }
-        return html `
-      <mdc-staticradio
-        slot="leading-controls"
-        ?checked="${this.checked}"
-        ?disabled="${this.disabled}"
-      ></mdc-staticradio>
-    `;
+        return nothing;
     }
     /**
      * Returns a checkmark icon if the indicator is set to checkmark and the checked state is true.

package/dist/components/menusection/menusection.component.js

@@ -75,7 +75,7 @@ __decorate([
     __metadata("design:type", Object)
 ], MenuSection.prototype, "ariaLabel", void 0);
 __decorate([
-    property({ type: String, reflect: true }),
+    property({ type: String, reflect: true, attribute: 'header-text' }),
     __metadata("design:type", Object)
 ], MenuSection.prototype, "headerText", void 0);
 export default MenuSection;