@momentum-design/components 0.119.0 → 0.120.0

package/dist/custom-elements.json

@@ -477,157 +477,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/accordiongroup/accordiongroup.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\nEach heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\nAccordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n\n- Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n\nThere are three types of variants:\n- Stacked - Each accordion will have a gap of 1.5rem (24px).\n- Borderless - Each accordion will not have any border and the group will also not have any border.\n- Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n\nThere are two types of sizes:\n- Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n- Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n\nThe variant and size will be applied to all accordions inside this accordion group.\nTo show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.",
-          "name": "AccordionGroup",
-          "cssProperties": [
-            {
-              "description": "The border color of the entire accordiongroup",
-              "name": "--mdc-accordiongroup-border-color"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The default slot can contain the `accordion` or `accordionbutton` components.",
-              "name": "default"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "Size"
-              },
-              "description": "The size of the accordion item.",
-              "default": "'small'",
-              "attribute": "size",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
-              "default": "'stacked'",
-              "attribute": "variant",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "allowMultiple",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "If true, multiple accordion items can be visible at the same time.",
-              "attribute": "allow-multiple",
-              "reflects": true
-            },
-            {
-              "kind": "method",
-              "name": "handleAccordionExpanded",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "Event"
-                  },
-                  "description": "The event object from the 'shown' event."
-                }
-              ],
-              "description": "Handles the 'shown' event for accordion items.\nIf `allowMultiple` is false, ensures that only one accordion item\nremains expanded by collapsing all other expanded items when a new item is expanded."
-            },
-            {
-              "kind": "method",
-              "name": "setChildrenAccordionAttributes",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "attributeName",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The name of the attribute to set."
-                },
-                {
-                  "name": "attributeValue",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The value to set the attribute to."
-                }
-              ],
-              "description": "Sets the given attribute on all child accordion or accordionbutton components."
-            }
-          ],
-          "attributes": [
-            {
-              "name": "size",
-              "type": {
-                "text": "Size"
-              },
-              "description": "The size of the accordion item.",
-              "default": "'small'",
-              "fieldName": "size"
-            },
-            {
-              "name": "variant",
-              "type": {
-                "text": "Variant"
-              },
-              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
-              "default": "'stacked'",
-              "fieldName": "variant"
-            },
-            {
-              "name": "allow-multiple",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "If true, multiple accordion items can be visible at the same time.",
-              "fieldName": "allowMultiple"
-            }
-          ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-accordiongroup",
-          "jsDoc": "/**\n * An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\n * Each heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\n * Accordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n *\n * - Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n *\n * There are three types of variants:\n * - Stacked - Each accordion will have a gap of 1.5rem (24px).\n * - Borderless - Each accordion will not have any border and the group will also not have any border.\n * - Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n *\n * There are two types of sizes:\n * - Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n * - Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n *\n * The variant and size will be applied to all accordions inside this accordion group.\n * To show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.\n *\n * @tagname mdc-accordiongroup\n *\n * @slot default - The default slot can contain the `accordion` or `accordionbutton` components.\n *\n * @cssproperty --mdc-accordiongroup-border-color - The border color of the entire accordiongroup\n */",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "AccordionGroup",
-            "module": "components/accordiongroup/accordiongroup.component.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/accordionbutton/accordionbutton.component.js",
@@ -970,102 +819,253 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/alertchip/alertchip.component.js",
+      "path": "components/accordiongroup/accordiongroup.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "mdc-alertchip component is an interactive chip that consumers can use to represent an alert.\n\n- It supports a leading icon along with label.\n- It supports 5 variants of alerts - neutral, warning, error, success, and informational\n\nThis component is built by extending Buttonsimple.",
-          "name": "AlertChip",
+          "description": "An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\nEach heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\nAccordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n\n- Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n\nThere are three types of variants:\n- Stacked - Each accordion will have a gap of 1.5rem (24px).\n- Borderless - Each accordion will not have any border and the group will also not have any border.\n- Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n\nThere are two types of sizes:\n- Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n- Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n\nThe variant and size will be applied to all accordions inside this accordion group.\nTo show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.",
+          "name": "AccordionGroup",
           "cssProperties": [
             {
-              "description": "The color of the label text",
-              "name": "--mdc-chip-color"
-            },
-            {
-              "description": "The color of the icon",
-              "name": "--mdc-chip-icon-color"
-            },
-            {
-              "description": "The border color of the alertchip",
-              "name": "--mdc-chip-border-color"
-            },
-            {
-              "description": "The background color of the alertchip",
-              "name": "--mdc-chip-background-color"
+              "description": "The border color of the entire accordiongroup",
+              "name": "--mdc-accordiongroup-border-color"
             }
           ],
-          "cssParts": [
-            {
-              "description": "The alert icon",
-              "name": "icon"
-            },
+          "slots": [
             {
-              "description": "The text label of the alertchip",
-              "name": "label"
+              "description": "The default slot can contain the `accordion` or `accordionbutton` components.",
+              "name": "default"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "variant",
+              "name": "size",
               "type": {
-                "text": "VariantType"
+                "text": "Size"
               },
-              "description": "The variant of the alertchip. It supports 5 variants\n- neutral\n- warning\n- error\n- success\n- informational",
-              "default": "neutral",
-              "attribute": "variant"
+              "description": "The size of the accordion item.",
+              "default": "'small'",
+              "attribute": "size",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "variant",
               "type": {
-                "text": "string"
+                "text": "Variant"
               },
-              "default": "''",
-              "description": "The visible label text of the alertchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
-              "attribute": "label"
+              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
+              "default": "'stacked'",
+              "attribute": "variant",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "autoFocusOnMount",
+              "name": "allowMultiple",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
-              "attribute": "auto-focus-on-mount",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "AutoFocusOnMountMixin",
-                "module": "utils/mixins/AutoFocusOnMountMixin.js"
-              }
+              "description": "If true, multiple accordion items can be visible at the same time.",
+              "attribute": "allow-multiple",
+              "reflects": true
             },
             {
-              "kind": "field",
-              "name": "tabIndex",
-              "type": {
-                "text": "number"
+              "kind": "method",
+              "name": "handleAccordionExpanded",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "0",
-              "description": "This property specifies the tab order of the element.",
-              "attribute": "tabIndex",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "TabIndexMixin",
-                "module": "utils/mixins/TabIndexMixin.js"
-              }
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  },
+                  "description": "The event object from the 'shown' event."
+                }
+              ],
+              "description": "Handles the 'shown' event for accordion items.\nIf `allowMultiple` is false, ensures that only one accordion item\nremains expanded by collapsing all other expanded items when a new item is expanded."
             },
             {
-              "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": {
+              "kind": "method",
+              "name": "setChildrenAccordionAttributes",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "attributeName",
+                  "type": {
+                    "text": "string"
+                  },
+                  "description": "The name of the attribute to set."
+                },
+                {
+                  "name": "attributeValue",
+                  "type": {
+                    "text": "string"
+                  },
+                  "description": "The value to set the attribute to."
+                }
+              ],
+              "description": "Sets the given attribute on all child accordion or accordionbutton components."
+            }
+          ],
+          "attributes": [
+            {
+              "name": "size",
+              "type": {
+                "text": "Size"
+              },
+              "description": "The size of the accordion item.",
+              "default": "'small'",
+              "fieldName": "size"
+            },
+            {
+              "name": "variant",
+              "type": {
+                "text": "Variant"
+              },
+              "description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
+              "default": "'stacked'",
+              "fieldName": "variant"
+            },
+            {
+              "name": "allow-multiple",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true, multiple accordion items can be visible at the same time.",
+              "fieldName": "allowMultiple"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-accordiongroup",
+          "jsDoc": "/**\n * An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\n * Each heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\n * Accordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n *\n * - Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n *\n * There are three types of variants:\n * - Stacked - Each accordion will have a gap of 1.5rem (24px).\n * - Borderless - Each accordion will not have any border and the group will also not have any border.\n * - Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n *\n * There are two types of sizes:\n * - Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n * - Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n *\n * The variant and size will be applied to all accordions inside this accordion group.\n * To show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.\n *\n * @tagname mdc-accordiongroup\n *\n * @slot default - The default slot can contain the `accordion` or `accordionbutton` components.\n *\n * @cssproperty --mdc-accordiongroup-border-color - The border color of the entire accordiongroup\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "AccordionGroup",
+            "module": "components/accordiongroup/accordiongroup.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/alertchip/alertchip.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "mdc-alertchip component is an interactive chip that consumers can use to represent an alert.\n\n- It supports a leading icon along with label.\n- It supports 5 variants of alerts - neutral, warning, error, success, and informational\n\nThis component is built by extending Buttonsimple.",
+          "name": "AlertChip",
+          "cssProperties": [
+            {
+              "description": "The color of the label text",
+              "name": "--mdc-chip-color"
+            },
+            {
+              "description": "The color of the icon",
+              "name": "--mdc-chip-icon-color"
+            },
+            {
+              "description": "The border color of the alertchip",
+              "name": "--mdc-chip-border-color"
+            },
+            {
+              "description": "The background color of the alertchip",
+              "name": "--mdc-chip-background-color"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The alert icon",
+              "name": "icon"
+            },
+            {
+              "description": "The text label of the alertchip",
+              "name": "label"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "VariantType"
+              },
+              "description": "The variant of the alertchip. It supports 5 variants\n- neutral\n- warning\n- error\n- success\n- informational",
+              "default": "neutral",
+              "attribute": "variant"
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The visible label text of the alertchip.\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": "autoFocusOnMount",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
+              "attribute": "auto-focus-on-mount",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "AutoFocusOnMountMixin",
+                "module": "utils/mixins/AutoFocusOnMountMixin.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": "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"
               }
@@ -19846,79 +19846,64 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/linkbutton/linkbutton.component.js",
+      "path": "components/linksimple/linksimple.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "`mdc-linkbutton` visually mimics a hyperlink while functioning as a button. It blends the appearance of `mdc-link` with the accessibility and interaction capabilities of `mdc-button`.\n\n### Features:\n- Looks like a link, behaves like a button.\n- Supports slots for a text label and an optional trailing icon.\n- Inherits accessibility and keyboard interaction behavior from `mdc-buttonsimple`.",
-          "name": "LinkButton",
+          "description": "`mdc-linksimple` is a lightweight link component that can be used to navigate\nwithin the application or to an external URL. It does not have any predefined default size.\n\nThe `children` of the `mdc-linksimple` component can be customized to suit\ndifferent use cases, including text, icons, or other inline content. For the child to be an icon,\nthe `mdc-icon` component should be used to render.",
+          "name": "Linksimple",
           "cssProperties": [
             {
-              "description": "Border radius of the linkbutton.",
+              "description": "Border radius of the link.",
               "name": "--mdc-link-border-radius"
             },
             {
-              "description": "Color of the linkbutton’s child content in the active state.",
+              "description": "Color of the link’s child content in the active state.",
               "name": "--mdc-link-color-active"
             },
             {
-              "description": "Color of the linkbutton’s child content in the disabled state.",
+              "description": "Color of the link’s child content in the disabled state.",
               "name": "--mdc-link-color-disabled"
             },
             {
-              "description": "Color of the linkbutton’s child content in the hover state.",
+              "description": "Color of the link’s child content in the hover state.",
               "name": "--mdc-link-color-hover"
             },
             {
-              "description": "Color of the linkbutton’s child content in the normal state.",
+              "description": "Color of the link’s child content in the normal state.",
               "name": "--mdc-link-color-normal"
             },
             {
-              "description": "Color of the inverted linkbutton’s child content in the active state.",
+              "description": "Color of the inverted link’s child content in the active state.",
               "name": "--mdc-link-inverted-color-active"
             },
             {
-              "description": "Color of the inverted linkbutton’s child content in the disabled state.",
+              "description": "Color of the inverted link’s child content in the disabled state.",
               "name": "--mdc-link-inverted-color-disabled"
             },
             {
-              "description": "Color of the inverted linkbutton’s child content in the hover state.",
+              "description": "Color of the inverted link’s child content in the hover state.",
               "name": "--mdc-link-inverted-color-hover"
             },
             {
-              "description": "Color of the inverted linkbutton’s child content in the normal state.",
+              "description": "Color of the inverted link’s child content in the normal state.",
               "name": "--mdc-link-inverted-color-normal"
             }
           ],
-          "slots": [
+          "cssParts": [
             {
-              "description": "Text label of the linkbutton.",
-              "name": ""
+              "description": "The anchor element that wraps the linksimple content.",
+              "name": "anchor"
             }
           ],
           "members": [
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "ButtonSize"
-              },
-              "description": "Sets the size of the linkbutton.\nAcceptable values: \n- 12\n- 14\n- 16",
-              "default": "16",
-              "attribute": "size",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "components/buttonsimple/buttonsimple.component.js"
-              }
-            },
             {
               "kind": "field",
               "name": "inline",
               "type": {
                 "text": "boolean"
               },
-              "description": "The linkbutton can be inline or standalone.",
+              "description": "The link can be inline or standalone.",
               "default": "false",
               "attribute": "inline",
               "reflects": true
@@ -19929,392 +19914,185 @@
               "type": {
                 "text": "boolean"
               },
-              "description": "The linkbutton color can be inverted by setting the inverted attribute to true.",
+              "description": "The link color can be inverted by setting the inverted attribute to true.",
               "default": "false",
               "attribute": "inverted",
               "reflects": true
             },
-            {
-              "kind": "method",
-              "name": "setSize",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "size",
-                  "type": {
-                    "text": "LinkButtonSize"
-                  },
-                  "description": "The desired link size."
-                }
-              ],
-              "description": "Sets the `size` attribute for the linkbutton, falling back to the default if the value is invalid."
-            },
             {
               "kind": "field",
-              "name": "iconName",
+              "name": "href",
               "type": {
-                "text": "IconNames | undefined"
+                "text": "string | 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"
-              }
+              "description": "Href for navigation. The URL that the hyperlink points to",
+              "attribute": "href",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "autoFocusOnMount",
+              "name": "target",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
-              "attribute": "auto-focus-on-mount",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "components/buttonsimple/buttonsimple.component.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"
-              }
+              "default": "'_self'",
+              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
+              "attribute": "target",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "active",
+              "name": "rel",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string | 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"
-              }
+              "description": "Optional rel attribute that defines the relationship of the linked URL as space-separated link types.",
+              "attribute": "rel",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "softDisabled",
+              "name": "download",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string | 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"
-              }
+              "description": "Optional download attribute to instruct browsers to download the linked resource.",
+              "attribute": "download",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "role",
+              "name": "ping",
               "type": {
-                "text": "RoleType"
+                "text": "string | undefined"
               },
-              "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"
-              }
+              "description": "Optional ping attribute that defines a space-separated list of URLs to be notified if the link is followed.",
+              "attribute": "ping",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "ariaStateKey",
+              "name": "hreflang",
               "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"
-              }
+              "description": "Optional hreflang attribute specifying the language of the linked resource.",
+              "attribute": "hreflang",
+              "reflects": true
             },
             {
               "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": "field",
-              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "The name of the button, submitted as a pair with the button's value as part of the form data,\nwhen that button is used to submit the form.",
-              "attribute": "name",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "components/buttonsimple/buttonsimple.component.js"
-              }
+              "description": "Optional type attribute indicating the MIME type of the linked resource.",
+              "attribute": "type",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "value",
+              "name": "referrerpolicy",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "Defines the value associated with the button's name when it's submitted with the form data.\nThis value is passed to the server in params when the form is submitted using this button.",
-              "attribute": "value",
-              "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"
-              }
+              "description": "Optional referrerpolicy attribute specifying how much referrer information to send.",
+              "attribute": "referrerpolicy",
+              "reflects": true
             },
             {
               "kind": "method",
-              "name": "setActive",
+              "name": "handleNavigation",
               "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"
+              "return": {
+                "type": {
+                  "text": "void"
                 }
-              ],
-              "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,
+                  "name": "e",
                   "type": {
-                    "text": "boolean"
-                  },
-                  "description": "The soft-disabled state."
+                    "text": "MouseEvent | KeyboardEvent"
+                  }
                 }
-              ],
-              "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": "Whether the element should be disabled"
                 }
               ],
-              "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"
-              }
+              "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."
             },
             {
-              "kind": "method",
-              "name": "triggerClickEvent",
-              "privacy": "private",
+              "kind": "field",
+              "name": "dataAriaLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
+              "attribute": "data-aria-label",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "components/buttonsimple/buttonsimple.component.js"
+                "name": "DataAriaLabelMixin",
+                "module": "utils/mixins/DataAriaLabelMixin.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.",
+              "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"
+                "name": "DisabledMixin",
+                "module": "utils/mixins/DisabledMixin.js"
               }
+            }
+          ],
+          "events": [
+            {
+              "description": "(React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.",
+              "name": "click",
+              "reactName": "onClick"
             },
             {
-              "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) This event is dispatched when the linkbutton 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 linkbutton.",
+              "description": "(React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.",
               "name": "keydown",
-              "reactName": "onKeyDown",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
+              "reactName": "onKeyDown"
             },
             {
-              "description": "(React: onKeyUp) This event is dispatched when a key is released on the linkbutton.",
-              "name": "keyup",
-              "reactName": "onKeyUp",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
+              "description": "(React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.",
+              "name": "focus",
+              "reactName": "onFocus"
             },
             {
-              "description": "(React: onFocus) This event is dispatched when the linkbutton receives focus.",
-              "name": "focus",
-              "reactName": "onFocus",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
+              "description": "(React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.",
+              "name": "blur",
+              "reactName": "onBlur"
             }
           ],
           "attributes": [
-            {
-              "name": "size",
-              "type": {
-                "text": "ButtonSize"
-              },
-              "description": "Sets the size of the linkbutton.\nAcceptable values: \n- 12\n- 14\n- 16",
-              "default": "16",
-              "fieldName": "size",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
-            },
             {
               "name": "inline",
               "type": {
                 "text": "boolean"
               },
-              "description": "The linkbutton can be inline or standalone.",
+              "description": "The link can be inline or standalone.",
               "default": "false",
               "fieldName": "inline"
             },
@@ -20323,163 +20101,118 @@
               "type": {
                 "text": "boolean"
               },
-              "description": "The linkbutton color can be inverted by setting the inverted attribute to true.",
+              "description": "The link color can be inverted by setting the inverted attribute to true.",
               "default": "false",
               "fieldName": "inverted"
             },
             {
-              "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": "IconNameMixin",
-                "module": "src/utils/mixins/IconNameMixin.ts"
-              }
-            },
-            {
-              "name": "auto-focus-on-mount",
+              "name": "href",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
-              "fieldName": "autoFocusOnMount",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
+              "description": "Href for navigation. The URL that the hyperlink points to",
+              "fieldName": "href"
             },
             {
-              "name": "tabIndex",
+              "name": "target",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "default": "0",
-              "description": "This property specifies the tab order of the element.",
-              "fieldName": "tabIndex",
-              "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
-              }
+              "default": "'_self'",
+              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
+              "fieldName": "target"
             },
             {
-              "name": "disabled",
+              "name": "rel",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string | 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"
-              }
+              "description": "Optional rel attribute that defines the relationship of the linked URL as space-separated link types.",
+              "fieldName": "rel"
             },
             {
-              "name": "active",
+              "name": "download",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string | 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"
-              }
+              "description": "Optional download attribute to instruct browsers to download the linked resource.",
+              "fieldName": "download"
             },
             {
-              "name": "soft-disabled",
+              "name": "ping",
               "type": {
-                "text": "boolean | undefined"
+                "text": "string | 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"
-              }
+              "description": "Optional ping attribute that defines a space-separated list of URLs to be notified if the link is followed.",
+              "fieldName": "ping"
             },
             {
-              "name": "role",
+              "name": "hreflang",
               "type": {
-                "text": "RoleType"
+                "text": "string | undefined"
               },
-              "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"
-              }
+              "description": "Optional hreflang attribute specifying the language of the linked resource.",
+              "fieldName": "hreflang"
             },
             {
-              "name": "ariaStateKey",
+              "name": "type",
               "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"
-              }
+              "description": "Optional type attribute indicating the MIME type of the linked resource.",
+              "fieldName": "type"
             },
             {
-              "name": "type",
+              "name": "referrerpolicy",
               "type": {
-                "text": "ButtonType"
+                "text": "string | undefined"
               },
-              "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"
-              }
+              "description": "Optional referrerpolicy attribute specifying how much referrer information to send.",
+              "fieldName": "referrerpolicy"
             },
             {
-              "name": "name",
+              "name": "data-aria-label",
               "type": {
-                "text": "string | undefined"
+                "text": "string | null"
               },
-              "description": "The name of the button, submitted as a pair with the button's value as part of the form data,\nwhen that button is used to submit the form.",
-              "fieldName": "name",
+              "default": "null",
+              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
+              "fieldName": "dataAriaLabel",
               "inheritedFrom": {
-                "name": "Buttonsimple",
-                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+                "name": "DataAriaLabelMixin",
+                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
               }
             },
             {
-              "name": "value",
+              "name": "disabled",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean | undefined"
               },
-              "description": "Defines the value associated with the button's name when it's submitted with the form data.\nThis value is passed to the server in params when the form is submitted using this button.",
-              "fieldName": "value",
+              "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": "DisabledMixin",
+                "module": "src/utils/mixins/DisabledMixin.ts"
               }
             }
           ],
           "mixins": [
             {
-              "name": "IconNameMixin",
-              "module": "/src/utils/mixins/IconNameMixin"
+              "name": "DataAriaLabelMixin",
+              "module": "/src/utils/mixins/DataAriaLabelMixin"
+            },
+            {
+              "name": "DisabledMixin",
+              "module": "/src/utils/mixins/DisabledMixin"
             }
           ],
           "superclass": {
-            "name": "Buttonsimple",
-            "module": "/src/components/buttonsimple/buttonsimple.component"
+            "name": "Component",
+            "module": "/src/models"
           },
-          "tagName": "mdc-linkbutton",
-          "jsDoc": "/**\n * `mdc-linkbutton` visually mimics a hyperlink while functioning as a button. It blends the appearance of `mdc-link` with the accessibility and interaction capabilities of `mdc-button`.\n *\n * ### Features:\n * - Looks like a link, behaves like a button.\n * - Supports slots for a text label and an optional trailing icon.\n * - Inherits accessibility and keyboard interaction behavior from `mdc-buttonsimple`.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-linkbutton\n *\n * @slot - Text label of the linkbutton.\n *\n * @event click - (React: onClick) This event is dispatched when the linkbutton is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the linkbutton.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the linkbutton.\n * @event focus - (React: onFocus) This event is dispatched when the linkbutton receives focus.\n *\n * @cssproperty --mdc-link-border-radius - Border radius of the linkbutton.\n * @cssproperty --mdc-link-color-active - Color of the linkbutton’s child content in the active state.\n * @cssproperty --mdc-link-color-disabled - Color of the linkbutton’s child content in the disabled state.\n * @cssproperty --mdc-link-color-hover - Color of the linkbutton’s child content in the hover state.\n * @cssproperty --mdc-link-color-normal - Color of the linkbutton’s child content in the normal state.\n * @cssproperty --mdc-link-inverted-color-active - Color of the inverted linkbutton’s child content in the active state.\n * @cssproperty --mdc-link-inverted-color-disabled - Color of the inverted linkbutton’s child content in the disabled state.\n * @cssproperty --mdc-link-inverted-color-hover - Color of the inverted linkbutton’s child content in the hover state.\n * @cssproperty --mdc-link-inverted-color-normal - Color of the inverted linkbutton’s child content in the normal state.\n */",
+          "tagName": "mdc-linksimple",
+          "jsDoc": "/**\n * `mdc-linksimple` is a lightweight link component that can be used to navigate\n * within the application or to an external URL. It does not have any predefined default size.\n *\n * The `children` of the `mdc-linksimple` component can be customized to suit\n * different use cases, including text, icons, or other inline content. For the child to be an icon,\n * the `mdc-icon` component should be used to render.\n *\n * @tagname mdc-linksimple\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 * @cssproperty --mdc-link-border-radius - Border radius of the link.\n * @cssproperty --mdc-link-color-active - Color of the link’s child content in the active state.\n * @cssproperty --mdc-link-color-disabled - Color of the link’s child content in the disabled state.\n * @cssproperty --mdc-link-color-hover - Color of the link’s child content in the hover state.\n * @cssproperty --mdc-link-color-normal - Color of the link’s child content in the normal state.\n * @cssproperty --mdc-link-inverted-color-active - Color of the inverted link’s child content in the active state.\n * @cssproperty --mdc-link-inverted-color-disabled - Color of the inverted link’s child content in the disabled state.\n * @cssproperty --mdc-link-inverted-color-hover - Color of the inverted link’s child content in the hover state.\n * @cssproperty --mdc-link-inverted-color-normal - Color of the inverted link’s child content in the normal state.\n *\n * @csspart anchor - The anchor element that wraps the linksimple content.\n */",
           "customElement": true
         }
       ],
@@ -20488,606 +20221,873 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "LinkButton",
-            "module": "components/linkbutton/linkbutton.component.js"
+            "name": "Linksimple",
+            "module": "components/linksimple/linksimple.component.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/linksimple/linksimple.component.js",
+      "path": "components/list/list.component.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "`mdc-linksimple` is a lightweight link component that can be used to navigate\nwithin the application or to an external URL. It does not have any predefined default size.\n\nThe `children` of the `mdc-linksimple` component can be customized to suit\ndifferent use cases, including text, icons, or other inline content. For the child to be an icon,\nthe `mdc-icon` component should be used to render.",
-          "name": "Linksimple",
-          "cssProperties": [
-            {
-              "description": "Border radius of the link.",
-              "name": "--mdc-link-border-radius"
-            },
-            {
-              "description": "Color of the link’s child content in the active state.",
-              "name": "--mdc-link-color-active"
-            },
-            {
-              "description": "Color of the link’s child content in the disabled state.",
-              "name": "--mdc-link-color-disabled"
-            },
-            {
-              "description": "Color of the link’s child content in the hover state.",
-              "name": "--mdc-link-color-hover"
-            },
-            {
-              "description": "Color of the link’s child content in the normal state.",
-              "name": "--mdc-link-color-normal"
-            },
-            {
-              "description": "Color of the inverted link’s child content in the active state.",
-              "name": "--mdc-link-inverted-color-active"
-            },
-            {
-              "description": "Color of the inverted link’s child content in the disabled state.",
-              "name": "--mdc-link-inverted-color-disabled"
-            },
-            {
-              "description": "Color of the inverted link’s child content in the hover state.",
-              "name": "--mdc-link-inverted-color-hover"
-            },
-            {
-              "description": "Color of the inverted link’s child content in the normal state.",
-              "name": "--mdc-link-inverted-color-normal"
-            }
-          ],
+          "description": "mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n\nTo add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n`mdc-listitem` components can be placed in the default slot.",
+          "name": "List",
           "cssParts": [
             {
-              "description": "The anchor element that wraps the linksimple content.",
-              "name": "anchor"
+              "description": "The container slot around the list items",
+              "name": "container"
             }
           ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "inline",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The link can be inline or standalone.",
-              "default": "false",
-              "attribute": "inline",
-              "reflects": true
-            },
-            {
-              "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
-            },
-            {
-              "kind": "field",
-              "name": "href",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Href for navigation. The URL that the hyperlink points to",
-              "attribute": "href",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "target",
-              "type": {
-                "text": "string"
-              },
-              "default": "'_self'",
-              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
-              "attribute": "target",
-              "reflects": true
-            },
-            {
-              "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.",
-              "attribute": "rel",
-              "reflects": true
-            },
+          "slots": [
             {
-              "kind": "field",
-              "name": "download",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Optional download attribute to instruct browsers to download the linked resource.",
-              "attribute": "download",
-              "reflects": true
+              "description": "This is a default/unnamed slot, where listitems can be placed.",
+              "name": "default"
             },
             {
-              "kind": "field",
-              "name": "ping",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Optional ping attribute that defines a space-separated list of URLs to be notified if the link is followed.",
-              "attribute": "ping",
-              "reflects": true
-            },
+              "description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
+              "name": "list-header"
+            }
+          ],
+          "members": [
             {
               "kind": "field",
-              "name": "hreflang",
+              "name": "loop",
               "type": {
-                "text": "string | undefined"
+                "text": "'true' | 'false'"
               },
-              "description": "Optional hreflang attribute specifying the language of the linked resource.",
-              "attribute": "hreflang",
+              "privacy": "public",
+              "description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
+              "default": "''",
+              "attribute": "loop",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "type",
+              "name": "initialFocus",
               "type": {
-                "text": "string | undefined"
+                "text": "number"
               },
-              "description": "Optional type attribute indicating the MIME type of the linked resource.",
-              "attribute": "type",
+              "privacy": "public",
+              "description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
+              "default": "0",
+              "attribute": "initial-focus",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "referrerpolicy",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Optional referrerpolicy attribute specifying how much referrer information to send.",
-              "attribute": "referrerpolicy",
-              "reflects": true
+              "name": "itemsStore",
+              "default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
             },
             {
               "kind": "method",
-              "name": "handleNavigation",
-              "privacy": "protected",
+              "name": "getCurrentIndex",
+              "privacy": "private",
               "return": {
                 "type": {
-                  "text": "void"
+                  "text": ""
                 }
               },
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "target",
                   "type": {
-                    "text": "MouseEvent | KeyboardEvent"
-                  }
+                    "text": "EventTarget | null"
+                  },
+                  "description": "The target element that triggered the event."
                 }
-              ]
+              ],
+              "description": "Retrieves the current index of the item that triggered the event.",
+              "inheritedFrom": {
+                "name": "ListNavigationMixin",
+                "module": "utils/mixins/ListNavigationMixin.js"
+              }
             },
             {
               "kind": "method",
-              "name": "setDisabled",
-              "privacy": "private",
+              "name": "resetTabIndexes",
+              "privacy": "protected",
               "parameters": [
                 {
-                  "name": "disabled",
+                  "name": "index",
                   "type": {
-                    "text": "boolean"
+                    "text": "number"
                   },
-                  "description": "Whether the element should be disabled"
+                  "description": "The index of the currently focused item."
                 }
               ],
-              "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."
-            },
-            {
-              "kind": "field",
-              "name": "dataAriaLabel",
-              "type": {
-                "text": "string | null"
-              },
-              "default": "null",
-              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
-              "attribute": "data-aria-label",
-              "reflects": true,
+              "description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
               "inheritedFrom": {
-                "name": "DataAriaLabelMixin",
-                "module": "utils/mixins/DataAriaLabelMixin.js"
+                "name": "ListNavigationMixin",
+                "module": "utils/mixins/ListNavigationMixin.js"
               }
             },
             {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
+              "kind": "method",
+              "name": "resetTabIndexAndSetFocus",
+              "privacy": "protected",
+              "parameters": [
+                {
+                  "name": "newIndex",
+                  "type": {
+                    "text": "number"
+                  },
+                  "description": "The index of the new item to focus."
+                },
+                {
+                  "name": "oldIndex",
+                  "optional": true,
+                  "type": {
+                    "text": "number"
+                  },
+                  "description": "The index of the currently focused item."
+                },
+                {
+                  "name": "focusNewItem",
+                  "default": "true",
+                  "description": "Call focus() on the new item or not. It should be false during firstUpdate"
+                }
+              ],
+              "description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
               },
-              "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"
+                "name": "ListNavigationMixin",
+                "module": "utils/mixins/ListNavigationMixin.js"
               }
-            }
-          ],
-          "events": [
-            {
-              "description": "(React: onClick) Fired when the user activates the buttonLink using a mouse or assistive technology.",
-              "name": "click",
-              "reactName": "onClick"
-            },
-            {
-              "description": "(React: onKeyDown) Fired when the user presses a key while the buttonLink has focus.",
-              "name": "keydown",
-              "reactName": "onKeyDown"
             },
             {
-              "description": "(React: onFocus) Fired when the buttonLink receives keyboard or mouse focus.",
-              "name": "focus",
-              "reactName": "onFocus"
+              "kind": "method",
+              "name": "resolveDirectionKey",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "key",
+                  "type": {
+                    "text": "string"
+                  },
+                  "description": "The key pressed by the user."
+                },
+                {
+                  "name": "isRtl",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "A boolean indicating if the layout is right-to-left (RTL)."
+                }
+              ],
+              "description": "Resolves the key pressed by the user based on the direction of the layout.\nThis method is used to handle keyboard navigation in a right-to-left (RTL) layout.\nIt checks if the layout is RTL and adjusts the arrow keys accordingly.\nFor example, in RTL, the left arrow key behaves like the right arrow key and vice versa.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "inheritedFrom": {
+                "name": "ListNavigationMixin",
+                "module": "utils/mixins/ListNavigationMixin.js"
+              }
             },
             {
-              "description": "(React: onBlur) Fired when the buttonLink loses keyboard or mouse focus.",
-              "name": "blur",
-              "reactName": "onBlur"
+              "kind": "method",
+              "name": "shouldLoop",
+              "privacy": "private",
+              "inheritedFrom": {
+                "name": "ListNavigationMixin",
+                "module": "utils/mixins/ListNavigationMixin.js"
+              }
             }
           ],
           "attributes": [
             {
-              "name": "inline",
+              "name": "loop",
               "type": {
-                "text": "boolean"
+                "text": "'true' | 'false'"
               },
-              "description": "The link can be inline or standalone.",
-              "default": "false",
-              "fieldName": "inline"
+              "description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
+              "default": "''",
+              "fieldName": "loop"
             },
             {
-              "name": "inverted",
+              "name": "initial-focus",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "description": "The link color can be inverted by setting the inverted attribute to true.",
-              "default": "false",
-              "fieldName": "inverted"
+              "description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
+              "default": "0",
+              "fieldName": "initialFocus"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "ListNavigationMixin",
+              "module": "/src/utils/mixins/ListNavigationMixin"
             },
             {
-              "name": "href",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Href for navigation. The URL that the hyperlink points to",
-              "fieldName": "href"
+              "name": "CaptureDestroyEventForChildElement",
+              "module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
+            }
+          ],
+          "superclass": {
+            "name": "Component",
+            "module": "/src/models"
+          },
+          "tagName": "mdc-list",
+          "jsDoc": "/**\n * mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n *\n * To add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n * `mdc-listitem` components can be placed in the default slot.\n *\n * @tagname mdc-list\n *\n * @slot default - This is a default/unnamed slot, where listitems can be placed.\n * @slot list-header - This slot is used to pass a header for the list, which can be a `mdc-listheader` component.\n *\n * @csspart container - The container slot around the list items\n */",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "List",
+            "module": "components/list/list.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/linkbutton/linkbutton.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`mdc-linkbutton` visually mimics a hyperlink while functioning as a button. It blends the appearance of `mdc-link` with the accessibility and interaction capabilities of `mdc-button`.\n\n### Features:\n- Looks like a link, behaves like a button.\n- Supports slots for a text label and an optional trailing icon.\n- Inherits accessibility and keyboard interaction behavior from `mdc-buttonsimple`.",
+          "name": "LinkButton",
+          "cssProperties": [
+            {
+              "description": "Border radius of the linkbutton.",
+              "name": "--mdc-link-border-radius"
             },
             {
-              "name": "target",
-              "type": {
-                "text": "string"
-              },
-              "default": "'_self'",
-              "description": "Optional target: _blank, _self, _parent, _top and _unfencedTop",
-              "fieldName": "target"
+              "description": "Color of the linkbutton’s child content in the active state.",
+              "name": "--mdc-link-color-active"
             },
             {
-              "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"
+              "description": "Color of the linkbutton’s child content in the disabled state.",
+              "name": "--mdc-link-color-disabled"
             },
             {
-              "name": "download",
+              "description": "Color of the linkbutton’s child content in the hover state.",
+              "name": "--mdc-link-color-hover"
+            },
+            {
+              "description": "Color of the linkbutton’s child content in the normal state.",
+              "name": "--mdc-link-color-normal"
+            },
+            {
+              "description": "Color of the inverted linkbutton’s child content in the active state.",
+              "name": "--mdc-link-inverted-color-active"
+            },
+            {
+              "description": "Color of the inverted linkbutton’s child content in the disabled state.",
+              "name": "--mdc-link-inverted-color-disabled"
+            },
+            {
+              "description": "Color of the inverted linkbutton’s child content in the hover state.",
+              "name": "--mdc-link-inverted-color-hover"
+            },
+            {
+              "description": "Color of the inverted linkbutton’s child content in the normal state.",
+              "name": "--mdc-link-inverted-color-normal"
+            }
+          ],
+          "slots": [
+            {
+              "description": "Text label of the linkbutton.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "size",
               "type": {
-                "text": "string | undefined"
+                "text": "ButtonSize"
               },
-              "description": "Optional download attribute to instruct browsers to download the linked resource.",
-              "fieldName": "download"
+              "description": "Sets the size of the linkbutton.\nAcceptable values: \n- 12\n- 14\n- 16",
+              "default": "16",
+              "attribute": "size",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
             },
             {
-              "name": "ping",
+              "kind": "field",
+              "name": "inline",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "Optional ping attribute that defines a space-separated list of URLs to be notified if the link is followed.",
-              "fieldName": "ping"
+              "description": "The linkbutton can be inline or standalone.",
+              "default": "false",
+              "attribute": "inline",
+              "reflects": true
             },
             {
-              "name": "hreflang",
+              "kind": "field",
+              "name": "inverted",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "Optional hreflang attribute specifying the language of the linked resource.",
-              "fieldName": "hreflang"
+              "description": "The linkbutton color can be inverted by setting the inverted attribute to true.",
+              "default": "false",
+              "attribute": "inverted",
+              "reflects": true
             },
             {
-              "name": "type",
+              "kind": "method",
+              "name": "setSize",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "size",
+                  "type": {
+                    "text": "LinkButtonSize"
+                  },
+                  "description": "The desired link size."
+                }
+              ],
+              "description": "Sets the `size` attribute for the linkbutton, falling back to the default if the value is invalid."
+            },
+            {
+              "kind": "field",
+              "name": "iconName",
               "type": {
-                "text": "string | undefined"
+                "text": "IconNames | undefined"
               },
-              "description": "Optional type attribute indicating the MIME type of the linked resource.",
-              "fieldName": "type"
+              "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"
+              }
             },
             {
-              "name": "referrerpolicy",
+              "kind": "field",
+              "name": "autoFocusOnMount",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "Optional referrerpolicy attribute specifying how much referrer information to send.",
-              "fieldName": "referrerpolicy"
+              "default": "false",
+              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
+              "attribute": "auto-focus-on-mount",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
             },
             {
-              "name": "data-aria-label",
+              "kind": "field",
+              "name": "tabIndex",
               "type": {
-                "text": "string | null"
+                "text": "number"
               },
-              "default": "null",
-              "description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
-              "fieldName": "dataAriaLabel",
+              "default": "0",
+              "description": "This property specifies the tab order of the element.",
+              "attribute": "tabIndex",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "DataAriaLabelMixin",
-                "module": "src/utils/mixins/DataAriaLabelMixin.ts"
+                "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",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "DisabledMixin",
-                "module": "src/utils/mixins/DisabledMixin.ts"
+              "attribute": "disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
               }
-            }
-          ],
-          "mixins": [
+            },
             {
-              "name": "DataAriaLabelMixin",
-              "module": "/src/utils/mixins/DataAriaLabelMixin"
+              "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"
+              }
             },
             {
-              "name": "DisabledMixin",
-              "module": "/src/utils/mixins/DisabledMixin"
+              "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": "role",
+              "type": {
+                "text": "RoleType"
+              },
+              "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": "field",
+              "name": "name",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The name of the button, submitted as a pair with the button's value as part of the form data,\nwhen that button is used to submit the form.",
+              "attribute": "name",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "components/buttonsimple/buttonsimple.component.js"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the value associated with the button's name when it's submitted with the form data.\nThis value is passed to the server in params when the form is submitted using this button.",
+              "attribute": "value",
+              "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"
+              }
             }
           ],
-          "superclass": {
-            "name": "Component",
-            "module": "/src/models"
-          },
-          "tagName": "mdc-linksimple",
-          "jsDoc": "/**\n * `mdc-linksimple` is a lightweight link component that can be used to navigate\n * within the application or to an external URL. It does not have any predefined default size.\n *\n * The `children` of the `mdc-linksimple` component can be customized to suit\n * different use cases, including text, icons, or other inline content. For the child to be an icon,\n * the `mdc-icon` component should be used to render.\n *\n * @tagname mdc-linksimple\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 * @cssproperty --mdc-link-border-radius - Border radius of the link.\n * @cssproperty --mdc-link-color-active - Color of the link’s child content in the active state.\n * @cssproperty --mdc-link-color-disabled - Color of the link’s child content in the disabled state.\n * @cssproperty --mdc-link-color-hover - Color of the link’s child content in the hover state.\n * @cssproperty --mdc-link-color-normal - Color of the link’s child content in the normal state.\n * @cssproperty --mdc-link-inverted-color-active - Color of the inverted link’s child content in the active state.\n * @cssproperty --mdc-link-inverted-color-disabled - Color of the inverted link’s child content in the disabled state.\n * @cssproperty --mdc-link-inverted-color-hover - Color of the inverted link’s child content in the hover state.\n * @cssproperty --mdc-link-inverted-color-normal - Color of the inverted link’s child content in the normal state.\n *\n * @csspart anchor - The anchor element that wraps the linksimple content.\n */",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "Linksimple",
-            "module": "components/linksimple/linksimple.component.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/list/list.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n\nTo add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n`mdc-listitem` components can be placed in the default slot.",
-          "name": "List",
-          "cssParts": [
+          "events": [
             {
-              "description": "The container slot around the list items",
-              "name": "container"
+              "description": "(React: onClick) This event is dispatched when the linkbutton 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 linkbutton.",
+              "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 linkbutton.",
+              "name": "keyup",
+              "reactName": "onKeyUp",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "description": "(React: onFocus) This event is dispatched when the linkbutton receives focus.",
+              "name": "focus",
+              "reactName": "onFocus",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
             }
           ],
-          "slots": [
+          "attributes": [
             {
-              "description": "This is a default/unnamed slot, where listitems can be placed.",
-              "name": "default"
+              "name": "size",
+              "type": {
+                "text": "ButtonSize"
+              },
+              "description": "Sets the size of the linkbutton.\nAcceptable values: \n- 12\n- 14\n- 16",
+              "default": "16",
+              "fieldName": "size",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
+            },
+            {
+              "name": "inline",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The linkbutton can be inline or standalone.",
+              "default": "false",
+              "fieldName": "inline"
+            },
+            {
+              "name": "inverted",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The linkbutton color can be inverted by setting the inverted attribute to true.",
+              "default": "false",
+              "fieldName": "inverted"
             },
             {
-              "description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
-              "name": "list-header"
-            }
-          ],
-          "members": [
+              "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": "IconNameMixin",
+                "module": "src/utils/mixins/IconNameMixin.ts"
+              }
+            },
             {
-              "kind": "field",
-              "name": "loop",
+              "name": "auto-focus-on-mount",
               "type": {
-                "text": "'true' | 'false'"
+                "text": "boolean"
               },
-              "privacy": "public",
-              "description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
-              "default": "''",
-              "attribute": "loop",
-              "reflects": true
+              "default": "false",
+              "description": "This property indicates whether the element should receive focus automatically when it is mounted.\n\nIt will not focus if the element is re-attached to the DOM after being removed.",
+              "fieldName": "autoFocusOnMount",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
             },
             {
-              "kind": "field",
-              "name": "initialFocus",
+              "name": "tabIndex",
               "type": {
                 "text": "number"
               },
-              "privacy": "public",
-              "description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
               "default": "0",
-              "attribute": "initial-focus",
-              "reflects": true
+              "description": "This property specifies the tab order of the element.",
+              "fieldName": "tabIndex",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
             },
             {
-              "kind": "field",
-              "name": "itemsStore",
-              "default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
+              "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"
+              }
             },
             {
-              "kind": "method",
-              "name": "getCurrentIndex",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
+              "name": "active",
+              "type": {
+                "text": "boolean | undefined"
               },
-              "parameters": [
-                {
-                  "name": "target",
-                  "type": {
-                    "text": "EventTarget | null"
-                  },
-                  "description": "The target element that triggered the event."
-                }
-              ],
-              "description": "Retrieves the current index of the item that triggered the event.",
+              "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": "ListNavigationMixin",
-                "module": "utils/mixins/ListNavigationMixin.js"
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
               }
             },
             {
-              "kind": "method",
-              "name": "resetTabIndexes",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "index",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the currently focused item."
-                }
-              ],
-              "description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
+              "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": "ListNavigationMixin",
-                "module": "utils/mixins/ListNavigationMixin.js"
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
               }
             },
             {
-              "kind": "method",
-              "name": "resetTabIndexAndSetFocus",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "newIndex",
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the new item to focus."
-                },
-                {
-                  "name": "oldIndex",
-                  "optional": true,
-                  "type": {
-                    "text": "number"
-                  },
-                  "description": "The index of the currently focused item."
-                },
-                {
-                  "name": "focusNewItem",
-                  "default": "true",
-                  "description": "Call focus() on the new item or not. It should be false during firstUpdate"
-                }
-              ],
-              "description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
+              "name": "role",
+              "type": {
+                "text": "RoleType"
               },
+              "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": "ListNavigationMixin",
-                "module": "utils/mixins/ListNavigationMixin.js"
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
               }
             },
             {
-              "kind": "method",
-              "name": "resolveDirectionKey",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "key",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The key pressed by the user."
-                },
-                {
-                  "name": "isRtl",
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "A boolean indicating if the layout is right-to-left (RTL)."
-                }
-              ],
-              "description": "Resolves the key pressed by the user based on the direction of the layout.\nThis method is used to handle keyboard navigation in a right-to-left (RTL) layout.\nIt checks if the layout is RTL and adjusts the arrow keys accordingly.\nFor example, in RTL, the left arrow key behaves like the right arrow key and vice versa.",
-              "return": {
-                "type": {
-                  "text": ""
-                }
+              "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": "ListNavigationMixin",
-                "module": "utils/mixins/ListNavigationMixin.js"
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
               }
             },
             {
-              "kind": "method",
-              "name": "shouldLoop",
-              "privacy": "private",
+              "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": "ListNavigationMixin",
-                "module": "utils/mixins/ListNavigationMixin.js"
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
               }
-            }
-          ],
-          "attributes": [
+            },
             {
-              "name": "loop",
+              "name": "name",
               "type": {
-                "text": "'true' | 'false'"
+                "text": "string | undefined"
               },
-              "description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
-              "default": "''",
-              "fieldName": "loop"
+              "description": "The name of the button, submitted as a pair with the button's value as part of the form data,\nwhen that button is used to submit the form.",
+              "fieldName": "name",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
             },
             {
-              "name": "initial-focus",
+              "name": "value",
               "type": {
-                "text": "number"
+                "text": "string | undefined"
               },
-              "description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
-              "default": "0",
-              "fieldName": "initialFocus"
+              "description": "Defines the value associated with the button's name when it's submitted with the form data.\nThis value is passed to the server in params when the form is submitted using this button.",
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "Buttonsimple",
+                "module": "src/components/buttonsimple/buttonsimple.component.ts"
+              }
             }
           ],
           "mixins": [
             {
-              "name": "ListNavigationMixin",
-              "module": "/src/utils/mixins/ListNavigationMixin"
-            },
-            {
-              "name": "CaptureDestroyEventForChildElement",
-              "module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
+              "name": "IconNameMixin",
+              "module": "/src/utils/mixins/IconNameMixin"
             }
           ],
           "superclass": {
-            "name": "Component",
-            "module": "/src/models"
+            "name": "Buttonsimple",
+            "module": "/src/components/buttonsimple/buttonsimple.component"
           },
-          "tagName": "mdc-list",
-          "jsDoc": "/**\n * mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n *\n * To add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n * `mdc-listitem` components can be placed in the default slot.\n *\n * @tagname mdc-list\n *\n * @slot default - This is a default/unnamed slot, where listitems can be placed.\n * @slot list-header - This slot is used to pass a header for the list, which can be a `mdc-listheader` component.\n *\n * @csspart container - The container slot around the list items\n */",
+          "tagName": "mdc-linkbutton",
+          "jsDoc": "/**\n * `mdc-linkbutton` visually mimics a hyperlink while functioning as a button. It blends the appearance of `mdc-link` with the accessibility and interaction capabilities of `mdc-button`.\n *\n * ### Features:\n * - Looks like a link, behaves like a button.\n * - Supports slots for a text label and an optional trailing icon.\n * - Inherits accessibility and keyboard interaction behavior from `mdc-buttonsimple`.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-linkbutton\n *\n * @slot - Text label of the linkbutton.\n *\n * @event click - (React: onClick) This event is dispatched when the linkbutton is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the linkbutton.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the linkbutton.\n * @event focus - (React: onFocus) This event is dispatched when the linkbutton receives focus.\n *\n * @cssproperty --mdc-link-border-radius - Border radius of the linkbutton.\n * @cssproperty --mdc-link-color-active - Color of the linkbutton’s child content in the active state.\n * @cssproperty --mdc-link-color-disabled - Color of the linkbutton’s child content in the disabled state.\n * @cssproperty --mdc-link-color-hover - Color of the linkbutton’s child content in the hover state.\n * @cssproperty --mdc-link-color-normal - Color of the linkbutton’s child content in the normal state.\n * @cssproperty --mdc-link-inverted-color-active - Color of the inverted linkbutton’s child content in the active state.\n * @cssproperty --mdc-link-inverted-color-disabled - Color of the inverted linkbutton’s child content in the disabled state.\n * @cssproperty --mdc-link-inverted-color-hover - Color of the inverted linkbutton’s child content in the hover state.\n * @cssproperty --mdc-link-inverted-color-normal - Color of the inverted linkbutton’s child content in the normal state.\n */",
           "customElement": true
         }
       ],
@@ -21096,8 +21096,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "List",
-            "module": "components/list/list.component.js"
+            "name": "LinkButton",
+            "module": "components/linkbutton/linkbutton.component.js"
           }
         }
       ]