@public-ui/components 2.1.8 → 2.1.9

package/vscode-custom-data.json

@@ -115,64 +115,6 @@
         }
       ]
     },
-    {
-      "name": "kol-alert-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Synonyme: Message\n\nDie **Alert**-Komponente gibt ein optisches Feedback an die Nutzer:innen. Sie besteht aus einem farblich gestalteten Container, einer Überschrift, einem Inhaltstext sowie einem Icon. Das verwendete Icon und die farbliche Gestaltung sind abhängig vom Typ `_type` des Alert."
-      },
-      "attributes": [
-        {
-          "name": "_alert",
-          "description": "Defines whether the screen-readers should read out the notification."
-        },
-        {
-          "name": "_has-closer",
-          "description": "Defines whether the element can be closed."
-        },
-        {
-          "name": "_label",
-          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
-        },
-        {
-          "name": "_level",
-          "description": "Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text."
-        },
-        {
-          "name": "_type",
-          "description": "Defines either the type of the component or of the components interactive element.",
-          "values": [
-            {
-              "name": "default"
-            },
-            {
-              "name": "error"
-            },
-            {
-              "name": "info"
-            },
-            {
-              "name": "success"
-            },
-            {
-              "name": "warning"
-            }
-          ]
-        },
-        {
-          "name": "_variant",
-          "description": "Defines which variant should be used for presentation.",
-          "values": [
-            {
-              "name": "card"
-            },
-            {
-              "name": "msg"
-            }
-          ]
-        }
-      ]
-    },
     {
       "name": "kol-avatar",
       "description": {
@@ -190,23 +132,6 @@
         }
       ]
     },
-    {
-      "name": "kol-avatar-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Synonyme: Persona\n\nDie **Avatar**-Komponente zeigt entweder ein kleines Bild des Users oder dessen Initialen an, falls kein Bild vorhanden ist."
-      },
-      "attributes": [
-        {
-          "name": "_label",
-          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
-        },
-        {
-          "name": "_src",
-          "description": "Sets the image `src` attribute to the given string."
-        }
-      ]
-    },
     {
       "name": "kol-badge",
       "description": {
@@ -435,14 +360,6 @@
       },
       "attributes": []
     },
-    {
-      "name": "kol-button-group-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "**Buttons** dienen dazu, Nutzer:innen Auswahlmöglichkeiten für Aktionen anzuzeigen und diese in einer klaren Hierarchie anzuordnen. Sie helfen den Nutzer:innen, die wichtigsten Aktionen einer Seite oder innerhalb eines Applikation zu finden und ermöglichen es ihm, diese Aktionen auszuführen.\n\nDie **ButtonGroup**-Komponente fasst mehrere Buttons zu einer optischen und funktionalen Einheit zusammen."
-      },
-      "attributes": []
-    },
     {
       "name": "kol-button-link",
       "description": {
@@ -619,6 +536,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -682,6 +620,10 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         },
+        {
+          "name": "_level",
+          "description": "Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text."
+        },
         {
           "name": "_open",
           "description": "If set (to true) opens/expands the element, closes if not set (or set to false)."
@@ -692,7 +634,7 @@
       "name": "kol-drawer",
       "description": {
         "kind": "markdown",
-        "value": "Synonyme: Modal, Modal Dialog, Corner Dialog, Prompt\n\n<kol-alert _type=\"warning\" _variant=\"card\">\n  <kol-badge _color=\"#476af5\" _label=\"Preview\"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da die Barrierefreiheitstests noch ausstehen. Die verschiedenen Tests können aufgrund der Modularität bei neuen Komponenten und Funktionalitäten meist erst nach einem Release erfolgen. Wir empfehlen daher, die Komponente noch nicht in Produktion zu verwenden.\n</kol-alert>\n\nMit Hilfe der **Drawer**-Komponente können zusätzliche Informationen oder auch Navigationselemente in einem ausklappbaren Seitenfenster angezeigt werden. Ein offener Drawer kann als Modal (\\_modal) via ESC geschlossen werden. Die **Drawer**-Komponente ist standardmäßig versteckt. Sie wird i.d.R. erst nach Klick auf einen Button oder sonstigem Trigger angezeigt bzw. controlled mit dem Attribut \\_open gesteuert.\n\n```html\n<kol-drawer _label=\"Drawer\" _open _modal _align=\"top\"> </kol-drawer>\n```"
+        "value": "Synonyme: Modal, Modal Dialog, Corner Dialog, Prompt\n\n<kol-alert _type=\"warning\" _variant=\"card\">\n  <kol-badge _color=\"#476af5\" _label=\"Preview\"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da die Barrierefreiheitstests noch ausstehen. Die verschiedenen Tests können aufgrund der Modularität bei neuen Komponenten und Funktionalitäten meist erst nach einem Release erfolgen. Wir empfehlen daher, die Komponente noch nicht in Produktion zu verwenden.\n</kol-alert>\n\nMithilfe der **Drawer**-Komponente können zusätzliche Informationen oder auch Navigationselemente in einem ausklappbaren Seitenfenster angezeigt werden. Ein offener Drawer kann als Modal (`_modal`) via ESC geschlossen werden.\n\nDie **Drawer**-Komponente ist standardmäßig versteckt. Sie wird i.d.R. erst nach Klick auf einen Button oder sonstigem Trigger angezeigt bzw. controlled mit dem Attribut `_open` gesteuert.\n\n```html\n<kol-drawer _label=\"Drawer\" _open _modal _align=\"top\"></kol-drawer>\n```"
       },
       "attributes": [
         {
@@ -788,54 +730,6 @@
         }
       ]
     },
-    {
-      "name": "kol-heading-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Die **Heading**-Komponente kann überall dort verwendet werden, wo eine Überschrift angezeigt werden soll. Durch die Verwendung der unterschiedlichen Größen, lassen sich Inhalte klar strukturieren und Seiten wirkungsvoll und abwechslungsreich präsentieren. Sie trennt Styling von Semantik und ermöglicht Flexibilität."
-      },
-      "attributes": [
-        {
-          "name": "_label",
-          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
-        },
-        {
-          "name": "_level",
-          "description": "Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text."
-        },
-        {
-          "name": "_secondary-headline",
-          "description": "Setzt den Text einer weiteren Überschrift, einen Level kleiner, unter der Ersten."
-        },
-        {
-          "name": "_variant",
-          "description": "Defines which variant should be used for presentation.",
-          "values": [
-            {
-              "name": "h1"
-            },
-            {
-              "name": "h2"
-            },
-            {
-              "name": "h3"
-            },
-            {
-              "name": "h4"
-            },
-            {
-              "name": "h5"
-            },
-            {
-              "name": "h6"
-            },
-            {
-              "name": "strong"
-            }
-          ]
-        }
-      ]
-    },
     {
       "name": "kol-icon",
       "description": {
@@ -898,14 +792,6 @@
       },
       "attributes": []
     },
-    {
-      "name": "kol-indented-text-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Heben Sie einzelne Informationen auf Ihrer Webseite optisch mit der **IndentedText**-Komponente hervor. Die Komponente eignet sich nicht nur für besondere Abschnitte auf der Webseite, sondern auch beispielsweise für Zitate (für verlinkte Zitate kann auch die <kol-link _href=\"/docs/components/quote/\" _label=\"/docs/components/quote/\" _label=\"kol-quote-Komponente\"></kol-link> verwendet werden.)."
-      },
-      "attributes": []
-    },
     {
       "name": "kol-input-checkbox",
       "description": {
@@ -973,6 +859,27 @@
             }
           ]
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -1087,6 +994,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -1233,6 +1161,27 @@
           "name": "_min",
           "description": "Defines the smallest possible input value."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -1412,6 +1361,27 @@
           "name": "_max-length",
           "description": "Defines the maximum number of input characters."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_multiple",
           "description": "Makes the input accept multiple inputs."
@@ -1562,6 +1532,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_multiple",
           "description": "Makes the input accept multiple inputs."
@@ -1712,6 +1703,27 @@
           "name": "_min",
           "description": "Defines the smallest possible input value."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -1874,6 +1886,27 @@
           "name": "_max-length",
           "description": "Defines the maximum number of input characters."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -2020,6 +2053,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -2143,6 +2197,27 @@
           "name": "_min",
           "description": "Defines the smallest possible input value."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -2254,6 +2329,27 @@
           "name": "_max-length",
           "description": "Defines the maximum number of input characters."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -2851,37 +2947,6 @@
         }
       ]
     },
-    {
-      "name": "kol-popover-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "> <kol-badge _label=\"untested\"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da der vollständige Barrierefreiheitstest noch aussteht. Der vollständige Test kann bei neuen Komponenten und Funktionalitäten auch erst nach einem abgeschlossenen Release erfolgen.\n\nDie **Popover**-Komponente stellt eine Möglichkeit dar zusätzliche Inhalte in ein temporäres Element zu setzen, das, ähnlich wie <kol-link _href=\"\" _label=\"Tooltip\"></kol-link>, um sein Triggerelement angeordnet ist.\nDas Triggerelement ist immer das im HTML vorangehende Element (previousSibling).\n\n<kol-alert _type=\"info\" _variant=\"card\">Die **Popover**-Komponente wird innerhalb von KoliBri verwendet und ist nicht dafür vorgesehen in der Anwendungsentwicklung verwendet zu werden.</kol-alert>"
-      },
-      "attributes": [
-        {
-          "name": "_align",
-          "description": "Defines the alignment of the tooltip, popover or tabs in relation to the element.",
-          "values": [
-            {
-              "name": "bottom"
-            },
-            {
-              "name": "left"
-            },
-            {
-              "name": "right"
-            },
-            {
-              "name": "top"
-            }
-          ]
-        },
-        {
-          "name": "_show",
-          "description": "Makes the element show up."
-        }
-      ]
-    },
     {
       "name": "kol-progress",
       "description": {
@@ -2999,6 +3064,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_multiple",
           "description": "Makes the input accept multiple inputs."
@@ -3094,6 +3180,27 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -3484,39 +3591,6 @@
         }
       ]
     },
-    {
-      "name": "kol-table-stateless-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Synonyme: Data Table, Details List, Data Grid\n\n<kol-alert _type=\"warning\" _variant=\"card\">\n  <kol-badge _color=\"#476af5\" _label=\"Preview\"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da die Barrierefreiheitstests noch ausstehen. Die verschiedenen Tests können aufgrund der Modularität bei neuen Komponenten und Funktionalitäten meist erst nach einem Release erfolgen. Wir empfehlen daher, die Komponente noch nicht in Produktion zu verwenden.\n</kol-alert>\n\nDie **TableStateless**-Komponente ist für die reine Darstellung der KoliBri-Tabelle verantwortlich. Für eine Tabellen-Komponente, die Sortierung und Paginierung mit den zur Verfügung gestellten Daten automatisch übernehmen kann, siehe [KolTableStateful](../table-stateful/readme.md).\n\nTableStateless bietet sich insbesondere bei größeren Datenmengen an, wenn es nicht praktikabel ist, die komplette Datenmenge zur Filterung und Sortierung in den Browser auszuliefern."
-      },
-      "attributes": [
-        {
-          "name": "_data",
-          "description": "Defines the primary table data."
-        },
-        {
-          "name": "_data-foot",
-          "description": "Defines the data for the table footer."
-        },
-        {
-          "name": "_header-cells",
-          "description": "Defines the horizontal and vertical table headers."
-        },
-        {
-          "name": "_label",
-          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
-        },
-        {
-          "name": "_min-width",
-          "description": "Defines the table min-width."
-        },
-        {
-          "name": "_selection",
-          "description": "Defines how rows can be selected and the current selection."
-        }
-      ]
-    },
     {
       "name": "kol-tabs",
       "description": {
@@ -3623,6 +3697,27 @@
           "name": "_max-length",
           "description": "Defines the maximum number of input characters."
         },
+        {
+          "name": "_msg",
+          "description": "Defines the properties for a message rendered as Alert component.",
+          "values": [
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "error"
+            },
+            {
+              "name": "msg"
+            }
+          ]
+        },
         {
           "name": "_name",
           "description": "Defines the technical name of an input field."
@@ -3714,45 +3809,6 @@
         }
       ]
     },
-    {
-      "name": "kol-tooltip-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Synonyme: Inline Dialog, Popover\n\n<kol-alert _type=\"info\" _variant=\"card\">Die **Tooltip**-Komponente wird innerhalb von KoliBri verwendet und ist nicht dafür vorgesehen in der Anwendungsentwicklung verwendet zu werden. Denn der Tooltip ist nur dann wirklich barrierefrei, wenn von einem Referenzelement auf das Tooltip verwiesen wird.</kol-alert>\n\nDie **Tooltip**-Komponente implementiert das Gegenstück zum `Aria-Label`. Es ist also explizit nur dafür vorgesehen, dem/der Nutzer:in ohne Screenreader die Beschriftung eines Elementes anzuzeigen.\n\nEin geöffneter Tooltip lässt sich mit der `Escape`-Taste schließen, um ggf. überlagerte Seiteninformationen wieder sichtbar zu machen.\n\n**Hinweis:** Damit der Tooltip korrekt ausgerichtet wird, darf das Referenz-Element nicht `display: inline` haben."
-      },
-      "attributes": [
-        {
-          "name": "_access-key",
-          "description": "Defines the elements access key."
-        },
-        {
-          "name": "_align",
-          "description": "Defines the alignment of the tooltip, popover or tabs in relation to the element.",
-          "values": [
-            {
-              "name": "bottom"
-            },
-            {
-              "name": "left"
-            },
-            {
-              "name": "right"
-            },
-            {
-              "name": "top"
-            }
-          ]
-        },
-        {
-          "name": "_id",
-          "description": "Defines the internal ID of the primary component element."
-        },
-        {
-          "name": "_label",
-          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
-        }
-      ]
-    },
     {
       "name": "kol-tree",
       "description": {
@@ -3816,19 +3872,6 @@
         }
       ]
     },
-    {
-      "name": "kol-tree-wc",
-      "description": {
-        "kind": "markdown",
-        "value": "Synonyme: List, Navigation\n\n<kol-alert _type=\"warning\" _variant=\"card\">\n  <kol-badge _color=\"#476af5\" _label=\"Preview\"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da die Barrierefreiheitstests noch ausstehen. Die verschiedenen Tests können aufgrund der Modularität bei neuen Komponenten und Funktionalitäten meist erst nach einem Release erfolgen. Wir empfehlen daher, die Komponente noch nicht in Produktion zu verwenden.\n</kol-alert>\n\nDie Komponente **Tree** stellt eine hierarchische Liste dar. Jedes Element in der Hierarchie kann Kindelemente haben, und Elemente, die Kinder haben, können erweitert oder reduziert werden, um die Kinder anzuzeigen oder zu verbergen."
-      },
-      "attributes": [
-        {
-          "name": "_label",
-          "description": "Defines the label of the tree."
-        }
-      ]
-    },
     {
       "name": "kol-version",
       "description": {