@oiz/stzh-components 1.5.0-alpha → 2.0.0

package/dist/vscode-data.json

@@ -25,6 +25,39 @@
         "value": "The STZH accordion item component."
       },
       "attributes": [
+        {
+          "name": "badge",
+          "description": "Badge"
+        },
+        {
+          "name": "badge-empty",
+          "description": "Whether badge should be displayed empty"
+        },
+        {
+          "name": "badge-type",
+          "description": "Badge type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
+        },
+        {
+          "name": "description",
+          "description": "Description"
+        },
         {
           "name": "disabled",
           "description": "Whether fold disabled"
@@ -51,6 +84,10 @@
             }
           ]
         },
+        {
+          "name": "icon",
+          "description": "Icon (use instead of icon slot)"
+        },
         {
           "name": "open",
           "description": "Whether fold is open"
@@ -89,6 +126,106 @@
         }
       ]
     },
+    {
+      "name": "stzh-actionset",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH actions component.\n\nAutomatically position given buttons inside a form, dialog or process. Sets `variant=\"secondary\"` to `stzh-button` elements placed in secondary slot by default if nothing else is set."
+      },
+      "attributes": [
+        {
+          "name": "actions",
+          "description": "Card header actions"
+        },
+        {
+          "name": "popover-button-size",
+          "description": "Popover button size",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "small"
+            },
+            {
+              "name": "tiny"
+            }
+          ]
+        },
+        {
+          "name": "popover-button-variant",
+          "description": "Popover button variant",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "input"
+            },
+            {
+              "name": "secondary"
+            },
+            {
+              "name": "tertiary"
+            }
+          ]
+        },
+        {
+          "name": "popover-placement",
+          "description": "Popover placement",
+          "values": [
+            {
+              "name": "bottom"
+            },
+            {
+              "name": "bottom-end"
+            },
+            {
+              "name": "bottom-start"
+            },
+            {
+              "name": "left"
+            },
+            {
+              "name": "left-end"
+            },
+            {
+              "name": "left-start"
+            },
+            {
+              "name": "right"
+            },
+            {
+              "name": "right-end"
+            },
+            {
+              "name": "right-start"
+            },
+            {
+              "name": "top"
+            },
+            {
+              "name": "top-end"
+            },
+            {
+              "name": "top-start"
+            }
+          ]
+        },
+        {
+          "name": "variant",
+          "description": "Variant determining what position the action buttons are",
+          "values": [
+            {
+              "name": "overflow"
+            },
+            {
+              "name": "stack"
+            }
+          ]
+        }
+      ]
+    },
     {
       "name": "stzh-appnav",
       "description": {
@@ -173,6 +310,27 @@
         {
           "name": "label",
           "description": "Text content of the badge"
+        },
+        {
+          "name": "type",
+          "description": "Type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
         }
       ]
     },
@@ -199,6 +357,10 @@
           "name": "badge",
           "description": "Display a badge aligned to button or icons"
         },
+        {
+          "name": "badge-empty",
+          "description": "Whether badge should be displayed empty"
+        },
         {
           "name": "badge-position",
           "description": "Badge position",
@@ -211,6 +373,31 @@
             }
           ]
         },
+        {
+          "name": "badge-type",
+          "description": "Badge type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
+        },
+        {
+          "name": "checked",
+          "description": "Checked status (if type is radio)"
+        },
         {
           "name": "disabled",
           "description": "Whether the button is disabled"
@@ -259,6 +446,10 @@
           "name": "label",
           "description": "Label"
         },
+        {
+          "name": "name",
+          "description": "The name of the input element (if type is radio)"
+        },
         {
           "name": "size",
           "description": "Size variant",
@@ -306,6 +497,9 @@
             {
               "name": "button"
             },
+            {
+              "name": "radio"
+            },
             {
               "name": "reset"
             },
@@ -314,6 +508,10 @@
             }
           ]
         },
+        {
+          "name": "value",
+          "description": "The value of the input element (if type is radio)"
+        },
         {
           "name": "variant",
           "description": "Variant style",
@@ -359,6 +557,108 @@
         }
       ]
     },
+    {
+      "name": "stzh-card",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH card component."
+      },
+      "attributes": [
+        {
+          "name": "checked",
+          "description": "Whether card is checked (if card is selectable)"
+        },
+        {
+          "name": "collapsed",
+          "description": "Whether card is collapsed or not"
+        },
+        {
+          "name": "collapsible",
+          "description": "Whether card is collapsible"
+        },
+        {
+          "name": "disabled",
+          "description": "Whether the element is disabled or not (if card is selectable)"
+        },
+        {
+          "name": "footer-actions",
+          "description": "Card footer actions.\nThe [`stzh-actionset`](?path=/story/components-actionset) component is used internally.\nYou can listen to clicks with the `stzhActionClick` event."
+        },
+        {
+          "name": "header-actions",
+          "description": "Card header actions"
+        },
+        {
+          "name": "heading",
+          "description": "Heading"
+        },
+        {
+          "name": "hide-footer-border",
+          "description": "Whether to hide footer separation border"
+        },
+        {
+          "name": "hide-header-border",
+          "description": "Whether to hide header separation border"
+        },
+        {
+          "name": "hide-movement-actions",
+          "description": "Whether movement menu items should be shown.\nHas no effect if card is not inside a `card-list` element, which has `sortableEnabled` property set to true."
+        },
+        {
+          "name": "name",
+          "description": "The name of the input element (if card is selectable)"
+        },
+        {
+          "name": "selectable",
+          "description": "Whether card is selectable"
+        },
+        {
+          "name": "sortable-disabled",
+          "description": "Whether sorting should be disabled.\nHas no effect if card is not inside a `card-list` element, which has `sortableEnabled` property set to true."
+        },
+        {
+          "name": "starrable",
+          "description": "Whether card star is displayed (with tooltip and menu-item in mobile popover).\nThe tooltip / menu-item text can be adjusted in the translations file (`actionAdd` & `actionRemove`)."
+        },
+        {
+          "name": "starred",
+          "description": "Whether card was starred"
+        },
+        {
+          "name": "subtitle",
+          "description": "Subtitle"
+        },
+        {
+          "name": "subtitle-interactive",
+          "description": "Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click"
+        },
+        {
+          "name": "value",
+          "description": "The value of the input element (if card is selectable)"
+        }
+      ]
+    },
+    {
+      "name": "stzh-card-list",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH card list component."
+      },
+      "attributes": [
+        {
+          "name": "show-toggle-link",
+          "description": "Whether collapse/expand toggle link"
+        },
+        {
+          "name": "sortable-data-id-attribute",
+          "description": "HTML attribute that is used by the `toArray()` of sortable method"
+        },
+        {
+          "name": "sortable-enabled",
+          "description": "Whether sorting should be enabled"
+        }
+      ]
+    },
     {
       "name": "stzh-cell",
       "description": {
@@ -564,6 +864,14 @@
         "value": "The STZH chip component."
       },
       "attributes": [
+        {
+          "name": "a11y-describedby",
+          "description": "Id for element which describes the button"
+        },
+        {
+          "name": "a11y-label",
+          "description": "Accessible label for screen readers to replace visible text"
+        },
         {
           "name": "active",
           "description": "Active"
@@ -589,99 +897,220 @@
           "description": "Label"
         },
         {
-          "name": "removable",
-          "description": "Whether remove button should be shown"
+          "name": "removable",
+          "description": "Whether remove button should be shown"
+        },
+        {
+          "name": "remove-label",
+          "description": "Label of remove button for screenreaders"
+        },
+        {
+          "name": "size",
+          "description": "Size",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "small"
+            }
+          ]
+        },
+        {
+          "name": "type",
+          "description": "Type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "important"
+            },
+            {
+              "name": "secondary"
+            }
+          ]
+        },
+        {
+          "name": "variant",
+          "description": "Variant",
+          "values": [
+            {
+              "name": "filter"
+            },
+            {
+              "name": "input"
+            },
+            {
+              "name": "tag"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "stzh-chip-select",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH figure component."
+      },
+      "attributes": [
+        {
+          "name": "a11y-describedby",
+          "description": "Id for element which describes the input (this will be overwritten if description prop or slot is used, used by stzh-radiogroup)"
+        },
+        {
+          "name": "data",
+          "description": "Data"
+        },
+        {
+          "name": "description",
+          "description": "Description message (use description slot as alternative)"
+        },
+        {
+          "name": "description-long",
+          "description": "Long description message appearing in a popover (use description-long slot as alternative)"
+        },
+        {
+          "name": "disabled",
+          "description": "Whether the element is disabled or not"
+        },
+        {
+          "name": "error",
+          "description": "One or multiple error message (use error slot as alternative)"
+        },
+        {
+          "name": "invalid",
+          "description": "Invalid status"
+        },
+        {
+          "name": "label",
+          "description": "Label"
+        },
+        {
+          "name": "name",
+          "description": "The name of the input element"
+        },
+        {
+          "name": "required",
+          "description": "Required status"
+        },
+        {
+          "name": "value",
+          "description": "Value"
+        }
+      ]
+    },
+    {
+      "name": "stzh-container",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH container component.\n\nSets side margins and max-width based on the current breakpoint."
+      },
+      "attributes": []
+    },
+    {
+      "name": "stzh-cspace",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH cspace component.\n\nApply all the default collapsible spacings for slotted elements. See the <a href=\"?path=/story/tokens-spacings--page\" target=\"_blank\">spacings docs page</a> for more information.\n\n```html\n<stzh-cspace>\n  <stzh-heading>Heading</stzh-heading>\n  <stzh-text>Lorem ipsum</stzh-text>\n  <stzh-figure>\n    <img src=\"media/images/example.jpg\" loading=\"lazy\" />\n  </stzh-figure>\n  <stzh-heading level=\"2\">Heading<stzh-heading>\n  // note: use \"no-cspace-top\" to disable top margin\n  // or \"no-cspace-bottom\" to disable bottom margin if needed\n  <stzh-button no-cspace-top no-cspace-bottom>Test</stzh-button>\n  ...\n</stzh-cspace>\n```"
+      },
+      "attributes": []
+    },
+    {
+      "name": "stzh-datalist",
+      "description": {
+        "kind": "markdown",
+        "value": "The STZH datalist component."
+      },
+      "attributes": [
+        {
+          "name": "direction",
+          "description": "Direction",
+          "values": [
+            {
+              "name": "horizontal"
+            },
+            {
+              "name": "vertical"
+            }
+          ]
         },
         {
-          "name": "remove-label",
-          "description": "Label of remove button for screenreaders"
+          "name": "direction-large",
+          "description": "Direction above large breakpoint",
+          "values": [
+            {
+              "name": "horizontal"
+            },
+            {
+              "name": "inherit"
+            },
+            {
+              "name": "vertical"
+            }
+          ]
         },
         {
-          "name": "size",
-          "description": "Size",
+          "name": "direction-medium",
+          "description": "Direction above medium breakpoint",
           "values": [
             {
-              "name": "default"
+              "name": "horizontal"
             },
             {
-              "name": "small"
+              "name": "inherit"
+            },
+            {
+              "name": "vertical"
             }
           ]
         },
         {
-          "name": "type",
-          "description": "Type",
+          "name": "direction-small",
+          "description": "Direction above small breakpoint",
           "values": [
             {
-              "name": "default"
+              "name": "horizontal"
             },
             {
-              "name": "important"
+              "name": "inherit"
             },
             {
-              "name": "secondary"
+              "name": "vertical"
             }
           ]
         },
         {
-          "name": "variant",
-          "description": "Variant",
+          "name": "direction-ultra",
+          "description": "Direction above ultra breakpoint",
           "values": [
             {
-              "name": "filter"
+              "name": "horizontal"
             },
             {
-              "name": "input"
+              "name": "inherit"
             },
             {
-              "name": "tag"
+              "name": "vertical"
             }
           ]
-        }
-      ]
-    },
-    {
-      "name": "stzh-chip-select",
-      "description": {
-        "kind": "markdown",
-        "value": "The STZH figure component."
-      },
-      "attributes": [
-        {
-          "name": "data",
-          "description": "Data"
         },
         {
-          "name": "label",
-          "description": "Label"
+          "name": "hide-border",
+          "description": "Hide border lines between items"
         },
         {
-          "name": "value",
-          "description": "Value"
+          "name": "items",
+          "description": "Items in datalist\nArray of objects that must at least include `value` attribute.\nCan optionally contain `label`, `meta`, `icon`, `href` attribute:\n`[{\"value\":\"Value 1\", \"label\": \"Label 1\"}, {\"value\":\"Value 2\", \"label\": \"Label 2\"}]`"
         }
       ]
     },
-    {
-      "name": "stzh-container",
-      "description": {
-        "kind": "markdown",
-        "value": "The STZH container component.\n\nSets side margins and max-width based on the current breakpoint."
-      },
-      "attributes": []
-    },
-    {
-      "name": "stzh-cspace",
-      "description": {
-        "kind": "markdown",
-        "value": "The STZH cspace component.\n\nApply all the default collapsible spacings for slotted elements. See the <a href=\"?path=/story/tokens-spacings--page\" target=\"_blank\">spacings docs page</a> for more information.\n\n```html\n<stzh-cspace>\n  <stzh-heading>Heading</stzh-heading>\n  <stzh-text>Lorem ipsum</stzh-text>\n  <stzh-figure>\n    <img src=\"media/images/example.jpg\" loading=\"lazy\" />\n  </stzh-figure>\n  <stzh-heading level=\"2\">Heading<stzh-heading>\n  // note: use \"no-cspace-top\" to disable top margin\n  // or \"no-cspace-bottom\" to disable bottom margin if needed\n  <stzh-button no-cspace-top no-cspace-bottom>Test</stzh-button>\n  ...\n</stzh-cspace>\n```"
-      },
-      "attributes": []
-    },
     {
       "name": "stzh-datamessagelist",
       "description": {
         "kind": "markdown",
-        "value": "The STZH datemessagelist component."
+        "value": "The STZH datamessagelist component."
       },
       "attributes": []
     },
@@ -844,10 +1273,6 @@
           "name": "name",
           "description": "Name of the hidden date picker input."
         },
-        {
-          "name": "placeholder",
-          "description": "Placeholder text"
-        },
         {
           "name": "readonly",
           "description": "Whether the element is readonly or not"
@@ -1054,10 +1479,6 @@
           "name": "options",
           "description": "Available options"
         },
-        {
-          "name": "placeholder",
-          "description": "Placeholder option"
-        },
         {
           "name": "popover-placement",
           "description": "Popover placement",
@@ -1831,10 +2252,6 @@
           "name": "no-autocomplete",
           "description": "Whether autocomplete should be turned off"
         },
-        {
-          "name": "placeholder",
-          "description": "Placeholder text"
-        },
         {
           "name": "readonly",
           "description": "Whether the element is readonly or not"
@@ -1919,6 +2336,10 @@
           "name": "badge",
           "description": "Badge text"
         },
+        {
+          "name": "badge-empty",
+          "description": "Whether badge should be displayed empty"
+        },
         {
           "name": "badge-position",
           "description": "Badge position",
@@ -1931,6 +2352,27 @@
             }
           ]
         },
+        {
+          "name": "badge-type",
+          "description": "Badge type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
+        },
         {
           "name": "disabled",
           "description": "Disabled status"
@@ -1974,6 +2416,9 @@
             {
               "name": "default"
             },
+            {
+              "name": "inherit"
+            },
             {
               "name": "small"
             }
@@ -2121,6 +2566,31 @@
           "name": "badge",
           "description": "Badge"
         },
+        {
+          "name": "badge-empty",
+          "description": "Whether badge should be displayed empty"
+        },
+        {
+          "name": "badge-type",
+          "description": "Badge type",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            }
+          ]
+        },
         {
           "name": "disabled",
           "description": "Whether the button is disabled"
@@ -2296,6 +2766,18 @@
           "name": "skidding",
           "description": "Shifting of popover content"
         },
+        {
+          "name": "strategy",
+          "description": "Position strategy",
+          "values": [
+            {
+              "name": "absolute"
+            },
+            {
+              "name": "fixed"
+            }
+          ]
+        },
         {
           "name": "variant",
           "description": "Variant",
@@ -2543,7 +3025,7 @@
       "name": "stzh-richtext",
       "description": {
         "kind": "markdown",
-        "value": "The STZH richtext component.\n\nThis component styles (colors, fonts, spacings) the slotted text elements `hX`, `p`, `i`, `b`, `strong`, `em`, `ul`, `ol`, `blockquote` and `a` (icon are added to external links) and adds spacings to the components `stzh-text` and `stzh-heading`.\n\nThis is especially useful when the content is coming from a WYSIWYG editor within a CMS."
+        "value": "The STZH richtext component.\n\nThis component styles (colors, fonts, spacings) the slotted elements `hX`, `p`, `i`, `b`, `strong`, `em`, `ul`, `ol`, `blockquote`, `table` and `a` (icon are added to external links) and adds spacings to the components `stzh-text` and `stzh-heading`.\n\nThis is especially useful when the content is coming from a WYSIWYG editor within a CMS."
       },
       "attributes": [
         {
@@ -2708,124 +3190,6 @@
         }
       ]
     },
-    {
-      "name": "stzh-servicecard",
-      "description": {
-        "kind": "markdown",
-        "value": "The STZH servicecard component."
-      },
-      "attributes": [
-        {
-          "name": "actions",
-          "description": "Card actions"
-        },
-        {
-          "name": "collapsed",
-          "description": "Whether card is collapsed or not"
-        },
-        {
-          "name": "collapsible",
-          "description": "Whether card is collapsible"
-        },
-        {
-          "name": "heading",
-          "description": "Heading"
-        },
-        {
-          "name": "hide-movement-actions",
-          "description": "Whether movement menu items should be shown"
-        },
-        {
-          "name": "middle-variant",
-          "description": "Middle column position variant (positioning behaviour on tablet)",
-          "values": [
-            {
-              "name": "to-left"
-            },
-            {
-              "name": "to-right"
-            }
-          ]
-        },
-        {
-          "name": "middle-vertical-spacing",
-          "description": "Set middle column vertical spacing",
-          "values": [
-            {
-              "name": "default"
-            },
-            {
-              "name": "none"
-            }
-          ]
-        },
-        {
-          "name": "right-vertical-spacing",
-          "description": "Set right column vertical spacing",
-          "values": [
-            {
-              "name": "default"
-            },
-            {
-              "name": "none"
-            }
-          ]
-        },
-        {
-          "name": "sortable-disabled",
-          "description": "Whether sorting should be disabled"
-        },
-        {
-          "name": "starrable",
-          "description": "Whether card star is displayed"
-        },
-        {
-          "name": "starred",
-          "description": "Whether card was starred"
-        },
-        {
-          "name": "subtitle",
-          "description": "Subtitle"
-        },
-        {
-          "name": "subtitle-interactive",
-          "description": "Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click"
-        },
-        {
-          "name": "type",
-          "description": "Type",
-          "values": [
-            {
-              "name": "alert"
-            },
-            {
-              "name": "default"
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "name": "stzh-servicecard-list",
-      "description": {
-        "kind": "markdown",
-        "value": "The STZH servicecard list component."
-      },
-      "attributes": [
-        {
-          "name": "show-toggle-link",
-          "description": "Whether collapse/expand toggle link"
-        },
-        {
-          "name": "sortable-data-id-attribute",
-          "description": "HTML attribute that is used by the `toArray()` of sortable method"
-        },
-        {
-          "name": "sortable-disabled",
-          "description": "Whether sorting should be disabled"
-        }
-      ]
-    },
     {
       "name": "stzh-skiplink",
       "description": {
@@ -3376,6 +3740,18 @@
           "name": "skidding",
           "description": "Shifting of tooltip content"
         },
+        {
+          "name": "strategy",
+          "description": "Position strategy",
+          "values": [
+            {
+              "name": "absolute"
+            },
+            {
+              "name": "fixed"
+            }
+          ]
+        },
         {
           "name": "trigger",
           "description": "Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple\noptions can be passed by separating them with a space. When manual is used, the tooltip must be activated\nprogrammatically."