npm - @momentum-design/components - Versions diffs - 0.83.5 → 0.83.6 - Mend

@momentum-design/components 0.83.5 → 0.83.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (22) hide show

package/dist/custom-elements.json CHANGED Viewed

@@ -2203,138 +2203,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/buttongroup/buttongroup.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "buttongroup component, is a styled wrapper for multiple buttons.\nIt can support icon buttons, combination of icon and pill buttons, and text buttons.\nThey are available in horizontal and vertical orientation.",
-          "name": "ButtonGroup",
-          "cssProperties": [
-            {
-              "description": "The border radius of the buttongroup",
-              "name": "--mdc-buttongroup-border-radius"
-            },
-            {
-              "description": "The border color of the buttongroup",
-              "name": "--mdc-buttongroup-border-color"
-            },
-            {
-              "description": "The color of the divider between buttons within the buttongroup",
-              "name": "--mdc-buttongroup-divider-color"
-            }
-          ],
-          "slots": [
-            {
-              "description": "This is a default/unnamed slot, which contains the buttons",
-              "name": "default"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "orientation",
-              "type": {
-                "text": "ButtonGroupOrientation"
-              },
-              "description": "Orientation of the buttongroup.",
-              "default": "'horizontal'",
-              "attribute": "orientation",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "ButtonGroupVariant"
-              },
-              "description": "Variant of the buttons within the buttongroup.",
-              "default": "'primary'",
-              "attribute": "variant",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "ButtonGroupSize"
-              },
-              "description": "Size of the buttons within the buttongroup.",
-              "default": "'28'",
-              "attribute": "size",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "compact",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
-              "attribute": "compact",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "orientation",
-              "type": {
-                "text": "ButtonGroupOrientation"
-              },
-              "description": "Orientation of the buttongroup.",
-              "default": "'horizontal'",
-              "fieldName": "orientation"
-            },
-            {
-              "name": "variant",
-              "type": {
-                "text": "ButtonGroupVariant"
-              },
-              "description": "Variant of the buttons within the buttongroup.",
-              "default": "'primary'",
-              "fieldName": "variant"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "ButtonGroupSize"
-              },
-              "description": "Size of the buttons within the buttongroup.",
-              "default": "'28'",
-              "fieldName": "size"
-            },
-            {
-              "name": "compact",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
-              "fieldName": "compact"
-            }
-          ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-buttongroup",
-          "jsDoc": "/**\n * buttongroup component, is a styled wrapper for multiple buttons.\n * It can support icon buttons, combination of icon and pill buttons, and text buttons.\n * They are available in horizontal and vertical orientation.\n *\n * @tagname mdc-buttongroup\n *\n * @slot default - This is a default/unnamed slot, which contains the buttons\n *\n * @cssproperty --mdc-buttongroup-border-radius - The border radius of the buttongroup\n * @cssproperty --mdc-buttongroup-border-color - The border color of the buttongroup\n * @cssproperty --mdc-buttongroup-divider-color - The color of the divider between buttons within the buttongroup\n */",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "ButtonGroup",
-            "module": "components/buttongroup/buttongroup.component.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/button/button.component.js",
@@ -3030,6 +2898,138 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/buttongroup/buttongroup.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "buttongroup component, is a styled wrapper for multiple buttons.\nIt can support icon buttons, combination of icon and pill buttons, and text buttons.\nThey are available in horizontal and vertical orientation.",
+          "name": "ButtonGroup",
+          "cssProperties": [
+            {
+              "description": "The border radius of the buttongroup",
+              "name": "--mdc-buttongroup-border-radius"
+            },
+            {
+              "description": "The border color of the buttongroup",
+              "name": "--mdc-buttongroup-border-color"
+            },
+            {
+              "description": "The color of the divider between buttons within the buttongroup",
+              "name": "--mdc-buttongroup-divider-color"
+            }
+          ],
+          "slots": [
+            {
+              "description": "This is a default/unnamed slot, which contains the buttons",
+              "name": "default"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "ButtonGroupOrientation"
+              },
+              "description": "Orientation of the buttongroup.",
+              "default": "'horizontal'",
+              "attribute": "orientation",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "ButtonGroupVariant"
+              },
+              "description": "Variant of the buttons within the buttongroup.",
+              "default": "'primary'",
+              "attribute": "variant",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "ButtonGroupSize"
+              },
+              "description": "Size of the buttons within the buttongroup.",
+              "default": "'28'",
+              "attribute": "size",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "compact",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
+              "attribute": "compact",
+              "reflects": true
+            }
+          ],
+          "attributes": [
+            {
+              "name": "orientation",
+              "type": {
+                "text": "ButtonGroupOrientation"
+              },
+              "description": "Orientation of the buttongroup.",
+              "default": "'horizontal'",
+              "fieldName": "orientation"
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "ButtonGroupVariant"
+              },
+              "description": "Variant of the buttons within the buttongroup.",
+              "default": "'primary'",
+              "fieldName": "variant"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "ButtonGroupSize"
+              },
+              "description": "Size of the buttons within the buttongroup.",
+              "default": "'28'",
+              "fieldName": "size"
+            },
+            {
+              "name": "compact",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "When this is true, the buttons within the buttongroup will be compact.\ni.e. Irrespective of the size of the buttons, they will have a height of 24px.",
+              "fieldName": "compact"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-buttongroup",
+          "jsDoc": "/**\n * buttongroup component, is a styled wrapper for multiple buttons.\n * It can support icon buttons, combination of icon and pill buttons, and text buttons.\n * They are available in horizontal and vertical orientation.\n *\n * @tagname mdc-buttongroup\n *\n * @slot default - This is a default/unnamed slot, which contains the buttons\n *\n * @cssproperty --mdc-buttongroup-border-radius - The border radius of the buttongroup\n * @cssproperty --mdc-buttongroup-border-color - The border color of the buttongroup\n * @cssproperty --mdc-buttongroup-divider-color - The color of the divider between buttons within the buttongroup\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ButtonGroup",
+            "module": "components/buttongroup/buttongroup.component.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/buttonlink/buttonlink.component.js",
@@ -8773,7 +8773,7 @@
             {
               "kind": "field",
               "name": "onOutsidePopoverClick",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Handles the outside click event to close the popover.",
               "parameters": [
                 {
@@ -14627,7 +14627,7 @@
             {
               "kind": "method",
               "name": "handleKeyDown",
-              "privacy": "private",
+              "privacy": "protected",
               "return": {
                 "type": {
                   "text": "void"
@@ -14642,12 +14642,12 @@
                   "description": "The keyboard event triggered when a key is pressed down."
                 }
               ],
-              "description": "Fires the click event when the enter or space key is pressed."
+              "description": "Fires the click event when the enter or space key is pressed down.\nThis behavior is similar to a button click and key interaction."
             },
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item."
             },
             {
@@ -15731,6 +15731,50 @@
               "attribute": "arrow-direction",
               "reflects": true
             },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keydown event for the menu item.\nIf the Enter key is pressed, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Enter key.",
+              "inheritedFrom": {
+                "name": "ListItem",
+                "module": "components/listitem/listitem.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keyup event for the menu item.\nIf the Space key is released, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Space key.\nIt also prevents the default action of the Space key to avoid scrolling the page."
+            },
             {
               "kind": "method",
               "name": "renderTrailingControls",
@@ -15905,34 +15949,10 @@
                 "module": "components/listitem/listitem.component.js"
               }
             },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  },
-                  "description": "The keyboard event triggered when a key is pressed down."
-                }
-              ],
-              "description": "Fires the click event when the enter or space key is pressed.",
-              "inheritedFrom": {
-                "name": "ListItem",
-                "module": "components/listitem/listitem.component.js"
-              }
-            },
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item.",
               "inheritedFrom": {
                 "name": "ListItem",
@@ -16497,15 +16517,22 @@
               "attribute": "indicator",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "menuitemcheckboxHandleClick",
+              "privacy": "private",
+              "description": "Handles click events to toggle checked state\nIf the menuitemcheckbox is disabled, it does nothing.\nIf the menuitemcheckbox is not disabled, it toggles the `aria-checked` state between `true` and `false`."
+            },
             {
               "kind": "method",
               "name": "staticCheckbox",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "TemplateResult | typeof nothing"
+                  "text": ""
                 }
-              }
+              },
+              "description": "Returns a static checkbox element if the indicator is set to checkbox.\nIf the indicator is not set to checkbox, it returns nothing."
             },
             {
               "kind": "method",
@@ -16513,9 +16540,10 @@
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "TemplateResult | typeof nothing"
+                  "text": ""
                 }
-              }
+              },
+              "description": "Returns a static toggle element if the indicator is set to toggle.\nIf the indicator is not set to toggle, it returns nothing.\n\nThe toggle will always be positioned on the trailing side of the menuitem label."
             },
             {
               "kind": "method",
@@ -16523,9 +16551,10 @@
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "TemplateResult | typeof nothing"
+                  "text": ""
                 }
-              }
+              },
+              "description": "Returns a checkmark icon if the indicator is set to checkmark and the aria-checked state is true.\nIf the indicator is not set to checkmark or the aria-checked state is false, it returns nothing.\n\nThe checkmark icon will always be positioned on the trailing side of the menuitem label."
             },
             {
               "kind": "field",
@@ -16555,6 +16584,54 @@
                 "module": "components/menuitem/menuitem.component.js"
               }
             },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keydown event for the menu item.\nIf the Enter key is pressed, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Enter key.",
+              "inheritedFrom": {
+                "name": "ListItem",
+                "module": "components/listitem/listitem.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keyup event for the menu item.\nIf the Space key is released, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Space key.\nIt also prevents the default action of the Space key to avoid scrolling the page.",
+              "inheritedFrom": {
+                "name": "MenuItem",
+                "module": "components/menuitem/menuitem.component.js"
+              }
+            },
             {
               "kind": "method",
               "name": "renderTrailingControls",
@@ -16729,34 +16806,10 @@
                 "module": "components/listitem/listitem.component.js"
               }
             },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  },
-                  "description": "The keyboard event triggered when a key is pressed down."
-                }
-              ],
-              "description": "Fires the click event when the enter or space key is pressed.",
-              "inheritedFrom": {
-                "name": "ListItem",
-                "module": "components/listitem/listitem.component.js"
-              }
-            },
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item.",
               "inheritedFrom": {
                 "name": "ListItem",
@@ -17205,6 +17258,23 @@
               "attribute": "aria-checked",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name attribute is used to group radio items within the same menu container.",
+              "attribute": "name",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "menuitemradioHandleClick",
+              "privacy": "private",
+              "description": "Handles click events to set checked state and uncheck siblings in the same group and container.\nIf the menuitemradio is not checked, it sets its aria-checked state to `true`\nand sets all other menuitemradio elements of the same group with aria-checked state to `false`."
+            },
             {
               "kind": "field",
               "name": "arrowPosition",
@@ -17233,6 +17303,54 @@
                 "module": "components/menuitem/menuitem.component.js"
               }
             },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keydown event for the menu item.\nIf the Enter key is pressed, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Enter key.",
+              "inheritedFrom": {
+                "name": "ListItem",
+                "module": "components/listitem/listitem.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keyup event for the menu item.\nIf the Space key is released, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Space key.\nIt also prevents the default action of the Space key to avoid scrolling the page.",
+              "inheritedFrom": {
+                "name": "MenuItem",
+                "module": "components/menuitem/menuitem.component.js"
+              }
+            },
             {
               "kind": "method",
               "name": "renderTrailingControls",
@@ -17407,34 +17525,10 @@
                 "module": "components/listitem/listitem.component.js"
               }
             },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  },
-                  "description": "The keyboard event triggered when a key is pressed down."
-                }
-              ],
-              "description": "Fires the click event when the enter or space key is pressed.",
-              "inheritedFrom": {
-                "name": "ListItem",
-                "module": "components/listitem/listitem.component.js"
-              }
-            },
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item.",
               "inheritedFrom": {
                 "name": "ListItem",
@@ -17627,6 +17721,15 @@
               "default": "'false'",
               "fieldName": "ariaChecked"
             },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name attribute is used to group radio items within the same menu container.",
+              "fieldName": "name"
+            },
             {
               "name": "arrow-position",
               "type": {
@@ -17945,51 +18048,12 @@
           "members": [
             {
               "kind": "field",
-              "name": "ariaOrientation",
-              "type": {
-                "text": "Orientation"
-              },
-              "description": "Defines the orientation of the menu. This value is reflected to\nthe `aria-orientation` attribute and can be either `'horizontal'` or `'vertical'`.",
-              "default": "'horizontal'",
-              "attribute": "aria-orientation",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setMenuBarPopoverValue",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "value",
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The value to set."
-                }
-              ],
-              "description": "Sets the value of the data-menu-popover-open attribute on the menu element.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isMenuPopoverOpen",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "description": "Returns true if the data-menu-popover-open attribute on the menu element is set to 'true', false otherwise.",
+              "name": "hidePopover",
+              "privacy": "public",
+              "description": "Hides the popover.",
               "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
               }
             },
             {
@@ -18007,255 +18071,63 @@
                   "type": {
                     "text": "EventTarget | null"
                   },
-                  "description": "The target element to find the index of."
+                  "description": "The target element that triggered the event."
                 }
               ],
-              "description": "Returns the index of the given target in the menuItems array.\nIf the target is not a menu item, but a child element of a menu item,\nit returns the index of the parent menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
+              "description": "Retrieves the current index of the menu item that triggered the event."
             },
             {
               "kind": "method",
-              "name": "updatePopoverPlacementBasedOnOrientation",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Updates the placement of the popover based on the aria-orientation property.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "updateTabIndexAndFocusNewIndex",
+              "name": "resetTabIndexAndSetFocus",
               "privacy": "private",
               "parameters": [
                 {
-                  "name": "menuItems",
-                  "type": {
-                    "text": "Array<HTMLElement>"
-                  },
-                  "description": "The list of menu items."
-                },
-                {
-                  "name": "currentIndex",
+                  "name": "newIndex",
                   "type": {
                     "text": "number"
                   },
-                  "description": "The current index of the focused menu item."
+                  "description": "The index of the new menu item to focus."
                 },
                 {
-                  "name": "newIndex",
+                  "name": "oldIndex",
                   "type": {
                     "text": "number"
                   },
-                  "description": "The index of the new active element in the list."
+                  "description": "The index of the currently focused menu item."
                 }
               ],
-              "description": "Updates the tabindex of the current index to -1 and the tabindex of the new index to 0,\neffectively setting the active element. This is used when navigating the menu via keyboard.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isValidMenu",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "tagName",
-                  "optional": true,
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The tag name to check."
-                }
-              ],
-              "description": "Checks if the given tag name is a valid menu tag name.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isValidNavItemList",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "tagName",
-                  "optional": true,
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The tag name to check."
-                }
-              ],
-              "description": "Checks if the given tag name is a valid navitemlist tag name.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isValidPopover",
-              "privacy": "private",
+              "description": "Resets the tabindex of the currently focused menu item and sets focus to a new menu item.",
               "return": {
                 "type": {
                   "text": ""
                 }
-              },
-              "parameters": [
-                {
-                  "name": "tagName",
-                  "optional": true,
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The tag name to check."
-                }
-              ],
-              "description": "Checks if the given tag name is a valid menu popover tag name.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
               }
             },
             {
               "kind": "method",
-              "name": "openPopover",
+              "name": "closeAllMenuPopovers",
               "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "index",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the menu item to open the popover for."
-                }
-              ],
-              "description": "Opens the popover at the given index if it exists.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
+              "description": "Closes all menu popovers in the stack.\nThis method is used to ensure that when a menu item is clicked,\nall other open popovers are closed, maintaining a clean user interface.\nIt iterates through the `popoverStack` and hides each popover until the stack is empty."
             },
             {
-              "kind": "method",
-              "name": "navigateToPrevMenuItem",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "currentIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The current index of the focused menu item."
-                },
-                {
-                  "name": "firstMenuIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the first menu item."
-                },
-                {
-                  "name": "lastMenuIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the last menu item."
-                },
-                {
-                  "name": "ariaOrientation",
-                  "type": {
-                    "text": "Orientation"
-                  },
-                  "description": "The orientation of the menu."
-                }
-              ],
-              "description": "Navigates to the previous menu item and updates the tabindex of the current index\nto -1 and the tabindex of the new index to 0.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "navigateToNextMenuItem",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
+              "kind": "field",
+              "name": "onOutsidePopoverClick",
+              "privacy": "protected",
+              "description": "Handles outside click events to close the popover.\nThis method checks if the click occurred outside the popover and its trigger element.\nIf so, it closes the popover by calling `closeAllMenuPopovers`.\nIt also checks if the click was on the backdrop element (if present) to close the popover.",
               "parameters": [
                 {
-                  "name": "currentIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The current index of the focused menu item."
-                },
-                {
-                  "name": "firstMenuIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the first menu item."
-                },
-                {
-                  "name": "lastMenuIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the last menu item."
-                },
-                {
-                  "name": "ariaOrientation",
-                  "type": {
-                    "text": "Orientation"
-                  },
-                  "description": "The orientation of the menu."
+                  "description": "The mouse event that triggered the outside click.",
+                  "name": "event"
                 }
               ],
-              "description": "Navigates to the next menu item and updates the tabindex of the current index\nto -1 and the tabindex of the new index to 0.",
               "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
               }
             },
             {
               "kind": "method",
-              "name": "getParentMenuItemDetails",
+              "name": "hasSubmenuWithTriggerId",
               "privacy": "private",
               "return": {
                 "type": {
@@ -18264,30 +18136,18 @@
               },
               "parameters": [
                 {
-                  "name": "menuChildId",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The id of the menu child element."
-                },
-                {
-                  "name": "menu",
-                  "optional": true,
+                  "name": "id",
                   "type": {
-                    "text": "HTMLElement | null"
+                    "text": "string | null"
                   },
-                  "description": "The current menu element to start traversing from."
+                  "description": "The ID of the menu item to check for a submenu."
                 }
               ],
-              "description": "Returns the parent menu item details for the given menu child id.\nIt recursively traverses up the DOM tree until it finds a menu or menubar element.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
+              "description": "Checks if the menu popover has a submenu with the specified trigger ID.\nThis method is used to determine if a menu item has a submenu associated with it,\nwhich is indicated by the presence of a `triggerid` attribute in the submenu popover.\nIt queries the parent element for any popover with the specified trigger ID."
             },
             {
               "kind": "method",
-              "name": "hideAllPopovers",
+              "name": "handleMouseClick",
               "privacy": "private",
               "return": {
                 "type": {
@@ -18296,268 +18156,60 @@
               },
               "parameters": [
                 {
-                  "name": "menu",
-                  "optional": true,
+                  "name": "event",
                   "type": {
-                    "text": "HTMLElement | null"
+                    "text": "MouseEvent"
                   },
-                  "description": "The current menu element to start traversing from."
+                  "description": "The mouse event that triggered the click."
                 }
               ],
-              "description": "Recursively hides all the popovers up the DOM tree until it finds a menu or menubar element.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
+              "description": "Handles mouse click events on the menu items.\nThis method checks if the clicked element is a valid menu item and not a submenu trigger.\nIf it is, it closes all other menu popovers to ensure only one menu is open at a time."
             },
             {
               "kind": "method",
-              "name": "navigateToPrevParentMenuItem",
+              "name": "resolveDirectionKey",
               "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
               "parameters": [
-                {
-                  "name": "currentIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The current index of the focused menu item."
-                },
                 {
                   "name": "key",
                   "type": {
                     "text": "string"
-                  }
-                }
-              ],
-              "description": "Recursively navigates up the DOM tree until it finds the previous menu item\nand updates the tabindex of the current index to -1 and the tabindex of the new index to 0.\nAlso opens the popover of the previous menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "closePopoverAndNavigateToPrevParentMenuItem",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "currentIndex",
-                  "type": {
-                    "text": "number"
                   },
-                  "description": "The current index of the focused menu item."
+                  "description": "The key pressed by the user."
                 },
                 {
-                  "name": "key",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ],
-              "description": "Closes the current menu popover and navigates to the previous parent menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getParentMenuContents",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "currentMenuItem",
-                  "type": {
-                    "text": "HTMLElement | null"
-                  },
-                  "description": "The current menu item to start traversing from."
-                }
-              ],
-              "description": "Gets the parent menu contents of the given current menu item.\nIt recursively traverses up the DOM tree until it finds the parent menu element\nand gets the parent menu item details and the children of the parent menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "openPopoverAndNavigateToNextChildrenMenuItem",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "currentIndex",
+                  "name": "isRtl",
                   "type": {
-                    "text": "number"
+                    "text": "boolean"
                   },
-                  "description": "The current index of the focused menu item."
+                  "description": "A boolean indicating if the layout is right-to-left (RTL)."
                 }
               ],
-              "description": "Opens the popover of the next children menu item if there are children.\nIf there are no children, then it closes all popovers recursively and\nnavigates to the next menu item from the menu bar.\nIf the parent menu item does not have any children, then we will go to the next menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isValidMenuItem",
-              "privacy": "private",
+              "description": "Resolves the key pressed by the user based on the direction of the layout.\nThis method is used to handle keyboard navigation in a right-to-left (RTL) layout.\nIt checks if the layout is RTL and adjusts the arrow keys accordingly.\nFor example, in RTL, the left arrow key behaves like the right arrow key and vice versa.",
               "return": {
                 "type": {
                   "text": ""
                 }
-              },
-              "parameters": [
-                {
-                  "name": "menuItem",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The menu item to check."
-                }
-              ],
-              "description": "Checks if the given menu item is a valid menu item.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "resetTabIndexAndSetActiveTabIndex",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "menuItems",
-                  "type": {
-                    "text": "Array<HTMLElement>"
-                  }
-                },
-                {
-                  "description": "The index of the new active element in the list.",
-                  "name": "newIndex"
-                }
-              ],
-              "description": "Resets all list items tabindex to -1 and sets the tabindex of the\nelement at the given index to 0, effectively setting the active\nelement. This is used when navigating the list via keyboard.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getKeyBasedOnDirection",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "originalKey",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The original key pressed."
-                }
-              ],
-              "description": "Returns the key based on the direction of the document.\nIf the document is in RTL mode and the key is ARROW_LEFT or ARROW_RIGHT,\nit will swap them to maintain the correct navigation direction.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
               }
             },
             {
               "kind": "method",
               "name": "handleKeyDown",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
+              "privacy": "private",
               "parameters": [
                 {
                   "name": "event",
                   "type": {
                     "text": "KeyboardEvent"
                   },
-                  "description": "The keyboard event."
-                }
-              ],
-              "description": "Handles the keydown event on the menu bar.\nThe keys are as follows:\n- HOME: Sets focus to the first menu item.\n- END: Sets focus to the last menu item.\n- ARROW_LEFT:\n  - If orientation is horizontal, then it navigates to the previous menu item.\n  - If orientation is vertical, then it closes the popover of the current menu item and\n    navigates to the previous parent menu item.\n- ARROW_RIGHT:\n  - If orientation is horizontal, then it navigates to the next menu item.\n  - If orientation is vertical, then it opens the popover of the current menu item and\n    navigates to the next children menu item.\n- ARROW_UP:\n  - If orientation is horizontal, then it opens the popover of the current menu item.\n  - If orientation is vertical, then it navigates to the previous menu item.\n- ARROW_DOWN:\n  - If orientation is horizontal, then it opens the popover of the current menu item.\n  - If orientation is vertical, then it navigates to the next menu item.\n- SPACE:\n- ENTER:\n  - If the next element sibling is a menu popover, then it opens the popover of the current\n    menu item and navigates to the next children menu item.\n  - If the target element is a menu item, then it closes all popovers recursively and\n    navigates to the previous parent menu item.\n- ESCAPE:\n  - If a popover is already open then we close it and navigate to the parent menu item.\n  - If the current menuitem is a child of menubar, then we will set the value of isMenuPopoverOpen to false.,",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "closeAllPopoversExceptCurrent",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "currentIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the current menu item."
+                  "description": "The keyboard event that triggered the keydown action."
                 }
               ],
-              "description": "Closes all popovers except the current one.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleMouseClick",
-              "privacy": "protected",
+              "description": "Handles keydown events for keyboard navigation within the menu popover.\nThis method allows users to navigate through the menu items using the keyboard.\nIt supports Home, End, Arrow Up, Arrow Down, Arrow Left, Arrow Right, and Escape keys.",
               "return": {
                 "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "MouseEvent"
-                  },
-                  "description": "The mouse click event."
+                  "text": ""
                 }
-              ],
-              "description": "Handles the mouse click event on the menu items.\n- If the menuitem has children, then it opens the popover of the next children menu item.\n- If the menuitem does not have children, then it closes all popovers recursively.",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "utils/mixins/MenuMixin.js"
               }
             },
             {
@@ -19530,22 +19182,6 @@
                 "module": "components/popover/popover.component.js"
               }
             },
-            {
-              "kind": "field",
-              "name": "onOutsidePopoverClick",
-              "privacy": "private",
-              "description": "Handles the outside click event to close the popover.",
-              "parameters": [
-                {
-                  "description": "The mouse event.",
-                  "name": "event"
-                }
-              ],
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
             {
               "kind": "field",
               "name": "onEscapeKeydown",
@@ -19634,16 +19270,6 @@
                 "module": "components/popover/popover.component.js"
               }
             },
-            {
-              "kind": "field",
-              "name": "hidePopover",
-              "privacy": "public",
-              "description": "Hides the popover.",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
             {
               "kind": "field",
               "name": "togglePopoverVisible",
@@ -19674,12 +19300,6 @@
               }
             }
           ],
-          "mixins": [
-            {
-              "name": "MenuMixin",
-              "module": "/src/utils/mixins/MenuMixin"
-            }
-          ],
           "superclass": {
             "name": "Popover",
             "module": "/src/components/popover/popover.component"
@@ -19688,19 +19308,6 @@
           "jsDoc": "/**\n * A popover menu component that displays a list of menu items in a floating container.\n * It's designed to work in conjunction with `mdc-menubar` and `mdc-menuitem` to create\n * accessible, nested menu structures with the following features:\n * - Appears adjacent to the triggering menu item\n * - Supports keyboard navigation (arrow keys, Home, End)\n * - Manages focus trapping when open\n * - Closes on Escape key or outside click\n * - Supports both mouse and keyboard interactions\n * - Automatically handles ARIA attributes for accessibility\n *\n * The component extends `mdc-popover` and adds menu-specific behaviors and styling.\n * When nested within another `mdc-menupopover`, it automatically adjusts its behavior\n * to work as a submenu (right-aligned, shows on hover).\n *\n * The orientation of the menu popover is always set to `vertical`.\n *\n * @tagname mdc-menupopover\n * @slot default - Contains the menu items to be displayed in the popover\n */",
           "customElement": true,
           "attributes": [
-            {
-              "name": "aria-orientation",
-              "type": {
-                "text": "Orientation"
-              },
-              "description": "Defines the orientation of the menu. This value is reflected to\nthe `aria-orientation` attribute and can be either `'horizontal'` or `'vertical'`.",
-              "default": "'horizontal'",
-              "fieldName": "ariaOrientation",
-              "inheritedFrom": {
-                "name": "MenuMixin",
-                "module": "src/utils/mixins/MenuMixin.ts"
-              }
-            },
             {
               "name": "should-focus-trap-wrap",
               "type": {
@@ -20553,6 +20160,54 @@
                 "module": "components/menuitem/menuitem.component.js"
               }
             },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keydown event for the menu item.\nIf the Enter key is pressed, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Enter key.",
+              "inheritedFrom": {
+                "name": "ListItem",
+                "module": "components/listitem/listitem.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event that triggered the action."
+                }
+              ],
+              "description": "Handles the keyup event for the menu item.\nIf the Space key is released, it triggers a click event on the menu item.\nThis allows keyboard users to activate the menu item using the Space key.\nIt also prevents the default action of the Space key to avoid scrolling the page.",
+              "inheritedFrom": {
+                "name": "MenuItem",
+                "module": "components/menuitem/menuitem.component.js"
+              }
+            },
             {
               "kind": "method",
               "name": "renderTrailingControls",
@@ -20727,34 +20382,10 @@
                 "module": "components/listitem/listitem.component.js"
               }
             },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  },
-                  "description": "The keyboard event triggered when a key is pressed down."
-                }
-              ],
-              "description": "Fires the click event when the enter or space key is pressed.",
-              "inheritedFrom": {
-                "name": "ListItem",
-                "module": "components/listitem/listitem.component.js"
-              }
-            },
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item.",
               "inheritedFrom": {
                 "name": "ListItem",
@@ -22444,7 +22075,7 @@
             {
               "kind": "method",
               "name": "handleKeyDown",
-              "privacy": "private",
+              "privacy": "protected",
               "return": {
                 "type": {
                   "text": "void"
@@ -22459,7 +22090,7 @@
                   "description": "The keyboard event triggered when a key is pressed down."
                 }
               ],
-              "description": "Fires the click event when the enter or space key is pressed.",
+              "description": "Fires the click event when the enter or space key is pressed down.\nThis behavior is similar to a button click and key interaction.",
               "inheritedFrom": {
                 "name": "ListItem",
                 "module": "components/listitem/listitem.component.js"
@@ -22468,7 +22099,7 @@
             {
               "kind": "method",
               "name": "triggerClickEvent",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Triggers a click event on the list item.",
               "inheritedFrom": {
                 "name": "ListItem",
@@ -23377,7 +23008,7 @@
             {
               "kind": "field",
               "name": "onOutsidePopoverClick",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Handles the outside click event to close the popover.",
               "parameters": [
                 {
@@ -33823,7 +33454,7 @@
             {
               "kind": "field",
               "name": "onOutsidePopoverClick",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Handles the outside click event to close the popover.",
               "parameters": [
                 {
@@ -35593,7 +35224,7 @@
             {
               "kind": "field",
               "name": "onOutsidePopoverClick",
-              "privacy": "private",
+              "privacy": "protected",
               "description": "Handles the outside click event to close the popover.",
               "parameters": [
                 {