@kickstartds/ds-agency-premium 1.6.71 → 1.6.72--canary.43.2474.0

package/dist/components/teaser-card/teaser-card.schema.json

@@ -28,10 +28,16 @@
       "description": "Layout for the Teaser Card",
       "default": "stack"
     },
-    "target": {
+    "centered": {
+      "type": "boolean",
+      "title": "Centered",
+      "description": "Whether the Teaser Card is centered",
+      "default": false
+    },
+    "url": {
       "type": "string",
-      "title": "Target",
-      "description": "Target that should be linked",
+      "title": "Url",
+      "description": "Url that should be linked",
       "format": "uri"
     },
     "button": {
@@ -71,5 +77,5 @@
     }
   },
   "additionalProperties": false,
-  "required": ["topic", "target"]
+  "required": ["topic", "url"]
 }

package/dist/components/testimonial/index.js

@@ -2,6 +2,12 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
 import { Quote } from '@kickstartds/content/lib/quote';
 import classnames from 'classnames';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
+
+const defaults = {
+    "quoteSigns": "normal",
+    "image": {}
+};
 
 const TestimonialContextDefault = forwardRef(({ image, quote, name, title, layout, index, rating, quoteSigns, ...rest }, ref) => (jsx(Quote, { ...rest, ref: ref, className: classnames(layout === "alternating" && index % 2 === 1 ? "c-quote--reverse" : "", quoteSigns === "normal" || quoteSigns === "none"
         ? "c-quote--small-signs"
@@ -9,7 +15,7 @@ const TestimonialContextDefault = forwardRef(({ image, quote, name, title, layou
 const TestimonialContext = createContext(TestimonialContextDefault);
 const Testimonial = forwardRef((props, ref) => {
     const Component = useContext(TestimonialContext);
-    return jsx(Component, { ...props, ref: ref });
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
 });
 Testimonial.displayName = "Testimonial";
 

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

@@ -64,9 +64,6 @@
       "type": "integer",
       "minimum": 1,
       "maximum": 5
-    },
-    "type": {
-      "const": "testimonial"
     }
   },
   "additionalProperties": false,

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
 import { TestimonialsProps } from "../../TestimonialsProps-e344f597.js";
-import { SliderProps } from "../../SliderProps-93230a76.js";
+import { SliderProps } from "../../SliderProps-789f8508.js";
 interface ConditionalSliderProps extends SliderProps {
     layout: "slider" | "list" | "alternating";
 }

package/dist/components/testimonials/index.js

@@ -3,10 +3,17 @@ import { forwardRef, createElement, createContext, useContext } from 'react';
 import { jsx } from 'react/jsx-runtime';
 import { Slider } from '../slider/index.js';
 import { Testimonial } from '../testimonial/index.js';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
 import 'classnames';
 import '@kickstartds/content/lib/slider';
 import '@kickstartds/content/lib/quote';
 
+const defaults = {
+    "layout": "slider",
+    "quoteSigns": "normal",
+    "testimonial": []
+};
+
 const ConditionalSlider = forwardRef(({ layout, children, arrows, nav, ...props }, ref) => {
     if (layout === "slider") {
         return (jsx(Slider, { className: "dsa-testimonials dsa-testimonials--slider", arrows: arrows, nav: nav, ...props, ref: ref, children: children }));
@@ -21,7 +28,7 @@ const TestimonialsContextDefault = forwardRef(({ testimonial: testimonials = [],
 const TestimonialsContext = createContext(TestimonialsContextDefault);
 const Testimonials = forwardRef((props, ref) => {
     const Component = useContext(TestimonialsContext);
-    return jsx(Component, { ...props, ref: ref });
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
 });
 Testimonials.displayName = "Testimonials";
 

package/dist/components/testimonials/testimonials.css

@@ -2,6 +2,7 @@
 .dsa-testimonials {
   --dsa-testimonials--padding-left: calc(var(--dsa-testimonials__icon--font-size) / 6);
   --dsa-testimonials--padding-top: 0.5em;
+  --dsa-testimonials--gap: var(--ks-spacing-stack-s) var(--ks-spacing-inline-m);
   --dsa-testimonials__quote--font: var(--ks-font-copy-l);
   --dsa-testimonials__quote--font-weight: var(--ks-font-weight-regular);
   --dsa-testimonials__quote--margin-bottom: var(--ks-spacing-stack-s);
@@ -20,7 +21,6 @@
   --dsa-testimonials__byline--font-weight: var(--ks-font-weight-regular);
   --dsa-testimonials__byline--color: var(--ks-text-color-copy);
   --dsa-testimonials__image--max-width: 40%;
-  --dsa-testimonials__list--gap: var(--ks-spacing-stack-xl);
 }
 @container quote (min-width: 640px) {
   .dsa-testimonials {
@@ -32,6 +32,9 @@
     --dsa-testimonials--padding-left: var(--ks-spacing-inline-xl);
   }
 }
+.dsa-testimonials {
+  --dsa-testimonials__list--gap: var(--ks-spacing-stack-xl);
+}
 
 .dsa-testimonials .c-quote {
   --c-quote_text--font: var(--dsa-testimonials__quote--font, var(--ks-font-copy-l));
@@ -60,6 +63,9 @@
   flex-direction: column;
   gap: var(--dsa-testimonials__list--gap, var(--ks-spacing-stack-xl));
 }
+.dsa-testimonials .c-quote {
+  gap: var(--dsa-testimonials--gap, var(--ks-spacing-stack-s) var(--ks-spacing-inline-m));
+}
 .dsa-testimonials .c-quote__source {
   color: var(--dsa-testimonials__source--color, var(--ks-text-color-default));
 }

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

@@ -93,9 +93,6 @@
           "image"
         ]
       }
-    },
-    "type": {
-      "const": "testimonials"
     }
   },
   "additionalProperties": false

package/dist/components/text/index.js

@@ -3,6 +3,13 @@ import { jsx } from 'react/jsx-runtime';
 import classnames from 'classnames';
 import { forwardRef, createContext, useContext } from 'react';
 import { RichText } from '@kickstartds/base/lib/rich-text';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
+
+const defaults = {
+    "layout": "singleColumn",
+    "align": "left",
+    "highlightText": false
+};
 
 const TextContextDefault = forwardRef(({ text, layout = "singleColumn", align = "left", highlightText = false, ...rest }, ref) => {
     const layoutClass = `${layout === "multiColumn" ? "dsa-text--columns" : ""}`;
@@ -13,7 +20,7 @@ const TextContextDefault = forwardRef(({ text, layout = "singleColumn", align =
 const TextContext = createContext(TextContextDefault);
 const Text = forwardRef((props, ref) => {
     const Component = useContext(TextContext);
-    return jsx(Component, { ...props, ref: ref });
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
 });
 Text.displayName = "Text";
 

package/dist/components/text/text.css

@@ -8,8 +8,8 @@
 }
 
 .c-rich-text.dsa-text {
-  font: var(--dsa-text--font, var(--dsa-rich-text--font), var(--ks-font-copy-m));
-  color: var(--dsa-text--color, var(--dsa-rich-text--color), var(--ks-text-color-default));
+  font: var(--dsa-text--font, var(--dsa-rich-text--font, var(--ks-font-copy-m)));
+  color: var(--dsa-text--color, var(--dsa-rich-text--color, var(--ks-text-color-default)));
 }
 .c-rich-text.dsa-text--highlight.c-rich-text {
   color: var(--dsa-text_highlight--color, var(--ks-text-color-default));

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

@@ -39,9 +39,6 @@
       "title": "Highlight Text",
       "description": "Visually highlight the text",
       "default": false
-    },
-    "type": {
-      "const": "text"
     }
   },
   "additionalProperties": false,

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

@@ -59,10 +59,10 @@
             "Book a meeting"
           ]
         },
-        "target": {
+        "url": {
           "type": "string",
-          "title": "Target",
-          "description": "Target that should be linked, makes the button behave like a link semantically",
+          "title": "URL",
+          "description": "The URL to link to when the button is clicked",
           "format": "uri"
         },
         "icon": {
@@ -91,9 +91,6 @@
       "description": "Overwrite the color to use for the text content",
       "type": "string",
       "format": "color"
-    },
-    "type": {
-      "const": "tile"
     }
   },
   "additionalProperties": false,

package/dist/components/tile/tile.schema.json

@@ -51,8 +51,8 @@
         "label": {
           "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/label"
         },
-        "target": {
-          "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/target"
+        "url": {
+          "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/url"
         },
         "icon": {
           "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/icon"

package/dist/components/video-curtain/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { VideoCurtainProps } from "../../VideoCurtainProps-6c625a69.js";
+import { VideoCurtainProps } from "../../VideoCurtainProps-a2c0cc7f.js";
 declare const VideoCurtainContextDefault: import("react").ForwardRefExoticComponent<VideoCurtainProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const VideoCurtainContext: import("react").Context<import("react").ForwardRefExoticComponent<VideoCurtainProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const VideoCurtain: import("react").ForwardRefExoticComponent<VideoCurtainProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/video-curtain/index.js

@@ -6,25 +6,43 @@ import classnames from 'classnames';
 import { Container } from '@kickstartds/core/lib/container';
 import { ButtonContext } from '@kickstartds/base/lib/button';
 import { useButtonGroup } from '../button-group/index.js';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
 import '@kickstartds/base/lib/button-group';
 
+const defaults = {
+    "highlightText": false,
+    "colorNeutral": false,
+    "buttons": [],
+    "overlay": false,
+    "video": {},
+    "textPosition": "center"
+};
+
 const VideoCurtainContextDefault = forwardRef(({ headline, sub, text, highlightText, colorNeutral, textPosition, overlay, video, className, buttons = [], ...rest }, ref) => {
     const ButtonGroup = useButtonGroup();
     return (jsx(ButtonContext.Provider
     // @ts-expect-error
     , { 
         // @ts-expect-error
-        value: ButtonGroup, children: jsx(Container, { name: "visual", children: jsx(VisualContextDefault, { ...rest, ref: ref, skipButton: true, className: classnames(`dsa-video-curtain`, highlightText ? `dsa-video-curtain--highlight-text` : "", colorNeutral ? `dsa-video-curtain--color-neutral` : "", className), height: "fullScreen", inbox: true, box: {
+        value: ButtonGroup, children: jsx(Container, { name: "visual", children: jsx(VisualContextDefault, { ...rest, ref: ref, skipButton: true, className: classnames(`dsa-video-curtain`, textPosition && `dsa-video-curtain--content-${textPosition}`, highlightText && `dsa-video-curtain--highlight-text`, colorNeutral && `dsa-video-curtain--color-neutral`, className), height: "fullScreen", inbox: true, box: {
                     background: "transparent",
                     enabled: true,
-                    vertical: "center",
-                    horizontal: textPosition,
+                    vertical: textPosition === "bottom" || textPosition === "corner"
+                        ? "bottom"
+                        : "center",
+                    horizontal: textPosition === "left" || textPosition === "corner"
+                        ? "left"
+                        : textPosition === "right"
+                            ? "right"
+                            : "center",
                     link: {
                         // @ts-expect-error
                         buttons,
                         colorNeutral,
                         enabled: buttons.length > 0,
-                        arrangement: textPosition === "center" ? "center" : "left",
+                        arrangement: textPosition === "left" || textPosition === "corner"
+                            ? "left"
+                            : "center",
                     },
                     headline: {
                         text: headline,
@@ -46,7 +64,7 @@ const VideoCurtainContextDefault = forwardRef(({ headline, sub, text, highlightT
 const VideoCurtainContext = createContext(VideoCurtainContextDefault);
 const VideoCurtain = forwardRef((props, ref) => {
     const Component = useContext(VideoCurtainContext);
-    return jsx(Component, { ...props, ref: ref });
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
 });
 VideoCurtain.displayName = "VideoCurtain";
 

package/dist/components/video-curtain/video-curtain.css

@@ -4,17 +4,22 @@
   --dsa-video-curtain_color-neutral__headline--color: var(--ks-text-color-default);
   --dsa-video-curtain_color-neutral__subheadline--color: var(--ks-text-color-default);
   --dsa-video-curtain__copy--color: var(--ks-text-color-default);
-  --dsa-video-curtain__copy--font: var(--dsa-rich-text--font);
+  --dsa-video-curtain__copy--font: var(--ks-font-copy-m);
   --dsa-video-curtain_highlight-text__copy--font: var(--ks-font-copy-l);
   --dsa-video-curtain_color-neutral__copy--color: var(--ks-text-color-default);
   --dsa-video-curtain__textbox--background-color: var(--ks-color-bg-alpha-2);
   --dsa-video-curtain__textbox--border-radius: var(--ks-border-radius-surface);
   --dsa-video-curtain__textbox--max-width: var(--dsa-section__content--width_narrow);
   --dsa-video-curtain__textbox--padding: var(--ks-spacing-inset-squish-xl);
-  --dsa-video-curtain__overlay--background: linear-gradient(
+  --dsa-video-curtain_corner__overlay--background: linear-gradient(
+    20deg,
+    var(--ks-color-fg-inverted-alpha-2) 30%,
+    transparent 80%
+  );
+  --dsa-video-curtain_bottom__overlay--background: linear-gradient(
     0deg,
-    var(--ks-background-color-default) 15%,
-    transparent 50%
+    var(--ks-color-fg-inverted-alpha-1),
+    transparent
   );
 }
 
@@ -30,44 +35,46 @@
   );
   --c-visual_overlay--background-size: 100%;
 }
-.c-visual.dsa-video-curtain--highlight-text .c-visual__box {
-  --c-visual_text--font: var(--dsa-video-curtain_highlight-text__copy--font, var(--ks-font-copy-l));
-}
-.c-visual.dsa-video-curtain .c-visual__box {
-  --c-visual_box--background: var(--ks-background-color-default);
-  --c-visual_box--color: var(--ks-color-fg);
-  --c-visual_subheadline--color: var(--ks-text-color-primary);
-  --c-visual_headline--color: var(--ks-color-fg);
+.c-visual.dsa-video-curtain--color-neutral {
+  --dsa-video-curtain__copy--color: var(--dsa-video-curtain_color-neutral__copy--color, var(--ks-text-color-default));
+  --dsa-video-curtain__headline--color: var(
+    --dsa-video-curtain_color-neutral__copy--color,
+    var(--ks-text-color-default)
+  );
+  --dsa-video-curtain__subheadline--color: var(
+    --dsa-video-curtain_color-neutral__copy--color,
+    var(--ks-text-color-default)
+  );
 }
-@container visual (min-width: 640px) {
-  .c-visual.dsa-video-curtain .c-visual__box {
-    --c-visual_box--max-width: var(--dsa-video-curtain__textbox--max-width, 50rem);
-  }
+.c-visual.dsa-video-curtain--content-bottom {
+  --c-visual_overlay--background: var(
+    --dsa-video-curtain_bottom__overlay--background,
+    linear-gradient(0deg, var(--ks-background-color-default) 15%, transparent 50%)
+  );
 }
-
-.c-visual.dsa-video-curtain {
-  --c-visual_overlay--background-size: 100%;
+.c-visual.dsa-video-curtain--content-corner {
+  --c-visual_overlay--background: var(
+    --dsa-video-curtain_corner__overlay--background,
+    linear-gradient(40deg, var(--ks-background-color-default) 15%, transparent 50%)
+  );
 }
 .c-visual.dsa-video-curtain .c-visual__box {
   --c-visual_box--background: var(--dsa-video-curtain__textbox--background-color, var(--ks-color-bg-alpha-2));
   --c-visual_box--color: var(--dsa-video-curtain__copy--color, var(--ks-text-color-default));
   --c-visual_box--border-radius: var(--dsa-video-curtain__textbox--border-radius, var(--ks-border-radius-surface));
   --c-visual_box--padding: var(--dsa-video-curtain__textbox--padding, var(--ks-spacing-inset-squish-xl));
-  --c-visual_text--font: var(--dsa-video-curtain__copy--font, var(--dsa-rich-text--font));
+  --c-visual_text--font: var(--dsa-video-curtain__copy--font, var(--ks-font-copy-m));
 }
-.c-visual.dsa-video-curtain--highlight-text.c-visual {
+.c-visual.dsa-video-curtain--highlight-text {
   --dsa-video-curtain__copy--font: var(--dsa-video-curtain_highlight-text__box--font, var(--ks-font-copy-l));
 }
-.c-visual.dsa-video-curtain--color-neutral.c-visual {
-  --dsa-video-curtain__copy--color: var(--dsa-video-curtain_color-neutral__copy--color, var(--ks-text-color-default));
-  --dsa-video-curtain__headline--color: var(
-    --dsa-video-curtain_color-neutral__copy--color,
-    var(--ks-text-color-default)
-  );
-  --dsa-video-curtain__subheadline--color: var(
-    --dsa-video-curtain_color-neutral__copy--color,
-    var(--ks-text-color-default)
-  );
+.c-visual.dsa-video-curtain--highlight-text .c-visual__box {
+  --c-visual_text--font: var(--dsa-video-curtain_highlight-text__copy--font, var(--ks-font-copy-l));
+}
+@container visual (min-width: 640px) {
+  .c-visual.dsa-video-curtain .c-visual__box {
+    --c-visual_box--max-width: var(--dsa-video-curtain__textbox--max-width, 50rem);
+  }
 }
 
 .c-visual.dsa-video-curtain .dsa-headline .dsa-headline__headline {
@@ -86,4 +93,20 @@
 .c-visual.dsa-video-curtain .c-visual__box {
   max-width: var(--c-visual_box--max-width);
   padding: var(--c-visual_box--padding);
+}
+.c-visual.dsa-video-curtain .c-visual__box--transparent {
+  padding: 0;
+}
+.c-visual.dsa-video-curtain:not(.dsa-video-curtain--content-bottom) .c-visual__continue-btn {
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translate(-50%, -10px);
+}
+.c-visual.dsa-video-curtain:not(.dsa-video-curtain--content-bottom) .c-visual__continue-btn:hover {
+  transform: translate(-50%);
+}
+.c-visual.dsa-video-curtain .c-visual__continue-btn {
+  color: var(--dsa-overlay-text--text-color, var(--ks-color-fg));
+  filter: drop-shadow(var(--dsa-overlay-text--shadow, 0 0 10px var(--ks-color-bg-inverted-alpha-3-base)));
 }

package/dist/components/video-curtain/video-curtain.schema.dereffed.json

@@ -54,10 +54,10 @@
             "title": "Icon",
             "description": "Choose an icon"
           },
-          "target": {
+          "url": {
             "type": "string",
-            "title": "Target",
-            "description": "Target that should be linked, makes the button behave like a link semantically",
+            "title": "URL",
+            "description": "The URL to link to when the button is clicked",
             "format": "uri"
           }
         },
@@ -113,14 +113,13 @@
       "description": "Choose the alginment of the module content",
       "enum": [
         "center",
+        "bottom",
         "left",
-        "right"
+        "right",
+        "corner"
       ],
       "type": "string",
-      "default": "bottom"
-    },
-    "type": {
-      "const": "video-curtain"
+      "default": "center"
     }
   },
   "additionalProperties": false

package/dist/components/video-curtain/video-curtain.schema.json

@@ -46,8 +46,8 @@
           "icon": {
             "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/icon"
           },
-          "target": {
-            "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/target"
+          "url": {
+            "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/url"
           }
         }
       }
@@ -61,9 +61,9 @@
     "textPosition": {
       "title": "Module aligment",
       "description": "Choose the alginment of the module content",
-      "enum": ["center", "left", "right"],
+      "enum": ["center", "bottom", "left", "right", "corner"],
       "type": "string",
-      "default": "bottom"
+      "default": "center"
     }
   },
   "additionalProperties": false