@kickstartds/ds-agency-premium 1.2.22 → 1.2.24

package/dist/components/presets.json

@@ -1726,32 +1726,9 @@
     "id": "components-logos--centered-with-button",
     "group": "Components/Logos",
     "name": "CenteredWithButton",
-    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'button',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: true\n  }}\n  items={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    }\n  ]}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={5}\n  tagline=\"Your Success, Our Commitment\"\n/>",
+    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'button',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: true\n  }}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={5}\n  tagline=\"Your Success, Our Commitment\"\n/>",
     "args": {
       "tagline": "Your Success, Our Commitment",
-      "items": [
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        }
-      ],
-      "align": "center",
-      "logosPerRow": 5,
-      "cta": {
-        "toggle": true,
-        "text": "Explore the success stories of our valued customers and discover more about their journey.",
-        "link": "#",
-        "label": "See all our partners",
-        "style": "button"
-      },
       "logo": [
         {
           "src": "img/logos/logoipsum-212.svg",
@@ -1777,7 +1754,16 @@
           "src": "img/logos/logoipsum-286.svg",
           "alt": "Logo 6"
         }
-      ]
+      ],
+      "align": "center",
+      "logosPerRow": 5,
+      "cta": {
+        "toggle": true,
+        "text": "Explore the success stories of our valued customers and discover more about their journey.",
+        "link": "#",
+        "label": "See all our partners",
+        "style": "button"
+      }
     },
     "screenshot": "img/screenshots/components-logos--centered-with-button.png"
   },
@@ -1785,32 +1771,9 @@
     "id": "components-logos--left-aligned-with-text-link",
     "group": "Components/Logos",
     "name": "LeftAlignedWithTextLink",
-    "code": "<Logos\n  align=\"left\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: true\n  }}\n  items={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    }\n  ]}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={5}\n  tagline=\"Your Success, Our Commitment\"\n/>",
+    "code": "<Logos\n  align=\"left\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: true\n  }}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={5}\n  tagline=\"Your Success, Our Commitment\"\n/>",
     "args": {
       "tagline": "Your Success, Our Commitment",
-      "items": [
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        }
-      ],
-      "align": "left",
-      "logosPerRow": 5,
-      "cta": {
-        "toggle": true,
-        "text": "Explore the success stories of our valued customers and discover more about their journey.",
-        "link": "#",
-        "label": "See all our partners",
-        "style": "text"
-      },
       "logo": [
         {
           "src": "img/logos/logoipsum-212.svg",
@@ -1836,7 +1799,16 @@
           "src": "img/logos/logoipsum-286.svg",
           "alt": "Logo 6"
         }
-      ]
+      ],
+      "align": "left",
+      "logosPerRow": 5,
+      "cta": {
+        "toggle": true,
+        "text": "Explore the success stories of our valued customers and discover more about their journey.",
+        "link": "#",
+        "label": "See all our partners",
+        "style": "text"
+      }
     },
     "screenshot": "img/screenshots/components-logos--left-aligned-with-text-link.png"
   },
@@ -1844,32 +1816,9 @@
     "id": "components-logos--logo-wall",
     "group": "Components/Logos",
     "name": "LogoWall",
-    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: false\n  }}\n  items={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    }\n  ]}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={4}\n  tagline=\"Your Success, Our Commitment\"\n/>",
+    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: false\n  }}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={4}\n  tagline=\"Your Success, Our Commitment\"\n/>",
     "args": {
       "tagline": "Your Success, Our Commitment",
-      "items": [
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        }
-      ],
-      "align": "center",
-      "logosPerRow": 4,
-      "cta": {
-        "toggle": false,
-        "text": "Explore the success stories of our valued customers and discover more about their journey.",
-        "link": "#",
-        "label": "See all our partners",
-        "style": "text"
-      },
       "logo": [
         {
           "src": "img/logos/logoipsum-212.svg",
@@ -1919,7 +1868,16 @@
           "src": "img/logos/logoipsum-286.svg",
           "alt": "Logo 6"
         }
-      ]
+      ],
+      "align": "center",
+      "logosPerRow": 4,
+      "cta": {
+        "toggle": false,
+        "text": "Explore the success stories of our valued customers and discover more about their journey.",
+        "link": "#",
+        "label": "See all our partners",
+        "style": "text"
+      }
     },
     "screenshot": "img/screenshots/components-logos--logo-wall.png"
   },
@@ -1927,32 +1885,9 @@
     "id": "components-logos--logo-row",
     "group": "Components/Logos",
     "name": "LogoRow",
-    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: false\n  }}\n  items={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    }\n  ]}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={6}\n  tagline=\"Your Success, Our Commitment\"\n/>",
+    "code": "<Logos\n  align=\"center\"\n  cta={{\n    label: 'See all our partners',\n    link: '#',\n    style: 'text',\n    text: 'Explore the success stories of our valued customers and discover more about their journey.',\n    toggle: false\n  }}\n  logo={[\n    {\n      alt: 'Logo 1',\n      src: 'img/logos/logoipsum-212.svg'\n    },\n    {\n      alt: 'Logo 2',\n      src: 'img/logos/logoipsum-217.svg'\n    },\n    {\n      alt: 'Logo 3',\n      src: 'img/logos/logoipsum-239.svg'\n    },\n    {\n      alt: 'Logo 4',\n      src: 'img/logos/logoipsum-244.svg'\n    },\n    {\n      alt: 'Logo 5',\n      src: 'img/logos/logoipsum-250.svg'\n    },\n    {\n      alt: 'Logo 6',\n      src: 'img/logos/logoipsum-286.svg'\n    }\n  ]}\n  logosPerRow={6}\n  tagline=\"Your Success, Our Commitment\"\n/>",
     "args": {
       "tagline": "Your Success, Our Commitment",
-      "items": [
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        },
-        {
-          "src": "img/logos/logoipsum-212.svg",
-          "alt": "Logo 1"
-        }
-      ],
-      "align": "center",
-      "logosPerRow": 6,
-      "cta": {
-        "toggle": false,
-        "text": "Explore the success stories of our valued customers and discover more about their journey.",
-        "link": "#",
-        "label": "See all our partners",
-        "style": "text"
-      },
       "logo": [
         {
           "src": "img/logos/logoipsum-212.svg",
@@ -1978,7 +1913,16 @@
           "src": "img/logos/logoipsum-286.svg",
           "alt": "Logo 6"
         }
-      ]
+      ],
+      "align": "center",
+      "logosPerRow": 6,
+      "cta": {
+        "toggle": false,
+        "text": "Explore the success stories of our valued customers and discover more about their journey.",
+        "link": "#",
+        "label": "See all our partners",
+        "style": "text"
+      }
     },
     "screenshot": "img/screenshots/components-logos--logo-row.png"
   },
@@ -2538,26 +2482,9 @@
     "id": "components-stats--count-up-with-icons",
     "group": "Components/Stats",
     "name": "CountUpWithIcons",
-    "code": "<Stats\n  items={[\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    },\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    },\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    }\n  ]}\n  stats={[\n    {\n      icon: 'person',\n      number: 1500,\n      title: 'Users'\n    },\n    {\n      icon: 'star',\n      number: 350,\n      title: 'Subscribers'\n    },\n    {\n      icon: 'map',\n      number: 125,\n      title: 'Locations'\n    }\n  ]}\n/>",
+    "code": "<Stats\n  stat={[\n    {\n      icon: 'person',\n      number: 1500,\n      title: 'Users'\n    },\n    {\n      icon: 'star',\n      number: 350,\n      title: 'Subscribers'\n    },\n    {\n      icon: 'map',\n      number: 125,\n      title: 'Locations'\n    }\n  ]}\n />",
     "args": {
-      "items": [
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        },
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        },
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        }
-      ],
-      "stats": [
+      "stat": [
         {
           "number": 1500,
           "title": "Users",
@@ -2581,26 +2508,9 @@
     "id": "components-stats--count-up-with-description",
     "group": "Components/Stats",
     "name": "CountUpWithDescription",
-    "code": "<Stats\n  items={[\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    },\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    },\n    {\n      icon: 'person',\n      number: 1,\n      title: 'Stat 1'\n    }\n  ]}\n  stats={[\n    {\n      description: 'Experience the power of our platform, embraced by a vast community of users. Our user base is diverse and dynamic, including both active and inactive members. Join us and become part of this ever-growing community.',\n      number: 1500,\n      title: 'Users'\n    },\n    {\n      description: 'Stay ahead with our regular updates and newsletters. Our subscribers are always in the loop, receiving the latest news and features. Subscribe now and never miss an update from us.',\n      number: 350,\n      title: 'Subscribers'\n    }\n  ]}\n/>",
+    "code": "<Stats\n  stat={[\n    {\n      description: 'Experience the power of our platform, embraced by a vast community of users. Our user base is diverse and dynamic, including both active and inactive members. Join us and become part of this ever-growing community.',\n      number: 1500,\n      title: 'Users'\n    },\n    {\n      description: 'Stay ahead with our regular updates and newsletters. Our subscribers are always in the loop, receiving the latest news and features. Subscribe now and never miss an update from us.',\n      number: 350,\n      title: 'Subscribers'\n    }\n  ]}\n />",
     "args": {
-      "items": [
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        },
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        },
-        {
-          "number": 1,
-          "title": "Stat 1",
-          "icon": "person"
-        }
-      ],
-      "stats": [
+      "stat": [
         {
           "number": 1500,
           "title": "Users",

package/dist/components/section/section.schema.dereffed.json

@@ -1084,15 +1084,20 @@
                   "Your Success, Our Commitment"
                 ]
               },
-              "items": {
+              "logo": {
                 "type": "array",
-                "title": "Items",
+                "title": "Logos",
                 "description": "The logos to display",
                 "items": {
+                  "$schema": "http://json-schema.org/draft-07/schema#",
+                  "$id": "http://schema.mydesignsystem.com/logo.schema.json",
+                  "title": "Logo",
+                  "description": "Logo entry for Logos component",
                   "type": "object",
                   "properties": {
                     "src": {
                       "type": "string",
+                      "format": "image",
                       "title": "URL",
                       "description": "The URL of the logo image",
                       "examples": [
@@ -1111,6 +1116,9 @@
                       "examples": [
                         "Logo 1"
                       ]
+                    },
+                    "type": {
+                      "const": "logo"
                     }
                   },
                   "additionalProperties": false,
@@ -1387,13 +1395,16 @@
             "description": "Component used to display stats with a number upcounter",
             "type": "object",
             "properties": {
-              "items": {
-                "title": "Items",
+              "stat": {
+                "title": "Stats",
                 "type": "array",
                 "description": "The stats to display with a number upcounter",
                 "items": {
-                  "type": "object",
+                  "$schema": "http://json-schema.org/draft-07/schema#",
+                  "$id": "http://schema.mydesignsystem.com/stat.schema.json",
                   "title": "Stat",
+                  "description": "Stat entry of Stats component",
+                  "type": "object",
                   "properties": {
                     "number": {
                       "title": "Number",
@@ -1409,12 +1420,14 @@
                     "description": {
                       "title": "Description",
                       "description": "Optional description of the stat",
-                      "type": "string"
+                      "type": "string",
+                      "format": "markdown"
                     },
                     "title": {
                       "title": "Title",
                       "description": "Title of the stat",
                       "type": "string",
+                      "format": "markdown",
                       "examples": [
                         "Stat 1",
                         "Stat 2",
@@ -1431,12 +1444,33 @@
                         "home",
                         "map"
                       ]
+                    },
+                    "type": {
+                      "const": "stat"
                     }
                   },
                   "additionalProperties": false,
                   "required": [
                     "number",
-                    "title"
+                    "label"
+                  ],
+                  "examples": [
+                    {
+                      "number": 1,
+                      "label": "Stat 1"
+                    },
+                    {
+                      "number": 2,
+                      "label": "Stat 2"
+                    },
+                    {
+                      "number": 3,
+                      "label": "Stat 3"
+                    },
+                    {
+                      "value": 4,
+                      "label": "Stat 4"
+                    }
                   ]
                 },
                 "minItems": 1,

package/dist/components/stat/index.d.ts

@@ -1,31 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-/* eslint-disable */
-/**
- * This file was automatically generated by json-schema-to-typescript.
- * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
- * and run json-schema-to-typescript to regenerate this file.
- */
-/**
- * The number of the stat
- */
-type Number = number;
-/**
- * Optional description of the stat
- */
-type Description = string;
-/**
- * Title of the stat
- */
-type Title = string;
-/**
- * Stat entry of Stats component
- */
-interface StatProps {
-    number: Number;
-    description?: Description;
-    title?: Title;
-}
+import { StatProps } from "../../StatProps-12a3eae0.js";
 declare const StatContextDefault: import("react").ForwardRefExoticComponent<StatProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const StatContext: import("react").Context<import("react").ForwardRefExoticComponent<StatProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Stat: import("react").ForwardRefExoticComponent<StatProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/stat/index.js

@@ -1,7 +1,10 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
+import { CountUp } from '@kickstartds/content/lib/count-up';
 
-const StatContextDefault = forwardRef(({ number, title, description, ...rest }, ref) => (jsxs("div", { ...rest, ref: ref, className: "dsa-stats__stat", children: [jsx("span", { className: "dsa-stats__value", children: number }), jsx("span", { className: "dsa-stats__label", children: title }), description && (jsx("span", { className: "dsa-stats__description", children: description }))] })));
+const StatContextDefault = forwardRef(({ number, title, description, icon, ...rest }, ref) => (jsx(CountUp, { ...rest, ref: ref, className: "dsa-stats__item", to: number, icon: {
+        icon: icon,
+    }, text: description, topic: title })));
 const StatContext = createContext(StatContextDefault);
 const Stat = forwardRef((props, ref) => {
     const Component = useContext(StatContext);

package/dist/components/stat/stat.schema.dereffed.json

@@ -34,6 +34,16 @@
         "Stat 4"
       ]
     },
+    "icon": {
+      "title": "Icon",
+      "description": "Optional icon of the stat",
+      "type": "string",
+      "examples": [
+        "person",
+        "home",
+        "map"
+      ]
+    },
     "type": {
       "const": "stat"
     }

package/dist/components/stat/stat.schema.json

@@ -23,6 +23,12 @@
       "type": "string",
       "format": "markdown",
       "examples": ["Stat 1", "Stat 2", "Stat 3", "Stat 4"]
+    },
+    "icon": {
+      "title": "Icon",
+      "description": "Optional icon of the stat",
+      "type": "string",
+      "examples": ["person", "home", "map"]
     }
   },
   "additionalProperties": false,

package/dist/components/stats/index.d.ts

@@ -1,4 +1,4 @@
 import { HTMLAttributes, FC } from "react";
-import { StatsProps } from "../../StatsProps-17b0743a.js";
+import { StatsProps } from "../../StatsProps-bf5ef578.js";
 declare const Stats: FC<StatsProps & HTMLAttributes<HTMLElement>>;
 export { Stats };

package/dist/components/stats/index.js

@@ -1,11 +1,11 @@
 import "./stats.css";
 import { jsx } from 'react/jsx-runtime';
-import { CountUp } from '@kickstartds/content/lib/count-up';
+import { createElement } from 'react';
+import { Stat } from '../stat/index.js';
+import '@kickstartds/content/lib/count-up';
 
-const Stats = ({ items = [], }) => {
-    return (jsx("div", { className: "dsa-stats", children: items.map((item, index) => (jsx(CountUp, { className: "dsa-stats__item", to: item.number, icon: {
-                icon: item?.icon,
-            }, text: item?.description, topic: item.title }, index))) }));
+const Stats = ({ stat: stats = [], }) => {
+    return (jsx("div", { className: "dsa-stats", children: stats.map((item, index) => (createElement(Stat, { ...item, key: index }))) }));
 };
 
 export { Stats };

package/dist/components/stats/stats.schema.dereffed.json

@@ -5,13 +5,16 @@
   "description": "Component used to display stats with a number upcounter",
   "type": "object",
   "properties": {
-    "items": {
-      "title": "Items",
+    "stat": {
+      "title": "Stats",
       "type": "array",
       "description": "The stats to display with a number upcounter",
       "items": {
-        "type": "object",
+        "$schema": "http://json-schema.org/draft-07/schema#",
+        "$id": "http://schema.mydesignsystem.com/stat.schema.json",
         "title": "Stat",
+        "description": "Stat entry of Stats component",
+        "type": "object",
         "properties": {
           "number": {
             "title": "Number",
@@ -27,12 +30,14 @@
           "description": {
             "title": "Description",
             "description": "Optional description of the stat",
-            "type": "string"
+            "type": "string",
+            "format": "markdown"
           },
           "title": {
             "title": "Title",
             "description": "Title of the stat",
             "type": "string",
+            "format": "markdown",
             "examples": [
               "Stat 1",
               "Stat 2",
@@ -49,12 +54,33 @@
               "home",
               "map"
             ]
+          },
+          "type": {
+            "const": "stat"
           }
         },
         "additionalProperties": false,
         "required": [
           "number",
-          "title"
+          "label"
+        ],
+        "examples": [
+          {
+            "number": 1,
+            "label": "Stat 1"
+          },
+          {
+            "number": 2,
+            "label": "Stat 2"
+          },
+          {
+            "number": 3,
+            "label": "Stat 3"
+          },
+          {
+            "value": 4,
+            "label": "Stat 4"
+          }
         ]
       },
       "minItems": 1,

package/dist/components/stats/stats.schema.json

@@ -5,40 +5,12 @@
   "description": "Component used to display stats with a number upcounter",
   "type": "object",
   "properties": {
-    "items": {
-      "title": "Items",
+    "stat": {
+      "title": "Stats",
       "type": "array",
       "description": "The stats to display with a number upcounter",
       "items": {
-        "type": "object",
-        "title": "Stat",
-        "properties": {
-          "number": {
-            "title": "Number",
-            "description": "The number of the stat",
-            "type": "integer",
-            "examples": [1, 2, 3, 4]
-          },
-          "description": {
-            "title": "Description",
-            "description": "Optional description of the stat",
-            "type": "string"
-          },
-          "title": {
-            "title": "Title",
-            "description": "Title of the stat",
-            "type": "string",
-            "examples": ["Stat 1", "Stat 2", "Stat 3", "Stat 4"]
-          },
-          "icon": {
-            "title": "Icon",
-            "description": "Optional icon of the stat",
-            "type": "string",
-            "examples": ["person", "home", "map"]
-          }
-        },
-        "additionalProperties": false,
-        "required": ["number", "title"]
+        "$ref": "http://schema.mydesignsystem.com/stat.schema.json"
       },
       "minItems": 1,
       "maxItems": 4

package/dist/tokens/themes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:18 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:39 GMT
  */
 :root [ks-theme=business] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -2727,7 +2727,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:23 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:44 GMT
  */
 :root [ks-theme=google] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -5458,7 +5458,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:21 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:42 GMT
  */
 :root [ks-theme=ngo] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -8459,7 +8459,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:25 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:46 GMT
  */
 :root [ks-theme=telekom] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);

package/dist/tokens/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:15 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:36 GMT
  */
 
 :root, [ks-theme] {

package/dist/tokens/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri, 01 Mar 2024 18:00:16 GMT
+ * Generated on Fri, 01 Mar 2024 19:33:37 GMT
  */
 
 export const KsBackgroundColorAccentBase = "#230a2b";