@skf-design-system/ui-components 1.0.2-beta.1 → 1.0.2-beta.11

package/dist/custom-elements.json

@@ -11,6 +11,22 @@
           "description": "The `<skf-icon>` component is used to clarify interface elements. When used, should always be paired with (possibly invisible) text.",
           "name": "SkfIcon",
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "color",
@@ -20,9 +36,8 @@
               "default": "'primary'",
               "description": "Sets the color of the icon",
               "attribute": "color",
-              "reflects": true,
               "expandedType": {
-                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasised' | 'secondary' | 'success'"
+                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasized' | 'secondary' | 'purple' | 'success'"
               }
             },
             {
@@ -55,7 +70,6 @@
               "default": "'md'",
               "description": "Size of the icon",
               "attribute": "size",
-              "reflects": true,
               "expandedType": {
                 "text": "'xs' | 'sm' | 'md' | 'lg'"
               }
@@ -71,7 +85,7 @@
               "description": "Sets the color of the icon",
               "fieldName": "color",
               "expandedType": {
-                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasised' | 'secondary' | 'success'"
+                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasized' | 'secondary' | 'purple' | 'success'"
               }
             },
             {
@@ -111,7 +125,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-icon",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/icon/icon.component.ts"
         }
       ],
       "exports": [
@@ -210,12 +225,18 @@
             {
               "kind": "method",
               "name": "setClose",
-              "description": "Class method as alternative to manipulate attribute"
+              "description": "Class method as alternative to manipulate attribute",
+              "type": {
+                "text": "setClose() => void"
+              }
             },
             {
               "kind": "method",
               "name": "setOpen",
-              "description": "Class method as alternative to manipulate attribute"
+              "description": "Class method as alternative to manipulate attribute",
+              "type": {
+                "text": "setOpen() => void"
+              }
             }
           ],
           "events": [
@@ -290,7 +311,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-accordion-item",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/accordion/accordion-item.component.ts"
         }
       ],
       "exports": [
@@ -465,7 +487,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-accordion",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/accordion/accordion.component.ts"
         }
       ],
       "exports": [
@@ -501,13 +524,26 @@
           "members": [
             {
               "kind": "field",
-              "name": "buttonLabel",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "string"
-              },
-              "default": "'Close'",
-              "description": "Close button aria-label",
-              "attribute": "button-label"
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
@@ -521,6 +557,19 @@
                 "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
               }
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "persistent",
@@ -529,8 +578,7 @@
               },
               "default": "false",
               "description": "If true, renders with an close button and sets aria-role to `status`",
-              "attribute": "persistent",
-              "reflects": true
+              "attribute": "persistent"
             },
             {
               "kind": "field",
@@ -540,7 +588,6 @@
               },
               "description": "If defined, gives the supplied appearance",
               "attribute": "severity",
-              "reflects": true,
               "expandedType": {
                 "text": "'error' | 'info' | 'warning' | 'success' | undefined"
               }
@@ -548,20 +595,14 @@
           ],
           "events": [
             {
+              "type": {
+                "text": "CustomEvent"
+              },
               "description": "Fires when the close button is clicked",
               "name": "skf-alert-close"
             }
           ],
           "attributes": [
-            {
-              "name": "button-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Close'",
-              "description": "Close button aria-label",
-              "fieldName": "buttonLabel"
-            },
             {
               "name": "icon",
               "type": {
@@ -573,6 +614,18 @@
                 "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
               }
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "persistent",
               "type": {
@@ -599,7 +652,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-alert",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/alert/alert.component.ts"
         }
       ],
       "exports": [
@@ -667,7 +721,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-breadcrumb-item",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/breadcrumb/breadcrumb-item.component.ts"
         }
       ],
       "exports": [
@@ -697,6 +752,22 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "label",
@@ -709,14 +780,13 @@
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "small",
               "type": {
-                "text": "'md' | 'sm'"
+                "text": "boolean"
               },
-              "default": "'md'",
-              "description": "Displays an alternative size",
-              "attribute": "size",
-              "reflects": true
+              "default": "false",
+              "description": "If true, renders a smaller version",
+              "attribute": "small"
             }
           ],
           "events": [
@@ -736,13 +806,13 @@
               "fieldName": "label"
             },
             {
-              "name": "size",
+              "name": "small",
               "type": {
-                "text": "'md' | 'sm'"
+                "text": "boolean"
               },
-              "default": "'md'",
-              "description": "Displays an alternative size",
-              "fieldName": "size"
+              "default": "false",
+              "description": "If true, renders a smaller version",
+              "fieldName": "small"
             }
           ],
           "superclass": {
@@ -750,7 +820,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-breadcrumb",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/breadcrumb/breadcrumb.component.ts"
         }
       ],
       "exports": [
@@ -776,14 +847,19 @@
           "members": [
             {
               "kind": "field",
-              "name": "ariaLabel",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "string"
-              },
-              "default": "'Loading...'",
-              "description": "Defines the aria-label",
-              "attribute": "aria-label",
-              "reflects": true
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
@@ -799,24 +875,17 @@
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "'md' | 'sm' | undefined"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Defines the size of the loader",
               "attribute": "size",
-              "reflects": true
+              "expandedType": {
+                "text": "'sm' | 'md'"
+              }
             }
           ],
           "attributes": [
-            {
-              "name": "aria-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Loading...'",
-              "description": "Defines the aria-label",
-              "fieldName": "ariaLabel"
-            },
             {
               "name": "invert",
               "type": {
@@ -829,11 +898,14 @@
             {
               "name": "size",
               "type": {
-                "text": "'md' | 'sm' | undefined"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Defines the size of the loader",
-              "fieldName": "size"
+              "fieldName": "size",
+              "expandedType": {
+                "text": "'sm' | 'md'"
+              }
             }
           ],
           "superclass": {
@@ -841,7 +913,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-loader",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/loader/loader.component.ts"
         }
       ],
       "exports": [
@@ -999,7 +1072,10 @@
             {
               "kind": "method",
               "name": "click",
-              "description": "Simulates a click on the button."
+              "description": "Simulates a click on the button.",
+              "type": {
+                "text": "click() => void"
+              }
             }
           ],
           "events": [
@@ -1112,7 +1188,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-button",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/button/button.component.ts"
         }
       ],
       "exports": [
@@ -1135,6 +1212,12 @@
           "kind": "class",
           "description": "The `<skf-card>` can be used to group related subjects in a container\n\nSee [zeroheight](https://zeroheight.com/853e936c9/p/021eed-card) for design principles",
           "name": "SkfCard",
+          "cssProperties": [
+            {
+              "description": "Ability to set a custom background color",
+              "name": "--mod-card-bg-color"
+            }
+          ],
           "slots": [
             {
               "description": "The card's main content",
@@ -1142,6 +1225,22 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "noBorder",
@@ -1150,8 +1249,7 @@
               },
               "default": "false",
               "description": "If true, removes border",
-              "attribute": "no-border",
-              "reflects": true
+              "attribute": "no-border"
             },
             {
               "kind": "field",
@@ -1161,8 +1259,7 @@
               },
               "default": "false",
               "description": "If true, removes padding",
-              "attribute": "no-padding",
-              "reflects": true
+              "attribute": "no-padding"
             },
             {
               "kind": "field",
@@ -1172,8 +1269,7 @@
               },
               "default": "false",
               "description": "If true, the Card fills the parent element height",
-              "attribute": "stretch",
-              "reflects": true
+              "attribute": "stretch"
             }
           ],
           "attributes": [
@@ -1210,7 +1306,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-card",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/card/card.component.ts"
         }
       ],
       "exports": [
@@ -1240,6 +1337,13 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "debug",
@@ -1253,6 +1357,10 @@
             {
               "kind": "field",
               "name": "checked",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
               "description": "If true, outputs helping hints in console",
               "attribute": "checked",
               "reflects": true
@@ -1290,21 +1398,25 @@
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "attribute": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
               "kind": "field",
-              "name": "requiredLabel",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
+              "description": "If defined, adds name to the input-element",
+              "attribute": "name"
             },
             {
               "kind": "field",
@@ -1385,6 +1497,10 @@
             },
             {
               "name": "checked",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
               "description": "If true, outputs helping hints in console",
               "fieldName": "checked"
             },
@@ -1415,20 +1531,24 @@
               "fieldName": "label"
             },
             {
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "fieldName": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "name": "required-label",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
+              "description": "If defined, adds name to the input-element",
+              "fieldName": "name"
             },
             {
               "name": "severity",
@@ -1471,7 +1591,8 @@
             "package": "@internal/components/formBase.js"
           },
           "tagName": "skf-checkbox",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/checkbox/checkbox.component.ts"
         }
       ],
       "exports": [
@@ -1488,13 +1609,20 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/date-picker/datepicker.calendar.component.ts",
+      "path": "components/datepicker/datepicker-calendar.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SkfDatePickerCalendar",
+          "name": "SkfDatepickerCalendar",
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "eventid",
@@ -1522,6 +1650,19 @@
               "attribute": "invalid-dates",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "locale",
@@ -1608,7 +1749,10 @@
                     "text": "false"
                   }
                 }
-              ]
+              ],
+              "type": {
+                "text": "_createDate({ year, month, day }: DateParts, useTemporalApi?: false) => Date"
+              }
             },
             {
               "kind": "method",
@@ -1632,7 +1776,10 @@
                     "text": "boolean"
                   }
                 }
-              ]
+              ],
+              "type": {
+                "text": "_createDate({ year, month, day = 1 }: DateParts, useTemporalApi?: boolean) => Date | Temporal.PlainDate"
+              }
             },
             {
               "kind": "field",
@@ -1663,6 +1810,18 @@
               "description": "A comma-separated list of dates (yyyy-mm-dd format) that are not selectable.",
               "fieldName": "invalidDates"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "locale",
               "type": {
@@ -1715,40 +1874,32 @@
           "superclass": {
             "name": "SkfElement",
             "package": "@internal/components/skf-element.js"
-          }
+          },
+          "tagName": "skf-datepicker-calendar",
+          "customElement": true,
+          "modulePath": "src/components/datepicker/datepicker-calendar.component.ts"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkfDatePickerCalendar",
+          "name": "SkfDatepickerCalendar",
           "declaration": {
-            "name": "SkfDatePickerCalendar",
-            "module": "src/components/date-picker/datepicker.calendar.component.ts"
+            "name": "SkfDatepickerCalendar",
+            "module": "src/components/datepicker/datepicker-calendar.component.ts"
           }
         }
-      ]
+      ],
+      "typeDefinitionPath": "components/datepicker/datepicker-calendar.d.ts"
     },
     {
       "kind": "javascript-module",
-      "path": "components/date-picker/datepicker.js",
+      "path": "src/components/datepicker/datepicker-popup.component.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "A date picker component that allows users to select a date or a range of dates.",
-          "name": "SkfDatePicker",
-          "cssProperties": [
-            {
-              "description": "The maximum width of the date picker",
-              "name": "--max-width"
-            }
-          ],
-          "slots": [
-            {
-              "description": "Default hint content placed inside the date picker",
-              "name": ""
-            }
-          ],
+          "description": "",
+          "name": "SkfDatepickerPopup",
           "members": [
             {
               "kind": "field",
@@ -1757,17 +1908,12 @@
                 "text": "string"
               },
               "default": "'en-CA'",
-              "description": "The locale to use for formatting the date",
               "attribute": "locale",
               "reflects": true
             },
             {
               "kind": "field",
               "name": "date",
-              "type": {
-                "text": "string"
-              },
-              "description": "The date to display in the date picker",
               "attribute": "date",
               "reflects": true
             },
@@ -1789,6 +1935,19 @@
               "description": "A comma-separated list of dates (yyyy-mm-dd format) that are not selectable.",
               "attribute": "invalid-dates"
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "range",
@@ -1796,7 +1955,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, the date picker will allow the selection of a range of dates",
               "attribute": "range"
             },
             {
@@ -1829,7 +1987,7 @@
               "kind": "field",
               "name": "selectedDateRange",
               "type": {
-                "text": "SkfDatePickerDateRange"
+                "text": "SkfDatepickerPopupDateRange"
               },
               "default": "{ start: null, end: null, }"
             },
@@ -1852,16 +2010,6 @@
               "description": "Navigates to the given date."
             }
           ],
-          "events": [
-            {
-              "description": "When a date is selected",
-              "name": "selected-date-changed"
-            },
-            {
-              "description": "When a range of dates is selected",
-              "name": "selected-date-range-changed"
-            }
-          ],
           "attributes": [
             {
               "name": "locale",
@@ -1869,15 +2017,10 @@
                 "text": "string"
               },
               "default": "'en-CA'",
-              "description": "The locale to use for formatting the date",
               "fieldName": "locale"
             },
             {
               "name": "date",
-              "type": {
-                "text": "string"
-              },
-              "description": "The date to display in the date picker",
               "fieldName": "date"
             },
             {
@@ -1896,13 +2039,24 @@
               "description": "A comma-separated list of dates (yyyy-mm-dd format) that are not selectable.",
               "fieldName": "invalidDates"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "range",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, the date picker will allow the selection of a range of dates",
               "fieldName": "range"
             },
             {
@@ -1925,32 +2079,36 @@
           "superclass": {
             "name": "SkfElement",
             "package": "@internal/components/skf-element.js"
-          },
-          "tagName": "skf-datepicker",
-          "customElement": true
+          }
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkfDatePicker",
+          "name": "SkfDatepickerPopup",
           "declaration": {
-            "name": "SkfDatePicker",
-            "module": "src/components/date-picker/datepicker.component.ts"
+            "name": "SkfDatepickerPopup",
+            "module": "src/components/datepicker/datepicker-popup.component.ts"
           }
         }
-      ],
-      "typeDefinitionPath": "components/date-picker/datepicker.d.ts"
+      ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/date-picker-input/datepicker-input.component.ts",
+      "path": "components/datepicker/datepicker.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SkfDatePickerInput",
+          "name": "SkfDatepicker",
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "focusTimeoutId",
@@ -1985,12 +2143,25 @@
             },
             {
               "kind": "field",
-              "name": "hideLabel",
+              "name": "lang",
               "type": {
-                "text": "boolean | undefined"
+                "text": "Language"
               },
-              "description": "If true, hides the label visually",
-              "attribute": "hide-label"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "hideLabel",
+              "type": {
+                "text": "boolean | undefined"
+              },
+              "description": "If true, hides the label visually",
+              "attribute": "hide-label"
             },
             {
               "kind": "field",
@@ -2047,15 +2218,6 @@
               "description": "If true, makes the element not mutable, meaning the user can not edit the control",
               "attribute": "readonly"
             },
-            {
-              "kind": "field",
-              "name": "requiredLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
-            },
             {
               "kind": "field",
               "name": "selectableFrom",
@@ -2124,16 +2286,15 @@
             },
             {
               "kind": "field",
-              "name": "abortController",
-              "default": "new AbortController()"
-            },
-            {
-              "kind": "field",
-              "name": "abortSignal"
+              "name": "_handleSelectedDate",
+              "privacy": "private"
             },
             {
-              "kind": "field",
-              "name": "_handleSelectedDate"
+              "kind": "method",
+              "name": "_handleValueChange",
+              "type": {
+                "text": "_handleValueChange() => void"
+              }
             },
             {
               "kind": "field",
@@ -2141,21 +2302,26 @@
               "privacy": "private"
             },
             {
-              "kind": "field",
-              "name": "showPopover"
-            },
-            {
-              "kind": "field",
-              "name": "hidePopover"
+              "kind": "method",
+              "name": "showPopover",
+              "type": {
+                "text": "showPopover() => void"
+              }
             },
             {
               "kind": "method",
-              "name": "_handleValueChange"
+              "name": "hidePopover",
+              "type": {
+                "text": "hidePopover() => void"
+              }
             },
             {
-              "kind": "field",
+              "kind": "method",
               "name": "clear",
-              "description": "Clears the input field"
+              "description": "Clears the input field",
+              "type": {
+                "text": "clear() => void"
+              }
             }
           ],
           "attributes": [
@@ -2180,6 +2346,18 @@
               "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
               "fieldName": "label"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "hide-label",
               "type": {
@@ -2236,14 +2414,6 @@
               "description": "If true, makes the element not mutable, meaning the user can not edit the control",
               "fieldName": "readonly"
             },
-            {
-              "name": "required-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
-            },
             {
               "name": "selectable-from",
               "type": {
@@ -2298,19 +2468,23 @@
           "superclass": {
             "name": "FormBase",
             "package": "@internal/components/formBase.js"
-          }
+          },
+          "tagName": "skf-datepicker",
+          "customElement": true,
+          "modulePath": "src/components/datepicker/datepicker.component.ts"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkfDatePickerInput",
+          "name": "SkfDatepicker",
           "declaration": {
-            "name": "SkfDatePickerInput",
-            "module": "src/components/date-picker-input/datepicker-input.component.ts"
+            "name": "SkfDatepicker",
+            "module": "src/components/datepicker/datepicker.component.ts"
           }
         }
-      ]
+      ],
+      "typeDefinitionPath": "components/datepicker/datepicker.d.ts"
     },
     {
       "kind": "javascript-module",
@@ -2327,6 +2501,22 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "as",
@@ -2349,7 +2539,6 @@
               },
               "description": "If defined, changes the appearance of the heading",
               "attribute": "styled-as",
-              "reflects": true,
               "expandedType": {
                 "text": "'h1' | 'h2' | 'h3' | 'h4' | undefined"
               }
@@ -2385,7 +2574,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-heading",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/heading/heading.component.ts"
         }
       ],
       "exports": [
@@ -2431,12 +2621,10 @@
           "members": [
             {
               "kind": "field",
-              "name": "closeButtonAriaLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, sets the aria-label for the close button",
-              "attribute": "close-button-aria-label"
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
             },
             {
               "kind": "field",
@@ -2457,6 +2645,19 @@
               "description": "If true, makes the dialog stretch edge to edge on screen",
               "attribute": "fullscreen"
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "noCloseButton",
@@ -2491,12 +2692,18 @@
             {
               "kind": "method",
               "name": "showModal",
-              "description": "Method that opens the dialog in modal state"
+              "description": "Method that opens the dialog in modal state",
+              "type": {
+                "text": "showModal() => void"
+              }
             },
             {
               "kind": "method",
               "name": "close",
-              "description": "Method that closes the dialog"
+              "description": "Method that closes the dialog",
+              "type": {
+                "text": "close() => void"
+              }
             }
           ],
           "events": [
@@ -2523,14 +2730,6 @@
             }
           ],
           "attributes": [
-            {
-              "name": "close-button-aria-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, sets the aria-label for the close button",
-              "fieldName": "closeButtonAriaLabel"
-            },
             {
               "name": "heading",
               "type": {
@@ -2548,6 +2747,18 @@
               "description": "If true, makes the dialog stretch edge to edge on screen",
               "fieldName": "fullscreen"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "no-close-button",
               "type": {
@@ -2581,7 +2792,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-dialog",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/dialog/dialog.component.ts"
         }
       ],
       "exports": [
@@ -2615,6 +2827,22 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "color",
@@ -2624,9 +2852,8 @@
               "default": "'primary'",
               "description": "Defines the Divider color",
               "attribute": "color",
-              "reflects": true,
               "expandedType": {
-                "text": "'primary' | 'inverse' | 'emphasised' | 'secondary' | 'tertiary'"
+                "text": "'primary' | 'inverse' | 'emphasized' | 'secondary' | 'tertiary'"
               }
             },
             {
@@ -2647,8 +2874,7 @@
               },
               "default": "false",
               "description": "If true, renders the divider vertically",
-              "attribute": "vertical",
-              "reflects": true
+              "attribute": "vertical"
             }
           ],
           "attributes": [
@@ -2661,7 +2887,7 @@
               "description": "Defines the Divider color",
               "fieldName": "color",
               "expandedType": {
-                "text": "'primary' | 'inverse' | 'emphasised' | 'secondary' | 'tertiary'"
+                "text": "'primary' | 'inverse' | 'emphasized' | 'secondary' | 'tertiary'"
               }
             },
             {
@@ -2688,7 +2914,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-divider",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/divider/divider.component.ts"
         }
       ],
       "exports": [
@@ -2720,13 +2947,26 @@
           "members": [
             {
               "kind": "field",
-              "name": "closeButtonAriaLabel",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "string"
-              },
-              "default": "'Close dialog'",
-              "description": "If defined, sets the aria-label for the close button",
-              "attribute": "close-button-aria-label"
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
@@ -2737,16 +2977,31 @@
               "description": "Heading for the Drawer",
               "attribute": "heading"
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "'sm' | 'md' | 'lg'"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Sets the max-width",
               "attribute": "size",
-              "reflects": true
+              "expandedType": {
+                "text": "'sm' | 'md' | 'lg'"
+              }
             },
             {
               "kind": "field",
@@ -2763,16 +3018,21 @@
               "kind": "field",
               "name": "placement",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "Placement"
               },
               "default": "'right'",
               "description": "Placement of the Drawer",
               "attribute": "placement",
-              "reflects": true
+              "expandedType": {
+                "text": "'left' | 'right'"
+              }
             },
             {
               "kind": "method",
-              "name": "close"
+              "name": "close",
+              "type": {
+                "text": "close() => void"
+              }
             }
           ],
           "events": [
@@ -2799,15 +3059,6 @@
             }
           ],
           "attributes": [
-            {
-              "name": "close-button-aria-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Close dialog'",
-              "description": "If defined, sets the aria-label for the close button",
-              "fieldName": "closeButtonAriaLabel"
-            },
             {
               "name": "heading",
               "type": {
@@ -2816,14 +3067,29 @@
               "description": "Heading for the Drawer",
               "fieldName": "heading"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "size",
               "type": {
-                "text": "'sm' | 'md' | 'lg'"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Sets the max-width",
-              "fieldName": "size"
+              "fieldName": "size",
+              "expandedType": {
+                "text": "'sm' | 'md' | 'lg'"
+              }
             },
             {
               "name": "open",
@@ -2837,11 +3103,14 @@
             {
               "name": "placement",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "Placement"
               },
               "default": "'right'",
               "description": "Placement of the Drawer",
-              "fieldName": "placement"
+              "fieldName": "placement",
+              "expandedType": {
+                "text": "'left' | 'right'"
+              }
             }
           ],
           "superclass": {
@@ -2849,7 +3118,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-drawer",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/drawer/drawer.component.ts"
         }
       ],
       "exports": [
@@ -2875,10 +3145,26 @@
           "cssProperties": [
             {
               "description": "The height of the logo",
-              "name": "--skf-logo-height"
+              "name": "--mod-logo-height"
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "title",
@@ -2931,7 +3217,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-logo",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/logo/logo.component.ts"
         }
       ],
       "exports": [
@@ -2948,999 +3235,1119 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/nav/nav.js",
+      "path": "components/link/link.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The `<skf-nav>` is a component that displays a list of <nav-items>.",
-          "name": "SkfNav",
+          "description": "The `<skf-link>` can be used as either a regular link or a semantic button. The button variant is\nintended to be used for triggering javascript functions, not handling forms.",
+          "name": "SkfLink",
           "slots": [
             {
-              "description": "The component's main content",
+              "description": "The links' main content",
               "name": ""
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "vertical",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "vertical",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "vertical",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "vertical"
-            }
-          ],
-          "superclass": {
-            "name": "SkfElement",
-            "package": "@internal/components/skf-element"
-          },
-          "tagName": "skf-nav",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkfNav",
-          "declaration": {
-            "name": "SkfNav",
-            "module": "src/components/nav/nav.component.ts"
-          }
-        }
-      ],
-      "typeDefinitionPath": "components/nav/nav.d.ts"
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/header/header.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The `<skf-header>` component is to be used as the site-header in the app. The navigation will be collapsed to mobile-view if the menu items exceed the available width.",
-          "name": "SkfHeader",
-          "slots": [
-            {
-              "description": "Navigation items",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "compact",
-              "description": "If true, sets header to display in compact mode only (hanburger menu and drawer)",
-              "attribute": "compact",
-              "reflects": true
+                "text": "ElementInternals"
+              }
             },
             {
               "kind": "field",
-              "name": "hamburgerAriaLabel",
+              "name": "#states",
+              "privacy": "private",
               "type": {
-                "text": "string"
-              },
-              "default": "'Show navigation'",
-              "description": "If defined, sets the aria-label for the hamburger button",
-              "attribute": "hamburger-aria-label"
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
-              "name": "siteName",
+              "name": "as",
               "type": {
-                "text": "string | undefined"
+                "text": "'button' | 'link'"
               },
-              "description": "If defined, sets the app or site's name",
-              "attribute": "site-name"
+              "default": "'link'",
+              "description": "Defines the semantic element to render",
+              "attribute": "as"
             },
             {
               "kind": "field",
-              "name": "siteUrl",
+              "name": "color",
               "type": {
-                "text": "string | undefined"
+                "text": "Color"
               },
-              "description": "If defined, sets the site's base-url for the \"logo-link\"",
-              "attribute": "site-url"
-            }
-          ],
-          "attributes": [
+              "default": "'primary'",
+              "description": "Defines the text-color",
+              "attribute": "color",
+              "expandedType": {
+                "text": "'primary' | 'inverse'"
+              }
+            },
             {
-              "name": "compact",
-              "description": "If true, sets header to display in compact mode only (hanburger menu and drawer)",
-              "fieldName": "compact"
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true, disables the link",
+              "attribute": "disabled"
             },
             {
-              "name": "hamburger-aria-label",
+              "kind": "field",
+              "name": "download",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'Show navigation'",
-              "description": "If defined, sets the aria-label for the hamburger button",
-              "fieldName": "hamburgerAriaLabel"
+              "default": "false",
+              "description": "If defined, downloads the url",
+              "attribute": "download"
             },
             {
-              "name": "site-name",
+              "kind": "field",
+              "name": "href",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, sets the app or site's name",
-              "fieldName": "siteName"
+              "description": "If defined, loads url on click",
+              "attribute": "href"
             },
             {
-              "name": "site-url",
+              "kind": "field",
+              "name": "icon",
               "type": {
-                "text": "string | undefined"
+                "text": "Icon | undefined"
               },
-              "description": "If defined, sets the site's base-url for the \"logo-link\"",
-              "fieldName": "siteUrl"
-            }
-          ],
-          "superclass": {
-            "name": "SkfElement",
-            "package": "@internal/components/skf-element"
-          },
-          "tagName": "skf-header",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkfHeader",
-          "declaration": {
-            "name": "SkfHeader",
-            "module": "src/components/header/header.component.ts"
-          }
-        }
-      ],
-      "typeDefinitionPath": "components/header/header.d.ts"
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/input/input.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The skf-text-field is used to create a text input field. It can be used inside a form element or standalone\n\nSee [zeroheight](https://zeroheight.com/853e936c9/p/9481fa-input-field) for design principles",
-          "name": "SkfInput",
-          "slots": [
+              "description": "If defined, renders an icon before or after the text",
+              "attribute": "icon",
+              "expandedType": {
+                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
+              }
+            },
             {
-              "description": "The Inputs label. Alternatively, you can use the `label` attribute.",
-              "name": ""
-            }
-          ],
-          "members": [
+              "kind": "field",
+              "name": "iconRight",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true, the icon is placed to the right in relation to the text",
+              "attribute": "icon-right"
+            },
             {
               "kind": "field",
-              "name": "customError",
+              "name": "rel",
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "private"
+              "description": "If defined, describes the relationship between a linked resource and the current document",
+              "attribute": "rel"
             },
             {
               "kind": "field",
-              "name": "autocomplete",
+              "name": "route",
               "type": {
-                "text": "HTMLInputElement['autocomplete'] | undefined"
+                "text": "string | undefined"
               },
-              "description": "Indicates whether the value of the control can be automatically completed by the browser. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/autocomplete) for details.",
-              "attribute": "autocomplete"
+              "description": "If defined, used on conjunction with onClick property. **Notice!** Only applicable to as=button.",
+              "attribute": "route"
             },
             {
               "kind": "field",
-              "name": "buttonAriaLabelClear",
+              "name": "stretch",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'Clear input'",
-              "description": "Custom aria-label for the clear button. **Notice!** Only applicable to type=search.",
-              "attribute": "button-aria-label-clear"
+              "default": "false",
+              "description": "If true, fills the parents horizontal axis",
+              "attribute": "stretch"
             },
             {
               "kind": "field",
-              "name": "buttonAriaLabelHide",
+              "name": "target",
               "type": {
-                "text": "string"
+                "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
               },
-              "default": "'Hide password'",
-              "description": "Custom aria-label for the visibility button. **Notice!** Only applicable to type=password.",
-              "attribute": "button-aria-label-hide"
+              "description": "If defined, specifies where to open the linked document",
+              "attribute": "target"
             },
             {
-              "kind": "field",
-              "name": "buttonAriaLabelShow",
+              "kind": "method",
+              "name": "_handleAsChange",
               "type": {
-                "text": "string"
+                "text": "_handleAsChange() => void"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_handleDisabledChange",
+              "type": {
+                "text": "_handleDisabledChange() => void"
+              }
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "CustomEvent"
               },
-              "default": "'Show password'",
-              "description": "Custom aria-label for the visibility button **Notice!** Only applicable to type=password.",
-              "attribute": "button-aria-label-show"
+              "description": "Fired when the link is clicked",
+              "name": "skf-link-click"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "as",
+              "type": {
+                "text": "'button' | 'link'"
+              },
+              "default": "'link'",
+              "description": "Defines the semantic element to render",
+              "fieldName": "as"
             },
             {
-              "kind": "field",
-              "name": "customInvalid",
-              "description": "If defined, forces component to invalid state until removed. Its value is used as hint text.",
-              "attribute": "custom-invalid",
-              "reflects": true
+              "name": "color",
+              "type": {
+                "text": "Color"
+              },
+              "default": "'primary'",
+              "description": "Defines the text-color",
+              "fieldName": "color",
+              "expandedType": {
+                "text": "'primary' | 'inverse'"
+              }
             },
             {
-              "kind": "field",
-              "name": "debug",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, outputs helping hints in console",
-              "attribute": "debug"
+              "description": "If true, disables the link",
+              "fieldName": "disabled"
             },
             {
-              "kind": "field",
-              "name": "hideLabel",
+              "name": "download",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, hides the label visually",
-              "attribute": "hide-label"
+              "description": "If defined, downloads the url",
+              "fieldName": "download"
             },
             {
-              "kind": "field",
-              "name": "hint",
+              "name": "href",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, displays informational text below the field",
-              "attribute": "hint"
+              "description": "If defined, loads url on click",
+              "fieldName": "href"
             },
             {
-              "kind": "field",
-              "name": "inputmode",
+              "name": "icon",
               "type": {
-                "text": "HTMLInputElement['inputMode']"
+                "text": "Icon | undefined"
               },
-              "default": "'text'",
-              "description": "Provides a hint about the type of data that might be entered by the user while editing the element or its contents. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inputMode) for details.",
-              "attribute": "inputmode"
+              "description": "If defined, renders an icon before or after the text",
+              "fieldName": "icon",
+              "expandedType": {
+                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
+              }
             },
             {
-              "kind": "field",
-              "name": "label",
+              "name": "icon-right",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
-              "attribute": "label"
+              "default": "false",
+              "description": "If true, the icon is placed to the right in relation to the text",
+              "fieldName": "iconRight"
             },
             {
-              "kind": "field",
-              "name": "leading",
+              "name": "rel",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, displays a prefix/adornment before the input-element",
-              "attribute": "leading"
+              "description": "If defined, describes the relationship between a linked resource and the current document",
+              "fieldName": "rel"
             },
             {
-              "kind": "field",
-              "name": "max",
+              "name": "route",
               "type": {
-                "text": "number | string | undefined"
+                "text": "string | undefined"
               },
-              "description": "If defined, sets the maximum value to accept for this input",
-              "attribute": "max"
+              "description": "If defined, used on conjunction with onClick property. **Notice!** Only applicable to as=button.",
+              "fieldName": "route"
             },
             {
-              "kind": "field",
-              "name": "maxLength",
+              "name": "stretch",
               "type": {
-                "text": "number | undefined"
+                "text": "boolean"
               },
-              "description": "If defined, sets the maximum character length to accept for this input",
-              "attribute": "maxlength"
+              "default": "false",
+              "description": "If true, fills the parents horizontal axis",
+              "fieldName": "stretch"
             },
             {
-              "kind": "field",
-              "name": "min",
+              "name": "target",
               "type": {
-                "text": "number | string | undefined"
+                "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
               },
-              "description": "If defined, sets the minimum value to accept for this input",
-              "attribute": "min"
-            },
+              "description": "If defined, specifies where to open the linked document",
+              "fieldName": "target"
+            }
+          ],
+          "superclass": {
+            "name": "SkfElement",
+            "package": "@internal/components/skf-element.js"
+          },
+          "tagName": "skf-link",
+          "customElement": true,
+          "modulePath": "src/components/link/link.component.ts"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkfLink",
+          "declaration": {
+            "name": "SkfLink",
+            "module": "src/components/link/link.component.ts"
+          }
+        }
+      ],
+      "typeDefinitionPath": "components/link/link.d.ts"
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/nav/nav-item.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `<skf-nav>` is a component that displays a list of <nav-items>.",
+          "name": "SkfNavItem",
+          "slots": [
+            {
+              "description": "The component's main content",
+              "name": ""
+            }
+          ],
+          "members": [
             {
               "kind": "field",
-              "name": "minLength",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "number | undefined"
-              },
-              "description": "If defined, sets the minimum character length to accept for this input",
-              "attribute": "minlength"
+                "text": "ElementInternals"
+              }
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "#states",
+              "privacy": "private",
               "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, adds name to the input-element",
-              "attribute": "name",
-              "reflects": true
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
-              "name": "pattern",
+              "name": "href",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "description": "If defined, adds name to the input-element",
-              "attribute": "pattern"
+              "default": "''",
+              "attribute": "href"
             },
             {
               "kind": "field",
-              "name": "placeholder",
+              "name": "icon",
               "type": {
-                "text": "string | undefined"
+                "text": "Icon | undefined"
               },
-              "description": "If defined, displays placeholder text",
-              "attribute": "placeholder"
+              "attribute": "icon",
+              "expandedType": {
+                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
+              }
             },
             {
               "kind": "field",
-              "name": "readonly",
+              "name": "vertical",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "If true, makes the element not mutable, meaning the user can not edit the control",
-              "attribute": "readonly"
+              "default": "false"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "href",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "href"
             },
             {
-              "kind": "field",
-              "name": "requiredLabel",
+              "name": "icon",
               "type": {
-                "text": "string | undefined"
+                "text": "Icon | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
+              "fieldName": "icon",
+              "expandedType": {
+                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "SkfElement",
+            "package": "@internal/components/skf-element"
+          },
+          "tagName": "skf-nav-item",
+          "customElement": true,
+          "modulePath": "src/components/nav/nav-item.component.ts"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkfNavItem",
+          "declaration": {
+            "name": "SkfNavItem",
+            "module": "src/components/nav/nav-item.component.ts"
+          }
+        }
+      ],
+      "typeDefinitionPath": "components/nav/nav-item.d.ts"
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/nav/nav.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `<skf-nav>` is a component that displays a list of <nav-items>.",
+          "name": "SkfNav",
+          "slots": [
+            {
+              "description": "The component's main content",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
             },
             {
               "kind": "field",
-              "name": "severity",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "FormFieldSeverity | undefined"
-              },
-              "description": "If defined, displays provided severity state",
-              "attribute": "severity",
-              "reflects": true
+                "text": "ElementInternals"
+              }
             },
             {
               "kind": "field",
-              "name": "showValid",
+              "name": "#states",
+              "privacy": "private",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "If true, displays valid state after interaction",
-              "attribute": "show-valid"
+                "text": "CustomStateSet"
+              }
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "lang",
               "type": {
-                "text": "'sm' | 'md'"
+                "text": "Language"
               },
-              "default": "'md'",
-              "description": "Size of the input",
-              "attribute": "size",
-              "reflects": true
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
               "kind": "field",
-              "name": "trailing",
+              "name": "vertical",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "If defined, displays a suffix/adornment after the input-element",
-              "attribute": "trailing"
+              "default": "false",
+              "description": "If true, the navigation will be displayed vertically",
+              "attribute": "vertical"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "kind": "field",
-              "name": "type",
+              "name": "vertical",
               "type": {
-                "text": "'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url'"
+                "text": "boolean"
               },
-              "default": "'text'",
-              "description": "Type of input",
-              "attribute": "type"
+              "default": "false",
+              "description": "If true, the navigation will be displayed vertically",
+              "fieldName": "vertical"
+            }
+          ],
+          "superclass": {
+            "name": "SkfElement",
+            "package": "@internal/components/skf-element"
+          },
+          "tagName": "skf-nav",
+          "customElement": true,
+          "modulePath": "src/components/nav/nav.component.ts"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkfNav",
+          "declaration": {
+            "name": "SkfNav",
+            "module": "src/components/nav/nav.component.ts"
+          }
+        }
+      ],
+      "typeDefinitionPath": "components/nav/nav.d.ts"
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/header/header.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `<skf-header>` component is to be used as the site-header in the app. The navigation will be collapsed to mobile-view if the menu items exceed the available width.",
+          "name": "SkfHeader",
+          "slots": [
+            {
+              "description": "Navigation items",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "compact",
+              "description": "If true, sets header to display in compact mode only (hanburger menu and drawer)",
+              "attribute": "compact",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "validateOn",
+              "name": "lang",
               "type": {
-                "text": "'input' | 'change' | 'submit'"
+                "text": "Language"
               },
-              "default": "'change'",
-              "description": "Sets validation start",
-              "attribute": "validate-on"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
               "kind": "field",
-              "name": "value",
-              "description": "The current value of the input field",
-              "attribute": "value"
-            }
-          ],
-          "events": [
-            {
+              "name": "siteName",
               "type": {
-                "text": "CustomEvent"
+                "text": "string | undefined"
               },
-              "description": "Fires when the value of the input changes",
-              "name": "change"
+              "description": "If defined, sets the app or site's name",
+              "attribute": "site-name"
             },
             {
+              "kind": "field",
+              "name": "siteUrl",
               "type": {
-                "text": "CustomEvent"
+                "text": "string | undefined"
               },
-              "description": "Fires when the input is invalid",
-              "name": "invalid"
+              "description": "If defined, sets the site's base-url for the \"logo-link\"",
+              "attribute": "site-url"
             }
           ],
           "attributes": [
             {
-              "type": {
-                "text": "boolean"
-              },
-              "description": "If true, sets disabled state",
-              "name": "disabled",
-              "default": "false"
+              "name": "compact",
+              "description": "If true, sets header to display in compact mode only (hanburger menu and drawer)",
+              "fieldName": "compact"
             },
             {
+              "name": "lang",
               "type": {
-                "text": "boolean"
+                "text": "Language"
               },
-              "description": "If true, value is required or must be checked for the form to be submittable",
-              "name": "required",
-              "default": "false"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "name": "autocomplete",
+              "name": "site-name",
               "type": {
-                "text": "HTMLInputElement['autocomplete'] | undefined"
+                "text": "string | undefined"
               },
-              "description": "Indicates whether the value of the control can be automatically completed by the browser. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/autocomplete) for details.",
-              "fieldName": "autocomplete"
+              "description": "If defined, sets the app or site's name",
+              "fieldName": "siteName"
             },
             {
-              "name": "button-aria-label-clear",
+              "name": "site-url",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "'Clear input'",
-              "description": "Custom aria-label for the clear button. **Notice!** Only applicable to type=search.",
-              "fieldName": "buttonAriaLabelClear"
-            },
+              "description": "If defined, sets the site's base-url for the \"logo-link\"",
+              "fieldName": "siteUrl"
+            }
+          ],
+          "superclass": {
+            "name": "SkfElement",
+            "package": "@internal/components/skf-element"
+          },
+          "tagName": "skf-header",
+          "customElement": true,
+          "modulePath": "src/components/header/header.component.ts"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SkfHeader",
+          "declaration": {
+            "name": "SkfHeader",
+            "module": "src/components/header/header.component.ts"
+          }
+        }
+      ],
+      "typeDefinitionPath": "components/header/header.d.ts"
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/input/input.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The skf-text-field is used to create a text input field. It can be used inside a form element or standalone\n\nSee [zeroheight](https://zeroheight.com/853e936c9/p/9481fa-input-field) for design principles",
+          "name": "SkfInput",
+          "slots": [
+            {
+              "description": "The Inputs label. Alternatively, you can use the `label` attribute.",
+              "name": ""
+            }
+          ],
+          "members": [
             {
-              "name": "button-aria-label-hide",
+              "kind": "field",
+              "name": "customError",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "'Hide password'",
-              "description": "Custom aria-label for the visibility button. **Notice!** Only applicable to type=password.",
-              "fieldName": "buttonAriaLabelHide"
+              "privacy": "private"
             },
             {
-              "name": "button-aria-label-show",
+              "kind": "field",
+              "name": "autocomplete",
               "type": {
-                "text": "string"
+                "text": "HTMLInputElement['autocomplete'] | undefined"
               },
-              "default": "'Show password'",
-              "description": "Custom aria-label for the visibility button **Notice!** Only applicable to type=password.",
-              "fieldName": "buttonAriaLabelShow"
+              "description": "Indicates whether the value of the control can be automatically completed by the browser. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/autocomplete) for details.",
+              "attribute": "autocomplete"
             },
             {
-              "name": "custom-invalid",
+              "kind": "field",
+              "name": "customInvalid",
               "description": "If defined, forces component to invalid state until removed. Its value is used as hint text.",
-              "fieldName": "customInvalid"
+              "attribute": "custom-invalid",
+              "reflects": true
             },
             {
+              "kind": "field",
               "name": "debug",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "If true, outputs helping hints in console",
-              "fieldName": "debug"
+              "attribute": "debug"
             },
             {
-              "name": "hide-label",
+              "kind": "field",
+              "name": "hideLabel",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "If true, hides the label visually",
-              "fieldName": "hideLabel"
+              "attribute": "hide-label"
             },
             {
+              "kind": "field",
               "name": "hint",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, displays informational text below the field",
-              "fieldName": "hint"
+              "attribute": "hint"
             },
             {
+              "kind": "field",
               "name": "inputmode",
               "type": {
                 "text": "HTMLInputElement['inputMode']"
               },
               "default": "'text'",
               "description": "Provides a hint about the type of data that might be entered by the user while editing the element or its contents. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inputMode) for details.",
-              "fieldName": "inputmode"
+              "attribute": "inputmode"
             },
             {
+              "kind": "field",
               "name": "label",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
-              "fieldName": "label"
+              "attribute": "label"
+            },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
+              "kind": "field",
               "name": "leading",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, displays a prefix/adornment before the input-element",
-              "fieldName": "leading"
+              "attribute": "leading"
             },
             {
+              "kind": "field",
               "name": "max",
               "type": {
                 "text": "number | string | undefined"
               },
               "description": "If defined, sets the maximum value to accept for this input",
-              "fieldName": "max"
+              "attribute": "max"
             },
             {
-              "name": "maxlength",
+              "kind": "field",
+              "name": "maxLength",
               "type": {
                 "text": "number | undefined"
               },
               "description": "If defined, sets the maximum character length to accept for this input",
-              "fieldName": "maxLength"
+              "attribute": "maxlength"
             },
             {
+              "kind": "field",
               "name": "min",
               "type": {
                 "text": "number | string | undefined"
               },
               "description": "If defined, sets the minimum value to accept for this input",
-              "fieldName": "min"
+              "attribute": "min"
             },
             {
-              "name": "minlength",
+              "kind": "field",
+              "name": "minLength",
               "type": {
                 "text": "number | undefined"
               },
               "description": "If defined, sets the minimum character length to accept for this input",
-              "fieldName": "minLength"
+              "attribute": "minlength"
             },
             {
+              "kind": "field",
               "name": "name",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, adds name to the input-element",
-              "fieldName": "name"
+              "attribute": "name",
+              "reflects": true
             },
             {
+              "kind": "field",
               "name": "pattern",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, adds name to the input-element",
-              "fieldName": "pattern"
+              "attribute": "pattern"
             },
             {
+              "kind": "field",
               "name": "placeholder",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, displays placeholder text",
-              "fieldName": "placeholder"
+              "attribute": "placeholder"
             },
             {
+              "kind": "field",
               "name": "readonly",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "If true, makes the element not mutable, meaning the user can not edit the control",
-              "fieldName": "readonly"
-            },
-            {
-              "name": "required-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
+              "attribute": "readonly"
             },
             {
+              "kind": "field",
               "name": "severity",
               "type": {
                 "text": "FormFieldSeverity | undefined"
               },
               "description": "If defined, displays provided severity state",
-              "fieldName": "severity"
+              "attribute": "severity",
+              "reflects": true
             },
             {
-              "name": "show-valid",
+              "kind": "field",
+              "name": "showValid",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "If true, displays valid state after interaction",
-              "fieldName": "showValid"
+              "attribute": "show-valid"
             },
             {
+              "kind": "field",
               "name": "size",
               "type": {
                 "text": "'sm' | 'md'"
               },
               "default": "'md'",
               "description": "Size of the input",
-              "fieldName": "size"
+              "attribute": "size",
+              "reflects": true
             },
             {
+              "kind": "field",
               "name": "trailing",
               "type": {
                 "text": "string | undefined"
               },
               "description": "If defined, displays a suffix/adornment after the input-element",
-              "fieldName": "trailing"
+              "attribute": "trailing"
             },
             {
+              "kind": "field",
               "name": "type",
               "type": {
                 "text": "'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url'"
               },
               "default": "'text'",
               "description": "Type of input",
-              "fieldName": "type"
+              "attribute": "type"
             },
             {
-              "name": "validate-on",
+              "kind": "field",
+              "name": "validateOn",
               "type": {
                 "text": "'input' | 'change' | 'submit'"
               },
               "default": "'change'",
               "description": "Sets validation start",
-              "fieldName": "validateOn"
+              "attribute": "validate-on"
             },
             {
+              "kind": "field",
               "name": "value",
               "description": "The current value of the input field",
-              "fieldName": "value"
+              "attribute": "value"
             }
           ],
-          "superclass": {
-            "name": "FormBase",
-            "package": "@internal/components/formBase.js"
-          },
-          "tagName": "skf-input",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkfInput",
-          "declaration": {
-            "name": "SkfInput",
-            "module": "src/components/input/input.component.ts"
-          }
-        }
-      ],
-      "typeDefinitionPath": "components/input/input.d.ts"
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/link/link.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The `<skf-link>` can be used as either a regular link or a link styled semantic button",
-          "name": "SkfLink",
-          "slots": [
+          "events": [
             {
-              "description": "The links' main content",
-              "name": ""
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fires when the value of the input changes",
+              "name": "change"
+            },
+            {
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fires when the input is invalid",
+              "name": "invalid"
             }
           ],
-          "members": [
+          "attributes": [
             {
-              "kind": "field",
-              "name": "classMap",
               "type": {
-                "text": "object"
+                "text": "boolean"
               },
-              "static": true,
-              "default": "{}"
+              "description": "If true, sets disabled state",
+              "name": "disabled",
+              "default": "false"
             },
             {
-              "kind": "field",
-              "name": "as",
               "type": {
-                "text": "'button' | 'a'"
+                "text": "boolean"
               },
-              "default": "'a'",
-              "description": "Defines the semantic element to render",
-              "attribute": "as",
-              "reflects": true
+              "description": "If true, value is required or must be checked for the form to be submittable",
+              "name": "required",
+              "default": "false"
             },
             {
-              "kind": "field",
-              "name": "color",
+              "name": "autocomplete",
               "type": {
-                "text": "'primary' | 'inverse'"
+                "text": "HTMLInputElement['autocomplete'] | undefined"
               },
-              "default": "'primary'",
-              "description": "Defines the text-color",
-              "attribute": "color",
-              "reflects": true
+              "description": "Indicates whether the value of the control can be automatically completed by the browser. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/autocomplete) for details.",
+              "fieldName": "autocomplete"
             },
             {
-              "kind": "field",
-              "name": "disabled",
+              "name": "custom-invalid",
+              "description": "If defined, forces component to invalid state until removed. Its value is used as hint text.",
+              "fieldName": "customInvalid"
+            },
+            {
+              "name": "debug",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, disables the link",
-              "attribute": "disabled",
-              "reflects": true
+              "description": "If true, outputs helping hints in console",
+              "fieldName": "debug"
             },
             {
-              "kind": "field",
-              "name": "download",
+              "name": "hide-label",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "If defined, downloads the url",
-              "attribute": "download"
+              "default": "false",
+              "description": "If true, hides the label visually",
+              "fieldName": "hideLabel"
             },
             {
-              "kind": "field",
-              "name": "href",
+              "name": "hint",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, loads url on click",
-              "attribute": "href"
+              "description": "If defined, displays informational text below the field",
+              "fieldName": "hint"
             },
             {
-              "kind": "field",
-              "name": "icon",
+              "name": "inputmode",
               "type": {
-                "text": "Icon | undefined"
+                "text": "HTMLInputElement['inputMode']"
               },
-              "description": "If defined, renders an icon before or after the text",
-              "attribute": "icon",
-              "expandedType": {
-                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
-              }
+              "default": "'text'",
+              "description": "Provides a hint about the type of data that might be entered by the user while editing the element or its contents. See\n[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inputMode) for details.",
+              "fieldName": "inputmode"
             },
             {
-              "kind": "field",
-              "name": "iconPlacement",
+              "name": "label",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "string | undefined"
               },
-              "default": "'left'",
-              "description": "Defines the position of the icon in relation to the text",
-              "attribute": "icon-placement",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "onClick",
-              "description": "If defined, accepts a function that runs on click. Forwards optional route as second argument."
+              "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
+              "fieldName": "label"
             },
             {
-              "kind": "field",
-              "name": "rel",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, describes the relationship between a linked resource and the current document",
-              "attribute": "rel"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "kind": "field",
-              "name": "route",
+              "name": "leading",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, used on conjunction with onClick property, second argument",
-              "attribute": "route",
-              "reflects": true
+              "description": "If defined, displays a prefix/adornment before the input-element",
+              "fieldName": "leading"
             },
             {
-              "kind": "field",
-              "name": "stretch",
+              "name": "max",
               "type": {
-                "text": "boolean"
+                "text": "number | string | undefined"
               },
-              "default": "false",
-              "description": "If true, fills the parents horizontal axis",
-              "attribute": "stretch",
-              "reflects": true
+              "description": "If defined, sets the maximum value to accept for this input",
+              "fieldName": "max"
             },
             {
-              "kind": "field",
-              "name": "target",
+              "name": "maxlength",
               "type": {
-                "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
+                "text": "number | undefined"
               },
-              "description": "If defined, specifies where to open the linked document",
-              "attribute": "target"
+              "description": "If defined, sets the maximum character length to accept for this input",
+              "fieldName": "maxLength"
             },
             {
-              "kind": "field",
-              "name": "type",
+              "name": "min",
               "type": {
-                "text": "SkfLinkType"
+                "text": "number | string | undefined"
               },
-              "default": "'button'",
-              "description": "Defines the type of button",
-              "attribute": "type",
-              "expandedType": {
-                "text": "'submit' | 'reset' | 'button'"
-              }
-            }
-          ],
-          "attributes": [
+              "description": "If defined, sets the minimum value to accept for this input",
+              "fieldName": "min"
+            },
             {
-              "name": "as",
+              "name": "minlength",
               "type": {
-                "text": "'button' | 'a'"
+                "text": "number | undefined"
               },
-              "default": "'a'",
-              "description": "Defines the semantic element to render",
-              "fieldName": "as"
+              "description": "If defined, sets the minimum character length to accept for this input",
+              "fieldName": "minLength"
             },
             {
-              "name": "color",
+              "name": "name",
               "type": {
-                "text": "'primary' | 'inverse'"
+                "text": "string | undefined"
               },
-              "default": "'primary'",
-              "description": "Defines the text-color",
-              "fieldName": "color"
+              "description": "If defined, adds name to the input-element",
+              "fieldName": "name"
             },
             {
-              "name": "disabled",
+              "name": "pattern",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "description": "If true, disables the link",
-              "fieldName": "disabled"
+              "description": "If defined, adds name to the input-element",
+              "fieldName": "pattern"
             },
             {
-              "name": "download",
+              "name": "placeholder",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, downloads the url",
-              "fieldName": "download"
+              "description": "If defined, displays placeholder text",
+              "fieldName": "placeholder"
             },
             {
-              "name": "href",
+              "name": "readonly",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "If defined, loads url on click",
-              "fieldName": "href"
+              "default": "false",
+              "description": "If true, makes the element not mutable, meaning the user can not edit the control",
+              "fieldName": "readonly"
             },
             {
-              "name": "icon",
+              "name": "severity",
               "type": {
-                "text": "Icon | undefined"
+                "text": "FormFieldSeverity | undefined"
               },
-              "description": "If defined, renders an icon before or after the text",
-              "fieldName": "icon",
-              "expandedType": {
-                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
-              }
+              "description": "If defined, displays provided severity state",
+              "fieldName": "severity"
             },
             {
-              "name": "icon-placement",
+              "name": "show-valid",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "boolean"
               },
-              "default": "'left'",
-              "description": "Defines the position of the icon in relation to the text",
-              "fieldName": "iconPlacement"
+              "default": "false",
+              "description": "If true, displays valid state after interaction",
+              "fieldName": "showValid"
             },
             {
-              "name": "rel",
+              "name": "size",
               "type": {
-                "text": "string | undefined"
+                "text": "'sm' | 'md'"
               },
-              "description": "If defined, describes the relationship between a linked resource and the current document",
-              "fieldName": "rel"
+              "default": "'md'",
+              "description": "Size of the input",
+              "fieldName": "size"
             },
             {
-              "name": "route",
+              "name": "trailing",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, used on conjunction with onClick property, second argument",
-              "fieldName": "route"
+              "description": "If defined, displays a suffix/adornment after the input-element",
+              "fieldName": "trailing"
             },
             {
-              "name": "stretch",
+              "name": "type",
               "type": {
-                "text": "boolean"
+                "text": "'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url'"
               },
-              "default": "false",
-              "description": "If true, fills the parents horizontal axis",
-              "fieldName": "stretch"
+              "default": "'text'",
+              "description": "Type of input",
+              "fieldName": "type"
             },
             {
-              "name": "target",
+              "name": "validate-on",
               "type": {
-                "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
+                "text": "'input' | 'change' | 'submit'"
               },
-              "description": "If defined, specifies where to open the linked document",
-              "fieldName": "target"
+              "default": "'change'",
+              "description": "Sets validation start",
+              "fieldName": "validateOn"
             },
             {
-              "name": "type",
-              "type": {
-                "text": "SkfLinkType"
-              },
-              "default": "'button'",
-              "description": "Defines the type of button",
-              "fieldName": "type",
-              "expandedType": {
-                "text": "'submit' | 'reset' | 'button'"
-              }
+              "name": "value",
+              "description": "The current value of the input field",
+              "fieldName": "value"
             }
           ],
           "superclass": {
-            "name": "SkfElement",
-            "package": "@internal/components/skf-element.js"
+            "name": "FormBase",
+            "package": "@internal/components/formBase.js"
           },
-          "tagName": "skf-link",
-          "customElement": true
+          "tagName": "skf-input",
+          "customElement": true,
+          "modulePath": "src/components/input/input.component.ts"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkfLink",
+          "name": "SkfInput",
           "declaration": {
-            "name": "SkfLink",
-            "module": "src/components/link/link.component.ts"
+            "name": "SkfInput",
+            "module": "src/components/input/input.component.ts"
           }
         }
       ],
-      "typeDefinitionPath": "components/link/link.d.ts"
+      "typeDefinitionPath": "components/input/input.d.ts"
     },
     {
       "kind": "javascript-module",
@@ -3963,20 +4370,23 @@
           "members": [
             {
               "kind": "field",
-              "name": "role",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "string"
+                "text": "ElementInternals"
               },
-              "default": "'menuitem'"
+              "inheritedFrom": {
+                "name": "SkfLink",
+                "module": "src/components/link/link.component.ts"
+              }
             },
             {
               "kind": "field",
-              "name": "classMap",
+              "name": "#states",
+              "privacy": "private",
               "type": {
-                "text": "object"
+                "text": "CustomStateSet"
               },
-              "static": true,
-              "default": "{ 'menu-item': true }",
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -3986,12 +4396,11 @@
               "kind": "field",
               "name": "as",
               "type": {
-                "text": "'button' | 'a'"
+                "text": "'button' | 'link'"
               },
-              "default": "'a'",
+              "default": "'link'",
               "description": "Defines the semantic element to render",
               "attribute": "as",
-              "reflects": true,
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4001,12 +4410,14 @@
               "kind": "field",
               "name": "color",
               "type": {
-                "text": "'primary' | 'inverse'"
+                "text": "Color"
               },
               "default": "'primary'",
               "description": "Defines the text-color",
               "attribute": "color",
-              "reflects": true,
+              "expandedType": {
+                "text": "'primary' | 'inverse'"
+              },
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4021,7 +4432,6 @@
               "default": "false",
               "description": "If true, disables the link",
               "attribute": "disabled",
-              "reflects": true,
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4031,8 +4441,9 @@
               "kind": "field",
               "name": "download",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
+              "default": "false",
               "description": "If defined, downloads the url",
               "attribute": "download",
               "inheritedFrom": {
@@ -4071,23 +4482,13 @@
             },
             {
               "kind": "field",
-              "name": "iconPlacement",
+              "name": "iconRight",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "boolean"
               },
-              "default": "'left'",
-              "description": "Defines the position of the icon in relation to the text",
-              "attribute": "icon-placement",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "SkfLink",
-                "module": "src/components/link/link.component.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "onClick",
-              "description": "If defined, accepts a function that runs on click. Forwards optional route as second argument.",
+              "default": "false",
+              "description": "If true, the icon is placed to the right in relation to the text",
+              "attribute": "icon-right",
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4112,9 +4513,8 @@
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, used on conjunction with onClick property, second argument",
+              "description": "If defined, used on conjunction with onClick property. **Notice!** Only applicable to as=button.",
               "attribute": "route",
-              "reflects": true,
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4129,7 +4529,6 @@
               "default": "false",
               "description": "If true, fills the parents horizontal axis",
               "attribute": "stretch",
-              "reflects": true,
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4149,20 +4548,25 @@
               }
             },
             {
-              "kind": "field",
-              "name": "type",
-              "type": {
-                "text": "SkfLinkType"
-              },
-              "default": "'button'",
-              "description": "Defines the type of button",
-              "attribute": "type",
-              "expandedType": {
-                "text": "'submit' | 'reset' | 'button'"
+              "kind": "method",
+              "name": "_handleAsChange",
+              "inheritedFrom": {
+                "name": "SkfLink",
+                "module": "src/components/link/link.component.ts"
               },
+              "type": {
+                "text": "_handleAsChange() => void"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_handleDisabledChange",
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
+              },
+              "type": {
+                "text": "_handleDisabledChange() => void"
               }
             }
           ],
@@ -4176,9 +4580,9 @@
             {
               "name": "as",
               "type": {
-                "text": "'button' | 'a'"
+                "text": "'button' | 'link'"
               },
-              "default": "'a'",
+              "default": "'link'",
               "description": "Defines the semantic element to render",
               "fieldName": "as",
               "inheritedFrom": {
@@ -4189,11 +4593,14 @@
             {
               "name": "color",
               "type": {
-                "text": "'primary' | 'inverse'"
+                "text": "Color"
               },
               "default": "'primary'",
               "description": "Defines the text-color",
               "fieldName": "color",
+              "expandedType": {
+                "text": "'primary' | 'inverse'"
+              },
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4215,8 +4622,9 @@
             {
               "name": "download",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
+              "default": "false",
               "description": "If defined, downloads the url",
               "fieldName": "download",
               "inheritedFrom": {
@@ -4252,13 +4660,13 @@
               }
             },
             {
-              "name": "icon-placement",
+              "name": "icon-right",
               "type": {
-                "text": "'left' | 'right'"
+                "text": "boolean"
               },
-              "default": "'left'",
-              "description": "Defines the position of the icon in relation to the text",
-              "fieldName": "iconPlacement",
+              "default": "false",
+              "description": "If true, the icon is placed to the right in relation to the text",
+              "fieldName": "iconRight",
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
@@ -4281,7 +4689,7 @@
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, used on conjunction with onClick property, second argument",
+              "description": "If defined, used on conjunction with onClick property. **Notice!** Only applicable to as=button.",
               "fieldName": "route",
               "inheritedFrom": {
                 "name": "SkfLink",
@@ -4312,24 +4720,22 @@
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
               }
-            },
+            }
+          ],
+          "events": [
             {
-              "name": "type",
               "type": {
-                "text": "SkfLinkType"
-              },
-              "default": "'button'",
-              "description": "Defines the type of button",
-              "fieldName": "type",
-              "expandedType": {
-                "text": "'submit' | 'reset' | 'button'"
+                "text": "CustomEvent"
               },
+              "description": "Fired when the link is clicked",
+              "name": "skf-link-click",
               "inheritedFrom": {
                 "name": "SkfLink",
                 "module": "src/components/link/link.component.ts"
               }
             }
-          ]
+          ],
+          "modulePath": "src/components/menu/menu-item.component.ts"
         }
       ],
       "exports": [
@@ -4354,11 +4760,28 @@
           "name": "SkfMenu",
           "slots": [
             {
-              "description": "The menu popover content",
+              "description": "The menu content",
               "name": ""
             }
           ],
-          "members": [],
+          "members": [
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that opens the menu",
+              "name": "open()",
+              "kind": "field"
+            },
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that closes the menu",
+              "name": "close()",
+              "kind": "field"
+            }
+          ],
           "events": [
             {
               "type": {
@@ -4397,7 +4820,8 @@
             "package": "@internal/base-classes/popover/popover.base.js"
           },
           "tagName": "skf-menu",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/menu/menu.component.ts"
         }
       ],
       "exports": [
@@ -4412,77 +4836,6 @@
       ],
       "typeDefinitionPath": "components/menu/menu.d.ts"
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/nav/nav-item.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The `<skf-nav>` is a component that displays a list of <nav-items>.",
-          "name": "SkfNavItem",
-          "slots": [
-            {
-              "description": "The component's main content",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "href",
-              "type": {
-                "text": "string"
-              },
-              "default": "'#'",
-              "attribute": "href",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "icon",
-              "type": {
-                "text": "SkfLink['icon'] | undefined"
-              },
-              "attribute": "icon"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "href",
-              "type": {
-                "text": "string"
-              },
-              "default": "'#'",
-              "fieldName": "href"
-            },
-            {
-              "name": "icon",
-              "type": {
-                "text": "SkfLink['icon'] | undefined"
-              },
-              "fieldName": "icon"
-            }
-          ],
-          "superclass": {
-            "name": "SkfElement",
-            "package": "@internal/components/skf-element"
-          },
-          "tagName": "skf-nav-item",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SkfNavItem",
-          "declaration": {
-            "name": "SkfNavItem",
-            "module": "src/components/nav/nav-item.component.ts"
-          }
-        }
-      ],
-      "typeDefinitionPath": "components/nav/nav-item.d.ts"
-    },
     {
       "kind": "javascript-module",
       "path": "components/popover/popover.js",
@@ -4517,6 +4870,22 @@
               "default": "false",
               "description": "If true, hides the arrow",
               "attribute": "hideArrow"
+            },
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that opens the popover",
+              "name": "open()",
+              "kind": "field"
+            },
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that closes the popover",
+              "name": "close()",
+              "kind": "field"
             }
           ],
           "events": [
@@ -4524,14 +4893,14 @@
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when the menu is opened",
+              "description": "Fired when the popover is opened",
               "name": "skf-opened"
             },
             {
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when the menu is closed",
+              "description": "Fired when the popover is closed",
               "name": "skf-closed"
             }
           ],
@@ -4548,7 +4917,7 @@
               "type": {
                 "text": "string"
               },
-              "description": "The id of the element the menu will be anchored to",
+              "description": "The id of the element the popover will be anchored to",
               "name": "anchor"
             },
             {
@@ -4575,7 +4944,8 @@
             "package": "@internal/base-classes/popover/popover.base.js"
           },
           "tagName": "skf-popover",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/popover/popover.component.ts"
         }
       ],
       "exports": [
@@ -4608,6 +4978,22 @@
               "static": true,
               "default": "true"
             },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "animated",
@@ -4616,8 +5002,7 @@
               },
               "default": "false",
               "description": "If true, the progress-bar's fill value is animated",
-              "attribute": "animated",
-              "reflects": true
+              "attribute": "animated"
             },
             {
               "kind": "field",
@@ -4674,7 +5059,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-progress",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/progress/progress.component.ts"
         }
       ],
       "exports": [
@@ -4704,6 +5090,13 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "debug",
@@ -4746,21 +5139,25 @@
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "attribute": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
               "kind": "field",
-              "name": "requiredLabel",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
+              "description": "If defined, adds name to the input-element",
+              "attribute": "name"
             },
             {
               "kind": "field",
@@ -4865,20 +5262,24 @@
               "fieldName": "label"
             },
             {
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "fieldName": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "name": "required-label",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
+              "description": "If defined, adds name to the input-element",
+              "fieldName": "name"
             },
             {
               "name": "size",
@@ -4921,7 +5322,8 @@
             "package": "@internal/components/formBase.js"
           },
           "tagName": "skf-radio",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/radio/radio.component.ts"
         }
       ],
       "exports": [
@@ -5037,7 +5439,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-segmented-button-item",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/segmented-button/segmented-button-item.component.ts"
         }
       ],
       "exports": [
@@ -5094,7 +5497,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-segmented-button",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/segmented-button/segmented-button.component.ts"
         }
       ],
       "exports": [
@@ -5124,6 +5528,22 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "label",
@@ -5133,6 +5553,14 @@
               "default": "'Default label'",
               "attribute": "label",
               "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "small",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
             }
           ],
           "attributes": [
@@ -5150,7 +5578,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-select-option-group",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/select/select-option-group.component.ts"
         }
       ],
       "exports": [
@@ -5180,16 +5609,41 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "'sm' | 'md'"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Specifies Tag size",
               "attribute": "size",
-              "reflects": true
+              "expandedType": {
+                "text": "'sm' | 'md'"
+              }
             },
             {
               "kind": "field",
@@ -5211,11 +5665,23 @@
               },
               "description": "If defined, gives the supplied appearance",
               "attribute": "color",
-              "reflects": true,
               "expandedType": {
                 "text": "'error' | 'info' | 'warning' | 'success' | undefined"
               }
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "onClick",
@@ -5234,19 +5700,21 @@
               },
               "default": "false",
               "description": "If true, adds trailing button to remove tag",
-              "attribute": "removable",
-              "reflects": true
+              "attribute": "removable"
             }
           ],
           "attributes": [
             {
               "name": "size",
               "type": {
-                "text": "'sm' | 'md'"
+                "text": "Size"
               },
               "default": "'md'",
               "description": "Specifies Tag size",
-              "fieldName": "size"
+              "fieldName": "size",
+              "expandedType": {
+                "text": "'sm' | 'md'"
+              }
             },
             {
               "name": "icon",
@@ -5260,14 +5728,26 @@
               }
             },
             {
-              "name": "color",
+              "name": "color",
+              "type": {
+                "text": "Severity | undefined"
+              },
+              "description": "If defined, gives the supplied appearance",
+              "fieldName": "color",
+              "expandedType": {
+                "text": "'error' | 'info' | 'warning' | 'success' | undefined"
+              }
+            },
+            {
+              "name": "lang",
               "type": {
-                "text": "Severity | undefined"
+                "text": "Language"
               },
-              "description": "If defined, gives the supplied appearance",
-              "fieldName": "color",
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
               "expandedType": {
-                "text": "'error' | 'info' | 'warning' | 'success' | undefined"
+                "text": "'en' | 'es' | 'pt' | 'sv'"
               }
             },
             {
@@ -5285,7 +5765,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-tag",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/tag/tag.component.ts"
         }
       ],
       "exports": [
@@ -5317,11 +5798,32 @@
           "members": [
             {
               "kind": "field",
-              "name": "buttonLabel",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "_componentIsConnected",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "_defaultButtonLabel",
               "type": {
                 "text": "string"
               },
-              "default": "'Select an option'",
+              "privacy": "private",
+              "default": "'Select an option'"
+            },
+            {
+              "kind": "field",
+              "name": "buttonLabel",
               "description": "Sets the first visible text on the component",
               "attribute": "button-label",
               "reflects": true
@@ -5385,6 +5887,19 @@
               "attribute": "label",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "max",
@@ -5423,15 +5938,6 @@
               "description": "If defined, set name of the component",
               "attribute": "name"
             },
-            {
-              "kind": "field",
-              "name": "requiredLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
-            },
             {
               "kind": "field",
               "name": "severity",
@@ -5465,11 +5971,21 @@
             {
               "kind": "field",
               "name": "value",
-              "description": "Read only, returns the selected value. (if multiple: in a comma separated string)"
+              "description": "Returns the selected value. (if multiple: in a comma separated string). If set will default set corresponding option."
+            },
+            {
+              "kind": "method",
+              "name": "_handleSizeUpdate",
+              "type": {
+                "text": "_handleSizeUpdate() => void"
+              }
             },
             {
               "kind": "method",
-              "name": "handleExpandedChange"
+              "name": "handleExpandedChange",
+              "type": {
+                "text": "handleExpandedChange() => void"
+              }
             },
             {
               "kind": "field",
@@ -5515,6 +6031,13 @@
               },
               "description": "{detail: {value: string | null, option: SkfSelectOption}} Fired when the select dropdown is toggled",
               "name": "skf-select-option-select"
+            },
+            {
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fires when the select options are connected, useful for setting selected option(s) via value property. E.g mySkfSelect.value = 'option1,option2';",
+              "name": "skf-select-connected"
             }
           ],
           "attributes": [
@@ -5536,10 +6059,6 @@
             },
             {
               "name": "button-label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Select an option'",
               "description": "Sets the first visible text on the component",
               "fieldName": "buttonLabel"
             },
@@ -5585,6 +6104,18 @@
               "description": "If defined, displays provided label",
               "fieldName": "label"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "max",
               "type": {
@@ -5618,14 +6149,6 @@
               "description": "If defined, set name of the component",
               "fieldName": "name"
             },
-            {
-              "name": "required-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
-            },
             {
               "name": "severity",
               "type": {
@@ -5658,7 +6181,8 @@
             "package": "@internal/components/formBase.js"
           },
           "tagName": "skf-select",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/select/select.component.ts"
         }
       ],
       "exports": [
@@ -5679,7 +6203,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "The `<skf-select-option>` is a component is used nested in a skf-select or skf-select-option-group.",
+          "description": "The `<skf-select-option>` is a component is used nested in a skf-select or skf-select-option-group.\nIt represents an individual option in a select dropdown.",
           "name": "SkfSelectOption",
           "slots": [
             {
@@ -5701,6 +6225,22 @@
               "static": true,
               "default": "{ ...LitElement.shadowRootOptions, delegatesFocus: true }"
             },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
+              "type": {
+                "text": "ElementInternals"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
+              }
+            },
             {
               "kind": "field",
               "name": "disabled",
@@ -5735,7 +6275,7 @@
               "attribute": "icon-color",
               "reflects": true,
               "expandedType": {
-                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasised' | 'secondary' | 'success' | undefined"
+                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasized' | 'secondary' | 'purple' | 'success' | undefined"
               }
             },
             {
@@ -5767,21 +6307,17 @@
             {
               "kind": "field",
               "name": "value",
-              "description": "Returns or sets the tags value. If value is omitted, defaults to the tags text.",
+              "description": "Returns or sets the option value. If value is omitted, defaults to the tags slotted text.",
               "attribute": "value",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "role",
+              "name": "small",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'option'"
-            },
-            {
-              "kind": "field",
-              "name": "_parent"
+              "default": "false"
             },
             {
               "kind": "field",
@@ -5827,7 +6363,7 @@
               "description": "If defined, sets provided color on the icon",
               "fieldName": "iconColor",
               "expandedType": {
-                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasised' | 'secondary' | 'success' | undefined"
+                "text": "'error' | 'info' | 'warning' | 'primary' | 'inverse' | 'emphasized' | 'secondary' | 'purple' | 'success' | undefined"
               }
             },
             {
@@ -5849,7 +6385,7 @@
             },
             {
               "name": "value",
-              "description": "Returns or sets the tags value. If value is omitted, defaults to the tags text.",
+              "description": "Returns or sets the option value. If value is omitted, defaults to the tags slotted text.",
               "fieldName": "value"
             }
           ],
@@ -5858,7 +6394,8 @@
             "package": "@internal/components/skf-element.js"
           },
           "tagName": "skf-select-option",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/select/select-option.component.ts"
         }
       ],
       "exports": [
@@ -5929,14 +6466,6 @@
             {
               "kind": "field",
               "name": "_setInternalState"
-            },
-            {
-              "kind": "field",
-              "name": "role",
-              "type": {
-                "text": "string"
-              },
-              "default": "'listitem'"
             }
           ],
           "events": [
@@ -5969,7 +6498,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-stepper-item",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/stepper/stepper-item.component.ts"
         }
       ],
       "exports": [
@@ -6054,7 +6584,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-stepper",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/stepper/stepper.component.ts"
         }
       ],
       "exports": [
@@ -6084,6 +6615,13 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "debug",
@@ -6127,21 +6665,25 @@
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "attribute": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
               "kind": "field",
-              "name": "requiredLabel",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
+              "description": "If defined, adds name to the input-element",
+              "attribute": "name"
             },
             {
               "kind": "field",
@@ -6166,7 +6708,10 @@
             },
             {
               "kind": "method",
-              "name": "debugOutput"
+              "name": "debugOutput",
+              "type": {
+                "text": "debugOutput() => void"
+              }
             }
           ],
           "attributes": [
@@ -6222,20 +6767,24 @@
               "fieldName": "label"
             },
             {
-              "name": "name",
+              "name": "lang",
               "type": {
-                "text": "string | undefined"
+                "text": "Language"
               },
-              "description": "If defined, adds name to the input-element",
-              "fieldName": "name"
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
             },
             {
-              "name": "required-label",
+              "name": "name",
               "type": {
                 "text": "string | undefined"
               },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
+              "description": "If defined, adds name to the input-element",
+              "fieldName": "name"
             },
             {
               "name": "size",
@@ -6261,7 +6810,8 @@
             "package": "@internal/components/formBase.js"
           },
           "tagName": "skf-switch",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/switch/switch.component.ts"
         }
       ],
       "exports": [
@@ -6278,7 +6828,7 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/tab-panel/tab-panel.js",
+      "path": "components/tabs/tab-panel.js",
       "declarations": [
         {
           "kind": "class",
@@ -6308,14 +6858,6 @@
                 "text": "boolean"
               },
               "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "role",
-              "type": {
-                "text": "string"
-              },
-              "default": "'tabpanel'"
             }
           ],
           "attributes": [
@@ -6334,7 +6876,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-tab-panel",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/tabs/tab-panel.component.ts"
         }
       ],
       "exports": [
@@ -6343,20 +6886,20 @@
           "name": "SkfTabPanel",
           "declaration": {
             "name": "SkfTabPanel",
-            "module": "src/components/tab-panel/tab-panel.component.ts"
+            "module": "src/components/tabs/tab-panel.component.ts"
           }
         }
       ],
-      "typeDefinitionPath": "components/tab-panel/tab-panel.d.ts"
+      "typeDefinitionPath": "components/tabs/tab-panel.d.ts"
     },
     {
       "kind": "javascript-module",
-      "path": "components/tab-group/tab-group.js",
+      "path": "components/tabs/tabs.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The `<skf-tab-group>` is a component that displays a list of actions or options.",
-          "name": "SkfTabGroup",
+          "description": "The `<skf-tabs>` is a component that displays a list of actions or options",
+          "name": "SkfTabs",
           "slots": [
             {
               "description": "Used for grouping tab panels in the tab group. Must be <skf-tab-panel> elements",
@@ -6471,25 +7014,26 @@
             "name": "SkfElement",
             "package": "@internal/components/skf-element"
           },
-          "tagName": "skf-tab-group",
-          "customElement": true
+          "tagName": "skf-tabs",
+          "customElement": true,
+          "modulePath": "src/components/tabs/tabs.component.ts"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SkfTabGroup",
+          "name": "SkfTabs",
           "declaration": {
-            "name": "SkfTabGroup",
-            "module": "src/components/tab-group/tab-group.component.ts"
+            "name": "SkfTabs",
+            "module": "src/components/tabs/tabs.component.ts"
           }
         }
       ],
-      "typeDefinitionPath": "components/tab-group/tab-group.d.ts"
+      "typeDefinitionPath": "components/tabs/tabs.d.ts"
     },
     {
       "kind": "javascript-module",
-      "path": "components/tab/tab.js",
+      "path": "components/tabs/tab.js",
       "declarations": [
         {
           "kind": "class",
@@ -6525,17 +7069,9 @@
               "kind": "field",
               "name": "variant",
               "type": {
-                "text": "SkfTabGroup['variant']"
+                "text": "SkfTabs['variant']"
               },
               "default": "'expanded'"
-            },
-            {
-              "kind": "field",
-              "name": "role",
-              "type": {
-                "text": "string"
-              },
-              "default": "'tab'"
             }
           ],
           "events": [
@@ -6567,7 +7103,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-tab",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/tabs/tab.component.ts"
         }
       ],
       "exports": [
@@ -6576,11 +7113,11 @@
           "name": "SkfTab",
           "declaration": {
             "name": "SkfTab",
-            "module": "src/components/tab/tab.component.ts"
+            "module": "src/components/tabs/tab.component.ts"
           }
         }
       ],
-      "typeDefinitionPath": "components/tab/tab.d.ts"
+      "typeDefinitionPath": "components/tabs/tab.d.ts"
     },
     {
       "kind": "javascript-module",
@@ -6597,6 +7134,13 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "cols",
@@ -6651,6 +7195,19 @@
               "description": "If defined, sets the input's label unless the default slot is used. Alternatively, you can use the `label` attribute.",
               "attribute": "label"
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "kind": "field",
               "name": "name",
@@ -6697,15 +7254,6 @@
               "description": "If true, makes the element not mutable, meaning the user can not edit the control",
               "attribute": "readonly"
             },
-            {
-              "kind": "field",
-              "name": "requiredLabel",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "attribute": "required-label"
-            },
             {
               "kind": "field",
               "name": "rows",
@@ -6840,6 +7388,18 @@
               "description": "If defined, sets the input's label unless the default slot is used. Alternatively, you can use the `label` attribute.",
               "fieldName": "label"
             },
+            {
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              }
+            },
             {
               "name": "name",
               "type": {
@@ -6881,14 +7441,6 @@
               "description": "If true, makes the element not mutable, meaning the user can not edit the control",
               "fieldName": "readonly"
             },
-            {
-              "name": "required-label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "If defined, renders an alternative A11y text for the asterisk",
-              "fieldName": "requiredLabel"
-            },
             {
               "name": "rows",
               "type": {
@@ -6947,7 +7499,8 @@
             "package": "@internal/components/formBase.js"
           },
           "tagName": "skf-textarea",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/textarea/textarea.component.ts"
         }
       ],
       "exports": [
@@ -7060,13 +7613,34 @@
             },
             {
               "kind": "field",
-              "name": "buttonLabel",
+              "name": "#localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)",
+              "inheritedFrom": {
+                "name": "SkfAlert",
+                "module": "src/components/alert/alert.component.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#internals",
+              "privacy": "private",
               "type": {
-                "text": "string"
+                "text": "ElementInternals"
+              },
+              "inheritedFrom": {
+                "name": "SkfAlert",
+                "module": "src/components/alert/alert.component.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#states",
+              "privacy": "private",
+              "type": {
+                "text": "CustomStateSet"
               },
-              "default": "'Close'",
-              "description": "Close button aria-label",
-              "attribute": "button-label",
               "inheritedFrom": {
                 "name": "SkfAlert",
                 "module": "src/components/alert/alert.component.ts"
@@ -7088,6 +7662,23 @@
                 "module": "src/components/alert/alert.component.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "lang",
+              "type": {
+                "text": "Language"
+              },
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "attribute": "lang",
+              "expandedType": {
+                "text": "'en' | 'es' | 'pt' | 'sv'"
+              },
+              "inheritedFrom": {
+                "name": "SkfAlert",
+                "module": "src/components/alert/alert.component.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "persistent",
@@ -7097,7 +7688,6 @@
               "default": "false",
               "description": "If true, renders with an close button and sets aria-role to `status`",
               "attribute": "persistent",
-              "reflects": true,
               "inheritedFrom": {
                 "name": "SkfAlert",
                 "module": "src/components/alert/alert.component.ts"
@@ -7111,7 +7701,6 @@
               },
               "description": "If defined, gives the supplied appearance",
               "attribute": "severity",
-              "reflects": true,
               "expandedType": {
                 "text": "'error' | 'info' | 'warning' | 'success' | undefined"
               },
@@ -7131,27 +7720,30 @@
               "fieldName": "timer"
             },
             {
-              "name": "button-label",
+              "name": "icon",
               "type": {
-                "text": "string"
+                "text": "Icon | undefined"
+              },
+              "description": "If defined, displays leading icon",
+              "fieldName": "icon",
+              "expandedType": {
+                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
               },
-              "default": "'Close'",
-              "description": "Close button aria-label",
-              "fieldName": "buttonLabel",
               "inheritedFrom": {
                 "name": "SkfAlert",
                 "module": "src/components/alert/alert.component.ts"
               }
             },
             {
-              "name": "icon",
+              "name": "lang",
               "type": {
-                "text": "Icon | undefined"
+                "text": "Language"
               },
-              "description": "If defined, displays leading icon",
-              "fieldName": "icon",
+              "default": "'en'",
+              "description": "Sets the internal language of the component",
+              "fieldName": "lang",
               "expandedType": {
-                "text": "'addCircleOutline' | 'addCircle' | 'addPlus' | 'arrowBackIos' | 'arrowBack' | 'arrowDown' | 'arrowForwardIos' | 'arrowForward' | 'arrowLeft' | 'arrowRight' | 'arrowUpDown' | 'arrowUp' | 'article' | 'asset' | 'attachment' | 'bandCursor' | 'bands' | 'batteryEmpty' | 'batteryFull' | 'batteryLow' | 'bearingFault' | 'bluetoothDisabled' | 'bluetooth' | 'book' | 'bookmarkOutline' | 'bookmark' | 'calculator' | 'calendarBusy' | 'calendarCheck' | 'calendarEmpty' | 'calendarMonth' | 'calendarReccuring' | 'call' | 'caretDown' | 'caretUpDown' | 'caretUp' | 'chat' | 'checkCircleOutline' | 'checkCircle' | 'checkSmall' | 'check' | 'chevronDownUp' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUpDown' | 'chevronUp' | 'chip' | 'circleStatus' | 'closeAll' | 'closeAlt' | 'close' | 'columnGraph' | 'comment' | 'connection0' | 'connection1' | 'connection2' | 'connection3' | 'connection4' | 'contentPaste' | 'copy' | 'cpmCyclesPerMinute' | 'dangerOutline' | 'danger' | 'defectFrequenciesAlt' | 'defectFrequencies' | 'deleteOutline' | 'delete' | 'devices' | 'directions' | 'doubleChevronLeft' | 'doubleChevronRight' | 'downloadDone' | 'download' | 'draftOutline' | 'draft' | 'dragDrop' | 'drop' | 'duplicate' | 'editOutline' | 'edit' | 'emailOutline' | 'emailPdf' | 'email' | 'errorOutline' | 'error' | 'exclamation' | 'facebook' | 'filterOutline' | 'filter' | 'findReplace' | 'forbidden' | 'frequencyHz' | 'fullScreen' | 'fullscreenExit' | 'functionalGroup' | 'hamburgerMenu' | 'harmonicCursor' | 'heatmap' | 'hierarchy' | 'history' | 'homeOutline' | 'home' | 'hourglassOutline' | 'hourglass' | 'image' | 'imx' | 'infoOutline' | 'info' | 'instagram' | 'integration' | 'iosShare' | 'kebabMore' | 'language' | 'lightbulbOutline' | 'lightbulb' | 'link' | 'linkedin' | 'listGroup' | 'list' | 'locationPin' | 'lockOutline' | 'lock' | 'logOut' | 'login' | 'meatballsMoreCircle' | 'meatballsMore' | 'microphone' | 'nearMe' | 'noData' | 'notificationsBellOutline' | 'notificationsBell' | 'o' | 'offer' | 'openInNew' | 'overlaysBaseline' | 'pan360' | 'paper' | 'pause' | 'pdfOutline' | 'pdf' | 'person' | 'photoCameraOutline' | 'photoCamera' | 'pieChart' | 'pinOutline' | 'pin' | 'play' | 'powerOff' | 'printOutline' | 'print' | 'privacyPolicyOutline' | 'privacyPolicy' | 'proCollect' | 'recAction' | 'refresh' | 'removeMinus' | 'reorder' | 'reply' | 'report' | 'rewakableRoute' | 'route' | 'search' | 'sendOutline' | 'send' | 'sensorAlt' | 'sensor' | 'settingsOutline' | 'settings' | 'share' | 'shoppingCart' | 'sidebandCursor' | 'singleCursor' | 'skfBearing' | 'spectrum' | 'starOutline' | 'star' | 'stop' | 'sync' | 'time' | 'timewave' | 'translate' | 'trend' | 'trendingUp' | 'twitter' | 'undo' | 'unknownDiamondOutline' | 'unknownDiamond' | 'unknownOutline' | 'unknown' | 'unlink' | 'unlockOutline' | 'unlock' | 'unscheduledAction' | 'upload' | 'vibrationAlt' | 'vibration' | 'view3D' | 'viewFull' | 'viewHorizontal' | 'viewVertical' | 'visibilityOffOutline' | 'visibilityOff' | 'visibilityOutline' | 'visibility' | 'warningDiamondOutline' | 'warningDiamond' | 'warningOutline' | 'warning' | 'youtube' | 'zoomIn' | 'zoomOut' | undefined"
+                "text": "'en' | 'es' | 'pt' | 'sv'"
               },
               "inheritedFrom": {
                 "name": "SkfAlert",
@@ -7211,6 +7803,9 @@
           ],
           "events": [
             {
+              "type": {
+                "text": "CustomEvent"
+              },
               "description": "Fires when the close button is clicked",
               "name": "skf-alert-close",
               "inheritedFrom": {
@@ -7273,7 +7868,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-toast-wrapper",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/toast/toast-wrapper.component.ts"
         }
       ],
       "exports": [
@@ -7431,7 +8027,8 @@
             "package": "@internal/components/skf-element"
           },
           "tagName": "skf-toast",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/toast/toast.component.ts"
         }
       ],
       "exports": [
@@ -7461,39 +8058,6 @@
             }
           ],
           "members": [
-            {
-              "kind": "method",
-              "name": "openExtended"
-            },
-            {
-              "kind": "method",
-              "name": "closeExtended"
-            },
-            {
-              "kind": "method",
-              "name": "addEventListeners",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "$element",
-                  "type": {
-                    "text": "HTMLElement | Element"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "field",
-              "name": "role",
-              "type": {
-                "text": "string"
-              },
-              "default": "'tooltip'"
-            },
             {
               "kind": "field",
               "name": "offset",
@@ -7517,15 +8081,37 @@
                 "text": "string"
               },
               "default": "'tooltip'"
+            },
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that opens the tooltip",
+              "name": "open()",
+              "kind": "field"
+            },
+            {
+              "type": {
+                "text": "(void) => void"
+              },
+              "description": "Method that closes the tooltip",
+              "name": "close()",
+              "kind": "field"
             }
           ],
           "events": [
             {
-              "description": "Fired when the dropdown is opened",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the tooltip is opened",
               "name": "skf-opened"
             },
             {
-              "description": "Fired when the dropdown is closed",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the tooltip is closed",
               "name": "skf-closed"
             }
           ],
@@ -7551,7 +8137,8 @@
             "package": "@internal/base-classes/popover/popover.base.js"
           },
           "tagName": "skf-tooltip",
-          "customElement": true
+          "customElement": true,
+          "modulePath": "src/components/tooltip/tooltip.component.ts"
         }
       ],
       "exports": [