@momentum-design/components 0.112.3 → 0.112.4

package/dist/custom-elements.json

@@ -2,481 +2,6 @@
   "schemaVersion": "1.0.0",
   "readme": "",
   "modules": [
-    {
-      "kind": "javascript-module",
-      "path": "components/accordion/accordion.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n\nThe header section contains:\n- Prefix Icon\n- Header Text\n- Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n- Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n\nThe body section contains:\n- Default slot - User can place any content inside the body section.\n\nThe accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\nThere are two types of variants based on that the border styling of the accordion gets reflected. <br/>\nThere are two sizes of accordion, one is small and the other is large.\nSmall size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n\nBy default, the header text in the accordion heading is of H3 with an aria-level of '3'.\nIf this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n\nAn accordion can be disabled, and when it's disabled, the header section will not be clickable.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.",
-          "name": "Accordion",
-          "cssProperties": [
-            {
-              "description": "The border color of the accordion.",
-              "name": "--mdc-accordionbutton-border-color",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The hover color of the accordion.",
-              "name": "--mdc-accordionbutton-hover-color",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The active color of the accordion.",
-              "name": "--mdc-accordionbutton-active-color",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The disabled color of the accordion.",
-              "name": "--mdc-accordionbutton-disabled-color",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            }
-          ],
-          "cssParts": [
-            {
-              "description": "The header section of the accordion.",
-              "name": "header-section",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The leading header of the accordion.",
-              "name": "leading-header",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The trailing header of the accordion.",
-              "name": "trailing-header",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The trailing header button of the accordion.",
-              "name": "trailing-header__button"
-            },
-            {
-              "description": "The body section of the accordion.",
-              "name": "body-section",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The header button section of the accordion button.",
-              "name": "header-button-section",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "description": "The trailing header icon of the accordion button.",
-              "name": "trailing-header__icon",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            }
-          ],
-          "slots": [
-            {
-              "description": "The leading controls slot of the accordion on the header section.",
-              "name": "leading-controls"
-            },
-            {
-              "description": "The trailing controls slot of the accordion on the header section.",
-              "name": "trailing-controls"
-            },
-            {
-              "description": "The default slot contains the body section of the accordion. User can place anything inside this body slot.",
-              "name": "default",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            }
-          ],
-          "members": [
-            {
-              "kind": "method",
-              "name": "renderHeader",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "description": "Renders the header section of the accordion.\nThis includes the leading icon, text and controls, and the trailing controls.\nThe trailing controls include the expand/collapse button.\nThe button is disabled if the accordion is disabled.\nThe button is also given the aria-controls attribute set to the id of the body section.\nThe button is also given the aria-expanded attribute set to the expanded state of the accordion.\nThe prefix icon of the button is set to the expanded state of the accordion.",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "attribute": "disabled",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "utils/mixins/DisabledMixin.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "Size"
-              },
-              "description": "The size of the accordion item.",
-              "default": "'small'",
-              "attribute": "size",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
-              "default": "'default'",
-              "attribute": "variant",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "dataAriaLevel",
-              "type": {
-                "text": "number"
-              },
-              "description": "The aria level of the accordion component.",
-              "default": "3",
-              "attribute": "data-aria-level",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "expanded",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The visibility of the accordion button.",
-              "default": "false",
-              "attribute": "expanded",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "headerText",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The header text of the accordion item.",
-              "attribute": "header-text",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "prefixIcon",
-              "type": {
-                "text": "IconNames | undefined"
-              },
-              "description": "The leading icon that is displayed before the header text.",
-              "attribute": "prefix-icon",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleHeaderClick",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Handles the click event of the header section.\nIf the accordion is disabled, it will not toggle the expanded state.\nIt will dispatch the `shown` event with the current expanded state.",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "dispatchHeaderClickEvent",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Dispatches the `shown` event with the current expanded state.\nThe event is cancelable and bubbles.\nThe event detail contains the current expanded state.",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  },
-                  "description": "The KeyboardEvent fired."
-                }
-              ],
-              "description": "Handles the keydown event of the component.\nIf the key pressed is either Enter or Space, it calls the handleHeaderClick method.\nThis allows keyboard users to toggle the accordion button using these keys.",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderIcon",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "TemplateResult | typeof nothing"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "iconName",
-                  "optional": true,
-                  "type": {
-                    "text": "IconNames"
-                  }
-                }
-              ],
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHeadingText",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "TemplateResult | typeof nothing"
-                }
-              },
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getArrowIconName",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "description": "Returns the icon name based on the expanded state.\nIf the accordion button is disabled, it always returns the arrow down icon.\nOtherwise, it returns the arrow up icon if the accordion button is expanded, otherwise the arrow down icon.",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderBody",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "TemplateResult | typeof nothing"
-                }
-              },
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "components/accordionbutton/accordionbutton.component.js"
-              }
-            }
-          ],
-          "events": [
-            {
-              "description": "(React: onShown) This event is triggered when the accordion is expanded.",
-              "name": "shown",
-              "reactName": "onShown",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            }
-          ],
-          "superclass": {
-            "name": "AccordionButton",
-            "module": "/src/components/accordionbutton/accordionbutton.component"
-          },
-          "tagName": "mdc-accordion",
-          "jsDoc": "/**\n * An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n *\n * The header section contains:\n * - Prefix Icon\n * - Header Text\n * - Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n * - Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n *\n * The body section contains:\n * - Default slot - User can place any content inside the body section.\n *\n * The accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\n * There are two types of variants based on that the border styling of the accordion gets reflected. <br/>\n * There are two sizes of accordion, one is small and the other is large.\n * Small size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n *\n * By default, the header text in the accordion heading is of H3 with an aria-level of '3'.\n * If this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n *\n * An accordion can be disabled, and when it's disabled, the header section will not be clickable.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.\n *\n * @tagname mdc-accordion\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot leading-controls - The leading controls slot of the accordion on the header section.\n * @slot trailing-controls - The trailing controls slot of the accordion on the header section.\n * @slot default - The default slot contains the body section of the accordion. User can place anything inside this body slot.\n *\n * @event shown - (React: onShown) This event is triggered when the accordion is expanded.\n *\n * @cssproperty --mdc-accordionbutton-border-color - The border color of the accordion.\n * @cssproperty --mdc-accordionbutton-hover-color - The hover color of the accordion.\n * @cssproperty --mdc-accordionbutton-active-color - The active color of the accordion.\n * @cssproperty --mdc-accordionbutton-disabled-color - The disabled color of the accordion.\n *\n * @csspart header-section - The header section of the accordion.\n * @csspart leading-header - The leading header of the accordion.\n * @csspart trailing-header - The trailing header of the accordion.\n * @csspart trailing-header__button - The trailing header button of the accordion.\n * @csspart body-section - The body section of the accordion.\n */",
-          "customElement": true,
-          "attributes": [
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
-              }
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "Size"
-              },
-              "description": "The size of the accordion item.",
-              "default": "'small'",
-              "fieldName": "size",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
-              "default": "'default'",
-              "fieldName": "variant",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "name": "data-aria-level",
-              "type": {
-                "text": "number"
-              },
-              "description": "The aria level of the accordion component.",
-              "default": "3",
-              "fieldName": "dataAriaLevel",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "name": "expanded",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The visibility of the accordion button.",
-              "default": "false",
-              "fieldName": "expanded",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "name": "header-text",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The header text of the accordion item.",
-              "fieldName": "headerText",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            },
-            {
-              "name": "prefix-icon",
-              "type": {
-                "text": "IconNames | undefined"
-              },
-              "description": "The leading icon that is displayed before the header text.",
-              "fieldName": "prefixIcon",
-              "inheritedFrom": {
-                "name": "AccordionButton",
-                "module": "src/components/accordionbutton/accordionbutton.component.ts"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "Accordion",
-            "module": "components/accordion/accordion.component.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/accordionbutton/accordionbutton.component.js",
@@ -970,203 +495,466 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/animation/animation.component.js",
+      "path": "components/accordion/accordion.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The `mdc-animation` component is a wrapper around the Lottie animation library.\nIt fetches the animation data dynamically based on the provided name and renders it.\nThis is a display only component that does not have any interactive functionality.\nFrom accessibility perspective, (by default) it is a decorative image component.",
-          "name": "Animation",
-          "members": [
+          "description": "An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n\nThe header section contains:\n- Prefix Icon\n- Header Text\n- Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n- Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n\nThe body section contains:\n- Default slot - User can place any content inside the body section.\n\nThe accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\nThere are two types of variants based on that the border styling of the accordion gets reflected. <br/>\nThere are two sizes of accordion, one is small and the other is large.\nSmall size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n\nBy default, the header text in the accordion heading is of H3 with an aria-level of '3'.\nIf this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n\nAn accordion can be disabled, and when it's disabled, the header section will not be clickable.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.",
+          "name": "Accordion",
+          "cssProperties": [
             {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "AnimationNames | undefined"
-              },
-              "description": "Name of the animation (= filename)",
-              "attribute": "name",
-              "reflects": true
+              "description": "The border color of the accordion.",
+              "name": "--mdc-accordionbutton-border-color",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "kind": "field",
-              "name": "loop",
-              "type": {
-                "text": "LoopType | undefined"
-              },
-              "description": "How many times to loop the animation\n- \"true\" - infinite\n- \"false\" - no loop\n- number - number of times to loop",
-              "attribute": "loop",
-              "reflects": true
+              "description": "The hover color of the accordion.",
+              "name": "--mdc-accordionbutton-hover-color",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "kind": "field",
-              "name": "autoplay",
+              "description": "The active color of the accordion.",
+              "name": "--mdc-accordionbutton-active-color",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The disabled color of the accordion.",
+              "name": "--mdc-accordionbutton-disabled-color",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The header section of the accordion.",
+              "name": "header-section",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The leading header of the accordion.",
+              "name": "leading-header",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The trailing header of the accordion.",
+              "name": "trailing-header",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The trailing header button of the accordion.",
+              "name": "trailing-header__button"
+            },
+            {
+              "description": "The body section of the accordion.",
+              "name": "body-section",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The header button section of the accordion button.",
+              "name": "header-button-section",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            },
+            {
+              "description": "The trailing header icon of the accordion button.",
+              "name": "trailing-header__icon",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "description": "The leading controls slot of the accordion on the header section.",
+              "name": "leading-controls"
+            },
+            {
+              "description": "The trailing controls slot of the accordion on the header section.",
+              "name": "trailing-controls"
+            },
+            {
+              "description": "The default slot contains the body section of the accordion. User can place anything inside this body slot.",
+              "name": "default",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            }
+          ],
+          "members": [
+            {
+              "kind": "method",
+              "name": "renderHeader",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "description": "Renders the header section of the accordion.\nThis includes the leading icon, text and controls, and the trailing controls.\nThe trailing controls include the expand/collapse button.\nThe button is disabled if the accordion is disabled.\nThe button is also given the aria-controls attribute set to the id of the body section.\nThe button is also given the aria-expanded attribute set to the expanded state of the accordion.\nThe prefix icon of the button is set to the expanded state of the accordion.",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
               "type": {
                 "text": "boolean | undefined"
               },
-              "description": "Weather start the animation automatically",
-              "attribute": "autoplay",
-              "reflects": true
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "attribute": "disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "field",
-              "name": "ariaLabel",
+              "name": "size",
               "type": {
-                "text": "string | null"
+                "text": "Size"
               },
-              "default": "null",
-              "description": "Aria-label attribute to be set for accessibility",
-              "attribute": "aria-label"
+              "description": "The size of the accordion item.",
+              "default": "'small'",
+              "attribute": "size",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "field",
-              "name": "ariaLabelledBy",
+              "name": "variant",
               "type": {
-                "text": "string | null"
+                "text": "Variant"
               },
-              "default": "null",
-              "description": "Aria-labelledby attribute to be set for accessibility",
-              "attribute": "aria-labelledby"
+              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
+              "default": "'default'",
+              "attribute": "variant",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "field",
-              "name": "lottieInstance",
+              "name": "dataAriaLevel",
               "type": {
-                "text": "AnimationItem | undefined"
+                "text": "number"
               },
-              "privacy": "private",
-              "description": "Lottie animation instance"
+              "description": "The aria level of the accordion component.",
+              "default": "3",
+              "attribute": "data-aria-level",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "field",
-              "name": "containerRef",
+              "name": "expanded",
               "type": {
-                "text": "Ref<HTMLDivElement>"
+                "text": "boolean"
               },
-              "privacy": "private",
-              "description": "Container for the animation"
+              "description": "The visibility of the accordion button.",
+              "default": "false",
+              "attribute": "expanded",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "field",
-              "name": "animation",
-              "description": "Exposed API of the animation library (lottie)",
-              "readonly": true
+              "name": "headerText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The header text of the accordion item.",
+              "attribute": "header-text",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "prefixIcon",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "The leading icon that is displayed before the header text.",
+              "attribute": "prefix-icon",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "method",
-              "name": "getLoopValue",
-              "privacy": "private"
+              "name": "handleHeaderClick",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Handles the click event of the header section.\nIf the accordion is disabled, it will not toggle the expanded state.\nIt will dispatch the `shown` event with the current expanded state.",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "method",
-              "name": "onLoadSuccessHandler",
+              "name": "dispatchHeaderClickEvent",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Dispatches the `shown` event with the current expanded state.\nThe event is cancelable and bubbles.\nThe event detail contains the current expanded state.",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
               "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
               "parameters": [
                 {
-                  "name": "animationData",
+                  "name": "event",
                   "type": {
-                    "text": "any"
-                  }
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The KeyboardEvent fired."
                 }
               ],
-              "description": "Create new lotty instance for the loaded data"
+              "description": "Handles the keydown event of the component.\nIf the key pressed is either Enter or Space, it calls the handleHeaderClick method.\nThis allows keyboard users to toggle the accordion button using these keys.",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "method",
-              "name": "onLoadFailHandler",
-              "privacy": "private",
+              "name": "renderIcon",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "TemplateResult | typeof nothing"
+                }
+              },
               "parameters": [
                 {
-                  "name": "error",
+                  "name": "iconName",
+                  "optional": true,
                   "type": {
-                    "text": "Error"
+                    "text": "IconNames"
                   }
                 }
               ],
-              "description": "Error handler for animation loading"
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
               "kind": "method",
-              "name": "getAnimationData",
-              "privacy": "private",
-              "description": "Import animation data dynamically"
+              "name": "renderHeadingText",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "TemplateResult | typeof nothing"
+                }
+              },
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             },
             {
-              "kind": "field",
-              "name": "onCompleteHandler",
-              "description": "Re-dispatch the complete event from the animation library\n\nThis handler called with the animation instance instead of the component instance\nso we need to bind it to the component instance. The arrow function just does that."
+              "kind": "method",
+              "name": "getArrowIconName",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "description": "Returns the icon name based on the expanded state.\nIf the accordion button is disabled, it always returns the arrow down icon.\nOtherwise, it returns the arrow up icon if the accordion button is expanded, otherwise the arrow down icon.",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderBody",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "TemplateResult | typeof nothing"
+                }
+              },
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "components/accordionbutton/accordionbutton.component.js"
+              }
             }
           ],
           "events": [
             {
-              "name": "load",
+              "description": "(React: onShown) This event is triggered when the accordion is expanded.",
+              "name": "shown",
+              "reactName": "onShown",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "AccordionButton",
+            "module": "/src/components/accordionbutton/accordionbutton.component"
+          },
+          "tagName": "mdc-accordion",
+          "jsDoc": "/**\n * An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n *\n * The header section contains:\n * - Prefix Icon\n * - Header Text\n * - Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n * - Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n *\n * The body section contains:\n * - Default slot - User can place any content inside the body section.\n *\n * The accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\n * There are two types of variants based on that the border styling of the accordion gets reflected. <br/>\n * There are two sizes of accordion, one is small and the other is large.\n * Small size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n *\n * By default, the header text in the accordion heading is of H3 with an aria-level of '3'.\n * If this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n *\n * An accordion can be disabled, and when it's disabled, the header section will not be clickable.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.\n *\n * @tagname mdc-accordion\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot leading-controls - The leading controls slot of the accordion on the header section.\n * @slot trailing-controls - The trailing controls slot of the accordion on the header section.\n * @slot default - The default slot contains the body section of the accordion. User can place anything inside this body slot.\n *\n * @event shown - (React: onShown) This event is triggered when the accordion is expanded.\n *\n * @cssproperty --mdc-accordionbutton-border-color - The border color of the accordion.\n * @cssproperty --mdc-accordionbutton-hover-color - The hover color of the accordion.\n * @cssproperty --mdc-accordionbutton-active-color - The active color of the accordion.\n * @cssproperty --mdc-accordionbutton-disabled-color - The disabled color of the accordion.\n *\n * @csspart header-section - The header section of the accordion.\n * @csspart leading-header - The leading header of the accordion.\n * @csspart trailing-header - The trailing header of the accordion.\n * @csspart trailing-header__button - The trailing header button of the accordion.\n * @csspart body-section - The body section of the accordion.\n */",
+          "customElement": true,
+          "attributes": [
+            {
+              "name": "disabled",
               "type": {
-                "text": "CustomEvent"
+                "text": "boolean | undefined"
               },
-              "description": "(React: onLoad) This event is dispatched when the animation is loaded",
-              "reactName": "onLoad"
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "description": "(React: onComplete) This event is dispatched when all animation loops completed",
-              "name": "complete",
-              "reactName": "onComplete"
+              "name": "size",
+              "type": {
+                "text": "Size"
+              },
+              "description": "The size of the accordion item.",
+              "default": "'small'",
+              "fieldName": "size",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "description": "(React: onError) This event is dispatched when animation loading failed",
-              "name": "error",
-              "reactName": "onError"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "name",
+              "name": "variant",
               "type": {
-                "text": "AnimationNames | undefined"
+                "text": "Variant"
               },
-              "description": "Name of the animation (= filename)",
-              "fieldName": "name"
+              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
+              "default": "'default'",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "name": "loop",
+              "name": "data-aria-level",
               "type": {
-                "text": "LoopType | undefined"
+                "text": "number"
               },
-              "description": "How many times to loop the animation\n- \"true\" - infinite\n- \"false\" - no loop\n- number - number of times to loop",
-              "fieldName": "loop"
+              "description": "The aria level of the accordion component.",
+              "default": "3",
+              "fieldName": "dataAriaLevel",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "name": "autoplay",
+              "name": "expanded",
               "type": {
-                "text": "boolean | undefined"
+                "text": "boolean"
               },
-              "description": "Weather start the animation automatically",
-              "fieldName": "autoplay"
+              "description": "The visibility of the accordion button.",
+              "default": "false",
+              "fieldName": "expanded",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "name": "aria-label",
+              "name": "header-text",
               "type": {
-                "text": "string | null"
+                "text": "string | undefined"
               },
-              "default": "null",
-              "description": "Aria-label attribute to be set for accessibility",
-              "fieldName": "ariaLabel"
+              "description": "The header text of the accordion item.",
+              "fieldName": "headerText",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             },
             {
-              "name": "aria-labelledby",
+              "name": "prefix-icon",
               "type": {
-                "text": "string | null"
+                "text": "IconNames | undefined"
               },
-              "default": "null",
-              "description": "Aria-labelledby attribute to be set for accessibility",
-              "fieldName": "ariaLabelledBy"
+              "description": "The leading icon that is displayed before the header text.",
+              "fieldName": "prefixIcon",
+              "inheritedFrom": {
+                "name": "AccordionButton",
+                "module": "src/components/accordionbutton/accordionbutton.component.ts"
+              }
             }
-          ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-animation",
-          "jsDoc": "/**\n * The `mdc-animation` component is a wrapper around the Lottie animation library.\n * It fetches the animation data dynamically based on the provided name and renders it.\n * This is a display only component that does not have any interactive functionality.\n * From accessibility perspective, (by default) it is a decorative image component.\n *\n * @tagname mdc-animation\n *\n * @event load - (React: onLoad) This event is dispatched when the animation is loaded\n * @event complete - (React: onComplete) This event is dispatched when all animation loops completed\n * @event error - (React: onError) This event is dispatched when animation loading failed\n */",
-          "customElement": true
+          ]
         }
       ],
       "exports": [
@@ -1174,8 +962,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "Animation",
-            "module": "components/animation/animation.component.js"
+            "name": "Accordion",
+            "module": "components/accordion/accordion.component.js"
           }
         }
       ]
@@ -1768,42 +1556,254 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/appheader/appheader.component.js",
+      "path": "components/animation/animation.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
-          "name": "Appheader",
-          "cssParts": [
+          "description": "The `mdc-animation` component is a wrapper around the Lottie animation library.\nIt fetches the animation data dynamically based on the provided name and renders it.\nThis is a display only component that does not have any interactive functionality.\nFrom accessibility perspective, (by default) it is a decorative image component.",
+          "name": "Animation",
+          "members": [
             {
-              "description": "The main container for styling the header.",
-              "name": "container"
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "AnimationNames | undefined"
+              },
+              "description": "Name of the animation (= filename)",
+              "attribute": "name",
+              "reflects": true
             },
             {
-              "description": "The leading section of the header.",
-              "name": "leading-section"
+              "kind": "field",
+              "name": "loop",
+              "type": {
+                "text": "LoopType | undefined"
+              },
+              "description": "How many times to loop the animation\n- \"true\" - infinite\n- \"false\" - no loop\n- number - number of times to loop",
+              "attribute": "loop",
+              "reflects": true
             },
             {
-              "description": "The center section of the header.",
-              "name": "center-section"
+              "kind": "field",
+              "name": "autoplay",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Weather start the animation automatically",
+              "attribute": "autoplay",
+              "reflects": true
             },
             {
-              "description": "The trailing section of the header.",
-              "name": "trailing-section"
-            }
-          ],
-          "slots": [
-            {
-              "description": "Slot for the leading section (e.g., brand logo, brand name).",
-              "name": "leading"
+              "kind": "field",
+              "name": "ariaLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Aria-label attribute to be set for accessibility",
+              "attribute": "aria-label"
             },
             {
-              "description": "Slot for the center section (e.g., search bar, icons).",
-              "name": "center"
+              "kind": "field",
+              "name": "ariaLabelledBy",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Aria-labelledby attribute to be set for accessibility",
+              "attribute": "aria-labelledby"
             },
             {
-              "description": "Slot for the trailing section (e.g., profile avatar, icons).",
-              "name": "trailing"
+              "kind": "field",
+              "name": "lottieInstance",
+              "type": {
+                "text": "AnimationItem | undefined"
+              },
+              "privacy": "private",
+              "description": "Lottie animation instance"
+            },
+            {
+              "kind": "field",
+              "name": "containerRef",
+              "type": {
+                "text": "Ref<HTMLDivElement>"
+              },
+              "privacy": "private",
+              "description": "Container for the animation"
+            },
+            {
+              "kind": "field",
+              "name": "animation",
+              "description": "Exposed API of the animation library (lottie)",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "getLoopValue",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "onLoadSuccessHandler",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "animationData",
+                  "type": {
+                    "text": "any"
+                  }
+                }
+              ],
+              "description": "Create new lotty instance for the loaded data"
+            },
+            {
+              "kind": "method",
+              "name": "onLoadFailHandler",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "error",
+                  "type": {
+                    "text": "Error"
+                  }
+                }
+              ],
+              "description": "Error handler for animation loading"
+            },
+            {
+              "kind": "method",
+              "name": "getAnimationData",
+              "privacy": "private",
+              "description": "Import animation data dynamically"
+            },
+            {
+              "kind": "field",
+              "name": "onCompleteHandler",
+              "description": "Re-dispatch the complete event from the animation library\n\nThis handler called with the animation instance instead of the component instance\nso we need to bind it to the component instance. The arrow function just does that."
+            }
+          ],
+          "events": [
+            {
+              "name": "load",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "(React: onLoad) This event is dispatched when the animation is loaded",
+              "reactName": "onLoad"
+            },
+            {
+              "description": "(React: onComplete) This event is dispatched when all animation loops completed",
+              "name": "complete",
+              "reactName": "onComplete"
+            },
+            {
+              "description": "(React: onError) This event is dispatched when animation loading failed",
+              "name": "error",
+              "reactName": "onError"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "name",
+              "type": {
+                "text": "AnimationNames | undefined"
+              },
+              "description": "Name of the animation (= filename)",
+              "fieldName": "name"
+            },
+            {
+              "name": "loop",
+              "type": {
+                "text": "LoopType | undefined"
+              },
+              "description": "How many times to loop the animation\n- \"true\" - infinite\n- \"false\" - no loop\n- number - number of times to loop",
+              "fieldName": "loop"
+            },
+            {
+              "name": "autoplay",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Weather start the animation automatically",
+              "fieldName": "autoplay"
+            },
+            {
+              "name": "aria-label",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Aria-label attribute to be set for accessibility",
+              "fieldName": "ariaLabel"
+            },
+            {
+              "name": "aria-labelledby",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Aria-labelledby attribute to be set for accessibility",
+              "fieldName": "ariaLabelledBy"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-animation",
+          "jsDoc": "/**\n * The `mdc-animation` component is a wrapper around the Lottie animation library.\n * It fetches the animation data dynamically based on the provided name and renders it.\n * This is a display only component that does not have any interactive functionality.\n * From accessibility perspective, (by default) it is a decorative image component.\n *\n * @tagname mdc-animation\n *\n * @event load - (React: onLoad) This event is dispatched when the animation is loaded\n * @event complete - (React: onComplete) This event is dispatched when all animation loops completed\n * @event error - (React: onError) This event is dispatched when animation loading failed\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Animation",
+            "module": "components/animation/animation.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/appheader/appheader.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `mdc-appheader` component provides a structured and accessible app header layout.\nIt consists of three primary sections: leading, center, and trailing.\n\n- The **leading section** typically holds a **brand logo**, **brand name** or **menu icon**.\n- The **center section** can contain a **search bar**, **icons** or action controls.\n- The **trailing section** generally includes a **profile avatar**, **additional icons** or **action controls**.",
+          "name": "Appheader",
+          "cssParts": [
+            {
+              "description": "The main container for styling the header.",
+              "name": "container"
+            },
+            {
+              "description": "The leading section of the header.",
+              "name": "leading-section"
+            },
+            {
+              "description": "The center section of the header.",
+              "name": "center-section"
+            },
+            {
+              "description": "The trailing section of the header.",
+              "name": "trailing-section"
+            }
+          ],
+          "slots": [
+            {
+              "description": "Slot for the leading section (e.g., brand logo, brand name).",
+              "name": "leading"
+            },
+            {
+              "description": "Slot for the center section (e.g., search bar, icons).",
+              "name": "center"
+            },
+            {
+              "description": "Slot for the trailing section (e.g., profile avatar, icons).",
+              "name": "trailing"
             }
           ],
           "members": [],
@@ -10789,38 +10789,7 @@
             },
             {
               "kind": "field",
-              "name": "triggerElement",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "public",
-              "default": "null",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "storeConnectedTooltip",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setupTriggerRelatedElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "cleanupTrigger",
+              "name": "parseTrigger",
               "privacy": "private",
               "inheritedFrom": {
                 "name": "Popover",
@@ -10831,7 +10800,7 @@
               "kind": "field",
               "name": "setupTriggerListeners",
               "privacy": "private",
-              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.",
+              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.\n\nWe are using capture phase for to make sure we capture trigger events even when they are not propagated during the\nbubble phase (e.g.: buttons in list item)",
               "inheritedFrom": {
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
@@ -11032,14 +11001,20 @@
               }
             },
             {
-              "kind": "field",
-              "name": "findClosestPopover",
+              "kind": "method",
+              "name": "isEventFromTrigger",
               "privacy": "protected",
-              "description": "Finds the closest popover to the passed element in the DOM tree.\n\nUseful when need to find the parent popover in a nested popover scenario.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "description": "The element to start searching from.",
-                  "name": "element"
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
                 }
               ],
               "inheritedFrom": {
@@ -11055,6 +11030,13 @@
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
               }
+            },
+            {
+              "kind": "field",
+              "inheritedFrom": {
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
+              }
             }
           ],
           "events": [
@@ -13995,6 +13977,257 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/formfieldwrapper/formfieldwrapper.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "formfieldwrapper is a component that contains the label and helper/validation text\n that can be configured in various ways to suit different use cases (most of the input related components).\nIt is used as an internal component and is not intended to be used directly by consumers.",
+          "name": "FormfieldWrapper",
+          "members": [
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
+              "attribute": "label",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
+              "attribute": "required",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "helpTextType",
+              "type": {
+                "text": "ValidationType"
+              },
+              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
+              "attribute": "help-text-type",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "helpText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The help text that is displayed below the input field.",
+              "attribute": "help-text",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "toggletipText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
+              "attribute": "toggletip-text",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "toggletipPlacement",
+              "type": {
+                "text": "PopoverPlacement"
+              },
+              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
+              "default": "'top'",
+              "attribute": "toggletip-placement",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "infoIconAriaLabel",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
+              "attribute": "info-icon-aria-label",
+              "reflects": true
+            },
+            {
+              "kind": "method",
+              "name": "renderLabelElement",
+              "privacy": "protected",
+              "description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelpTextIcon",
+              "privacy": "protected",
+              "description": "creates the helpertext icon based on the helpTextType for validation.\nIf the helpTextType is not set, it defaults to 'default' and it doesn't display any icon.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelpText",
+              "privacy": "protected",
+              "description": "creates the helper text component when the helpertext value is set.\nIt is also used to display the validation message based on the helpTextType.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderLabel",
+              "privacy": "protected",
+              "description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelperText",
+              "privacy": "protected",
+              "description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "attribute": "disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "DisabledMixin",
+                "module": "utils/mixins/DisabledMixin.js"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
+              "fieldName": "label"
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
+              "fieldName": "required"
+            },
+            {
+              "name": "help-text-type",
+              "type": {
+                "text": "ValidationType"
+              },
+              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
+              "fieldName": "helpTextType"
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The help text that is displayed below the input field.",
+              "fieldName": "helpText"
+            },
+            {
+              "name": "toggletip-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
+              "fieldName": "toggletipText"
+            },
+            {
+              "name": "toggletip-placement",
+              "type": {
+                "text": "PopoverPlacement"
+              },
+              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
+              "default": "'top'",
+              "fieldName": "toggletipPlacement"
+            },
+            {
+              "name": "info-icon-aria-label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
+              "fieldName": "infoIconAriaLabel"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "DisabledMixin",
+              "module": "/src/utils/mixins/DisabledMixin"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-formfieldwrapper",
+          "jsDoc": "/**\n * formfieldwrapper is a component that contains the label and helper/validation text\n *  that can be configured in various ways to suit different use cases (most of the input related components).\n * It is used as an internal component and is not intended to be used directly by consumers.\n *\n * @tagname mdc-formfieldwrapper\n *\n * @dependency mdc-text\n * @dependency mdc-icon\n * @dependency mdc-button\n * @dependency mdc-toggletip\n *\n *\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "FormfieldWrapper",
+            "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/icon/icon.component.js",
@@ -14439,257 +14672,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/formfieldwrapper/formfieldwrapper.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "formfieldwrapper is a component that contains the label and helper/validation text\n that can be configured in various ways to suit different use cases (most of the input related components).\nIt is used as an internal component and is not intended to be used directly by consumers.",
-          "name": "FormfieldWrapper",
-          "members": [
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
-              "attribute": "label",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
-              "attribute": "required",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "helpTextType",
-              "type": {
-                "text": "ValidationType"
-              },
-              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
-              "attribute": "help-text-type",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "helpText",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The help text that is displayed below the input field.",
-              "attribute": "help-text",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "toggletipText",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
-              "attribute": "toggletip-text",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "toggletipPlacement",
-              "type": {
-                "text": "PopoverPlacement"
-              },
-              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
-              "default": "'top'",
-              "attribute": "toggletip-placement",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "infoIconAriaLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
-              "attribute": "info-icon-aria-label",
-              "reflects": true
-            },
-            {
-              "kind": "method",
-              "name": "renderLabelElement",
-              "privacy": "protected",
-              "description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelpTextIcon",
-              "privacy": "protected",
-              "description": "creates the helpertext icon based on the helpTextType for validation.\nIf the helpTextType is not set, it defaults to 'default' and it doesn't display any icon.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelpText",
-              "privacy": "protected",
-              "description": "creates the helper text component when the helpertext value is set.\nIt is also used to display the validation message based on the helpTextType.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderLabel",
-              "privacy": "protected",
-              "description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelperText",
-              "privacy": "protected",
-              "description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "attribute": "disabled",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "utils/mixins/DisabledMixin.js"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
-              "fieldName": "label"
-            },
-            {
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
-              "fieldName": "required"
-            },
-            {
-              "name": "help-text-type",
-              "type": {
-                "text": "ValidationType"
-              },
-              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
-              "fieldName": "helpTextType"
-            },
-            {
-              "name": "help-text",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The help text that is displayed below the input field.",
-              "fieldName": "helpText"
-            },
-            {
-              "name": "toggletip-text",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
-              "fieldName": "toggletipText"
-            },
-            {
-              "name": "toggletip-placement",
-              "type": {
-                "text": "PopoverPlacement"
-              },
-              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
-              "default": "'top'",
-              "fieldName": "toggletipPlacement"
-            },
-            {
-              "name": "info-icon-aria-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
-              "fieldName": "infoIconAriaLabel"
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
-              }
-            }
-          ],
-          "mixins": [
-            {
-              "name": "DisabledMixin",
-              "module": "/src/utils/mixins/DisabledMixin"
-            }
-          ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-formfieldwrapper",
-          "jsDoc": "/**\n * formfieldwrapper is a component that contains the label and helper/validation text\n *  that can be configured in various ways to suit different use cases (most of the input related components).\n * It is used as an internal component and is not intended to be used directly by consumers.\n *\n * @tagname mdc-formfieldwrapper\n *\n * @dependency mdc-text\n * @dependency mdc-icon\n * @dependency mdc-button\n * @dependency mdc-toggletip\n *\n *\n */",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "FormfieldWrapper",
-            "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/input/input.component.js",
@@ -23097,38 +23079,7 @@
             },
             {
               "kind": "field",
-              "name": "triggerElement",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "public",
-              "default": "null",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "storeConnectedTooltip",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setupTriggerRelatedElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "cleanupTrigger",
+              "name": "parseTrigger",
               "privacy": "private",
               "inheritedFrom": {
                 "name": "Popover",
@@ -23139,7 +23090,7 @@
               "kind": "field",
               "name": "setupTriggerListeners",
               "privacy": "private",
-              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.",
+              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.\n\nWe are using capture phase for to make sure we capture trigger events even when they are not propagated during the\nbubble phase (e.g.: buttons in list item)",
               "inheritedFrom": {
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
@@ -23288,14 +23239,20 @@
               }
             },
             {
-              "kind": "field",
-              "name": "findClosestPopover",
+              "kind": "method",
+              "name": "isEventFromTrigger",
               "privacy": "protected",
-              "description": "Finds the closest popover to the passed element in the DOM tree.\n\nUseful when need to find the parent popover in a nested popover scenario.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "description": "The element to start searching from.",
-                  "name": "element"
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
                 }
               ],
               "inheritedFrom": {
@@ -23311,6 +23268,13 @@
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
               }
+            },
+            {
+              "kind": "field",
+              "inheritedFrom": {
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
+              }
             }
           ],
           "events": [
@@ -27967,33 +27931,14 @@
             },
             {
               "kind": "field",
-              "name": "triggerElement",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "public",
-              "default": "null"
-            },
-            {
-              "kind": "field",
-              "name": "storeConnectedTooltip",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "setupTriggerRelatedElement",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "cleanupTrigger",
+              "name": "parseTrigger",
               "privacy": "private"
             },
             {
               "kind": "field",
               "name": "setupTriggerListeners",
               "privacy": "private",
-              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers."
+              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.\n\nWe are using capture phase for to make sure we capture trigger events even when they are not propagated during the\nbubble phase (e.g.: buttons in list item)"
             },
             {
               "kind": "field",
@@ -28126,14 +28071,20 @@
               "description": "Positions the popover based on the trigger element.\nIt also handles the flip, size and arrow placement.\nIt uses the floating-ui/dom library to calculate the position."
             },
             {
-              "kind": "field",
-              "name": "findClosestPopover",
+              "kind": "method",
+              "name": "isEventFromTrigger",
               "privacy": "protected",
-              "description": "Finds the closest popover to the passed element in the DOM tree.\n\nUseful when need to find the parent popover in a nested popover scenario.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "description": "The element to start searching from.",
-                  "name": "element"
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
                 }
               ]
             },
@@ -28142,6 +28093,9 @@
               "name": "utils",
               "default": "new PopoverUtils(this)"
             },
+            {
+              "kind": "field"
+            },
             {
               "kind": "method",
               "name": "activatePreventScroll",
@@ -29535,7 +29489,609 @@
               },
               "description": "Types of the progressbar\n- **Default**\n- **Inline**",
               "default": "default",
-              "fieldName": "variant"
+              "fieldName": "variant"
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "'0'",
+              "description": "The current progress as a percentage, 0 to 100.\nThe value will be clamped between 0 and 100.",
+              "fieldName": "value"
+            },
+            {
+              "name": "error",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Define error state of the progressbar\n- **true**\n- **false**",
+              "fieldName": "error"
+            },
+            {
+              "name": "data-aria-label",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
+              "fieldName": "dataAriaLabel",
+              "inheritedFrom": {
+                "name": "DataAriaLabelMixin",
+                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
+              }
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
+              "fieldName": "label",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
+              "fieldName": "required",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "help-text-type",
+              "type": {
+                "text": "ValidationType"
+              },
+              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
+              "fieldName": "helpTextType",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The help text that is displayed below the input field.",
+              "fieldName": "helpText",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "toggletip-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
+              "fieldName": "toggletipText",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "toggletip-placement",
+              "type": {
+                "text": "PopoverPlacement"
+              },
+              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
+              "default": "'top'",
+              "fieldName": "toggletipPlacement",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            },
+            {
+              "name": "info-icon-aria-label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
+              "fieldName": "infoIconAriaLabel",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "DataAriaLabelMixin",
+              "module": "/src/utils/mixins/DataAriaLabelMixin"
+            }
+          ],
+          "superclass": {
+            "name": "FormfieldWrapper",
+            "module": "/src/components/formfieldwrapper"
+          },
+          "tagName": "mdc-progressbar",
+          "jsDoc": "/**\n * mdc-progressbar component visually represents a progress indicator, typically used to show\n * the completion state of an ongoing process (e.g., loading, file upload, etc.).\n * It contains an optional label and an optional helper text.\n *\n * - It supports mainly two types: Default and Inline\n * - It supports three validation variants: Default, Success and Error.\n *\n * This component is created by extending FormfieldWrapper.\n *\n * @tagname mdc-progressbar\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.\n * @cssproperty --mdc-progressbar-active-background-color - Background color of the elapsed progressbar portion.\n * @cssproperty --mdc-progressbar-success-color - Background color of the progressbar when in success state.\n * @cssproperty --mdc-progressbar-error-color - Background color of the progressbar when in error state.\n * @cssproperty --mdc-progressbar-height - The height of the progressbar.\n * @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.\n * @cssproperty --mdc-progressbar-label-color - Color of the progressbar label text.\n * @cssproperty --mdc-progressbar-label-line-height - Line height of the label text.\n * @cssproperty --mdc-progressbar-label-font-size - Font size of the label text.\n * @cssproperty --mdc-progressbar-label-font-weight - Font weight of the label text.\n * @cssproperty --mdc-progressbar-help-text-color - Color of the help text.\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Progressbar",
+            "module": "components/progressbar/progressbar.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/progressspinner/progressspinner.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`mdc-progressspinner` is a customizable, circular progress indicator component.\nIt visually represents the current completion state of a process, such as loading,\nsyncing, uploading, or any ongoing task that has a measurable percentage.\n\nThe spinner is built using SVG with two concentric `<circle>` elements:\n- The `progress` arc represents the portion of work completed.\n- The `track` arc represents the remaining part.\n\nA visual gap is maintained between the progress and track arcs to clearly\ndistinguish the two segments. The component smoothly animates arc length\nand respects accessibility best practices with ARIA attributes.\n\nThe component supports different states:\n- **Default**: Circular spinner shows the progress.\n- **Success**: Displays a checkmark icon when progress reaches 100%.\n- **Error**: Displays an error icon when in an error state.",
+          "name": "Progressspinner",
+          "cssProperties": [
+            {
+              "description": "The size of the spinner.",
+              "name": "--mdc-spinner-size"
+            },
+            {
+              "description": "The color of the spinner track.",
+              "name": "--mdc-track-color"
+            },
+            {
+              "description": "The color of the spinner progress.",
+              "name": "--mdc-progress-color"
+            },
+            {
+              "description": "The color of the spinner when in success state.",
+              "name": "--mdc-progress-success-color"
+            },
+            {
+              "description": "The color of the spinner when in error state.",
+              "name": "--mdc-progress-error-color"
+            },
+            {
+              "description": "Background color of the remaining progressbar portion.",
+              "name": "--mdc-progressbar-background-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Background color of the elapsed progressbar portion.",
+              "name": "--mdc-progressbar-active-background-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Background color of the progressbar when in success state.",
+              "name": "--mdc-progressbar-success-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Background color of the progressbar when in error state.",
+              "name": "--mdc-progressbar-error-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "The height of the progressbar.",
+              "name": "--mdc-progressbar-height",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "The border radius of the progressbar.",
+              "name": "--mdc-progressbar-border-radius",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Color of the progressbar label text.",
+              "name": "--mdc-progressbar-label-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Line height of the label text.",
+              "name": "--mdc-progressbar-label-line-height",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Font size of the label text.",
+              "name": "--mdc-progressbar-label-font-size",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Font weight of the label text.",
+              "name": "--mdc-progressbar-label-font-weight",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            },
+            {
+              "description": "Color of the help text.",
+              "name": "--mdc-progressbar-help-text-color",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
+            }
+          ],
+          "members": [
+            {
+              "kind": "method",
+              "name": "renderProgressSpinner",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "renderErrorState",
+              "privacy": "private",
+              "description": "Renders the error state of the progress spinner.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderSuccessState",
+              "privacy": "private",
+              "description": "Renders the success state of the progress spinner.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "dataAriaLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
+              "attribute": "data-aria-label",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "DataAriaLabelMixin",
+                "module": "utils/mixins/DataAriaLabelMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "Variant"
+              },
+              "description": "Types of the progressbar\n- **Default**\n- **Inline**",
+              "default": "default",
+              "attribute": "variant",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "components/progressbar/progressbar.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "'0'",
+              "description": "The current progress as a percentage, 0 to 100.\nThe value will be clamped between 0 and 100.",
+              "attribute": "value",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "components/progressbar/progressbar.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "error",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Define error state of the progressbar\n- **true**\n- **false**",
+              "attribute": "error",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "components/progressbar/progressbar.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "getValidationVariant",
+              "privacy": "private",
+              "description": "Determines the validation state (success, error, or default) based on progress value and error state.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "components/progressbar/progressbar.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
+              "default": "undefined",
+              "attribute": "disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
+              "attribute": "label",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
+              "attribute": "required",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "helpTextType",
+              "type": {
+                "text": "ValidationType"
+              },
+              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
+              "attribute": "help-text-type",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "helpText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The help text that is displayed below the input field.",
+              "attribute": "help-text",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "toggletipText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
+              "attribute": "toggletip-text",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "toggletipPlacement",
+              "type": {
+                "text": "PopoverPlacement"
+              },
+              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
+              "default": "'top'",
+              "attribute": "toggletip-placement",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "infoIconAriaLabel",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
+              "attribute": "info-icon-aria-label",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderLabelElement",
+              "privacy": "protected",
+              "description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelpTextIcon",
+              "privacy": "protected",
+              "description": "creates the helpertext icon based on the helpTextType for validation.\nIf the helpTextType is not set, it defaults to 'default' and it doesn't display any icon.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelpText",
+              "privacy": "protected",
+              "description": "creates the helper text component when the helpertext value is set.\nIt is also used to display the validation message based on the helpTextType.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderLabel",
+              "privacy": "protected",
+              "description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHelperText",
+              "privacy": "protected",
+              "description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "Progressbar",
+            "module": "/src/components/progressbar/progressbar.component"
+          },
+          "tagName": "mdc-progressspinner",
+          "jsDoc": "/**\n * `mdc-progressspinner` is a customizable, circular progress indicator component.\n * It visually represents the current completion state of a process, such as loading,\n * syncing, uploading, or any ongoing task that has a measurable percentage.\n *\n * The spinner is built using SVG with two concentric `<circle>` elements:\n * - The `progress` arc represents the portion of work completed.\n * - The `track` arc represents the remaining part.\n *\n * A visual gap is maintained between the progress and track arcs to clearly\n * distinguish the two segments. The component smoothly animates arc length\n * and respects accessibility best practices with ARIA attributes.\n *\n * The component supports different states:\n * - **Default**: Circular spinner shows the progress.\n * - **Success**: Displays a checkmark icon when progress reaches 100%.\n * - **Error**: Displays an error icon when in an error state.\n *\n * @tagname mdc-progressspinner\n *\n * @cssproperty --mdc-spinner-size - The size of the spinner.\n * @cssproperty --mdc-track-color - The color of the spinner track.\n * @cssproperty --mdc-progress-color - The color of the spinner progress.\n * @cssproperty --mdc-progress-success-color - The color of the spinner when in success state.\n * @cssproperty --mdc-progress-error-color - The color of the spinner when in error state.\n *\n */",
+          "customElement": true,
+          "attributes": [
+            {
+              "name": "data-aria-label",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
+              "fieldName": "dataAriaLabel",
+              "inheritedFrom": {
+                "name": "DataAriaLabelMixin",
+                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
+              }
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "Variant"
+              },
+              "description": "Types of the progressbar\n- **Default**\n- **Inline**",
+              "default": "default",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
             },
             {
               "name": "value",
@@ -29544,7 +30100,11 @@
               },
               "default": "'0'",
               "description": "The current progress as a percentage, 0 to 100.\nThe value will be clamped between 0 and 100.",
-              "fieldName": "value"
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
+              }
             },
             {
               "name": "error",
@@ -29553,19 +30113,10 @@
               },
               "default": "false",
               "description": "Define error state of the progressbar\n- **true**\n- **false**",
-              "fieldName": "error"
-            },
-            {
-              "name": "data-aria-label",
-              "type": {
-                "text": "string | null"
-              },
-              "default": "null",
-              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
-              "fieldName": "dataAriaLabel",
+              "fieldName": "error",
               "inheritedFrom": {
-                "name": "DataAriaLabelMixin",
-                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
+                "name": "Progressbar",
+                "module": "src/components/progressbar/progressbar.component.ts"
               }
             },
             {
@@ -29667,20 +30218,7 @@
                 "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
               }
             }
-          ],
-          "mixins": [
-            {
-              "name": "DataAriaLabelMixin",
-              "module": "/src/utils/mixins/DataAriaLabelMixin"
-            }
-          ],
-          "superclass": {
-            "name": "FormfieldWrapper",
-            "module": "/src/components/formfieldwrapper"
-          },
-          "tagName": "mdc-progressbar",
-          "jsDoc": "/**\n * mdc-progressbar component visually represents a progress indicator, typically used to show\n * the completion state of an ongoing process (e.g., loading, file upload, etc.).\n * It contains an optional label and an optional helper text.\n *\n * - It supports mainly two types: Default and Inline\n * - It supports three validation variants: Default, Success and Error.\n *\n * This component is created by extending FormfieldWrapper.\n *\n * @tagname mdc-progressbar\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.\n * @cssproperty --mdc-progressbar-active-background-color - Background color of the elapsed progressbar portion.\n * @cssproperty --mdc-progressbar-success-color - Background color of the progressbar when in success state.\n * @cssproperty --mdc-progressbar-error-color - Background color of the progressbar when in error state.\n * @cssproperty --mdc-progressbar-height - The height of the progressbar.\n * @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.\n * @cssproperty --mdc-progressbar-label-color - Color of the progressbar label text.\n * @cssproperty --mdc-progressbar-label-line-height - Line height of the label text.\n * @cssproperty --mdc-progressbar-label-font-size - Font size of the label text.\n * @cssproperty --mdc-progressbar-label-font-weight - Font weight of the label text.\n * @cssproperty --mdc-progressbar-help-text-color - Color of the help text.\n */",
-          "customElement": true
+          ]
         }
       ],
       "exports": [
@@ -29688,157 +30226,36 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "Progressbar",
-            "module": "components/progressbar/progressbar.component.js"
+            "name": "Progressspinner",
+            "module": "components/progressspinner/progressspinner.component.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/progressspinner/progressspinner.component.js",
+      "path": "components/radiogroup/radiogroup.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "`mdc-progressspinner` is a customizable, circular progress indicator component.\nIt visually represents the current completion state of a process, such as loading,\nsyncing, uploading, or any ongoing task that has a measurable percentage.\n\nThe spinner is built using SVG with two concentric `<circle>` elements:\n- The `progress` arc represents the portion of work completed.\n- The `track` arc represents the remaining part.\n\nA visual gap is maintained between the progress and track arcs to clearly\ndistinguish the two segments. The component smoothly animates arc length\nand respects accessibility best practices with ARIA attributes.\n\nThe component supports different states:\n- **Default**: Circular spinner shows the progress.\n- **Success**: Displays a checkmark icon when progress reaches 100%.\n- **Error**: Displays an error icon when in an error state.",
-          "name": "Progressspinner",
+          "description": "`mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\nIt can have a header text and a description. It enables users to select a single option from a set of options.\nIt is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.",
+          "name": "RadioGroup",
           "cssProperties": [
             {
-              "description": "The size of the spinner.",
-              "name": "--mdc-spinner-size"
-            },
-            {
-              "description": "The color of the spinner track.",
-              "name": "--mdc-track-color"
-            },
-            {
-              "description": "The color of the spinner progress.",
-              "name": "--mdc-progress-color"
-            },
-            {
-              "description": "The color of the spinner when in success state.",
-              "name": "--mdc-progress-success-color"
-            },
-            {
-              "description": "The color of the spinner when in error state.",
-              "name": "--mdc-progress-error-color"
-            },
-            {
-              "description": "Background color of the remaining progressbar portion.",
-              "name": "--mdc-progressbar-background-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Background color of the elapsed progressbar portion.",
-              "name": "--mdc-progressbar-active-background-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Background color of the progressbar when in success state.",
-              "name": "--mdc-progressbar-success-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Background color of the progressbar when in error state.",
-              "name": "--mdc-progressbar-error-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "The height of the progressbar.",
-              "name": "--mdc-progressbar-height",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "The border radius of the progressbar.",
-              "name": "--mdc-progressbar-border-radius",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Color of the progressbar label text.",
-              "name": "--mdc-progressbar-label-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Line height of the label text.",
-              "name": "--mdc-progressbar-label-line-height",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Font size of the label text.",
-              "name": "--mdc-progressbar-label-font-size",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Font weight of the label text.",
-              "name": "--mdc-progressbar-label-font-weight",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "description": "Color of the help text.",
-              "name": "--mdc-progressbar-help-text-color",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
+              "description": "color of the description text",
+              "name": "--mdc-radiogroup-description-text-normal"
             }
           ],
           "members": [
             {
-              "kind": "method",
-              "name": "renderProgressSpinner",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "renderErrorState",
-              "privacy": "private",
-              "description": "Renders the error state of the progress spinner.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderSuccessState",
-              "privacy": "private",
-              "description": "Renders the success state of the progress spinner.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Name of the radio group.\nThey are used to group elements in a form together.",
+              "attribute": "name"
             },
             {
               "kind": "field",
@@ -29855,65 +30272,6 @@
                 "module": "utils/mixins/DataAriaLabelMixin.js"
               }
             },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "Types of the progressbar\n- **Default**\n- **Inline**",
-              "default": "default",
-              "attribute": "variant",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "components/progressbar/progressbar.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "'0'",
-              "description": "The current progress as a percentage, 0 to 100.\nThe value will be clamped between 0 and 100.",
-              "attribute": "value",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "components/progressbar/progressbar.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "error",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Define error state of the progressbar\n- **true**\n- **false**",
-              "attribute": "error",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "components/progressbar/progressbar.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getValidationVariant",
-              "privacy": "private",
-              "description": "Determines the validation state (success, error, or default) based on progress value and error state.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "components/progressbar/progressbar.component.js"
-              }
-            },
             {
               "kind": "field",
               "name": "disabled",
@@ -30105,14 +30463,16 @@
               }
             }
           ],
-          "superclass": {
-            "name": "Progressbar",
-            "module": "/src/components/progressbar/progressbar.component"
-          },
-          "tagName": "mdc-progressspinner",
-          "jsDoc": "/**\n * `mdc-progressspinner` is a customizable, circular progress indicator component.\n * It visually represents the current completion state of a process, such as loading,\n * syncing, uploading, or any ongoing task that has a measurable percentage.\n *\n * The spinner is built using SVG with two concentric `<circle>` elements:\n * - The `progress` arc represents the portion of work completed.\n * - The `track` arc represents the remaining part.\n *\n * A visual gap is maintained between the progress and track arcs to clearly\n * distinguish the two segments. The component smoothly animates arc length\n * and respects accessibility best practices with ARIA attributes.\n *\n * The component supports different states:\n * - **Default**: Circular spinner shows the progress.\n * - **Success**: Displays a checkmark icon when progress reaches 100%.\n * - **Error**: Displays an error icon when in an error state.\n *\n * @tagname mdc-progressspinner\n *\n * @cssproperty --mdc-spinner-size - The size of the spinner.\n * @cssproperty --mdc-track-color - The color of the spinner track.\n * @cssproperty --mdc-progress-color - The color of the spinner progress.\n * @cssproperty --mdc-progress-success-color - The color of the spinner when in success state.\n * @cssproperty --mdc-progress-error-color - The color of the spinner when in error state.\n *\n */",
-          "customElement": true,
           "attributes": [
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Name of the radio group.\nThey are used to group elements in a form together.",
+              "fieldName": "name"
+            },
             {
               "name": "data-aria-label",
               "type": {
@@ -30126,45 +30486,6 @@
                 "module": "src/utils/mixins/DataAriaLabelMixin.ts"
               }
             },
-            {
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "Types of the progressbar\n- **Default**\n- **Inline**",
-              "default": "default",
-              "fieldName": "variant",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "'0'",
-              "description": "The current progress as a percentage, 0 to 100.\nThe value will be clamped between 0 and 100.",
-              "fieldName": "value",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
-            {
-              "name": "error",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Define error state of the progressbar\n- **true**\n- **false**",
-              "fieldName": "error",
-              "inheritedFrom": {
-                "name": "Progressbar",
-                "module": "src/components/progressbar/progressbar.component.ts"
-              }
-            },
             {
               "name": "disabled",
               "type": {
@@ -30264,6 +30585,23 @@
                 "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
               }
             }
+          ],
+          "superclass": {
+            "name": "FormfieldGroup",
+            "module": "/src/components/formfieldgroup"
+          },
+          "tagName": "mdc-radiogroup",
+          "jsDoc": "/**\n * `mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\n * It can have a header text and a description. It enables users to select a single option from a set of options.\n * It is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.\n *\n * @tagname mdc-radiogroup\n *\n * @cssproperty --mdc-radiogroup-description-text-normal - color of the description text\n *\n */",
+          "customElement": true,
+          "slots": [
+            {
+              "description": "This is a default slot for checkbox or toggle components.",
+              "name": "default",
+              "inheritedFrom": {
+                "name": "FormfieldGroup",
+                "module": "src/components/formfieldgroup/formfieldgroup.component.ts"
+              }
+            }
           ]
         }
       ],
@@ -30272,8 +30610,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "Progressspinner",
-            "module": "components/progressspinner/progressspinner.component.js"
+            "name": "RadioGroup",
+            "module": "components/radiogroup/radiogroup.component.js"
           }
         }
       ]
@@ -31003,390 +31341,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/radiogroup/radiogroup.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "`mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\nIt can have a header text and a description. It enables users to select a single option from a set of options.\nIt is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.",
-          "name": "RadioGroup",
-          "cssProperties": [
-            {
-              "description": "color of the description text",
-              "name": "--mdc-radiogroup-description-text-normal"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Name of the radio group.\nThey are used to group elements in a form together.",
-              "attribute": "name"
-            },
-            {
-              "kind": "field",
-              "name": "dataAriaLabel",
-              "type": {
-                "text": "string | null"
-              },
-              "default": "null",
-              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
-              "attribute": "data-aria-label",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "DataAriaLabelMixin",
-                "module": "utils/mixins/DataAriaLabelMixin.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "attribute": "disabled",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
-              "attribute": "label",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
-              "attribute": "required",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "helpTextType",
-              "type": {
-                "text": "ValidationType"
-              },
-              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
-              "attribute": "help-text-type",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "helpText",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The help text that is displayed below the input field.",
-              "attribute": "help-text",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "toggletipText",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
-              "attribute": "toggletip-text",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "toggletipPlacement",
-              "type": {
-                "text": "PopoverPlacement"
-              },
-              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
-              "default": "'top'",
-              "attribute": "toggletip-placement",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "infoIconAriaLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
-              "attribute": "info-icon-aria-label",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderLabelElement",
-              "privacy": "protected",
-              "description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelpTextIcon",
-              "privacy": "protected",
-              "description": "creates the helpertext icon based on the helpTextType for validation.\nIf the helpTextType is not set, it defaults to 'default' and it doesn't display any icon.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelpText",
-              "privacy": "protected",
-              "description": "creates the helper text component when the helpertext value is set.\nIt is also used to display the validation message based on the helpTextType.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderLabel",
-              "privacy": "protected",
-              "description": "renders the mdc-label-text container that contains the label and labelInfoToggleTip.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "renderHelperText",
-              "privacy": "protected",
-              "description": "renders the mdc-help-text container that contains the helpertext icon and helpertext.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "components/formfieldwrapper/formfieldwrapper.component.js"
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Name of the radio group.\nThey are used to group elements in a form together.",
-              "fieldName": "name"
-            },
-            {
-              "name": "data-aria-label",
-              "type": {
-                "text": "string | null"
-              },
-              "default": "null",
-              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
-              "fieldName": "dataAriaLabel",
-              "inheritedFrom": {
-                "name": "DataAriaLabelMixin",
-                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
-              }
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
-              "default": "undefined",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The label of the input field. It is linked to the input field using the `for` attribute.",
-              "fieldName": "label",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
-              "fieldName": "required",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "help-text-type",
-              "type": {
-                "text": "ValidationType"
-              },
-              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
-              "fieldName": "helpTextType",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "help-text",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The help text that is displayed below the input field.",
-              "fieldName": "helpText",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "toggletip-text",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
-              "fieldName": "toggletipText",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "toggletip-placement",
-              "type": {
-                "text": "PopoverPlacement"
-              },
-              "description": "The placement of the toggletip that is displayed when the info icon is hovered.",
-              "default": "'top'",
-              "fieldName": "toggletipPlacement",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            },
-            {
-              "name": "info-icon-aria-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
-              "fieldName": "infoIconAriaLabel",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            }
-          ],
-          "superclass": {
-            "name": "FormfieldGroup",
-            "module": "/src/components/formfieldgroup"
-          },
-          "tagName": "mdc-radiogroup",
-          "jsDoc": "/**\n * `mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\n * It can have a header text and a description. It enables users to select a single option from a set of options.\n * It is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.\n *\n * @tagname mdc-radiogroup\n *\n * @cssproperty --mdc-radiogroup-description-text-normal - color of the description text\n *\n */",
-          "customElement": true,
-          "slots": [
-            {
-              "description": "This is a default slot for checkbox or toggle components.",
-              "name": "default",
-              "inheritedFrom": {
-                "name": "FormfieldGroup",
-                "module": "src/components/formfieldgroup/formfieldgroup.component.ts"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "RadioGroup",
-            "module": "components/radiogroup/radiogroup.component.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/screenreaderannouncer/screenreaderannouncer.component.js",
@@ -40549,38 +40503,7 @@
             },
             {
               "kind": "field",
-              "name": "triggerElement",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "public",
-              "default": "null",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "storeConnectedTooltip",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setupTriggerRelatedElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "cleanupTrigger",
+              "name": "parseTrigger",
               "privacy": "private",
               "inheritedFrom": {
                 "name": "Popover",
@@ -40591,7 +40514,7 @@
               "kind": "field",
               "name": "setupTriggerListeners",
               "privacy": "private",
-              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.",
+              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.\n\nWe are using capture phase for to make sure we capture trigger events even when they are not propagated during the\nbubble phase (e.g.: buttons in list item)",
               "inheritedFrom": {
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
@@ -40792,14 +40715,20 @@
               }
             },
             {
-              "kind": "field",
-              "name": "findClosestPopover",
+              "kind": "method",
+              "name": "isEventFromTrigger",
               "privacy": "protected",
-              "description": "Finds the closest popover to the passed element in the DOM tree.\n\nUseful when need to find the parent popover in a nested popover scenario.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "description": "The element to start searching from.",
-                  "name": "element"
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
                 }
               ],
               "inheritedFrom": {
@@ -40815,6 +40744,13 @@
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
               }
+            },
+            {
+              "kind": "field",
+              "inheritedFrom": {
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
+              }
             }
           ],
           "events": [
@@ -42613,38 +42549,7 @@
             },
             {
               "kind": "field",
-              "name": "triggerElement",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "public",
-              "default": "null",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "storeConnectedTooltip",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setupTriggerRelatedElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Popover",
-                "module": "components/popover/popover.component.js"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "cleanupTrigger",
+              "name": "parseTrigger",
               "privacy": "private",
               "inheritedFrom": {
                 "name": "Popover",
@@ -42655,7 +42560,7 @@
               "kind": "field",
               "name": "setupTriggerListeners",
               "privacy": "private",
-              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.",
+              "description": "Sets up the trigger related event listeners, based on the trigger type.\nIncludes fallback for mouseenter trigger to also handle focusin for non-interactive popovers.\n\nWe are using capture phase for to make sure we capture trigger events even when they are not propagated during the\nbubble phase (e.g.: buttons in list item)",
               "inheritedFrom": {
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
@@ -42856,14 +42761,20 @@
               }
             },
             {
-              "kind": "field",
-              "name": "findClosestPopover",
+              "kind": "method",
+              "name": "isEventFromTrigger",
               "privacy": "protected",
-              "description": "Finds the closest popover to the passed element in the DOM tree.\n\nUseful when need to find the parent popover in a nested popover scenario.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
               "parameters": [
                 {
-                  "description": "The element to start searching from.",
-                  "name": "element"
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
                 }
               ],
               "inheritedFrom": {
@@ -42879,6 +42790,13 @@
                 "name": "Popover",
                 "module": "components/popover/popover.component.js"
               }
+            },
+            {
+              "kind": "field",
+              "inheritedFrom": {
+                "name": "Popover",
+                "module": "components/popover/popover.component.js"
+              }
             }
           ],
           "events": [