{
  "$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json",
  "version": 1.1,
  "tags": [
    {
      "name": "skf-accordion",
      "description": "The `<skf-accordion>` component consists of multiple `<skf-collapse>`, working together.\n\nSee [zeroheight](https://zeroheight.com/853e936c9/p/6590bf-accordion) for design principles.\n---\n\n\n### **Slots:**\n - _default_ - Expects one or more <skf-accordion-item> element(s)",
      "attributes": [
        {
          "name": "animated",
          "description": "If true, will animate the expand/collapse state",
          "values": []
        },
        {
          "name": "heading-as",
          "description": "Defines which heading element will be rendered",
          "values": [
            { "name": "h1" },
            { "name": "h2" },
            { "name": "h3" },
            { "name": "h4" }
          ]
        },
        {
          "name": "gap",
          "description": "If true, adds a gap between each item",
          "values": []
        },
        {
          "name": "multiple",
          "description": "If true, allowes multiple accordion items to open",
          "values": []
        },
        {
          "name": "small",
          "description": "If true, renders the small version",
          "values": []
        },
        {
          "name": "truncate",
          "description": "If true, will truncate all headings in collapsed state",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-button",
      "description": "Component to be used in forms or for interactivity\n---\n\n\n### **Slots:**\n - _default_ - The Primary content",
      "attributes": [
        {
          "name": "destructive",
          "description": "If true, gives destructive appearance. **Notice!** Only applicable if `variant` is `primary`.",
          "values": []
        },
        {
          "name": "disabled",
          "description": "If true, removes border",
          "values": []
        },
        {
          "name": "icon",
          "description": "If provided, renders an icon before or after the text",
          "values": [
            { "name": "arrowDown" },
            { "name": "arrowDownUp" },
            { "name": "arrowLeft" },
            { "name": "arrowRight" },
            { "name": "arrowUp" },
            { "name": "article" },
            { "name": "artificialIntelligence" },
            { "name": "asset" },
            { "name": "attachment" },
            { "name": "bandCursor" },
            { "name": "bands" },
            { "name": "batteryEmpty" },
            { "name": "batteryFull" },
            { "name": "batteryLow" },
            { "name": "bearingFault" },
            { "name": "book" },
            { "name": "bulb" },
            { "name": "burger" },
            { "name": "cPM" },
            { "name": "calendar" },
            { "name": "calendarBooked" },
            { "name": "calendarEmpty" },
            { "name": "calendarNotBooked" },
            { "name": "calendarRecurring" },
            { "name": "caretDown" },
            { "name": "caretUp" },
            { "name": "caretUpDown" },
            { "name": "chat" },
            { "name": "check" },
            { "name": "checkCircle" },
            { "name": "checkSmall" },
            { "name": "chevronDown" },
            { "name": "chevronLeft" },
            { "name": "chevronRight" },
            { "name": "chevronUp" },
            { "name": "chevronUpDown" },
            { "name": "close" },
            { "name": "closeAllFaults" },
            { "name": "closeFault" },
            { "name": "closeSmall" },
            { "name": "columnGraph" },
            { "name": "comment" },
            { "name": "connection1" },
            { "name": "connection2" },
            { "name": "connection3" },
            { "name": "connection4" },
            { "name": "danger" },
            { "name": "defectFrequencies" },
            { "name": "defectFrequenciesAlternative" },
            { "name": "doubleChevronLeft" },
            { "name": "doubleChevronRight" },
            { "name": "download" },
            { "name": "draft" },
            { "name": "draftFilled" },
            { "name": "draftOutlined" },
            { "name": "dragNDrop" },
            { "name": "drop" },
            { "name": "duplicate" },
            { "name": "edit" },
            { "name": "emailFilled" },
            { "name": "emailOutlined" },
            { "name": "exclamation" },
            { "name": "eye" },
            { "name": "eyeHidden" },
            { "name": "eyeVisible" },
            { "name": "filter" },
            { "name": "forbidden" },
            { "name": "fullScreen" },
            { "name": "fullScreenExit" },
            { "name": "functionalLocation" },
            { "name": "harmonicCursor" },
            { "name": "heatmap" },
            { "name": "hierarchy" },
            { "name": "history" },
            { "name": "historyAlt" },
            { "name": "hourglassFramedFilled" },
            { "name": "hourglassFramedOutlined" },
            { "name": "hourglassOutlined" },
            { "name": "hz" },
            { "name": "iMX" },
            { "name": "image" },
            { "name": "infoCircleFilled" },
            { "name": "infoCircleOutlined" },
            { "name": "integration" },
            { "name": "kebab" },
            { "name": "link" },
            { "name": "listGroup" },
            { "name": "listItem" },
            { "name": "locationPin" },
            { "name": "lock" },
            { "name": "logOut" },
            { "name": "meatballs" },
            { "name": "microphone" },
            { "name": "minus" },
            { "name": "minusSmall" },
            { "name": "noData" },
            { "name": "o" },
            { "name": "openInNew" },
            { "name": "overlayBaseline" },
            { "name": "pDF" },
            { "name": "paper" },
            { "name": "pause" },
            { "name": "pieChart" },
            { "name": "pin" },
            { "name": "play" },
            { "name": "plus" },
            { "name": "powerOff" },
            { "name": "printer" },
            { "name": "proCollect" },
            { "name": "recAction" },
            { "name": "received" },
            { "name": "refresh" },
            { "name": "reorder" },
            { "name": "replace" },
            { "name": "reply" },
            { "name": "rewalkableRoute" },
            { "name": "routes" },
            { "name": "search" },
            { "name": "send" },
            { "name": "sensorA" },
            { "name": "sensorB" },
            { "name": "settings" },
            { "name": "sidebandCursor" },
            { "name": "singleCursor" },
            { "name": "spectrum" },
            { "name": "starFilled" },
            { "name": "starOutlined" },
            { "name": "statusCircle" },
            { "name": "stop" },
            { "name": "structuralVibration" },
            { "name": "sync" },
            { "name": "timewave" },
            { "name": "trash" },
            { "name": "trend" },
            { "name": "trendingUp" },
            { "name": "undo" },
            { "name": "unknownCircle" },
            { "name": "unknownDiamond" },
            { "name": "unlink" },
            { "name": "unlock" },
            { "name": "unscheduledAction" },
            { "name": "upload" },
            { "name": "user" },
            { "name": "viewFull" },
            { "name": "viewHorizontal" },
            { "name": "viewVertical" },
            { "name": "warning" },
            { "name": "warningCircle" },
            { "name": "warningDiamond" },
            { "name": "zoomIn" },
            { "name": "zoomOut" }
          ]
        },
        {
          "name": "icon-position",
          "description": "If provided, determines the positioning of the icon in relation to the text",
          "values": [{ "name": "left" }, { "name": "right" }]
        },
        {
          "name": "loading",
          "description": "If true, hides text & icon and shows loading indicator. **Notice!** Only applicable if `variant` is `primary`.",
          "values": []
        },
        {
          "name": "size",
          "description": "If provided, displays an alternative size",
          "values": [{ "name": "sm" }, { "name": "md" }, { "name": "lg" }]
        },
        {
          "name": "type",
          "description": "If provided, changes the button type",
          "values": [
            { "name": "button" },
            { "name": "submit" },
            { "name": "reset" }
          ]
        },
        {
          "name": "variant",
          "description": "If provided, alters the appearance",
          "values": [{ "name": "primary" }, { "name": "secondary" }]
        }
      ],
      "references": []
    },
    {
      "name": "skf-card",
      "description": "The `<skf-card>` can be used to group related subjects in a container\n---\n\n\n### **Slots:**\n - _default_ - The card's main content",
      "attributes": [
        {
          "name": "no-border",
          "description": "If true, removes border",
          "values": []
        },
        {
          "name": "no-padding",
          "description": "If true, removes padding",
          "values": []
        },
        {
          "name": "stretch",
          "description": "If true, the Card fills the parent element height",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-alert",
      "description": "The `<skf-alert>` is a type of notification that appears in-line\n---\n\n\n### **Events:**\n - **skf-alert-close** - Fires when the close button is clicked\n\n### **Slots:**\n - _default_ - Alert message. **Notice!** See design principles for approved content\n- **link** - Slot for the link",
      "attributes": [
        {
          "name": "closeable",
          "description": "If true, alert is being used as a toast (alertdialog) with an close button",
          "values": []
        },
        {
          "name": "button-label",
          "description": "Close button aria-label",
          "values": []
        },
        {
          "name": "icon",
          "description": "If defined, displays leading icon",
          "values": [{ "name": "SkfIcon['name']" }]
        },
        {
          "name": "severity",
          "description": "If defined, gives the supplied appearance",
          "values": [
            { "name": "error" },
            { "name": "info" },
            { "name": "warning" },
            { "name": "success" },
            { "name": "alert" }
          ]
        }
      ],
      "references": []
    },
    {
      "name": "skf-checkbox",
      "description": "The `<skf-checkbox>` component is used to create a checkbox input\n---\n\n\n### **Events:**\n - **change** - {object} - When the value of the input changes\n\n### **Slots:**\n - _default_ - The Radios label. Alternatively, you can use the `label` attribute.",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, sets disabled state",
          "values": []
        },
        {
          "name": "required",
          "description": "If true, value is required or must be checked for the form to be submittable",
          "values": []
        },
        {
          "name": "debug",
          "description": "If defined, outputs helping hints in console",
          "values": []
        },
        {
          "name": "checked",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "custom-invalid",
          "description": "If true, forces component to invalid state until removed",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "indeterminate",
          "description": "If true and the checkbox is unchecked, the checkbox will appear indeterminate",
          "values": []
        },
        {
          "name": "label",
          "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "severity",
          "description": "If defined, styles checkbox using provided severity",
          "values": [
            { "name": "alert" },
            { "name": "success" },
            { "name": "info" },
            { "name": "warning" }
          ]
        },
        {
          "name": "show-valid",
          "description": "If true, displays valid state after interaction",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the checkbox",
          "values": [{ "name": "sm" }, { "name": "md" }]
        },
        {
          "name": "value",
          "description": "The current value of the input field",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-divider",
      "description": "The `<Divider>` component can separate items from each other, to visually emphasize their lack of a relationship between groups of information\n---\n\n\n### **CSS Properties:**\n - **--skf-divider-spacing** - The amount of space the divider occupies. Pass valid CSS **margin-block** values when horizontal and **margin-inline** when vertical _(default: undefined)_\n- **--skf-divider-inset** - The amount of space the divider should be indented. Pass valid CSS **margin-inline** values when horizontal and **margin-block** when vertical _(default: undefined)_",
      "attributes": [
        {
          "name": "color",
          "description": "Defines the Divider color",
          "values": [
            { "name": "emphasised" },
            { "name": "primary" },
            { "name": "secondary" },
            { "name": "tertiary" },
            { "name": "inverse" }
          ]
        },
        {
          "name": "decorative",
          "description": "If true, renders a div for presentational purpose instead of the semantic hr-element",
          "values": []
        },
        {
          "name": "vertical",
          "description": "If true, renders the divider vertically",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-collapse",
      "description": "The `<skf-collapse>` component is a general purpose container for content that can be collapsed / expanded.\n\nSee [zeroheight](https://zeroheight.com/853e936c9/p/6590bf-accordion) for design principles.\n---\n\n\n### **Events:**\n - **skf-collapse-toggle** - Event emitted when toggled\n\n### **Methods:**\n - **setClose()** - Class method as alternative to manipulate attribute\n- **setOpen()** - Class method as alternative to manipulate attribute\n\n### **Slots:**\n - _default_ - Main content",
      "attributes": [
        {
          "name": "animated",
          "description": "If true, will animate the expand/collapse state",
          "values": []
        },
        {
          "name": "expanded",
          "description": "If true, will set the collapse to be expanded by default",
          "values": []
        },
        {
          "name": "heading",
          "description": "Heading for the collapse",
          "values": []
        },
        {
          "name": "heading-as",
          "description": "Defines which heading element will be rendered",
          "values": [
            { "name": "h1" },
            { "name": "h2" },
            { "name": "h3" },
            { "name": "h4" }
          ]
        },
        {
          "name": "small",
          "description": "If true, renders the small version",
          "values": []
        },
        {
          "name": "truncate",
          "description": "If true, will truncate the heading in collapsed state",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-heading",
      "description": "The `<Heading>` component is to deliniate content on a page. When using, take note not to skip heading levels.<br>\nIt extends the interface of native html `<h1>` to `<h4>` elements.\n---\n\n\n### **Slots:**\n - _default_ - The headings content",
      "attributes": [
        {
          "name": "as",
          "description": "Controls which heading element will be rendered. Should not be used to affect appearance",
          "values": [
            { "name": "h1" },
            { "name": "h2" },
            { "name": "h3" },
            { "name": "h4" }
          ]
        },
        {
          "name": "styled-as",
          "description": "If provided, changes the appearance of the heading",
          "values": [
            { "name": "h1" },
            { "name": "h2" },
            { "name": "h3" },
            { "name": "h4" }
          ]
        }
      ],
      "references": []
    },
    {
      "name": "skf-icon",
      "description": "The `<skf-icon>` component is used to clarify interface elements. When used, should always be paired with (possibly invisible) text\n---\n",
      "attributes": [
        {
          "name": "color",
          "description": "Sets the color of the icon",
          "values": [
            { "name": "primary" },
            { "name": "inverse" },
            { "name": "emphasised" },
            { "name": "secondary" },
            { "name": "success" },
            { "name": "info" },
            { "name": "warning" },
            { "name": "error" },
            { "name": "alert" }
          ]
        },
        {
          "name": "label",
          "description": "If defined, adds an alternate description to use for assistive devices",
          "values": []
        },
        {
          "name": "name",
          "description": "Name of the icon to display",
          "values": [
            { "name": "arrowDown" },
            { "name": "arrowDownUp" },
            { "name": "arrowLeft" },
            { "name": "arrowRight" },
            { "name": "arrowUp" },
            { "name": "article" },
            { "name": "artificialIntelligence" },
            { "name": "asset" },
            { "name": "attachment" },
            { "name": "bandCursor" },
            { "name": "bands" },
            { "name": "batteryEmpty" },
            { "name": "batteryFull" },
            { "name": "batteryLow" },
            { "name": "bearingFault" },
            { "name": "book" },
            { "name": "bulb" },
            { "name": "burger" },
            { "name": "cPM" },
            { "name": "calendar" },
            { "name": "calendarBooked" },
            { "name": "calendarEmpty" },
            { "name": "calendarNotBooked" },
            { "name": "calendarRecurring" },
            { "name": "caretDown" },
            { "name": "caretUp" },
            { "name": "caretUpDown" },
            { "name": "chat" },
            { "name": "check" },
            { "name": "checkCircle" },
            { "name": "checkSmall" },
            { "name": "chevronDown" },
            { "name": "chevronLeft" },
            { "name": "chevronRight" },
            { "name": "chevronUp" },
            { "name": "chevronUpDown" },
            { "name": "close" },
            { "name": "closeAllFaults" },
            { "name": "closeFault" },
            { "name": "closeSmall" },
            { "name": "columnGraph" },
            { "name": "comment" },
            { "name": "connection1" },
            { "name": "connection2" },
            { "name": "connection3" },
            { "name": "connection4" },
            { "name": "danger" },
            { "name": "defectFrequencies" },
            { "name": "defectFrequenciesAlternative" },
            { "name": "doubleChevronLeft" },
            { "name": "doubleChevronRight" },
            { "name": "download" },
            { "name": "draft" },
            { "name": "draftFilled" },
            { "name": "draftOutlined" },
            { "name": "dragNDrop" },
            { "name": "drop" },
            { "name": "duplicate" },
            { "name": "edit" },
            { "name": "emailFilled" },
            { "name": "emailOutlined" },
            { "name": "exclamation" },
            { "name": "eye" },
            { "name": "eyeHidden" },
            { "name": "eyeVisible" },
            { "name": "filter" },
            { "name": "forbidden" },
            { "name": "fullScreen" },
            { "name": "fullScreenExit" },
            { "name": "functionalLocation" },
            { "name": "harmonicCursor" },
            { "name": "heatmap" },
            { "name": "hierarchy" },
            { "name": "history" },
            { "name": "historyAlt" },
            { "name": "hourglassFramedFilled" },
            { "name": "hourglassFramedOutlined" },
            { "name": "hourglassOutlined" },
            { "name": "hz" },
            { "name": "iMX" },
            { "name": "image" },
            { "name": "infoCircleFilled" },
            { "name": "infoCircleOutlined" },
            { "name": "integration" },
            { "name": "kebab" },
            { "name": "link" },
            { "name": "listGroup" },
            { "name": "listItem" },
            { "name": "locationPin" },
            { "name": "lock" },
            { "name": "logOut" },
            { "name": "meatballs" },
            { "name": "microphone" },
            { "name": "minus" },
            { "name": "minusSmall" },
            { "name": "noData" },
            { "name": "o" },
            { "name": "openInNew" },
            { "name": "overlayBaseline" },
            { "name": "pDF" },
            { "name": "paper" },
            { "name": "pause" },
            { "name": "pieChart" },
            { "name": "pin" },
            { "name": "play" },
            { "name": "plus" },
            { "name": "powerOff" },
            { "name": "printer" },
            { "name": "proCollect" },
            { "name": "recAction" },
            { "name": "received" },
            { "name": "refresh" },
            { "name": "reorder" },
            { "name": "replace" },
            { "name": "reply" },
            { "name": "rewalkableRoute" },
            { "name": "routes" },
            { "name": "search" },
            { "name": "send" },
            { "name": "sensorA" },
            { "name": "sensorB" },
            { "name": "settings" },
            { "name": "sidebandCursor" },
            { "name": "singleCursor" },
            { "name": "spectrum" },
            { "name": "starFilled" },
            { "name": "starOutlined" },
            { "name": "statusCircle" },
            { "name": "stop" },
            { "name": "structuralVibration" },
            { "name": "sync" },
            { "name": "timewave" },
            { "name": "trash" },
            { "name": "trend" },
            { "name": "trendingUp" },
            { "name": "undo" },
            { "name": "unknownCircle" },
            { "name": "unknownDiamond" },
            { "name": "unlink" },
            { "name": "unlock" },
            { "name": "unscheduledAction" },
            { "name": "upload" },
            { "name": "user" },
            { "name": "viewFull" },
            { "name": "viewHorizontal" },
            { "name": "viewVertical" },
            { "name": "warning" },
            { "name": "warningCircle" },
            { "name": "warningDiamond" },
            { "name": "zoomIn" },
            { "name": "zoomOut" }
          ]
        },
        {
          "name": "size",
          "description": "Size of the icon",
          "values": [
            { "name": "xs" },
            { "name": "sm" },
            { "name": "md" },
            { "name": "lg" }
          ]
        }
      ],
      "references": []
    },
    {
      "name": "skf-input",
      "description": "The skf-text-field is used to create a text input field. It can be used inside a form element or standalone.\n---\n\n\n### **Events:**\n - **change** - Fires when the value of the input changes\n- **invalid** - Fires when the input is invalid\n\n### **Slots:**\n - _default_ - The Inputs label. Alternatively, you can use the `label` attribute.",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, sets disabled state",
          "values": []
        },
        {
          "name": "required",
          "description": "If true, value is required or must be checked for the form to be submittable",
          "values": []
        },
        {
          "name": "button-aria-label-clear",
          "description": "Custom aria-label for the clear button. **Notice!** Only applicable to type=search.",
          "values": []
        },
        {
          "name": "button-aria-label-hide",
          "description": "Custom aria-label for the visibility button. **Notice!** Only applicable to type=password.",
          "values": []
        },
        {
          "name": "button-aria-label-show",
          "description": "Custom aria-label for the visibility button **Notice!** Only applicable to type=password.",
          "values": []
        },
        {
          "name": "custom-invalid",
          "description": "If defined, forces component to invalid state until removed. Its value is used as hint text.",
          "values": []
        },
        {
          "name": "debug",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "hint",
          "description": "If defined, displays informational text below the field",
          "values": []
        },
        {
          "name": "inputmode",
          "description": "Tells what keyboard to use if applicable",
          "values": [
            { "name": "none" },
            { "name": "text" },
            { "name": "tel" },
            { "name": "url" },
            { "name": "email" },
            { "name": "numeric" },
            { "name": "decimal" },
            { "name": "search" }
          ]
        },
        {
          "name": "label",
          "description": "If defined, sets the input's label. Alternatively, you can use the `label` attribute.",
          "values": []
        },
        {
          "name": "leading",
          "description": "If defined, displays a prefix/adornment before the input-element",
          "values": []
        },
        {
          "name": "max",
          "description": "If defined, sets the maximum value to accept for this input",
          "values": []
        },
        {
          "name": "maxlength",
          "description": "If defined, sets the maximum character length to accept for this input",
          "values": []
        },
        {
          "name": "min",
          "description": "If defined, sets the minimum value to accept for this input",
          "values": []
        },
        {
          "name": "minlength",
          "description": "If defined, sets the minimum character length to accept for this input",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "pattern",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "placeholder",
          "description": "If defined, displays placeholder text",
          "values": []
        },
        {
          "name": "readonly",
          "description": "If true, makes the element not mutable, meaning the user can not edit the control",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "severity",
          "description": "If defined, displays provided severity state",
          "values": [
            { "name": "alert" },
            { "name": "success" },
            { "name": "info" },
            { "name": "warning" }
          ]
        },
        {
          "name": "show-valid",
          "description": "If true, displays valid state after interaction",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the input",
          "values": [{ "name": "sm" }, { "name": "md" }]
        },
        {
          "name": "trailing",
          "description": "If defined, displays a suffix/adornment after the input-element",
          "values": []
        },
        {
          "name": "type",
          "description": "Type of input control",
          "values": [
            { "name": "button" },
            { "name": "color" },
            { "name": "date" },
            { "name": "datetime-local" },
            { "name": "email" },
            { "name": "file" },
            { "name": "hidden" },
            { "name": "image" },
            { "name": "month" },
            { "name": "number" },
            { "name": "password" },
            { "name": "range" },
            { "name": "reset" },
            { "name": "search" },
            { "name": "submit" },
            { "name": "tel" },
            { "name": "text" },
            { "name": "time" },
            { "name": "url" },
            { "name": "week" }
          ]
        },
        {
          "name": "validate-on",
          "description": "Sets validation start",
          "values": [
            { "name": "input" },
            { "name": "change" },
            { "name": "submit" }
          ]
        },
        {
          "name": "value",
          "description": "The current value of the input field",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-link",
      "description": "The `<skf-link>` can be used as either a regular link or a link styled semantic button\n---\n\n\n### **Slots:**\n - _default_ - The links' main content",
      "attributes": [
        {
          "name": "as",
          "description": "Defines the semantic element to render",
          "values": [{ "name": "button" }, { "name": "a" }]
        },
        {
          "name": "color",
          "description": "Defines the text-color",
          "values": [{ "name": "primary" }, { "name": "inverse" }]
        },
        {
          "name": "disabled",
          "description": "If true, disables the link",
          "values": []
        },
        {
          "name": "download",
          "description": "If defined, downloads the url",
          "values": []
        },
        {
          "name": "href",
          "description": "If defined, loads url on click",
          "values": []
        },
        {
          "name": "icon",
          "description": "If defined, renders an icon before or after the text",
          "values": [
            { "name": "arrowDown" },
            { "name": "arrowDownUp" },
            { "name": "arrowLeft" },
            { "name": "arrowRight" },
            { "name": "arrowUp" },
            { "name": "article" },
            { "name": "artificialIntelligence" },
            { "name": "asset" },
            { "name": "attachment" },
            { "name": "bandCursor" },
            { "name": "bands" },
            { "name": "batteryEmpty" },
            { "name": "batteryFull" },
            { "name": "batteryLow" },
            { "name": "bearingFault" },
            { "name": "book" },
            { "name": "bulb" },
            { "name": "burger" },
            { "name": "cPM" },
            { "name": "calendar" },
            { "name": "calendarBooked" },
            { "name": "calendarEmpty" },
            { "name": "calendarNotBooked" },
            { "name": "calendarRecurring" },
            { "name": "caretDown" },
            { "name": "caretUp" },
            { "name": "caretUpDown" },
            { "name": "chat" },
            { "name": "check" },
            { "name": "checkCircle" },
            { "name": "checkSmall" },
            { "name": "chevronDown" },
            { "name": "chevronLeft" },
            { "name": "chevronRight" },
            { "name": "chevronUp" },
            { "name": "chevronUpDown" },
            { "name": "close" },
            { "name": "closeAllFaults" },
            { "name": "closeFault" },
            { "name": "closeSmall" },
            { "name": "columnGraph" },
            { "name": "comment" },
            { "name": "connection1" },
            { "name": "connection2" },
            { "name": "connection3" },
            { "name": "connection4" },
            { "name": "danger" },
            { "name": "defectFrequencies" },
            { "name": "defectFrequenciesAlternative" },
            { "name": "doubleChevronLeft" },
            { "name": "doubleChevronRight" },
            { "name": "download" },
            { "name": "draft" },
            { "name": "draftFilled" },
            { "name": "draftOutlined" },
            { "name": "dragNDrop" },
            { "name": "drop" },
            { "name": "duplicate" },
            { "name": "edit" },
            { "name": "emailFilled" },
            { "name": "emailOutlined" },
            { "name": "exclamation" },
            { "name": "eye" },
            { "name": "eyeHidden" },
            { "name": "eyeVisible" },
            { "name": "filter" },
            { "name": "forbidden" },
            { "name": "fullScreen" },
            { "name": "fullScreenExit" },
            { "name": "functionalLocation" },
            { "name": "harmonicCursor" },
            { "name": "heatmap" },
            { "name": "hierarchy" },
            { "name": "history" },
            { "name": "historyAlt" },
            { "name": "hourglassFramedFilled" },
            { "name": "hourglassFramedOutlined" },
            { "name": "hourglassOutlined" },
            { "name": "hz" },
            { "name": "iMX" },
            { "name": "image" },
            { "name": "infoCircleFilled" },
            { "name": "infoCircleOutlined" },
            { "name": "integration" },
            { "name": "kebab" },
            { "name": "link" },
            { "name": "listGroup" },
            { "name": "listItem" },
            { "name": "locationPin" },
            { "name": "lock" },
            { "name": "logOut" },
            { "name": "meatballs" },
            { "name": "microphone" },
            { "name": "minus" },
            { "name": "minusSmall" },
            { "name": "noData" },
            { "name": "o" },
            { "name": "openInNew" },
            { "name": "overlayBaseline" },
            { "name": "pDF" },
            { "name": "paper" },
            { "name": "pause" },
            { "name": "pieChart" },
            { "name": "pin" },
            { "name": "play" },
            { "name": "plus" },
            { "name": "powerOff" },
            { "name": "printer" },
            { "name": "proCollect" },
            { "name": "recAction" },
            { "name": "received" },
            { "name": "refresh" },
            { "name": "reorder" },
            { "name": "replace" },
            { "name": "reply" },
            { "name": "rewalkableRoute" },
            { "name": "routes" },
            { "name": "search" },
            { "name": "send" },
            { "name": "sensorA" },
            { "name": "sensorB" },
            { "name": "settings" },
            { "name": "sidebandCursor" },
            { "name": "singleCursor" },
            { "name": "spectrum" },
            { "name": "starFilled" },
            { "name": "starOutlined" },
            { "name": "statusCircle" },
            { "name": "stop" },
            { "name": "structuralVibration" },
            { "name": "sync" },
            { "name": "timewave" },
            { "name": "trash" },
            { "name": "trend" },
            { "name": "trendingUp" },
            { "name": "undo" },
            { "name": "unknownCircle" },
            { "name": "unknownDiamond" },
            { "name": "unlink" },
            { "name": "unlock" },
            { "name": "unscheduledAction" },
            { "name": "upload" },
            { "name": "user" },
            { "name": "viewFull" },
            { "name": "viewHorizontal" },
            { "name": "viewVertical" },
            { "name": "warning" },
            { "name": "warningCircle" },
            { "name": "warningDiamond" },
            { "name": "zoomIn" },
            { "name": "zoomOut" }
          ]
        },
        {
          "name": "icon-placement",
          "description": "Defines the position of the icon in relation to the text",
          "values": [{ "name": "left" }, { "name": "right" }]
        },
        {
          "name": "rel",
          "description": "Defines the relationship of the target object to the link object",
          "values": []
        },
        {
          "name": "route",
          "description": "If defined, used on conjunction with onClick property, second argument",
          "values": []
        },
        {
          "name": "stretch",
          "description": "If true, fills the parents horizontal axis",
          "values": []
        },
        {
          "name": "target",
          "description": "If defined, specifies where to open the linked document",
          "values": [
            { "name": "_blank" },
            { "name": "_parent" },
            { "name": "_self" },
            { "name": "_top" }
          ]
        },
        {
          "name": "type",
          "description": "Defines the type of button",
          "values": [
            { "name": "button" },
            { "name": "submit" },
            { "name": "reset" }
          ]
        }
      ],
      "references": []
    },
    {
      "name": "skf-loader",
      "description": "The `<skf-loader>` component is a progress indicator that uses circular indicators for short, indeterminate activities\n---\n",
      "attributes": [
        {
          "name": "aria-label",
          "description": "Defines the aria-label",
          "values": []
        },
        {
          "name": "invert",
          "description": "If true, inverts the color (to be used on colored backgrounds)",
          "values": []
        },
        {
          "name": "size",
          "description": "Defines the size of the loader",
          "values": [{ "name": "md" }, { "name": "sm" }]
        }
      ],
      "references": []
    },
    {
      "name": "skf-logo",
      "description": "The `<skf-logo>` component is used to display the SKF logo.\n---\n\n\n### **CSS Properties:**\n - **--skf-logo-height** - The height of the logo _(default: undefined)_",
      "attributes": [
        {
          "name": "title",
          "description": "Defines the title of the logo",
          "values": []
        },
        {
          "name": "color",
          "description": "If defined, sets color of the logo",
          "values": [
            { "name": "primary" },
            { "name": "secondary" },
            { "name": "inverse" }
          ]
        }
      ],
      "references": []
    },
    {
      "name": "skf-radio",
      "description": "The `<skf-radio>` component is used to create a radio input\n---\n\n\n### **Events:**\n - **change** - {object} - When the value of the input changes\n\n### **Slots:**\n - _default_ - The radios label. Alternatively, you can use the `label` attribute.",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, sets disabled state",
          "values": []
        },
        {
          "name": "required",
          "description": "If true, value is required or must be checked for the form to be submittable",
          "values": []
        },
        {
          "name": "debug",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "checked",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "custom-invalid",
          "description": "If true, forces component to invalid state until removed",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "label",
          "description": "If defined, sets the input's label unless the default slot is used. Alternatively, you can use the `label` attribute.",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the Radio",
          "values": [{ "name": "sm" }, { "name": "md" }]
        },
        {
          "name": "severity",
          "description": "If defined, displays provided severity state",
          "values": [
            { "name": "success" },
            { "name": "info" },
            { "name": "warning" },
            { "name": "alert" }
          ]
        },
        {
          "name": "show-valid",
          "description": "If true, displays valid state after interaction",
          "values": []
        },
        {
          "name": "value",
          "description": "The current value of the input field",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-select",
      "description": "The `<skf-select>` is a component that displays a list of actions or options. A click in the options list toggle the selected state of the option. Use it together with the ´skf-select-option` tag.\n---\n\n\n### **Events:**\n - **change** - Fired when the selected option(s) changes\n- **invalid** - Fired when the select is invalid\n- **reset** - Fired when the form is reset\n- **skf-select:dropdown** - {detail: {expanded: boolean}} Fired when the select dropdown is toggled\n- **skf-select-option:select** - {detail: {value: string | null, option: SkfSelectOption}} Fired when the select dropdown is toggled\n\n### **Slots:**\n - _default_ - The select's placeholder content",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, the select is disabled\t`default: false`",
          "values": []
        },
        {
          "name": "button-label",
          "description": "Sets the first visible text on the component",
          "values": []
        },
        {
          "name": "custom-invalid",
          "description": "If defined, forces component to invalid state until removed",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "hide-tags",
          "description": "If true and mulltiple is true, no tags are displayed under the select",
          "values": []
        },
        {
          "name": "hint",
          "description": "If defined, sets the hint text under the select component in the form",
          "values": []
        },
        {
          "name": "label",
          "description": "If defined, displays provided label",
          "values": []
        },
        {
          "name": "max",
          "description": "If defined, limits the number of selectable options",
          "values": []
        },
        {
          "name": "min",
          "description": "If defined, sets the minimum number of required options",
          "values": []
        },
        {
          "name": "multiple",
          "description": "If true, allows for multiple options to be selected",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, set name of the component",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "severity",
          "description": "If defined, displays provided severity state",
          "values": [{ "name": "FormFieldBaseProps['severity']" }]
        },
        {
          "name": "show-valid",
          "description": "If true, displays valid state after interaction",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the Select",
          "values": [{ "name": "sm" }, { "name": "md" }]
        }
      ],
      "references": []
    },
    {
      "name": "skf-select-option",
      "description": "The `<skf-select-option>` is a component is used nested in a skf-select or skf-select-option-group.\n---\n\n\n### **Events:**\n - **skf-select-option:select** - {detail: { value: string | null, option: SkfSelectOption }} Fires when the option is selected/deselected.\n\n### **Slots:**\n - _default_ - The option's text content\n- **icon** - The option's slot for icon or custom meta information (svg).",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, prevents interaction with the option",
          "values": []
        },
        {
          "name": "icon",
          "description": "If defined, set an icon",
          "values": [{ "name": "SkfIcon['name']" }]
        },
        {
          "name": "icon-color",
          "description": "If defined, sets provided color on the icon",
          "values": [{ "name": "IconColor" }]
        },
        {
          "name": "selected",
          "description": "If true, sets the option as selected",
          "values": []
        },
        {
          "name": "short-label",
          "description": "If defined, sets a short label",
          "values": []
        },
        {
          "name": "value",
          "description": "Returns or sets the tags value. If value is omitted, defaults to the tags text.",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-select-option-group",
      "description": "The `<skf-select-option-group>` is a component that groups select-options\n---\n\n\n### **Slots:**\n - _default_ - The component's placeholder content",
      "attributes": [{ "name": "label", "values": [] }],
      "references": []
    },
    {
      "name": "skf-switch",
      "description": "The `<skf-switch>` is a component that displays a list of actions or options\n---\n\n\n### **Slots:**\n - _default_ - The Switchs label. Alternatively, you can use the `label` attribute.",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, sets disabled state",
          "values": []
        },
        {
          "name": "required",
          "description": "If true, value is required or must be checked for the form to be submittable",
          "values": []
        },
        {
          "name": "debug",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "checked",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "label",
          "description": "If defined, sets the input's label unless the default slot is used. Alternatively, you can use the `label` attribute.",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the Switch",
          "values": [{ "name": "sm" }, { "name": "md" }]
        },
        {
          "name": "value",
          "description": "The current value of the input field",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-tag",
      "description": "The `<skf-tag>` is a component that displays a list of actions or options\n---\n\n\n### **Slots:**\n - _default_ - The component's placeholder content",
      "attributes": [
        {
          "name": "size",
          "description": "Specifies Tag size",
          "values": [{ "name": "sm" }, { "name": "md" }, { "name": "lg" }]
        },
        {
          "name": "icon",
          "description": "If defined, displays leading/provided icon",
          "values": [
            { "name": "arrowDown" },
            { "name": "arrowDownUp" },
            { "name": "arrowLeft" },
            { "name": "arrowRight" },
            { "name": "arrowUp" },
            { "name": "article" },
            { "name": "artificialIntelligence" },
            { "name": "asset" },
            { "name": "attachment" },
            { "name": "bandCursor" },
            { "name": "bands" },
            { "name": "batteryEmpty" },
            { "name": "batteryFull" },
            { "name": "batteryLow" },
            { "name": "bearingFault" },
            { "name": "book" },
            { "name": "bulb" },
            { "name": "burger" },
            { "name": "cPM" },
            { "name": "calendar" },
            { "name": "calendarBooked" },
            { "name": "calendarEmpty" },
            { "name": "calendarNotBooked" },
            { "name": "calendarRecurring" },
            { "name": "caretDown" },
            { "name": "caretUp" },
            { "name": "caretUpDown" },
            { "name": "chat" },
            { "name": "check" },
            { "name": "checkCircle" },
            { "name": "checkSmall" },
            { "name": "chevronDown" },
            { "name": "chevronLeft" },
            { "name": "chevronRight" },
            { "name": "chevronUp" },
            { "name": "chevronUpDown" },
            { "name": "close" },
            { "name": "closeAllFaults" },
            { "name": "closeFault" },
            { "name": "closeSmall" },
            { "name": "columnGraph" },
            { "name": "comment" },
            { "name": "connection1" },
            { "name": "connection2" },
            { "name": "connection3" },
            { "name": "connection4" },
            { "name": "danger" },
            { "name": "defectFrequencies" },
            { "name": "defectFrequenciesAlternative" },
            { "name": "doubleChevronLeft" },
            { "name": "doubleChevronRight" },
            { "name": "download" },
            { "name": "draft" },
            { "name": "draftFilled" },
            { "name": "draftOutlined" },
            { "name": "dragNDrop" },
            { "name": "drop" },
            { "name": "duplicate" },
            { "name": "edit" },
            { "name": "emailFilled" },
            { "name": "emailOutlined" },
            { "name": "exclamation" },
            { "name": "eye" },
            { "name": "eyeHidden" },
            { "name": "eyeVisible" },
            { "name": "filter" },
            { "name": "forbidden" },
            { "name": "fullScreen" },
            { "name": "fullScreenExit" },
            { "name": "functionalLocation" },
            { "name": "harmonicCursor" },
            { "name": "heatmap" },
            { "name": "hierarchy" },
            { "name": "history" },
            { "name": "historyAlt" },
            { "name": "hourglassFramedFilled" },
            { "name": "hourglassFramedOutlined" },
            { "name": "hourglassOutlined" },
            { "name": "hz" },
            { "name": "iMX" },
            { "name": "image" },
            { "name": "infoCircleFilled" },
            { "name": "infoCircleOutlined" },
            { "name": "integration" },
            { "name": "kebab" },
            { "name": "link" },
            { "name": "listGroup" },
            { "name": "listItem" },
            { "name": "locationPin" },
            { "name": "lock" },
            { "name": "logOut" },
            { "name": "meatballs" },
            { "name": "microphone" },
            { "name": "minus" },
            { "name": "minusSmall" },
            { "name": "noData" },
            { "name": "o" },
            { "name": "openInNew" },
            { "name": "overlayBaseline" },
            { "name": "pDF" },
            { "name": "paper" },
            { "name": "pause" },
            { "name": "pieChart" },
            { "name": "pin" },
            { "name": "play" },
            { "name": "plus" },
            { "name": "powerOff" },
            { "name": "printer" },
            { "name": "proCollect" },
            { "name": "recAction" },
            { "name": "received" },
            { "name": "refresh" },
            { "name": "reorder" },
            { "name": "replace" },
            { "name": "reply" },
            { "name": "rewalkableRoute" },
            { "name": "routes" },
            { "name": "search" },
            { "name": "send" },
            { "name": "sensorA" },
            { "name": "sensorB" },
            { "name": "settings" },
            { "name": "sidebandCursor" },
            { "name": "singleCursor" },
            { "name": "spectrum" },
            { "name": "starFilled" },
            { "name": "starOutlined" },
            { "name": "statusCircle" },
            { "name": "stop" },
            { "name": "structuralVibration" },
            { "name": "sync" },
            { "name": "timewave" },
            { "name": "trash" },
            { "name": "trend" },
            { "name": "trendingUp" },
            { "name": "undo" },
            { "name": "unknownCircle" },
            { "name": "unknownDiamond" },
            { "name": "unlink" },
            { "name": "unlock" },
            { "name": "unscheduledAction" },
            { "name": "upload" },
            { "name": "user" },
            { "name": "viewFull" },
            { "name": "viewHorizontal" },
            { "name": "viewVertical" },
            { "name": "warning" },
            { "name": "warningCircle" },
            { "name": "warningDiamond" },
            { "name": "zoomIn" },
            { "name": "zoomOut" }
          ]
        },
        {
          "name": "color",
          "description": "If defined, gives the supplied appearance",
          "values": [
            { "name": "warning" },
            { "name": "success" },
            { "name": "info" },
            { "name": "error" },
            { "name": "alert" }
          ]
        },
        {
          "name": "removable",
          "description": "If true, adds trailing button to remove tag",
          "values": []
        }
      ],
      "references": []
    },
    {
      "name": "skf-textarea",
      "description": "The skf-textarea is used to create a textarea. Use it inside a form element or wherever you like.\n---\n\n\n### **Events:**\n - **change** - Fires when the value of the input changes\n- **invalid** - Fires when the input is invalid\n\n### **Slots:**\n - _default_ - The textareas label. Alternatively, you can use the `label` attribute.",
      "attributes": [
        {
          "name": "disabled",
          "description": "If true, sets disabled state",
          "values": []
        },
        {
          "name": "required",
          "description": "If true, value is required or must be checked for the form to be submittable",
          "values": []
        },
        {
          "name": "cols",
          "description": "If defined, sets the cols of the textarea",
          "values": []
        },
        {
          "name": "custom-invalid",
          "description": "If defined, forces component to invalid state until removed. Its value is used as hint text.",
          "values": []
        },
        {
          "name": "debug",
          "description": "If true, outputs helping hints in console",
          "values": []
        },
        {
          "name": "hide-label",
          "description": "If true, hides the label visually",
          "values": []
        },
        {
          "name": "hint",
          "description": "If defined, displays informational text below the field",
          "values": []
        },
        {
          "name": "label",
          "description": "If defined, sets the input's label unless the default slot is used. Alternatively, you can use the `label` attribute.",
          "values": []
        },
        {
          "name": "name",
          "description": "If defined, adds name to the input-element",
          "values": []
        },
        {
          "name": "maxlength",
          "description": "If defined, sets the maximum character length to accept for this input",
          "values": []
        },
        {
          "name": "minlength",
          "description": "If defined, sets the minimum character length to accept for this input",
          "values": []
        },
        {
          "name": "placeholder",
          "description": "If defined, displays placeholder text",
          "values": []
        },
        {
          "name": "readonly",
          "description": "If true, makes the element not mutable, meaning the user can not edit the control",
          "values": []
        },
        {
          "name": "required-label",
          "description": "If defined, renders an alternative A11y text for the asterisk",
          "values": []
        },
        {
          "name": "rows",
          "description": "If defined, sets the rows of the textarea",
          "values": []
        },
        {
          "name": "severity",
          "description": "If defined, displays provided severity state",
          "values": [
            { "name": "success" },
            { "name": "info" },
            { "name": "warning" },
            { "name": "alert" }
          ]
        },
        {
          "name": "show-valid",
          "description": "If true, displays valid state after interaction",
          "values": []
        },
        {
          "name": "size",
          "description": "Size of the Textarea",
          "values": [{ "name": "sm" }, { "name": "md" }]
        },
        {
          "name": "validate-on",
          "description": "Sets validation start",
          "values": [
            { "name": "input" },
            { "name": "change" },
            { "name": "submit" }
          ]
        },
        {
          "name": "value",
          "description": "The current value of the text area",
          "values": []
        }
      ],
      "references": []
    }
  ]
}