@kickstartds/ds-agency-premium 1.6.71--canary.45.1846.0 → 1.7.0--canary.46.1791.0

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

@@ -93,7 +93,7 @@
           "items": {
             "type": "object",
             "properties": {
-              "url": {
+              "href": {
                 "type": "string",
                 "format": "uri"
               },
@@ -108,7 +108,7 @@
                 "items": {
                   "type": "object",
                   "properties": {
-                    "url": {
+                    "href": {
                       "type": "string",
                       "format": "uri"
                     },
@@ -125,7 +125,7 @@
             },
             "additionalProperties": false,
             "required": [
-              "url",
+              "href",
               "label"
             ]
           },
@@ -133,43 +133,43 @@
             [
               {
                 "label": "Active Item",
-                "url": "#",
+                "href": "#",
                 "active": true
               },
               {
                 "label": "Navigation Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Dropdown",
-                "url": "#",
+                "href": "#",
                 "items": [
                   {
                     "label": "Level 2 Item",
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "Active Item",
                     "active": true,
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "An Item with a longer Label",
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "And One last one",
-                    "url": "#"
+                    "href": "#"
                   }
                 ]
               },
               {
                 "label": "One more Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Last Item",
-                "url": "#"
+                "href": "#"
               }
             ]
           ]
@@ -250,7 +250,7 @@
           "items": {
             "type": "object",
             "properties": {
-              "url": {
+              "href": {
                 "type": "string",
                 "format": "uri"
               },
@@ -265,7 +265,7 @@
                 "items": {
                   "type": "object",
                   "properties": {
-                    "url": {
+                    "href": {
                       "type": "string",
                       "format": "uri"
                     },
@@ -282,7 +282,7 @@
             },
             "additionalProperties": false,
             "required": [
-              "url",
+              "href",
               "label"
             ]
           },
@@ -290,43 +290,43 @@
             [
               {
                 "label": "Active Item",
-                "url": "#",
+                "href": "#",
                 "active": true
               },
               {
                 "label": "Navigation Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Dropdown",
-                "url": "#",
+                "href": "#",
                 "items": [
                   {
                     "label": "Level 2 Item",
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "Active Item",
                     "active": true,
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "An Item with a longer Label",
-                    "url": "#"
+                    "href": "#"
                   },
                   {
                     "label": "And One last one",
-                    "url": "#"
+                    "href": "#"
                   }
                 ]
               },
               {
                 "label": "One more Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Last Item",
-                "url": "#"
+                "href": "#"
               }
             ]
           ]

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { SliderProps } from "../../SliderProps-babe4ee6.js";
+import { SliderProps } from "../../SliderProps-93230a76.js";
 declare const Slider: import("react").ForwardRefExoticComponent<SliderProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export type { SliderProps };
 export { Slider };

package/dist/components/slider/index.js

@@ -4,6 +4,6 @@ import { forwardRef } from 'react';
 import classnames from 'classnames';
 import { Slider as Slider$1 } from '@kickstartds/content/lib/slider';
 
-const Slider = forwardRef(({ gap, type, autoplay, arrows, teaseNeighbours, equalHeight, children, className, ...props }, ref) => (jsx(Slider$1, { className: classnames(`dsa-slider`, className), gap: gap, type: type, arrows: arrows, autoplay: autoplay, teaseNeighbours: teaseNeighbours, equalHeight: equalHeight, ...props, ref: ref, children: children })));
+const Slider = forwardRef(({ gap, variant, autoplay, arrows, teaseNeighbours, equalHeight, children, className, ...props }, ref) => (jsx(Slider$1, { className: classnames(`dsa-slider`, className), gap: gap, type: variant, arrows: arrows, autoplay: autoplay, teaseNeighbours: teaseNeighbours, equalHeight: equalHeight, ...props, ref: ref, children: children })));
 
 export { Slider };

package/dist/components/slider/slider.css

@@ -1,15 +1,15 @@
 .dsa-slider {
-  --dsa-slider__arrow--background-color: var(--ks-color-fg-alpha-4);
-  --dsa-slider__arrow--background-color_hover: var(--ks-color-fg-alpha-3);
-  --dsa-slider__arrow--background-color_active: var(--ks-color-fg-alpha-3);
-  --dsa-slider__bullet--border-color: var(--ks-border-color-default);
-  --dsa-slider__bullet--border-color_hover: var(--ks-border-color-default);
-  --dsa-slider__bullet--border-color_active: var(--ks-color-primary);
+  --dsa-slider__arrow--background-color: transparent;
+  --dsa-slider__arrow--background-color_hover: transparent;
+  --dsa-slider__arrow--background-color_active: transparent;
+  --dsa-slider__bullet--border-color: var(--ks-border-color-primary);
+  --dsa-slider__bullet--border-color_hover: var(--ks-border-color-primary);
+  --dsa-slider__bullet--border-color_active: var(--ks-border-color-primary);
   --dsa-slider__bullet--size: 1rem;
   --dsa-slider__bullet--background-color: transparent;
-  --dsa-slider__bullet--background-color_hover: var(--ks-color-fg-alpha-8);
+  --dsa-slider__bullet--background-color_hover: var(--ks-color-primary-alpha-8);
   --dsa-slider__bullet--background-color_active: var(--ks-color-primary);
-  --dsa-slider__arrow--color: var(--ks-color-fg-inverted);
+  --dsa-slider__arrow--color: var(--ks-border-color-primary-interactive);
 }
 
 .dsa-slider.c-slider {
@@ -42,14 +42,10 @@
     var(--ks-background-color-interface-interactive-active)
   );
   --c-slider_arrow--color: var(--dsa-slider__arrow--color, var(--ks-text-color-interface-interactive));
-  position: relative;
 }
 .dsa-slider.c-slider__nav {
   margin-top: var(--ks-spacing-stack-m);
 }
-.dsa-slider.c-slider .c-slider__arrows {
-  top: 50%;
-}
 .dsa-slider.c-slider .c-slider__nav {
   margin-top: var(--ks-spacing-stack-m);
 }
@@ -63,6 +59,5 @@
 }
 .dsa-slider.c-slider .c-slider__nav-item .c-slider__bullet {
   display: block;
-  transition: var(--ks-transition-hover);
-  transition-property: border-color, background-color;
+  transition: border-color var(--ks-transition-hover);
 }

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

@@ -42,8 +42,15 @@
         true
       ]
     },
-    "type": {
-      "const": "slider"
+    "variant": {
+      "title": "Type",
+      "description": "Type of the movement",
+      "type": "string",
+      "enum": [
+        "slider",
+        "carousel"
+      ],
+      "default": "carousel"
     },
     "className": {
       "title": "Class",
@@ -98,6 +105,12 @@
                 "default": false,
                 "type": "boolean"
               },
+              "fullWidth": {
+                "title": "Width",
+                "description": "Set the width of the content to the full width of the element",
+                "type": "boolean",
+                "default": false
+              },
               "buttons": {
                 "type": "array",
                 "items": {
@@ -118,10 +131,10 @@
                       "title": "Icon",
                       "description": "Choose an icon"
                     },
-                    "url": {
+                    "target": {
                       "type": "string",
-                      "title": "URL",
-                      "description": "The URL to link to when the button is clicked",
+                      "title": "Target",
+                      "description": "Target that should be linked, makes the button behave like a link semantically",
                       "format": "uri"
                     }
                   },
@@ -161,17 +174,6 @@
                     "title": "Alt text",
                     "description": "Image description",
                     "type": "string"
-                  },
-                  "align": {
-                    "title": "Vertical alignment of the image",
-                    "description": "Select a vertical alignment for the image",
-                    "type": "string",
-                    "enum": [
-                      "center",
-                      "top",
-                      "bottom"
-                    ],
-                    "default": "center"
                   }
                 },
                 "additionalProperties": false
@@ -206,9 +208,9 @@
                 "type": "string",
                 "default": "left"
               },
-              "align": {
+              "contentAlign": {
                 "title": "Vertical alignment of the content",
-                "description": "Select a vertical alignment for the content",
+                "description": "Select a vertical alignment for the image",
                 "type": "string",
                 "enum": [
                   "center",
@@ -217,18 +219,6 @@
                 ],
                 "default": "center"
               },
-              "padding": {
-                "title": "Padding",
-                "description": "Toggle padding of the content",
-                "type": "boolean",
-                "default": false
-              },
-              "inverted": {
-                "title": "Inverted",
-                "description": "Toggle inversion of the component",
-                "type": "boolean",
-                "default": false
-              },
               "type": {
                 "const": "cta"
               }
@@ -322,10 +312,10 @@
                     "cta": {
                       "type": "object",
                       "properties": {
-                        "url": {
+                        "target": {
                           "type": "string",
-                          "title": "Call to Action url",
-                          "description": "The CTA url",
+                          "title": "Call to Action target",
+                          "description": "The CTA target",
                           "default": "#",
                           "format": "uri"
                         },
@@ -337,16 +327,6 @@
                           "examples": [
                             "See all our partners"
                           ]
-                        },
-                        "icon": {
-                          "type": "string",
-                          "format": "icon",
-                          "title": "Icon",
-                          "description": "Icon for the link style of the cta",
-                          "examples": [
-                            "arrow-right"
-                          ],
-                          "default": "arrow-right"
                         }
                       },
                       "additionalProperties": false
@@ -420,8 +400,7 @@
                   "stack",
                   "smallTiles",
                   "largeTiles"
-                ],
-                "default": "smallTiles"
+                ]
               },
               "aspectRatio": {
                 "type": "string",
@@ -523,10 +502,10 @@
                       "title": "Icon",
                       "description": "Choose an icon"
                     },
-                    "url": {
+                    "target": {
                       "type": "string",
-                      "title": "URL",
-                      "description": "The URL to link to when the button is clicked",
+                      "title": "Target",
+                      "description": "Target that should be linked, makes the button behave like a link semantically",
                       "format": "uri"
                     }
                   },
@@ -613,13 +592,7 @@
                   "corner"
                 ],
                 "type": "string",
-                "default": "bottom"
-              },
-              "inverted": {
-                "type": "boolean",
-                "title": "Inverted",
-                "description": "Inverted color scheme for the box",
-                "default": false
+                "default": "below"
               },
               "type": {
                 "const": "hero"
@@ -727,12 +700,12 @@
                       "title": "URL",
                       "description": "The URL of the logo image",
                       "examples": [
-                        "img/logos/logoipsum-344.svg",
-                        "img/logos/logoipsum-347.svg",
-                        "img/logos/logoipsum-352.svg",
-                        "img/logos/logoipsum-356.svg",
-                        "img/logos/logoipsum-358.svg",
-                        "img/logos/logoipsum-369.svg"
+                        "img/logos/logoipsum-212.svg",
+                        "img/logos/logoipsum-217.svg",
+                        "img/logos/logoipsum-239.svg",
+                        "img/logos/logoipsum-244.svg",
+                        "img/logos/logoipsum-250.svg",
+                        "img/logos/logoipsum-286.svg"
                       ]
                     },
                     "alt": {
@@ -852,12 +825,13 @@
                     "number": {
                       "title": "Number",
                       "description": "The number of the stat",
-                      "type": "integer",
+                      "type": "string",
                       "examples": [
-                        1,
-                        2,
-                        3,
-                        4
+                        "1",
+                        "5x",
+                        "2",
+                        "40%",
+                        "bis zu 100"
                       ]
                     },
                     "description": {
@@ -962,10 +936,10 @@
                 "description": "Layout for the Teaser Card",
                 "default": "stack"
               },
-              "url": {
+              "target": {
                 "type": "string",
-                "title": "Url",
-                "description": "Url that should be linked",
+                "title": "Target",
+                "description": "Target that should be linked",
                 "format": "uri"
               },
               "button": {
@@ -1018,7 +992,7 @@
             "additionalProperties": false,
             "required": [
               "topic",
-              "url"
+              "target"
             ]
           },
           {
@@ -1177,15 +1151,8 @@
         ]
       }
     },
-    "typeProp": {
-      "title": "Type",
-      "description": "Type of the movement",
-      "type": "string",
-      "enum": [
-        "slider",
-        "carousel"
-      ],
-      "default": "carousel"
+    "type": {
+      "const": "slider"
     }
   },
   "additionalProperties": false

package/dist/components/slider/slider.schema.json

@@ -22,7 +22,7 @@
     "arrows": {
       "$ref": "http://schema.kickstartds.com/content/slider.schema.json#/properties/arrows"
     },
-    "type": {
+    "variant": {
       "$ref": "http://schema.kickstartds.com/content/slider.schema.json#/properties/type"
     },
     "className": {

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

@@ -0,0 +1,14 @@
+import { FC, PropsWithChildren } 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.
+ */
+interface SplitProps {
+    layout?: "sidebarRight" | "sidebarLeft";
+    mainSectionWidth?: "narrow" | "medium" | "wide";
+}
+declare const Split: FC<PropsWithChildren<SplitProps>>;
+export type { SplitProps };
+export { Split };

package/dist/components/split/index.js

@@ -0,0 +1,17 @@
+import "./split.css";
+import { jsx } from 'react/jsx-runtime';
+import classnames from 'classnames';
+
+const Split = ({ layout = "sidebarRight", mainSectionWidth = "default", children, }) => (jsx("div", { className: classnames("l-split", layout === "sidebarRight"
+        ? "l-split--sidebar-right"
+        : layout === "sidebarLeft"
+            ? "l-split--sidebar-left"
+            : "l-split--sidebar-right", mainSectionWidth === "narrow"
+        ? "l-split--narrow"
+        : mainSectionWidth === "medium"
+            ? "l-split--medium"
+            : mainSectionWidth === "wide"
+                ? "l-split--wide"
+                : "l-split--medium"), children: children }));
+
+export { Split };

package/dist/components/split/split.css

@@ -0,0 +1,53 @@
+.l-split {
+  --dsa-split--gap-vertical: var(--ks-spacing-stack-l);
+  --dsa-split--gap-horizontal: var(--ks-spacing-inline-l);
+  --dsa-split__side--top-offset: var(--ks-spacing-stack-l);
+  --dsa-split__side--top-margin: var(--ks-spacing-stack-l);
+  --dsa-split__side--flex-basis: 210px;
+}
+
+.l-split {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--dsa-split--gap-horizontal) var(--dsa-split--gap-horizontal);
+}
+.l-split--narrow {
+  --split__main--flex-basis: var(--dsa-content--width_narrow);
+}
+.l-split--medium {
+  --split__main--flex-basis: var(--dsa-content--width_default);
+}
+.l-split--wide {
+  --split__main--flex-basis: var(--dsa-content--width_wide);
+}
+@media (min-width: 48em) {
+  .l-split {
+    justify-content: space-between;
+  }
+}
+.l-split > * {
+  flex-grow: 1;
+  flex-shrink: 1;
+}
+.l-split--sidebar-right > :first-child {
+  flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--spacing) * 2);
+}
+.l-split--sidebar-right > :last-child {
+  flex-basis: var(--dsa-split__side--flex-basis, 210px);
+  position: -webkit-sticky;
+  position: sticky;
+  top: var(--dsa-split__side--top-offset, var(--ks-spacing-stack-l));
+  height: fit-content;
+  margin-top: var(--dsa-split__side-top-margin, var(--ks-spacing-stack-l));
+}
+.l-split--sidebar-left > :last-child {
+  flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--spacing) * 2);
+}
+.l-split--sidebar-left > :first-child {
+  flex-basis: var(--dsa-split__side--flex-basis, 210px);
+  position: -webkit-sticky;
+  position: sticky;
+  top: var(--dsa-split__side--top-margin, var(--ks-spacing-stack-l));
+  height: fit-content;
+  margin-top: var(--dsa-split__side-top-margin, var(--ks-spacing-stack-l));
+}

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

@@ -0,0 +1,29 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/split.schema.json",
+  "title": "Split",
+  "type": "object",
+  "properties": {
+    "layout": {
+      "type": "string",
+      "enum": [
+        "sidebarRight",
+        "sidebarLeft"
+      ],
+      "default": "sidebarRight"
+    },
+    "mainSectionWidth": {
+      "type": "string",
+      "enum": [
+        "narrow",
+        "medium",
+        "wide"
+      ],
+      "default": "medium"
+    },
+    "type": {
+      "const": "split"
+    }
+  },
+  "additionalProperties": false
+}

package/dist/components/split/split.schema.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/split.schema.json",
+  "title": "Split",
+  "type": "object",
+  "properties": {
+    "layout": {
+      "type": "string",
+      "enum": ["sidebarRight", "sidebarLeft"],
+      "default": "sidebarRight"
+    },
+    "mainSectionWidth": {
+      "type": "string",
+      "enum": ["narrow", "medium", "wide"],
+      "default": "medium"
+    }
+  },
+  "additionalProperties": false
+}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { StatProps } from "../../StatProps-12a3eae0.js";
+import { StatProps } from "../../StatProps-79109ad0.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

@@ -2,9 +2,18 @@ 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, icon, ...rest }, ref) => (jsx(CountUp, { ...rest, ref: ref, className: "dsa-stats__item", to: number, icon: {
-        icon: icon,
-    }, text: description, topic: title })));
+const StatContextDefault = forwardRef(({ number, title, description, icon, ...rest }, ref) => {
+    const parts = number ? number.toString().split(/(\d+)/).filter(Boolean) : [];
+    const numberIndex = parts.findIndex((part) => !isNaN(Number(part)));
+    const value = numberIndex !== -1 ? parseInt(parts[numberIndex], 10) : 0;
+    const prefix = numberIndex !== -1 && numberIndex > 0 ? parts[numberIndex - 1] : "";
+    const suffix = numberIndex !== -1 && numberIndex < parts.length - 1
+        ? parts[numberIndex + 1]
+        : "";
+    return (jsx(CountUp, { ...rest, ref: ref, className: "dsa-stats__item", to: value, prefix: prefix, suffix: suffix, 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

@@ -8,12 +8,13 @@
     "number": {
       "title": "Number",
       "description": "The number of the stat",
-      "type": "integer",
+      "type": "string",
       "examples": [
-        1,
-        2,
-        3,
-        4
+        "1",
+        "5x",
+        "2",
+        "40%",
+        "bis zu 100"
       ]
     },
     "description": {