@momentum-design/components 0.62.3 → 0.63.0

package/dist/custom-elements.json

@@ -2600,22 +2600,22 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/buttonlink/buttonlink.component.js",
+      "path": "components/buttonsimple/buttonsimple.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "`mdc-buttonlink` combines the functional behavior of `mdc-linksimple` with the visual and structural\nfeatures of `mdc-button`. This includes support for variants, sizing, and optional\nprefix and postfix icons via slots.\n\n### Features:\n- Behaves like an link while visually resembling a button.\n- Supports slots for `prefix-icon` and `postfix-icon`.\n- Customizable size, color, and variant through attributes.\n- Inherits accessibility and keyboard interaction support from `mdc-linksimple`.",
-          "name": "ButtonLink",
+          "description": "`mdc-buttonsimple` is a component that can be configured in various ways to suit different use cases.\nIt is used as an internal component and is not intended to be used directly by consumers.\nConsumers should use the `mdc-button` component instead.",
+          "name": "Buttonsimple",
           "members": [
             {
               "kind": "field",
-              "name": "size",
+              "name": "active",
               "type": {
-                "text": "PillButtonSize | IconButtonSize"
+                "text": "boolean | undefined"
               },
-              "description": "ButtonLink sizing is based on the buttonlink type.\n - **Pill buttonlink**: 40, 32, 28, 24.\n - **Icon buttonlink**: 64, 52, 40, 32, 28, 24.\n - Tertiary icon buttonlink can also be 20.",
-              "default": "32",
-              "attribute": "size",
+              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
+              "default": "undefined",
+              "attribute": "active",
               "reflects": true
             },
             {
@@ -2624,173 +2624,165 @@
               "type": {
                 "text": "boolean | undefined"
               },
-              "description": "Indicates whether the buttonlink is soft disabled.\nWhen set to `true`, the buttonlink appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe buttonlink behaves like a disabled buttonlink, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
               "default": "undefined",
               "attribute": "soft-disabled",
               "reflects": true
             },
-            {
-              "kind": "method",
-              "name": "setSoftDisabled",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "element",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The buttonlink element."
-                },
-                {
-                  "name": "softDisabled",
-                  "optional": true,
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The soft-disabled state."
-                }
-              ],
-              "description": "Sets the soft-disabled attribute for the buttonlink.\nWhen soft-disabled, the buttonlink looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute."
-            },
             {
               "kind": "field",
-              "name": "prefixIcon",
+              "name": "size",
               "type": {
-                "text": "IconNames | undefined"
+                "text": "ButtonSize"
               },
-              "description": "The name of the icon to display as a prefix.\nThe icon is displayed on the left side of the button.",
-              "attribute": "prefix-icon",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
+              "default": "32",
+              "attribute": "size",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "postfixIcon",
-              "type": {
-                "text": "IconNames | undefined"
-              },
-              "description": "The name of the icon to display as a postfix.\nThe icon is displayed on the right side of the button.",
-              "attribute": "postfix-icon",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "name": "role",
+              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
+              "default": "button",
+              "attribute": "role",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "variant",
+              "name": "ariaStateKey",
               "type": {
-                "text": "ButtonVariant"
+                "text": "string | undefined"
               },
-              "description": "There are 3 variants of button: primary, secondary, tertiary. They are styled differently.\n- **Primary**: Solid background color.\n- **Secondary**: Transparent background with a solid border.\n- **Tertiary**: No background or border, appears as plain text but retains all button functionalities.",
-              "default": "primary",
-              "attribute": "variant",
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
+              "default": "'aria-pressed' (when)",
+              "attribute": "ariaStateKey",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "color",
+              "name": "type",
               "type": {
-                "text": "ButtonColor"
+                "text": "ButtonType"
               },
-              "description": "There are 5 colors for button: positive, negative, accent, promotional, default.",
-              "default": "default",
-              "attribute": "color",
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
+              "default": "button",
+              "attribute": "type",
+              "reflects": true
             },
             {
               "kind": "method",
-              "name": "setVariant",
+              "name": "executeAction",
+              "privacy": "protected"
+            },
+            {
+              "kind": "method",
+              "name": "setActive",
+              "privacy": "protected",
               "parameters": [
                 {
-                  "name": "variant",
+                  "name": "element",
                   "type": {
-                    "text": "ButtonVariant"
+                    "text": "HTMLElement"
                   },
-                  "description": "The variant to set."
+                  "description": "The button element"
+                },
+                {
+                  "name": "active",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The active state of the element"
                 }
               ],
-              "description": "Sets the variant attribute for the button component.\nIf the provided variant is not included in the BUTTON_VARIANTS,\nit defaults to the value specified in DEFAULTS.VARIANT.",
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "Sets the ariaStateKey attributes based on the active state of the button."
             },
             {
               "kind": "method",
-              "name": "setColor",
+              "name": "setSoftDisabled",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "color",
+                  "name": "element",
                   "type": {
-                    "text": "ButtonColor"
+                    "text": "HTMLElement"
                   },
-                  "description": "The color to set."
+                  "description": "The button element."
+                },
+                {
+                  "name": "softDisabled",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The soft-disabled state."
                 }
               ],
-              "description": "Sets the color attribute for the button.\nDefaults to DEFAULTS.COLOR if invalid or for tertiary button.",
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "Sets the soft-disabled attribute for the button.\nWhen soft-disabled, the button looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute."
             },
             {
               "kind": "method",
-              "name": "setSize",
+              "name": "setDisabled",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "size",
+                  "name": "element",
                   "type": {
-                    "text": "PillButtonSize | IconButtonSize"
+                    "text": "HTMLElement"
                   },
-                  "description": "The size to set."
+                  "description": "The button element."
+                },
+                {
+                  "name": "disabled",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The disabled state."
                 }
               ],
-              "description": "Sets the size attribute for the button component.\nValidates the size based on the button type (icon, pill, or tertiary).\nDefaults to DEFAULTS.SIZE if invalid.",
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "Sets the disabled attribute for the button.\nWhen disabled, the button is not focusable or clickable, and tabindex is set to -1.\nThe previous tabindex is stored and restored when enabled.\nAlso sets/removes aria-disabled attribute."
             },
             {
               "kind": "method",
-              "name": "inferButtonType",
-              "description": "Infers the type of button based on the presence of slot and/or prefix and postfix icons.",
+              "name": "triggerClickEvent",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleBlur",
+              "privacy": "private",
+              "description": "In case the button is pressed and the focus is lost while pressing,\nthe pressed class is removed."
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "private",
               "parameters": [
                 {
-                  "description": "default slot of button",
-                  "name": "slot"
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event."
                 }
               ],
-              "inheritedFrom": {
-                "name": "ButtonComponentMixin",
-                "module": "utils/mixins/ButtonComponentMixin.js"
-              }
+              "description": "Handles the keydown event on the button.\nIf the key is 'Enter' or 'Space', the button is pressed.\nIf the key is 'Enter', the button is pressed. The native HTML button works in the same way.\nIf the key is 'Space', the button's default is prevent to avoid scrolling etc in the host application."
             },
             {
-              "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": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event."
+                }
+              ],
+              "description": "Handles the keyup event on the button.\nIf the key is 'Enter' or 'Space', the button is clicked.\nIf the key is 'Space', the button is pressed. The native HTML button works in the same way."
             },
             {
               "kind": "field",
@@ -2809,564 +2801,2546 @@
             },
             {
               "kind": "field",
-              "name": "inline",
+              "name": "disabled",
               "type": {
-                "text": "boolean"
+                "text": "boolean | undefined"
               },
-              "description": "The link can be inline or standalone.",
-              "default": "false",
-              "attribute": "inline",
+              "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": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
+                "name": "DisabledMixin",
+                "module": "utils/mixins/DisabledMixin.js"
               }
+            }
+          ],
+          "events": [
+            {
+              "description": "(React: onClick) This event is dispatched when the button is clicked.",
+              "name": "click",
+              "reactName": "onClick"
             },
             {
-              "kind": "field",
-              "name": "inverted",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The link color can be inverted by setting the inverted attribute to true.",
-              "default": "false",
-              "attribute": "inverted",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
+              "description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the button.",
+              "name": "keydown",
+              "reactName": "onKeyDown"
             },
             {
-              "kind": "field",
-              "name": "href",
+              "description": "(React: onKeyUp) This event is dispatched when a key is released on the button.",
+              "name": "keyup",
+              "reactName": "onKeyUp"
+            },
+            {
+              "description": "(React: onFocus) This event is dispatched when the button receives focus.",
+              "name": "focus",
+              "reactName": "onFocus"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "active",
               "type": {
-                "text": "string"
+                "text": "boolean | undefined"
               },
-              "default": "'#'",
-              "description": "Href for navigation. The URL that the hyperlink points to",
-              "attribute": "href",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
+              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
+              "default": "undefined",
+              "fieldName": "active"
             },
             {
-              "kind": "field",
-              "name": "target",
+              "name": "soft-disabled",
               "type": {
-                "text": "string"
+                "text": "boolean | undefined"
               },
-              "default": "'_self'",
-              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
-              "attribute": "target",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
+              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "default": "undefined",
+              "fieldName": "softDisabled"
             },
             {
-              "kind": "field",
-              "name": "rel",
+              "name": "size",
               "type": {
-                "text": "string | undefined"
+                "text": "ButtonSize"
               },
-              "description": "Optional rel attribute that defines the relationship of the linked URL as space-separated link types.",
-              "attribute": "rel",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
+              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
+              "default": "32",
+              "fieldName": "size"
             },
             {
-              "kind": "field",
-              "name": "handleNavigation",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
+              "name": "role",
+              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
+              "default": "button",
+              "fieldName": "role"
             },
             {
-              "kind": "method",
-              "name": "setDisabled",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "disabled",
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "Whether the element should be disabled"
-                }
-              ],
-              "description": "Sets or removes `aria-disabled` and updates `tabIndex` to reflect\nthe disabled state. When disabled, the element becomes unfocusable;\nwhen enabled, the previous `tabIndex` is restored.",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "components/linksimple/linksimple.component.js"
-              }
-            }
-          ],
-          "events": [
+              "name": "ariaStateKey",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
+              "default": "'aria-pressed' (when)",
+              "fieldName": "ariaStateKey"
+            },
             {
-              "description": "(React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.",
-              "name": "click",
-              "reactName": "onClick",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
+              "name": "type",
+              "type": {
+                "text": "ButtonType"
+              },
+              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
+              "default": "button",
+              "fieldName": "type"
             },
             {
-              "description": "(React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.",
-              "name": "keydown",
-              "reactName": "onKeyDown",
+              "name": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
               "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "name": "TabIndexMixin",
+                "module": "src/utils/mixins/TabIndexMixin.ts"
               }
             },
             {
-              "description": "(React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.",
-              "name": "focus",
-              "reactName": "onFocus",
+              "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": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "name": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
               }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "TabIndexMixin",
+              "module": "/src/utils/mixins/TabIndexMixin"
             },
             {
-              "description": "(React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.",
-              "name": "blur",
-              "reactName": "onBlur",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
+              "name": "DisabledMixin",
+              "module": "/src/utils/mixins/DisabledMixin"
             }
           ],
-          "attributes": [
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-buttonsimple",
+          "jsDoc": "/**\n * `mdc-buttonsimple` is a component that can be configured in various ways to suit different use cases.\n * It is used as an internal component and is not intended to be used directly by consumers.\n * Consumers should use the `mdc-button` component instead.\n *\n * @event click - (React: onClick) This event is dispatched when the button is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the button.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the button.\n * @event focus - (React: onFocus) This event is dispatched when the button receives focus.\n *\n * @tagname mdc-buttonsimple\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Buttonsimple",
+            "module": "components/buttonsimple/buttonsimple.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/buttonlink/buttonlink.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`mdc-buttonlink` combines the functional behavior of `mdc-linksimple` with the visual and structural\nfeatures of `mdc-button`. This includes support for variants, sizing, and optional\nprefix and postfix icons via slots.\n\n### Features:\n- Behaves like an link while visually resembling a button.\n- Supports slots for `prefix-icon` and `postfix-icon`.\n- Customizable size, color, and variant through attributes.\n- Inherits accessibility and keyboard interaction support from `mdc-linksimple`.",
+          "name": "ButtonLink",
+          "members": [
             {
+              "kind": "field",
               "name": "size",
               "type": {
                 "text": "PillButtonSize | IconButtonSize"
               },
               "description": "ButtonLink sizing is based on the buttonlink type.\n - **Pill buttonlink**: 40, 32, 28, 24.\n - **Icon buttonlink**: 64, 52, 40, 32, 28, 24.\n - Tertiary icon buttonlink can also be 20.",
               "default": "32",
-              "fieldName": "size"
+              "attribute": "size",
+              "reflects": true
             },
             {
-              "name": "soft-disabled",
+              "kind": "field",
+              "name": "softDisabled",
               "type": {
                 "text": "boolean | undefined"
               },
               "description": "Indicates whether the buttonlink is soft disabled.\nWhen set to `true`, the buttonlink appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe buttonlink behaves like a disabled buttonlink, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
               "default": "undefined",
-              "fieldName": "softDisabled"
+              "attribute": "soft-disabled",
+              "reflects": true
             },
             {
-              "name": "prefix-icon",
+              "kind": "method",
+              "name": "setSoftDisabled",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "HTMLElement"
+                  },
+                  "description": "The buttonlink element."
+                },
+                {
+                  "name": "softDisabled",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The soft-disabled state."
+                }
+              ],
+              "description": "Sets the soft-disabled attribute for the buttonlink.\nWhen soft-disabled, the buttonlink looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute."
+            },
+            {
+              "kind": "field",
+              "name": "prefixIcon",
               "type": {
                 "text": "IconNames | undefined"
               },
               "description": "The name of the icon to display as a prefix.\nThe icon is displayed on the left side of the button.",
-              "fieldName": "prefixIcon",
+              "attribute": "prefix-icon",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "ButtonComponentMixin",
-                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+                "module": "utils/mixins/ButtonComponentMixin.js"
               }
             },
             {
-              "name": "postfix-icon",
+              "kind": "field",
+              "name": "postfixIcon",
               "type": {
                 "text": "IconNames | undefined"
               },
               "description": "The name of the icon to display as a postfix.\nThe icon is displayed on the right side of the button.",
-              "fieldName": "postfixIcon",
+              "attribute": "postfix-icon",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "ButtonComponentMixin",
-                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+                "module": "utils/mixins/ButtonComponentMixin.js"
               }
             },
             {
+              "kind": "field",
               "name": "variant",
               "type": {
                 "text": "ButtonVariant"
               },
               "description": "There are 3 variants of button: primary, secondary, tertiary. They are styled differently.\n- **Primary**: Solid background color.\n- **Secondary**: Transparent background with a solid border.\n- **Tertiary**: No background or border, appears as plain text but retains all button functionalities.",
               "default": "primary",
-              "fieldName": "variant",
+              "attribute": "variant",
               "inheritedFrom": {
                 "name": "ButtonComponentMixin",
-                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+                "module": "utils/mixins/ButtonComponentMixin.js"
               }
             },
             {
+              "kind": "field",
               "name": "color",
               "type": {
                 "text": "ButtonColor"
               },
               "description": "There are 5 colors for button: positive, negative, accent, promotional, default.",
               "default": "default",
-              "fieldName": "color",
+              "attribute": "color",
               "inheritedFrom": {
                 "name": "ButtonComponentMixin",
-                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+                "module": "utils/mixins/ButtonComponentMixin.js"
               }
             },
             {
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
+              "kind": "method",
+              "name": "setVariant",
+              "parameters": [
+                {
+                  "name": "variant",
+                  "type": {
+                    "text": "ButtonVariant"
+                  },
+                  "description": "The variant to set."
+                }
+              ],
+              "description": "Sets the variant attribute for the button component.\nIf the provided variant is not included in the BUTTON_VARIANTS,\nit defaults to the value specified in DEFAULTS.VARIANT.",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "utils/mixins/ButtonComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setColor",
+              "parameters": [
+                {
+                  "name": "color",
+                  "type": {
+                    "text": "ButtonColor"
+                  },
+                  "description": "The color to set."
+                }
+              ],
+              "description": "Sets the color attribute for the button.\nDefaults to DEFAULTS.COLOR if invalid or for tertiary button.",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "utils/mixins/ButtonComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setSize",
+              "parameters": [
+                {
+                  "name": "size",
+                  "type": {
+                    "text": "PillButtonSize | IconButtonSize"
+                  },
+                  "description": "The size to set."
+                }
+              ],
+              "description": "Sets the size attribute for the button component.\nValidates the size based on the button type (icon, pill, or tertiary).\nDefaults to DEFAULTS.SIZE if invalid.",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "utils/mixins/ButtonComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "inferButtonType",
+              "description": "Infers the type of button based on the presence of slot and/or prefix and postfix icons.",
+              "parameters": [
+                {
+                  "description": "default slot of button",
+                  "name": "slot"
+                }
+              ],
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "utils/mixins/ButtonComponentMixin.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",
-              "fieldName": "disabled",
+              "attribute": "disabled",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
+                "module": "utils/mixins/DisabledMixin.js"
               }
             },
             {
+              "kind": "field",
               "name": "tabIndex",
               "type": {
                 "text": "number"
               },
               "default": "0",
               "description": "This property specifies the tab order of the element.",
-              "fieldName": "tabIndex",
+              "attribute": "tabIndex",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "TabIndexMixin",
-                "module": "src/utils/mixins/TabIndexMixin.ts"
+                "module": "utils/mixins/TabIndexMixin.js"
               }
             },
             {
+              "kind": "field",
               "name": "inline",
               "type": {
                 "text": "boolean"
               },
               "description": "The link can be inline or standalone.",
               "default": "false",
-              "fieldName": "inline",
+              "attribute": "inline",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
+              "kind": "field",
               "name": "inverted",
               "type": {
                 "text": "boolean"
               },
               "description": "The link color can be inverted by setting the inverted attribute to true.",
               "default": "false",
-              "fieldName": "inverted",
+              "attribute": "inverted",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
+              "kind": "field",
               "name": "href",
               "type": {
                 "text": "string"
               },
               "default": "'#'",
               "description": "Href for navigation. The URL that the hyperlink points to",
-              "fieldName": "href",
+              "attribute": "href",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
+              "kind": "field",
               "name": "target",
               "type": {
                 "text": "string"
               },
               "default": "'_self'",
               "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
-              "fieldName": "target",
+              "attribute": "target",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
+              "kind": "field",
               "name": "rel",
               "type": {
                 "text": "string | undefined"
               },
               "description": "Optional rel attribute that defines the relationship of the linked URL as space-separated link types.",
-              "fieldName": "rel",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            }
-          ],
-          "mixins": [
-            {
-              "name": "ButtonComponentMixin",
-              "module": "/src/utils/mixins/ButtonComponentMixin"
-            }
-          ],
-          "superclass": {
-            "name": "Linksimple",
-            "module": "/src/components/linksimple/linksimple.component"
-          },
-          "tagName": "mdc-buttonlink",
-          "jsDoc": "/**\n * `mdc-buttonlink` combines the functional behavior of `mdc-linksimple` with the visual and structural\n * features of `mdc-button`. This includes support for variants, sizing, and optional\n * prefix and postfix icons via slots.\n *\n * ### Features:\n * - Behaves like an link while visually resembling a button.\n * - Supports slots for `prefix-icon` and `postfix-icon`.\n * - Customizable size, color, and variant through attributes.\n * - Inherits accessibility and keyboard interaction support from `mdc-linksimple`.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-buttonlink\n *\n * @event click - (React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.\n * @event keydown - (React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.\n * @event focus - (React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.\n * @event blur - (React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.\n *\n */",
-          "customElement": true,
-          "cssProperties": [
-            {
-              "description": "Border radius of the link.",
-              "name": "--mdc-link-border-radius",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the link’s child content in the active state.",
-              "name": "--mdc-link-color-active",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the link’s child content in the disabled state.",
-              "name": "--mdc-link-color-disabled",
+              "attribute": "rel",
+              "reflects": true,
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
-              "description": "Color of the link’s child content in the hover state.",
-              "name": "--mdc-link-color-hover",
+              "kind": "field",
+              "name": "handleNavigation",
+              "privacy": "private",
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
             },
             {
-              "description": "Color of the link’s child content in the normal state.",
-              "name": "--mdc-link-color-normal",
+              "kind": "method",
+              "name": "setDisabled",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "disabled",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "Whether the element should be disabled"
+                }
+              ],
+              "description": "Sets or removes `aria-disabled` and updates `tabIndex` to reflect\nthe disabled state. When disabled, the element becomes unfocusable;\nwhen enabled, the previous `tabIndex` is restored.",
               "inheritedFrom": {
                 "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
+                "module": "components/linksimple/linksimple.component.js"
               }
-            },
+            }
+          ],
+          "events": [
             {
-              "description": "Color of the inverted link’s child content in the active state.",
-              "name": "--mdc-link-inverted-color-active",
+              "description": "(React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.",
+              "name": "click",
+              "reactName": "onClick",
               "inheritedFrom": {
                 "name": "Linksimple",
                 "module": "src/components/linksimple/linksimple.component.ts"
               }
             },
             {
-              "description": "Color of the inverted link’s child content in the disabled state.",
-              "name": "--mdc-link-inverted-color-disabled",
+              "description": "(React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.",
+              "name": "keydown",
+              "reactName": "onKeyDown",
               "inheritedFrom": {
                 "name": "Linksimple",
                 "module": "src/components/linksimple/linksimple.component.ts"
               }
             },
             {
-              "description": "Color of the inverted link’s child content in the hover state.",
-              "name": "--mdc-link-inverted-color-hover",
+              "description": "(React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.",
+              "name": "focus",
+              "reactName": "onFocus",
               "inheritedFrom": {
                 "name": "Linksimple",
                 "module": "src/components/linksimple/linksimple.component.ts"
               }
             },
             {
-              "description": "Color of the inverted link’s child content in the normal state.",
-              "name": "--mdc-link-inverted-color-normal",
+              "description": "(React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.",
+              "name": "blur",
+              "reactName": "onBlur",
               "inheritedFrom": {
                 "name": "Linksimple",
                 "module": "src/components/linksimple/linksimple.component.ts"
               }
             }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "ButtonLink",
-            "module": "components/buttonlink/buttonlink.component.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/buttonsimple/buttonsimple.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "`mdc-buttonsimple` is a component that can be configured in various ways to suit different use cases.\nIt is used as an internal component and is not intended to be used directly by consumers.\nConsumers should use the `mdc-button` component instead.",
-          "name": "Buttonsimple",
-          "members": [
+          ],
+          "attributes": [
             {
-              "kind": "field",
-              "name": "active",
+              "name": "size",
               "type": {
-                "text": "boolean | undefined"
+                "text": "PillButtonSize | IconButtonSize"
               },
-              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
-              "default": "undefined",
-              "attribute": "active",
-              "reflects": true
+              "description": "ButtonLink sizing is based on the buttonlink type.\n - **Pill buttonlink**: 40, 32, 28, 24.\n - **Icon buttonlink**: 64, 52, 40, 32, 28, 24.\n - Tertiary icon buttonlink can also be 20.",
+              "default": "32",
+              "fieldName": "size"
             },
             {
-              "kind": "field",
-              "name": "softDisabled",
+              "name": "soft-disabled",
               "type": {
                 "text": "boolean | undefined"
               },
-              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "description": "Indicates whether the buttonlink is soft disabled.\nWhen set to `true`, the buttonlink appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe buttonlink behaves like a disabled buttonlink, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
               "default": "undefined",
-              "attribute": "soft-disabled",
-              "reflects": true
+              "fieldName": "softDisabled"
             },
             {
-              "kind": "field",
-              "name": "size",
+              "name": "prefix-icon",
               "type": {
-                "text": "ButtonSize"
+                "text": "IconNames | undefined"
               },
-              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
-              "default": "32",
-              "attribute": "size",
-              "reflects": true
-            },
+              "description": "The name of the icon to display as a prefix.\nThe icon is displayed on the left side of the button.",
+              "fieldName": "prefixIcon",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+              }
+            },
+            {
+              "name": "postfix-icon",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "The name of the icon to display as a postfix.\nThe icon is displayed on the right side of the button.",
+              "fieldName": "postfixIcon",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+              }
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "ButtonVariant"
+              },
+              "description": "There are 3 variants of button: primary, secondary, tertiary. They are styled differently.\n- **Primary**: Solid background color.\n- **Secondary**: Transparent background with a solid border.\n- **Tertiary**: No background or border, appears as plain text but retains all button functionalities.",
+              "default": "primary",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "src/utils/mixins/ButtonComponentMixin.ts"
+              }
+            },
+            {
+              "name": "color",
+              "type": {
+                "text": "ButtonColor"
+              },
+              "description": "There are 5 colors for button: positive, negative, accent, promotional, default.",
+              "default": "default",
+              "fieldName": "color",
+              "inheritedFrom": {
+                "name": "ButtonComponentMixin",
+                "module": "src/utils/mixins/ButtonComponentMixin.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": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
+              }
+            },
+            {
+              "name": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
+              "inheritedFrom": {
+                "name": "TabIndexMixin",
+                "module": "src/utils/mixins/TabIndexMixin.ts"
+              }
+            },
+            {
+              "name": "inline",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The link can be inline or standalone.",
+              "default": "false",
+              "fieldName": "inline",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "name": "inverted",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The link color can be inverted by setting the inverted attribute to true.",
+              "default": "false",
+              "fieldName": "inverted",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "name": "href",
+              "type": {
+                "text": "string"
+              },
+              "default": "'#'",
+              "description": "Href for navigation. The URL that the hyperlink points to",
+              "fieldName": "href",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "name": "target",
+              "type": {
+                "text": "string"
+              },
+              "default": "'_self'",
+              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
+              "fieldName": "target",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "name": "rel",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Optional rel attribute that defines the relationship of the linked URL as space-separated link types.",
+              "fieldName": "rel",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "ButtonComponentMixin",
+              "module": "/src/utils/mixins/ButtonComponentMixin"
+            }
+          ],
+          "superclass": {
+            "name": "Linksimple",
+            "module": "/src/components/linksimple/linksimple.component"
+          },
+          "tagName": "mdc-buttonlink",
+          "jsDoc": "/**\n * `mdc-buttonlink` combines the functional behavior of `mdc-linksimple` with the visual and structural\n * features of `mdc-button`. This includes support for variants, sizing, and optional\n * prefix and postfix icons via slots.\n *\n * ### Features:\n * - Behaves like an link while visually resembling a button.\n * - Supports slots for `prefix-icon` and `postfix-icon`.\n * - Customizable size, color, and variant through attributes.\n * - Inherits accessibility and keyboard interaction support from `mdc-linksimple`.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-buttonlink\n *\n * @event click - (React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.\n * @event keydown - (React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.\n * @event focus - (React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.\n * @event blur - (React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.\n *\n */",
+          "customElement": true,
+          "cssProperties": [
+            {
+              "description": "Border radius of the link.",
+              "name": "--mdc-link-border-radius",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the link’s child content in the active state.",
+              "name": "--mdc-link-color-active",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the link’s child content in the disabled state.",
+              "name": "--mdc-link-color-disabled",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the link’s child content in the hover state.",
+              "name": "--mdc-link-color-hover",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the link’s child content in the normal state.",
+              "name": "--mdc-link-color-normal",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the inverted link’s child content in the active state.",
+              "name": "--mdc-link-inverted-color-active",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the inverted link’s child content in the disabled state.",
+              "name": "--mdc-link-inverted-color-disabled",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the inverted link’s child content in the hover state.",
+              "name": "--mdc-link-inverted-color-hover",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            },
+            {
+              "description": "Color of the inverted link’s child content in the normal state.",
+              "name": "--mdc-link-inverted-color-normal",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ButtonLink",
+            "module": "components/buttonlink/buttonlink.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/card/card.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The card component allows users to organize information in a structured and tangible\nformat that is visually appealing. `mdc-card` is a static component that supports\nthe following features:\n- Image\n- Header\n   - Icon\n   - Title\n   - Subtitle\n- Body\n\nThe card can either be vertically or horizontally oriented.\n\nThere are 2 variants for the card that represent the border styling - 'border' and 'ghost'.\n\nTo make this card interactive, use the following slots:\n- `icon-button`: This slot supports action icon buttons in the header section (maximum of 3 buttons).\n- `footer-link`: This slot is for passing `mdc-link` component within the footer section.\n- `footer-button-primary`: This slot is for passing primary variant of\n`mdc-button` component within the footer section.\n- `footer-button-secondary`: This slot is for passing secondary variant of `mdc-button` component\nwithin the footer section.\n\nInteractive card additionally supports 'promotional' variant that represents the border styling - 'promotional'.",
+          "name": "Card",
+          "slots": [
+            {
+              "description": "This slot is for passing the content before the body",
+              "name": "before-body"
+            },
+            {
+              "description": "This slot is for passing the text content for the card",
+              "name": "body"
+            },
+            {
+              "description": "This slot is for passing the content after the body",
+              "name": "after-body"
+            },
+            {
+              "description": "This slot is for passing `mdc-link` component within the footer section.",
+              "name": "footer-link"
+            },
+            {
+              "description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-primary"
+            },
+            {
+              "description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-secondary"
+            },
+            {
+              "description": "This slot is for passing the content before the body",
+              "name": "before-body"
+            },
+            {
+              "description": "This slot is for passing the text content for the card",
+              "name": "body"
+            },
+            {
+              "description": "This slot is for passing the content after the body",
+              "name": "after-body"
+            }
+          ],
+          "members": [
+            {
+              "kind": "method",
+              "name": "renderHeader",
+              "privacy": "protected",
+              "description": "Renders the header of the card if title is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "cardTitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "attribute": "card-title",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "attribute": "subtitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageSrc",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "attribute": "image-src",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageAlt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "attribute": "image-alt",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "attribute": "variant",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "attribute": "orientation",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "titleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "title-tag-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "subtitle-tag-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderImage",
+              "description": "Renders the image on the card if image source is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "description": "Renders the icon on the card if icon name is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderTitle",
+              "description": "Renders the title and subtitle on the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "CardComponentMixin",
+              "module": "/src/utils/mixins/CardComponentMixin"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-card",
+          "jsDoc": "/**\n * The card component allows users to organize information in a structured and tangible\n * format that is visually appealing. `mdc-card` is a static component that supports\n * the following features:\n * - Image\n * - Header\n *    - Icon\n *    - Title\n *    - Subtitle\n * - Body\n *\n * The card can either be vertically or horizontally oriented.\n *\n * There are 2 variants for the card that represent the border styling - 'border' and 'ghost'.\n *\n * To make this card interactive, use the following slots:\n * - `icon-button`: This slot supports action icon buttons in the header section (maximum of 3 buttons).\n * - `footer-link`: This slot is for passing `mdc-link` component within the footer section.\n * - `footer-button-primary`: This slot is for passing primary variant of\n * `mdc-button` component within the footer section.\n * - `footer-button-secondary`: This slot is for passing secondary variant of `mdc-button` component\n * within the footer section.\n *\n * Interactive card additionally supports 'promotional' variant that represents the border styling - 'promotional'.\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n * @slot footer-link - This slot is for passing `mdc-link` component within the footer section.\n * @slot footer-button-primary - This slot is for passing primary variant of\n * `mdc-button` component within the footer section.\n * @slot footer-button-secondary - This slot is for passing secondary variant of `mdc-button` component\n * within the footer section.\n *\n * @tagname mdc-card\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n */",
+          "customElement": true,
+          "attributes": [
+            {
+              "name": "card-title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "fieldName": "cardTitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "fieldName": "subtitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "image-src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "fieldName": "imageSrc",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "image-alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "fieldName": "imageAlt",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "fieldName": "orientation",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "title-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "titleTagName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "subtitle-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "subtitleTagName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "icon-name",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Card",
+            "module": "components/card/card.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/cardbutton/cardbutton.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "cardbutton component looks like a card and behaves as a button component.\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would trigger the click event.\nMake sure to pass only non-interactable elements within the slots.",
+          "name": "CardButton",
+          "slots": [
+            {
+              "description": "This slot is for passing the content before the body",
+              "name": "before-body"
+            },
+            {
+              "description": "This slot is for passing the text content for the card",
+              "name": "body"
+            },
+            {
+              "description": "This slot is for passing the content after the body",
+              "name": "after-body"
+            }
+          ],
+          "members": [
+            {
+              "kind": "method",
+              "name": "renderHeader",
+              "privacy": "protected",
+              "description": "Renders the header of the card if title is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "cardTitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "attribute": "card-title",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "attribute": "subtitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageSrc",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "attribute": "image-src",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageAlt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "attribute": "image-alt",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "attribute": "variant",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "attribute": "orientation",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "titleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "title-tag-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "subtitle-tag-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderImage",
+              "description": "Renders the image on the card if image source is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "description": "Renders the icon on the card if icon name is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderTitle",
+              "description": "Renders the title and subtitle on the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "utils/mixins/CardComponentMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "attribute": "tabIndex",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.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": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "active",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
+              "default": "undefined",
+              "attribute": "active",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "softDisabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "default": "undefined",
+              "attribute": "soft-disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "ButtonSize"
+              },
+              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
+              "default": "32",
+              "attribute": "size",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "role",
+              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
+              "default": "button",
+              "attribute": "role",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "ariaStateKey",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
+              "default": "'aria-pressed' (when)",
+              "attribute": "ariaStateKey",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "type",
+              "type": {
+                "text": "ButtonType"
+              },
+              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
+              "default": "button",
+              "attribute": "type",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "executeAction",
+              "privacy": "protected",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setActive",
+              "privacy": "protected",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "HTMLElement"
+                  },
+                  "description": "The button element"
+                },
+                {
+                  "name": "active",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The active state of the element"
+                }
+              ],
+              "description": "Sets the ariaStateKey attributes based on the active state of the button.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setSoftDisabled",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "HTMLElement"
+                  },
+                  "description": "The button element."
+                },
+                {
+                  "name": "softDisabled",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The soft-disabled state."
+                }
+              ],
+              "description": "Sets the soft-disabled attribute for the button.\nWhen soft-disabled, the button looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setDisabled",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "HTMLElement"
+                  },
+                  "description": "The button element."
+                },
+                {
+                  "name": "disabled",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "The disabled state."
+                }
+              ],
+              "description": "Sets the disabled attribute for the button.\nWhen disabled, the button is not focusable or clickable, and tabindex is set to -1.\nThe previous tabindex is stored and restored when enabled.\nAlso sets/removes aria-disabled attribute.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "triggerClickEvent",
+              "privacy": "private",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleBlur",
+              "privacy": "private",
+              "description": "In case the button is pressed and the focus is lost while pressing,\nthe pressed class is removed.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event."
+                }
+              ],
+              "description": "Handles the keydown event on the button.\nIf the key is 'Enter' or 'Space', the button is pressed.\nIf the key is 'Enter', the button is pressed. The native HTML button works in the same way.\nIf the key is 'Space', the button's default is prevent to avoid scrolling etc in the host application.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyUp",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event."
+                }
+              ],
+              "description": "Handles the keyup event on the button.\nIf the key is 'Enter' or 'Space', the button is clicked.\nIf the key is 'Space', the button is pressed. The native HTML button works in the same way.",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            }
+          ],
+          "events": [
+            {
+              "description": "(React: onClick) Event that gets dispatched when the card is clicked.",
+              "name": "click",
+              "reactName": "onClick",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It fires the click event when enter key is used.",
+              "name": "keydown",
+              "reactName": "onKeyDown",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It fires the click event when space key is used.",
+              "name": "keyup",
+              "reactName": "onKeyUp",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
+              "name": "focus",
+              "reactName": "onFocus",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "CardComponentMixin",
+              "module": "/src/utils/mixins/CardComponentMixin"
+            }
+          ],
+          "superclass": {
+            "name": "Buttonsimple",
+            "module": "/src/components/buttonsimple/buttonsimple.component"
+          },
+          "tagName": "mdc-cardbutton",
+          "jsDoc": "/**\n * cardbutton component looks like a card and behaves as a button component.\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would trigger the click event.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * @tagname mdc-cardbutton\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It fires the click event when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It fires the click event when space key is used.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
+          "customElement": true,
+          "attributes": [
+            {
+              "name": "card-title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "fieldName": "cardTitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "fieldName": "subtitle",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "image-src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "fieldName": "imageSrc",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "image-alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "fieldName": "imageAlt",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "fieldName": "orientation",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "title-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "titleTagName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "subtitle-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "subtitleTagName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "icon-name",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName",
+              "inheritedFrom": {
+                "name": "CardComponentMixin",
+                "module": "src/utils/mixins/CardComponentMixin.ts"
+              }
+            },
+            {
+              "name": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.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": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "active",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
+              "default": "undefined",
+              "fieldName": "active",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "soft-disabled",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "default": "undefined",
+              "fieldName": "softDisabled",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "ButtonSize"
+              },
+              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
+              "default": "32",
+              "fieldName": "size",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "role",
+              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
+              "default": "button",
+              "fieldName": "role",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "ariaStateKey",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
+              "default": "'aria-pressed' (when)",
+              "fieldName": "ariaStateKey",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "type",
+              "type": {
+                "text": "ButtonType"
+              },
+              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
+              "default": "button",
+              "fieldName": "type",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "CardButton",
+            "module": "components/cardbutton/cardbutton.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/cardcheckbox/cardcheckbox.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "cardcheckbox component extends `mdc-card` and supports checkbox selection interaction addtionally.\n\nWhile using this component within a form or group of cards, make sure cards are in a role = \"checkbox-group\".\nThis card would have events for selected and unselected (similar to checkbox)\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\nMake sure to pass only non-interactable elements within the slots.\n\nMake sure to pass the `card-title` mandatorily for this card.",
+          "name": "CardCheckbox",
+          "slots": [
+            {
+              "description": "This slot is for passing the content before the body",
+              "name": "before-body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing the text content for the card",
+              "name": "body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing the content after the body",
+              "name": "after-body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing `mdc-link` component within the footer section.",
+              "name": "footer-link",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-primary",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-secondary",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "checked",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The checked state of the card",
+              "attribute": "checked",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "selectionType",
+              "type": {
+                "text": "SelectionType"
+              },
+              "description": "The selection type of the card. It can either be set to 'check' or 'checkbox'",
+              "default": "'check'",
+              "attribute": "selection-type"
+            },
+            {
+              "kind": "method",
+              "name": "toggleChecked",
+              "privacy": "private",
+              "description": "Toggles the checked state"
+            },
+            {
+              "kind": "method",
+              "name": "toggleOnEnter",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event"
+                }
+              ],
+              "description": "Toggles the checked state when enter key is used"
+            },
+            {
+              "kind": "method",
+              "name": "toggleOnSpace",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  },
+                  "description": "The keyboard event"
+                }
+              ],
+              "description": "Toggles the checked state when space key is used"
+            },
+            {
+              "kind": "method",
+              "name": "renderSelection",
+              "privacy": "private",
+              "description": "Renders the selection icon or checkbox based on the selection type",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderHeader",
+              "privacy": "protected",
+              "description": "Renders the header of the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.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": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "attribute": "tabIndex",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "TabIndexMixin",
+                "module": "utils/mixins/TabIndexMixin.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "cardTitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "attribute": "card-title",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "attribute": "subtitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageSrc",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "attribute": "image-src",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageAlt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "attribute": "image-alt",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "attribute": "variant",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "attribute": "orientation",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "titleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "title-tag-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "subtitle-tag-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderImage",
+              "description": "Renders the image on the card if image source is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "description": "Renders the icon on the card if icon name is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderTitle",
+              "description": "Renders the title and subtitle on the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            }
+          ],
+          "events": [
             {
-              "kind": "field",
-              "name": "role",
-              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
-              "default": "button",
-              "attribute": "role",
-              "reflects": true
+              "description": "(React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.",
+              "name": "click",
+              "reactName": "onClick"
             },
             {
-              "kind": "field",
-              "name": "ariaStateKey",
+              "description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It toggles the checked state when enter key is used.",
+              "name": "keydown",
+              "reactName": "onKeyDown"
+            },
+            {
+              "description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It toggles the checked state when space key is used.",
+              "name": "keyup",
+              "reactName": "onKeyUp"
+            },
+            {
+              "description": "(React: onChange) Event that gets dispatched when the card state changes.",
+              "name": "change",
+              "reactName": "onChange"
+            },
+            {
+              "description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
+              "name": "focus",
+              "reactName": "onFocus"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "checked",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
-              "default": "'aria-pressed' (when)",
-              "attribute": "ariaStateKey",
-              "reflects": true
+              "default": "false",
+              "description": "The checked state of the card",
+              "fieldName": "checked"
             },
             {
-              "kind": "field",
-              "name": "type",
+              "name": "selection-type",
               "type": {
-                "text": "ButtonType"
+                "text": "SelectionType"
               },
-              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
-              "default": "button",
-              "attribute": "type",
-              "reflects": true
+              "description": "The selection type of the card. It can either be set to 'check' or 'checkbox'",
+              "default": "'check'",
+              "fieldName": "selectionType"
             },
             {
-              "kind": "method",
-              "name": "executeAction",
-              "privacy": "protected"
+              "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"
+              }
             },
             {
-              "kind": "method",
-              "name": "setActive",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "element",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The button element"
-                },
-                {
-                  "name": "active",
-                  "optional": true,
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The active state of the element"
-                }
-              ],
-              "description": "Sets the ariaStateKey attributes based on the active state of the button."
+              "name": "tabIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
+              "inheritedFrom": {
+                "name": "TabIndexMixin",
+                "module": "src/utils/mixins/TabIndexMixin.ts"
+              }
             },
             {
-              "kind": "method",
-              "name": "setSoftDisabled",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "element",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The button element."
-                },
-                {
-                  "name": "softDisabled",
-                  "optional": true,
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The soft-disabled state."
-                }
-              ],
-              "description": "Sets the soft-disabled attribute for the button.\nWhen soft-disabled, the button looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute."
+              "name": "card-title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "fieldName": "cardTitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
             },
             {
-              "kind": "method",
-              "name": "setDisabled",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "element",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The button element."
-                },
-                {
-                  "name": "disabled",
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The disabled state."
-                }
-              ],
-              "description": "Sets the disabled attribute for the button.\nWhen disabled, the button is not focusable or clickable, and tabindex is set to -1.\nThe previous tabindex is stored and restored when enabled.\nAlso sets/removes aria-disabled attribute."
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "fieldName": "subtitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "image-src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "fieldName": "imageSrc",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "image-alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "fieldName": "imageAlt",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "fieldName": "orientation",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "title-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "titleTagName",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "subtitle-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "subtitleTagName",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "icon-name",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "DisabledMixin",
+              "module": "/src/utils/mixins/DisabledMixin"
+            },
+            {
+              "name": "TabIndexMixin",
+              "module": "/src/utils/mixins/TabIndexMixin"
+            }
+          ],
+          "superclass": {
+            "name": "Card",
+            "module": "/src/components/card/card.component"
+          },
+          "tagName": "mdc-cardcheckbox",
+          "jsDoc": "/**\n * cardcheckbox component extends `mdc-card` and supports checkbox selection interaction addtionally.\n *\n * While using this component within a form or group of cards, make sure cards are in a role = \"checkbox-group\".\n * This card would have events for selected and unselected (similar to checkbox)\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * Make sure to pass the `card-title` mandatorily for this card.\n *\n * @tagname mdc-cardcheckbox\n *\n * @dependency mdc-icon\n * @dependency mdc-staticcheckbox\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It toggles the checked state when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It toggles the checked state when space key is used.\n * @event change - (React: onChange) Event that gets dispatched when the card state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "CardCheckbox",
+            "module": "components/cardcheckbox/cardcheckbox.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/cardradio/cardradio.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "cardradio component extends `mdc-card` and supports radio selection interaction addtionally.\n\nWhile using this component within a form or group of cards, make sure cards are in a role = \"radio-group\".\nThis card would have events for selected and unselected (similar to radio)\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\nMake sure to pass only non-interactable elements within the slots.\n\nMake sure to pass the `card-title` mandatorily for this card.",
+          "name": "CardRadio",
+          "slots": [
+            {
+              "description": "This slot is for passing the content before the body",
+              "name": "before-body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing the text content for the card",
+              "name": "body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing the content after the body",
+              "name": "after-body",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing `mdc-link` component within the footer section.",
+              "name": "footer-link",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-primary",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
+              "name": "footer-button-secondary",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "checked",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The checked state of the card",
+              "attribute": "checked",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the radio.",
+              "attribute": "name"
             },
             {
               "kind": "method",
-              "name": "triggerClickEvent",
-              "privacy": "private"
+              "name": "getAllCardsWithinSameGroup",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "CardRadio[]"
+                }
+              },
+              "description": "Returns all cards within the same group (name)."
             },
             {
               "kind": "method",
-              "name": "handleBlur",
+              "name": "toggleChecked",
               "privacy": "private",
-              "description": "In case the button is pressed and the focus is lost while pressing,\nthe pressed class is removed."
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Handles the change event on the radio element.\nThis will toggle the state of the radio element.\nDispatches the change event."
             },
             {
               "kind": "method",
-              "name": "handleKeyDown",
+              "name": "toggleOnEnter",
               "privacy": "private",
               "parameters": [
                 {
@@ -3374,14 +5348,14 @@
                   "type": {
                     "text": "KeyboardEvent"
                   },
-                  "description": "The keyboard event."
+                  "description": "The keyboard event"
                 }
               ],
-              "description": "Handles the keydown event on the button.\nIf the key is 'Enter' or 'Space', the button is pressed.\nIf the key is 'Enter', the button is pressed. The native HTML button works in the same way.\nIf the key is 'Space', the button's default is prevent to avoid scrolling etc in the host application."
+              "description": "Toggles the checked state when enter key is used"
             },
             {
               "kind": "method",
-              "name": "handleKeyUp",
+              "name": "toggleOnSpace",
               "privacy": "private",
               "parameters": [
                 {
@@ -3389,10 +5363,40 @@
                   "type": {
                     "text": "KeyboardEvent"
                   },
-                  "description": "The keyboard event."
+                  "description": "The keyboard event"
                 }
               ],
-              "description": "Handles the keyup event on the button.\nIf the key is 'Enter' or 'Space', the button is clicked.\nIf the key is 'Space', the button is pressed. The native HTML button works in the same way."
+              "description": "Toggles the checked state when space key is used"
+            },
+            {
+              "kind": "method",
+              "name": "renderHeader",
+              "privacy": "protected",
+              "description": "Renders the header of the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.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",
@@ -3411,137 +5415,378 @@
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "cardTitle",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string"
               },
-              "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",
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "attribute": "card-title",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "attribute": "subtitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageSrc",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "attribute": "image-src",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "imageAlt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "attribute": "image-alt",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "attribute": "variant",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "attribute": "orientation",
               "reflects": true,
               "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "utils/mixins/DisabledMixin.js"
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "titleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "title-tag-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "subtitleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "subtitle-tag-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderImage",
+              "description": "Renders the image on the card if image source is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "description": "Renders the icon on the card if icon name is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderTitle",
+              "description": "Renders the title and subtitle on the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "components/card/card.component.js"
               }
             }
           ],
           "events": [
             {
-              "description": "(React: onClick) This event is dispatched when the button is clicked.",
+              "description": "(React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.",
               "name": "click",
               "reactName": "onClick"
             },
             {
-              "description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the button.",
+              "description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It toggles the checked state when enter key is used.",
               "name": "keydown",
               "reactName": "onKeyDown"
             },
             {
-              "description": "(React: onKeyUp) This event is dispatched when a key is released on the button.",
+              "description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It toggles the checked state when space key is used.",
               "name": "keyup",
               "reactName": "onKeyUp"
             },
             {
-              "description": "(React: onFocus) This event is dispatched when the button receives focus.",
+              "description": "(React: onChange) Event that gets dispatched when the card state changes.",
+              "name": "change",
+              "reactName": "onChange"
+            },
+            {
+              "description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
               "name": "focus",
               "reactName": "onFocus"
             }
           ],
           "attributes": [
             {
-              "name": "active",
+              "name": "checked",
               "type": {
-                "text": "boolean | undefined"
+                "text": "boolean"
               },
-              "description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
-              "default": "undefined",
-              "fieldName": "active"
+              "default": "false",
+              "description": "The checked state of the card",
+              "fieldName": "checked"
             },
             {
-              "name": "soft-disabled",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the radio.",
+              "fieldName": "name"
+            },
+            {
+              "name": "disabled",
               "type": {
                 "text": "boolean | undefined"
               },
-              "description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
+              "description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
               "default": "undefined",
-              "fieldName": "softDisabled"
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
+              }
             },
             {
-              "name": "size",
+              "name": "tabIndex",
               "type": {
-                "text": "ButtonSize"
+                "text": "number"
               },
-              "description": "Simplebutton size is a super set of all the sizes supported by children components.",
-              "default": "32",
-              "fieldName": "size"
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
+              "inheritedFrom": {
+                "name": "TabIndexMixin",
+                "module": "src/utils/mixins/TabIndexMixin.ts"
+              }
             },
             {
-              "name": "role",
-              "description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
-              "default": "button",
-              "fieldName": "role"
+              "name": "card-title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "fieldName": "cardTitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "fieldName": "subtitle",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "image-src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "fieldName": "imageSrc",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "image-alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "fieldName": "imageAlt",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
             },
             {
-              "name": "ariaStateKey",
+              "name": "variant",
               "type": {
-                "text": "string | undefined"
+                "text": "CardVariant"
               },
-              "description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
-              "default": "'aria-pressed' (when)",
-              "fieldName": "ariaStateKey"
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "fieldName": "variant",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
             },
             {
-              "name": "type",
+              "name": "orientation",
               "type": {
-                "text": "ButtonType"
+                "text": "CardOrientation"
               },
-              "description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
-              "default": "button",
-              "fieldName": "type"
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "fieldName": "orientation",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
             },
             {
-              "name": "tabIndex",
+              "name": "title-tag-name",
               "type": {
-                "text": "number"
+                "text": "TagNameType"
               },
-              "default": "0",
-              "description": "This property specifies the tab order of the element.",
-              "fieldName": "tabIndex",
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "titleTagName",
               "inheritedFrom": {
-                "name": "TabIndexMixin",
-                "module": "src/utils/mixins/TabIndexMixin.ts"
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
               }
             },
             {
-              "name": "disabled",
+              "name": "subtitle-tag-name",
               "type": {
-                "text": "boolean | undefined"
+                "text": "TagNameType"
               },
-              "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",
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "subtitleTagName",
               "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
+              }
+            },
+            {
+              "name": "icon-name",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName",
+              "inheritedFrom": {
+                "name": "Card",
+                "module": "src/components/card/card.component.ts"
               }
             }
           ],
           "mixins": [
-            {
-              "name": "TabIndexMixin",
-              "module": "/src/utils/mixins/TabIndexMixin"
-            },
             {
               "name": "DisabledMixin",
               "module": "/src/utils/mixins/DisabledMixin"
+            },
+            {
+              "name": "TabIndexMixin",
+              "module": "/src/utils/mixins/TabIndexMixin"
             }
           ],
           "superclass": {
-            "name": "Component",
-            "module": "/src/models"
+            "name": "Card",
+            "module": "/src/components/card/card.component"
           },
-          "tagName": "mdc-buttonsimple",
-          "jsDoc": "/**\n * `mdc-buttonsimple` is a component that can be configured in various ways to suit different use cases.\n * It is used as an internal component and is not intended to be used directly by consumers.\n * Consumers should use the `mdc-button` component instead.\n *\n * @event click - (React: onClick) This event is dispatched when the button is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the button.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the button.\n * @event focus - (React: onFocus) This event is dispatched when the button receives focus.\n *\n * @tagname mdc-buttonsimple\n */",
+          "tagName": "mdc-cardradio",
+          "jsDoc": "/**\n * cardradio component extends `mdc-card` and supports radio selection interaction addtionally.\n *\n * While using this component within a form or group of cards, make sure cards are in a role = \"radio-group\".\n * This card would have events for selected and unselected (similar to radio)\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * Make sure to pass the `card-title` mandatorily for this card.\n *\n * @tagname mdc-cardradio\n *\n * @dependency mdc-icon\n * @dependency mdc-staticradio\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It toggles the checked state when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It toggles the checked state when space key is used.\n * @event change - (React: onChange) Event that gets dispatched when the card state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
           "customElement": true
         }
       ],
@@ -3550,8 +5795,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "Buttonsimple",
-            "module": "components/buttonsimple/buttonsimple.component.js"
+            "name": "CardRadio",
+            "module": "components/cardradio/cardradio.component.js"
           }
         }
       ]
@@ -9030,57 +11275,256 @@
               }
             },
             {
-              "name": "help-text-type",
+              "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"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "FormInternalsMixin",
+              "module": "/src/utils/mixins/FormInternalsMixin"
+            },
+            {
+              "name": "DataAriaLabelMixin",
+              "module": "/src/utils/mixins/DataAriaLabelMixin"
+            }
+          ],
+          "superclass": {
+            "name": "FormfieldWrapper",
+            "module": "/src/components/formfieldwrapper"
+          },
+          "tagName": "mdc-input",
+          "jsDoc": "/**\n * mdc-input is a component that allows users to input text.\n *  It contains:\n * - label field - describe the input field.\n * - input field - contains the value\n * - help text or validation message - displayed below the input field.\n * - trailing button - it displays a clear the input field.\n * - prefix text - displayed before the input field.\n * - leading icon - displayed before the input field.\n * - clear-aria-label - aria label for the trailing button.\n * - all the attributes of the input field.\n *\n * @tagname mdc-input\n *\n * @event input - (React: onInput) This event is dispatched when the value of the input field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the input field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the input receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the input loses focus.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @cssproperty --mdc-input-disabled-border-color - Border color for the input container when disabled\n * @cssproperty --mdc-input-disabled-text-color - Text color for the input field when disabled\n * @cssproperty --mdc-input-disabled-background-color - Background color for the input field when disabled\n * @cssproperty --mdc-input-border-color - Border color for the input container\n * @cssproperty --mdc-input-text-color - Text color for the input field\n * @cssproperty --mdc-input-background-color - Background color for the input field\n * @cssproperty --mdc-input-selection-background-color - Background color for the selected text\n * @cssproperty --mdc-input-selection-text-color - Text color for the selected text\n * @cssproperty --mdc-input-support-text-color - Text color for the help text\n * @cssproperty --mdc-input-hover-background-color - Background color for the input field when hovered\n * @cssproperty --mdc-input-focused-background-color - Background color for the input field when focused\n * @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused\n * @cssproperty --mdc-input-error-border-color - Border color for the input container when error\n * @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning\n * @cssproperty --mdc-input-success-border-color - Border color for the input container when success\n * @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary\n *\n */",
+          "customElement": true,
+          "slots": [
+            {
+              "description": "slot to add the label info icon",
+              "name": "label-info",
+              "inheritedFrom": {
+                "name": "FormfieldWrapper",
+                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "Input",
+            "module": "components/input/input.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/inputchip/inputchip.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n\n- It supports a leading icon along with label.\n- It supports an error state for validation.\n- It supports a close button to remove the chip.",
+          "name": "InputChip",
+          "cssProperties": [
+            {
+              "description": "The color of the chip.",
+              "name": "--mdc-chip-color"
+            },
+            {
+              "description": "The border color of the chip.",
+              "name": "--mdc-chip-border-color"
+            },
+            {
+              "description": "The background color of the chip.",
+              "name": "--mdc-chip-background-color"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
+              "attribute": "label"
+            },
+            {
+              "kind": "field",
+              "name": "error",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The error state of the inputchip.",
+              "attribute": "error"
+            },
+            {
+              "kind": "field",
+              "name": "clearAriaLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The aria-label of the close button.",
+              "attribute": "clear-aria-label"
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "privacy": "private",
+              "description": "Renders the icon element if available.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleClose",
+              "privacy": "private",
+              "description": "Handles the behavior of the close button on click event.",
+              "parameters": [
+                {
+                  "description": "The event object.",
+                  "name": "event"
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name",
+              "inheritedFrom": {
+                "name": "IconNameMixin",
+                "module": "utils/mixins/IconNameMixin.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"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "remove",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "This event is dispatched when the close button is activated. It bubbles and is composed.",
+              "reactName": "onRemove"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
+              "fieldName": "label"
+            },
+            {
+              "name": "error",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "The error state of the inputchip.",
+              "fieldName": "error"
+            },
+            {
+              "name": "clear-aria-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The aria-label of the close button.",
+              "fieldName": "clearAriaLabel"
+            },
+            {
+              "name": "icon-name",
               "type": {
-                "text": "ValidationType"
+                "text": "IconNames | undefined"
               },
-              "description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
-              "fieldName": "helpTextType",
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName",
               "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
+                "name": "IconNameMixin",
+                "module": "src/utils/mixins/IconNameMixin.ts"
               }
             },
             {
-              "name": "help-text",
+              "name": "disabled",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean | undefined"
               },
-              "description": "The help text that is displayed below the input field.",
-              "fieldName": "helpText",
+              "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": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
               }
             }
           ],
           "mixins": [
             {
-              "name": "FormInternalsMixin",
-              "module": "/src/utils/mixins/FormInternalsMixin"
+              "name": "IconNameMixin",
+              "module": "/src/utils/mixins/IconNameMixin"
             },
             {
-              "name": "DataAriaLabelMixin",
-              "module": "/src/utils/mixins/DataAriaLabelMixin"
+              "name": "DisabledMixin",
+              "module": "/src/utils/mixins/DisabledMixin"
             }
           ],
           "superclass": {
-            "name": "FormfieldWrapper",
-            "module": "/src/components/formfieldwrapper"
+            "name": "Component",
+            "module": "/src/models"
           },
-          "tagName": "mdc-input",
-          "jsDoc": "/**\n * mdc-input is a component that allows users to input text.\n *  It contains:\n * - label field - describe the input field.\n * - input field - contains the value\n * - help text or validation message - displayed below the input field.\n * - trailing button - it displays a clear the input field.\n * - prefix text - displayed before the input field.\n * - leading icon - displayed before the input field.\n * - clear-aria-label - aria label for the trailing button.\n * - all the attributes of the input field.\n *\n * @tagname mdc-input\n *\n * @event input - (React: onInput) This event is dispatched when the value of the input field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the input field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the input receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the input loses focus.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @cssproperty --mdc-input-disabled-border-color - Border color for the input container when disabled\n * @cssproperty --mdc-input-disabled-text-color - Text color for the input field when disabled\n * @cssproperty --mdc-input-disabled-background-color - Background color for the input field when disabled\n * @cssproperty --mdc-input-border-color - Border color for the input container\n * @cssproperty --mdc-input-text-color - Text color for the input field\n * @cssproperty --mdc-input-background-color - Background color for the input field\n * @cssproperty --mdc-input-selection-background-color - Background color for the selected text\n * @cssproperty --mdc-input-selection-text-color - Text color for the selected text\n * @cssproperty --mdc-input-support-text-color - Text color for the help text\n * @cssproperty --mdc-input-hover-background-color - Background color for the input field when hovered\n * @cssproperty --mdc-input-focused-background-color - Background color for the input field when focused\n * @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused\n * @cssproperty --mdc-input-error-border-color - Border color for the input container when error\n * @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning\n * @cssproperty --mdc-input-success-border-color - Border color for the input container when success\n * @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary\n *\n */",
-          "customElement": true,
-          "slots": [
-            {
-              "description": "slot to add the label info icon",
-              "name": "label-info",
-              "inheritedFrom": {
-                "name": "FormfieldWrapper",
-                "module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
-              }
-            }
-          ]
+          "tagName": "mdc-inputchip",
+          "jsDoc": "/**\n * mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n *\n * - It supports a leading icon along with label.\n * - It supports an error state for validation.\n * - It supports a close button to remove the chip.\n *\n * @tagname mdc-inputchip\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.\n *\n * @cssproperty --mdc-chip-color - The color of the chip.\n * @cssproperty --mdc-chip-border-color - The border color of the chip.\n * @cssproperty --mdc-chip-background-color - The background color of the chip.\n *\n */",
+          "customElement": true
         }
       ],
       "exports": [
@@ -9088,8 +11532,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "Input",
-            "module": "components/input/input.component.js"
+            "name": "InputChip",
+            "module": "components/inputchip/inputchip.component.js"
           }
         }
       ]
@@ -9454,260 +11898,61 @@
             },
             {
               "description": "Color of the link’s child content in the disabled state.",
-              "name": "--mdc-link-color-disabled",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the link’s child content in the hover state.",
-              "name": "--mdc-link-color-hover",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the link’s child content in the normal state.",
-              "name": "--mdc-link-color-normal",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the inverted link’s child content in the active state.",
-              "name": "--mdc-link-inverted-color-active",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the inverted link’s child content in the disabled state.",
-              "name": "--mdc-link-inverted-color-disabled",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the inverted link’s child content in the hover state.",
-              "name": "--mdc-link-inverted-color-hover",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            },
-            {
-              "description": "Color of the inverted link’s child content in the normal state.",
-              "name": "--mdc-link-inverted-color-normal",
-              "inheritedFrom": {
-                "name": "Linksimple",
-                "module": "src/components/linksimple/linksimple.component.ts"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "Link",
-            "module": "components/link/link.component.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/inputchip/inputchip.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n\n- It supports a leading icon along with label.\n- It supports an error state for validation.\n- It supports a close button to remove the chip.",
-          "name": "InputChip",
-          "cssProperties": [
-            {
-              "description": "The color of the chip.",
-              "name": "--mdc-chip-color"
-            },
-            {
-              "description": "The border color of the chip.",
-              "name": "--mdc-chip-border-color"
-            },
-            {
-              "description": "The background color of the chip.",
-              "name": "--mdc-chip-background-color"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "error",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The error state of the inputchip.",
-              "attribute": "error"
-            },
-            {
-              "kind": "field",
-              "name": "clearAriaLabel",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The aria-label of the close button.",
-              "attribute": "clear-aria-label"
-            },
-            {
-              "kind": "method",
-              "name": "renderIcon",
-              "privacy": "private",
-              "description": "Renders the icon element if available.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleClose",
-              "privacy": "private",
-              "description": "Handles the behavior of the close button on click event.",
-              "parameters": [
-                {
-                  "description": "The event object.",
-                  "name": "event"
-                }
-              ]
-            },
-            {
-              "kind": "field",
-              "name": "iconName",
-              "type": {
-                "text": "IconNames | undefined"
-              },
-              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
-              "attribute": "icon-name",
-              "inheritedFrom": {
-                "name": "IconNameMixin",
-                "module": "utils/mixins/IconNameMixin.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"
-              }
-            }
-          ],
-          "events": [
-            {
-              "name": "remove",
-              "type": {
-                "text": "CustomEvent"
-              },
-              "description": "This event is dispatched when the close button is activated. It bubbles and is composed.",
-              "reactName": "onRemove"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
-              "fieldName": "label"
+              "name": "--mdc-link-color-disabled",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
             },
             {
-              "name": "error",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "The error state of the inputchip.",
-              "fieldName": "error"
+              "description": "Color of the link’s child content in the hover state.",
+              "name": "--mdc-link-color-hover",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
             },
             {
-              "name": "clear-aria-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The aria-label of the close button.",
-              "fieldName": "clearAriaLabel"
+              "description": "Color of the link’s child content in the normal state.",
+              "name": "--mdc-link-color-normal",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
             },
             {
-              "name": "icon-name",
-              "type": {
-                "text": "IconNames | undefined"
-              },
-              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
-              "fieldName": "iconName",
+              "description": "Color of the inverted link’s child content in the active state.",
+              "name": "--mdc-link-inverted-color-active",
               "inheritedFrom": {
-                "name": "IconNameMixin",
-                "module": "src/utils/mixins/IconNameMixin.ts"
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.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",
+              "description": "Color of the inverted link’s child content in the disabled state.",
+              "name": "--mdc-link-inverted-color-disabled",
               "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
               }
-            }
-          ],
-          "mixins": [
+            },
             {
-              "name": "IconNameMixin",
-              "module": "/src/utils/mixins/IconNameMixin"
+              "description": "Color of the inverted link’s child content in the hover state.",
+              "name": "--mdc-link-inverted-color-hover",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
             },
             {
-              "name": "DisabledMixin",
-              "module": "/src/utils/mixins/DisabledMixin"
+              "description": "Color of the inverted link’s child content in the normal state.",
+              "name": "--mdc-link-inverted-color-normal",
+              "inheritedFrom": {
+                "name": "Linksimple",
+                "module": "src/components/linksimple/linksimple.component.ts"
+              }
             }
-          ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-inputchip",
-          "jsDoc": "/**\n * mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n *\n * - It supports a leading icon along with label.\n * - It supports an error state for validation.\n * - It supports a close button to remove the chip.\n *\n * @tagname mdc-inputchip\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.\n *\n * @cssproperty --mdc-chip-color - The color of the chip.\n * @cssproperty --mdc-chip-border-color - The border color of the chip.\n * @cssproperty --mdc-chip-background-color - The background color of the chip.\n *\n */",
-          "customElement": true
+          ]
         }
       ],
       "exports": [
@@ -9715,8 +11960,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "InputChip",
-            "module": "components/inputchip/inputchip.component.js"
+            "name": "Link",
+            "module": "components/link/link.component.js"
           }
         }
       ]
@@ -24717,6 +26962,239 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "utils/mixins/CardComponentMixin.js",
+      "declarations": [
+        {
+          "kind": "mixin",
+          "description": "",
+          "name": "CardComponentMixin",
+          "members": [
+            {
+              "kind": "field",
+              "name": "cardTitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "attribute": "card-title"
+            },
+            {
+              "kind": "field",
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "attribute": "subtitle"
+            },
+            {
+              "kind": "field",
+              "name": "imageSrc",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "attribute": "image-src"
+            },
+            {
+              "kind": "field",
+              "name": "imageAlt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "attribute": "image-alt"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "attribute": "variant"
+            },
+            {
+              "kind": "field",
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "attribute": "orientation",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "titleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "title-tag-name"
+            },
+            {
+              "kind": "field",
+              "name": "subtitleTagName",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "attribute": "subtitle-tag-name"
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "attribute": "icon-name"
+            },
+            {
+              "kind": "method",
+              "name": "renderImage",
+              "description": "Renders the image on the card if image source is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderIcon",
+              "description": "Renders the icon on the card if icon name is provided",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "renderTitle",
+              "description": "Renders the title and subtitle on the card",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "card-title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The title of the card - part of header section",
+              "fieldName": "cardTitle"
+            },
+            {
+              "name": "subtitle",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The subtitle of the card - part of header section",
+              "fieldName": "subtitle"
+            },
+            {
+              "name": "image-src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image source URL to render on the card",
+              "fieldName": "imageSrc"
+            },
+            {
+              "name": "image-alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The image alt for accessibility support",
+              "fieldName": "imageAlt"
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "CardVariant"
+              },
+              "description": "The variant of the card. It can either be set to 'border' or 'ghost'",
+              "default": "'border'",
+              "fieldName": "variant"
+            },
+            {
+              "name": "orientation",
+              "type": {
+                "text": "CardOrientation"
+              },
+              "description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
+              "default": "'vertical'",
+              "fieldName": "orientation"
+            },
+            {
+              "name": "title-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the card title. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "titleTagName"
+            },
+            {
+              "name": "subtitle-tag-name",
+              "type": {
+                "text": "TagNameType"
+              },
+              "description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
+              "default": "'span'",
+              "fieldName": "subtitleTagName"
+            },
+            {
+              "name": "icon-name",
+              "type": {
+                "text": "IconNames | undefined"
+              },
+              "description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
+              "fieldName": "iconName"
+            }
+          ],
+          "parameters": [
+            {
+              "name": "superClass",
+              "type": {
+                "text": "T"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "CardComponentMixin",
+          "declaration": {
+            "name": "CardComponentMixin",
+            "module": "utils/mixins/CardComponentMixin.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "utils/mixins/DataAriaLabelMixin.js",