@kickstartds/ds-agency-premium 1.6.65--canary.40.1537.0 → 1.6.66

package/dist/components/cta/cta.css

@@ -1,15 +1,12 @@
 .dsa-cta {
-  --dsa-cta--gap: var(--ks-spacing-stack-l) var(--ks-spacing-inline-l);
-  --dsa-cta__content--vertical-padding: var(--dsa-content--vertical-spacing);
-  --dsa-cta__content--horizontal-padding: var(--dsa-content--horizontal-spacing);
-  --dsa-cta__content--max-width: var(--dsa-content--width_narrow);
+  --dsa-cta--vertical-padding: var(--l-section--space-default);
+  --dsa-cta--horizontal-padding: var(--dsa-content--spacing);
   --dsa-cta__copy--font: var(--dsa-rich-text--font);
   --dsa-cta__copy--color: var(--ks-text-color-default);
   --dsa-cta__headline--color: var(--dsa-headline--color);
   --dsa-cta__headline--font: var(--dsa-headline_h2--font);
   --dsa-cta__subheadline--color: var(--dsa-headline__subheadline--color);
   --dsa-cta__subheadline--font: var(--dsa-headline_h2__subheadline--font);
-  --dsa-cta__image--padding: var(--ks-spacing-inset-m);
   --dsa-cta_color-neutral__headline--color: var(--ks-text-color-default);
   --dsa-cta_color-neutral__subheadline--color: var(--ks-text-color-default);
   --dsa-cta_color-neutral__copy--color: var(--ks-text-color-default);
@@ -19,11 +16,11 @@
 }
 
 .dsa-cta.c-storytelling {
-  --c-storytelling--horizontal-padding: var(--dsa-cta__content--horizontal-padding);
-  --c-storytelling--vertical-padding: var(--dsa-cta__content--vertical-padding);
+  --c-storytelling--padding-ratio: 2;
+  --c-storytelling--horizontal-padding: var(--dsa-content--spacing);
   justify-content: center;
   align-items: stretch;
-  gap: var(--dsa-cta--gap, var(--ks-spacing-inline-m));
+  padding: 0;
 }
 .dsa-cta.c-storytelling.dsa-cta--color-neutral {
   --dsa-cta__copy--color: var(--dsa-cta_color-neutral__copy--color, var(--ks-text-color-default));
@@ -38,19 +35,34 @@
     var(--dsa-headline_h1__subheadline--font)
   );
 }
-.dsa-cta.c-storytelling.dsa-cta--no-padding .c-storytelling__box {
-  padding: 0;
+.dsa-cta.c-storytelling.c-storytelling--full {
+  --c-storytelling--padding-ratio: 1;
 }
-.dsa-cta.c-storytelling.dsa-cta--image-padding .c-storytelling__image {
-  padding: var(--dsa-cta__content--vertical-padding, var(--dsa-content--vertical-spacing)) var(--dsa-cta__content--horizontal-padding, var(--dsa-content--horizontal-spacing));
+.dsa-cta.c-storytelling.c-storytelling--full.c-storytelling--order-desktop-image-last .c-storytelling__box {
+  padding-left: var(--dsa-cta--horizontal-padding);
 }
-.dsa-cta.c-storytelling .c-storytelling__box__content {
-  max-width: var(--dsa-cta__content--max-width, var(--dsa-content--width_narrow));
+.dsa-cta.c-storytelling.dsa-cta--align-top {
+  align-items: flex-start;
+}
+.dsa-cta.c-storytelling.dsa-cta--align-bottom {
+  align-items: flex-end;
+}
+.dsa-cta.c-storytelling .c-storytelling__box {
+  width: 100%;
+  padding: var(--dsa-cta--vertical-padding, var(--l-section--space-default)) var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing));
+}
+@container storytelling (max-width: 640px) {
+  .dsa-cta.c-storytelling .c-storytelling__box {
+    padding-top: calc(var(--dsa-cta--vertical-padding, var(--l-section--space-default)) / var(--c-storytelling--padding-ratio));
+  }
+  .dsa-cta.c-storytelling .c-storytelling__box:only-child {
+    padding-top: var(--dsa-cta--vertical-padding, var(--l-section--space-default));
+  }
 }
 .dsa-cta.c-storytelling .c-storytelling__box:only-child {
-  --c-storytelling--horizontal-padding: var(--dsa-cta__content--horizontal-padding);
+  padding: var(--dsa-cta--vertical-padding, var(--l-section--space-default)) var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing));
 }
-.dsa-cta.c-storytelling .c-storytelling__box:only-child .c-storytelling__box__content {
+.dsa-cta.c-storytelling .c-storytelling__box__content {
   max-width: 100%;
 }
 .dsa-cta.c-storytelling .c-storytelling__box .dsa-headline__headline {
@@ -67,42 +79,50 @@
   font: var(--dsa-cta__copy--font, var(--dsa-rich-text--font, var(--ks-font-copy-m)));
   color: var(--dsa-cta__copy--color, var(--dsa-rich-text--color, var(--ks-text-color-copy)));
 }
-.dsa-cta.c-storytelling > .c-storytelling__image {
+.dsa-cta.c-storytelling .c-storytelling__box:only-child {
+  --dsa-cta--horizontal-padding: var(--dsa-content--spacing);
+}
+.dsa-cta.c-storytelling .c-storytelling__image {
   margin: 0;
 }
-@container storytelling (max-width: 639.9px) {
-  .dsa-cta.c-storytelling.c-storytelling--order-mobile-image-last .c-storytelling__box {
-    padding-bottom: 0;
+@container storytelling (min-width: 640px) {
+  .dsa-cta.c-storytelling.c-storytelling--order-desktop-image-last .c-storytelling__image {
+    padding-left: calc(var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing)) / var(--c-storytelling--padding-ratio));
   }
-  .dsa-cta.c-storytelling.c-storytelling--order-mobile-image-last .c-storytelling__image {
-    padding-top: 0;
+  .dsa-cta.c-storytelling.c-storytelling--order-desktop-image-last .c-storytelling__box {
+    padding-right: calc(var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing)) / var(--c-storytelling--padding-ratio));
   }
-  .dsa-cta.c-storytelling:not(.c-storytelling--order-mobile-image-last) .c-storytelling__box:not(:only-child) {
-    padding-top: 0;
+  .dsa-cta.c-storytelling .c-storytelling__box {
+    padding-left: calc(var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing)) / var(--c-storytelling--padding-ratio));
   }
-  .dsa-cta.c-storytelling:not(.c-storytelling--order-mobile-image-last) .c-storytelling__image {
-    padding-bottom: 0;
+  .dsa-cta.c-storytelling .c-storytelling__box__content--center .c-button-group {
+    justify-content: center;
   }
-}
-@container storytelling (min-width: 640px) {
-  .dsa-cta.c-storytelling.c-storytelling--order-desktop-image-last .c-storytelling__box:not(:only-child) {
-    padding-right: 0;
+  .dsa-cta.c-storytelling .c-storytelling__box:only-child {
+    width: 100%;
+    max-width: calc(var(--dsa-content--width_default) - var(--dsa-content--spacing) * var(--c-storytelling--padding-ratio));
   }
-  .dsa-cta.c-storytelling.c-storytelling--order-desktop-image-last .c-storytelling__image {
-    padding-left: 0;
+  .dsa-cta.c-storytelling > .c-storytelling__image {
+    padding: var(--dsa-cta--vertical-padding, var(--l-section--space-default)) var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing));
+    padding-right: calc(var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing)) / var(--c-storytelling--padding-ratio));
+  }
+  .dsa-cta.c-storytelling.c-storytelling--full > .c-storytelling__image {
+    padding: 0;
   }
-  .dsa-cta.c-storytelling:not(.c-storytelling--order-desktop-image-last) .c-storytelling__box {
-    padding-left: 0;
+  .dsa-cta.c-storytelling > .c-storytelling__image,
+  .dsa-cta.c-storytelling > .c-storytelling__box {
+    max-width: calc(var(--dsa-content--width_wide) / 2);
   }
-  .dsa-cta.c-storytelling:not(.c-storytelling--order-desktop-image-last) .c-storytelling__image {
-    padding-right: 0;
+  .dsa-cta.c-storytelling.dsa-cta--full-width > .c-storytelling__image,
+  .dsa-cta.c-storytelling.dsa-cta--full-width > .c-storytelling__box {
+    max-width: 100%;
   }
 }
 
 @media (min-width: 640px) {
   .dsa-header--floating + .l-container--storytelling .c-storytelling.dsa-cta,
   .dsa-header--floating + .l-section .l-container--storytelling:first-child .c-storytelling.dsa-cta {
-    padding-top: calc(var(--dsa-header--height) + var(--dsa-cta__content--horizontal-padding, var(--dsa-content--horizontal-spacing)));
+    padding-top: calc(var(--dsa-header--height) + var(--dsa-cta--horizontal-padding, var(--dsa-content--spacing)));
     z-index: 1;
   }
 }

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

@@ -40,6 +40,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": {
@@ -103,17 +109,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
@@ -148,9 +143,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",
@@ -159,12 +154,6 @@
       ],
       "default": "center"
     },
-    "padding": {
-      "title": "Padding",
-      "description": "Toggle padding of the content",
-      "type": "boolean",
-      "default": false
-    },
     "type": {
       "const": "cta"
     }

package/dist/components/cta/cta.schema.json

@@ -36,6 +36,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": {
@@ -81,13 +87,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
@@ -119,18 +118,12 @@
       "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", "top", "bottom"],
       "default": "center"
-    },
-    "padding": {
-      "title": "Padding",
-      "description": "Toggle padding of the content",
-      "type": "boolean",
-      "default": false
     }
   },
   "additionalProperties": false

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { CtaProps } from "../../CtaProps-fd5e75dc.js";
+import { CtaProps } from "../../CtaProps-93230a76.js";
 declare const CtaContextDefault: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const CtaContext: import("react").Context<import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Cta: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/cta/index.js

@@ -7,20 +7,22 @@ import classnames from 'classnames';
 import { useButtonGroup } from '../button-group/index.js';
 import '@kickstartds/base/lib/button-group';
 
-const CtaContextDefault = forwardRef(({ headline, highlightText = false, sub, image, text, textAlign, backgroundImage, backgroundColor, colorNeutral, align, padding, order, buttons = [], ...rest }, ref) => {
+const CtaContextDefault = forwardRef(({ headline, highlightText = false, sub, image, text, textAlign, backgroundImage, backgroundColor, colorNeutral, contentAlign, order, fullWidth = false, buttons = [], ...rest }, ref) => {
     const ButtonGroup = useButtonGroup();
     return (jsx(ButtonContext.Provider
     // @ts-expect-error
     , { 
         // @ts-expect-error
-        value: ButtonGroup, children: jsx(Storytelling, { ...rest, ref: ref, className: classnames("dsa-cta", highlightText ? `dsa-cta--highlight-text` : "", colorNeutral ? `dsa-cta--color-neutral` : "", image?.padding ? `dsa-cta--image-padding` : "", !padding ? `dsa-cta--no-padding` : "", align && align !== "center" ? `dsa-cta--align-${align}` : ""), backgroundImage: backgroundImage, backgroundColor: backgroundColor, full: true, image: {
+        value: ButtonGroup, children: jsx(Storytelling, { ...rest, ref: ref, className: classnames("dsa-cta", fullWidth ? `dsa-cta--full-width` : "", highlightText ? `dsa-cta--highlight-text` : "", colorNeutral ? `dsa-cta--color-neutral` : "", contentAlign && contentAlign !== "center"
+                ? `dsa-cta--align-${contentAlign}`
+                : ""), backgroundImage: backgroundImage, backgroundColor: backgroundColor, full: image?.padding === false, image: {
                 source: image?.src,
                 order: order,
-                vAlign: image?.align,
+                vAlign: contentAlign,
             }, box: {
                 text: text,
                 textAlign: textAlign,
-                vAlign: align,
+                vAlign: contentAlign,
                 link: {
                     buttons,
                     colorNeutral: colorNeutral,

package/dist/components/footer/footer.css

@@ -27,7 +27,7 @@
   background-color: var(--dsa-footer--background-color, var(--ks-background-color-default));
 }
 .dsa-footer__content {
-  padding: var(--l-section--space-small) var(--dsa-content--horizontal-spacing);
+  padding: var(--l-section--space-small) var(--dsa-content--spacing);
   border-top: var(--dsa-footer--border-top, 1px solid var(--ks-border-color-default));
   max-width: var(--dsa-footer--max-width, var(--dsa-content--width_wide));
   width: 100%;

package/dist/components/header/header.css

@@ -9,7 +9,7 @@
   [ks-theme],
   [ks-inverted] {
     --dsa-header--spacing-vertical: var(--ks-spacing-stack-s);
-    --dsa-header--spacing-horizontal: var(--dsa-content--horizontal-spacing);
+    --dsa-header--spacing-horizontal: var(--dsa-content--spacing);
   }
 }
 

package/dist/components/hero/hero.css

@@ -17,7 +17,6 @@
   --dsa-hero__textbox--background-color: var(--ks-color-bg-alpha-2);
   --dsa-hero__textbox--border-radius: var(--ks-border-radius-surface);
   --dsa-hero__textbox--max-width: var(--dsa-content--width_narrow);
-  --dsa-hero_below__textbox--max-width: var(--dsa-content--width_default);
   --dsa-hero__textbox--padding: var(--ks-spacing-inset-squish-xl);
   --dsa-hero__overlay--background: linear-gradient(0deg, var(--ks-background-color-default) 15%, transparent 50%);
 }
@@ -115,12 +114,12 @@
     height: var(--c-visual--min-height);
   }
   .c-visual.dsa-hero.dsa-hero--content-below .c-visual__content {
-    padding: 0 var(--dsa-content--horizontal-spacing);
+    padding: 0 var(--dsa-content--spacing);
     margin-top: -10%;
     position: relative;
   }
   .c-visual.dsa-hero.dsa-hero--content-below .c-visual__content .c-visual__box {
-    --c-visual_box--max-width: var(--dsa-hero_below__textbox--max-width, var(--dsa-content--width_default));
+    --c-visual_box--max-width: var(--dsa-content--width_default);
   }
   .c-visual.dsa-hero.c-visual--no-crop {
     --c-visual--min-height: 0;

package/dist/components/html/html.css

@@ -1,6 +1,7 @@
 .dsa-html {
   --dsa-html__consent--color: var(--ks-text-color-display);
   --dsa-html__consent--font: var(--ks-font-copy-m);
+  --dsa-html__consent--font-weight: var(--ks-font-weight-regular);
   --dsa-html__consent--background: var(--ks-color-fg-inverted-alpha-4);
 }
 
@@ -8,17 +9,20 @@
   position: relative;
   width: 100%;
   height: 100%;
-  gap: var(--ks-spacing-stack-s);
   display: flex;
   align-items: center;
   flex-direction: column;
   justify-content: center;
+  gap: var(--ks-spacing-stack-s);
   background-position: center;
   background-size: cover;
+  padding: var(--ks-spacing-inset-l);
 }
 .dsa-html__consent .c-rich-text {
   color: var(--dsa-html__consent--color, var(--ks-text-color-display));
   font: var(--dsa-html__consent--font, var(--ks-font-interface-m));
+  font-weight: var(--dsa-html__consent--font-weight, var(--ks-font-weight-regular));
+  text-align: center;
 }
 .dsa-html__consent:after {
   content: "";

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

@@ -37,6 +37,12 @@
       ],
       "default": "16:9"
     },
+    "inverted": {
+      "title": "Inverted",
+      "description": "Invert the colors of the HTML",
+      "type": "boolean",
+      "default": false
+    },
     "className": {
       "title": "Additional Classes",
       "description": "Add additional css classes that should be applied to the element",

package/dist/components/html/html.schema.json

@@ -29,14 +29,15 @@
     },
     "consentAspectRatio": {
       "type": "string",
-      "enum": [
-        "16:9",
-        "16:10",
-        "4:3",
-        "1:1"
-      ],
+      "enum": ["16:9", "16:10", "4:3", "1:1"],
       "default": "16:9"
     },
+    "inverted": {
+      "title": "Inverted",
+      "description": "Invert the colors of the HTML",
+      "type": "boolean",
+      "default": false
+    },
     "className": {
       "title": "Additional Classes",
       "description": "Add additional css classes that should be applied to the element",

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { HtmlProps } from "../../HtmlProps-8e95ed81.js";
+import { HtmlProps } from "../../HtmlProps-9d091769.js";
 declare const HtmlContextDefault: import("react").ForwardRefExoticComponent<HtmlProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const HtmlContext: import("react").Context<import("react").ForwardRefExoticComponent<HtmlProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Html: import("react").ForwardRefExoticComponent<HtmlProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/html/index.js

@@ -7,8 +7,8 @@ import { RichText } from '@kickstartds/base/lib/rich-text';
 import './Html.client.js';
 import '@kickstartds/core/lib/component';
 
-const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBackgroundImage, consentButtonLabel, consentAspectRatio = "16:9", className, component = "dsa.html", ...props }, ref) => {
-    return (jsxs("div", { ref: ref, className: classnames("dsa-html", className), "ks-component": component, ...props, children: [jsx("template", { dangerouslySetInnerHTML: { __html: html } }), consent && (jsxs("div", { style: {
+const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBackgroundImage, consentButtonLabel, consentAspectRatio = "16:9", inverted, className, component = "dsa.html", ...props }, ref) => {
+    return (jsxs("div", { ref: ref, className: classnames("dsa-html", className), "ks-component": component, "ks-inverted": inverted ? "true" : undefined, ...props, children: [jsx("template", { dangerouslySetInnerHTML: { __html: html } }), consent && (jsxs("div", { style: {
                     backgroundImage: consentBackgroundImage
                         ? `url(${consentBackgroundImage})`
                         : undefined,

package/dist/components/image-story/image-story.css

@@ -1,6 +1,6 @@
 .dsa-image-story.c-storytelling {
   --dsa-image-story--gap: var(--ks-spacing-m);
-  --dsa-image-story--horizontal-padding: var(--dsa-content--horizontal-spacing);
+  --dsa-image-story--horizontal-padding: var(--dsa-content--spacing);
   --dsa-image-story--vertical-padding: var(--ks-spacing-xl);
   --dsa-image-story__copy--font: var(--dsa-rich-text--font);
   --dsa-image-story__copy--color: var(--dsa-rich-text--color);
@@ -8,10 +8,7 @@
 
 .c-storytelling.dsa-image-story {
   gap: var(--c-storytelling--horizontal-padding);
-  --c-storytelling--horizontal-padding: var(
-    --dsa-image-story--horizontal-padding,
-    var(--dsa-content--horizontal-spacing)
-  );
+  --c-storytelling--horizontal-padding: var(--dsa-image-story--horizontal-padding, var(--dsa-content--spacing));
   --c-storytelling--vertical-padding: var(--dsa-image-story--vertical-padding, var(--ks-spacing-xl));
 }
 .c-storytelling.dsa-image-story .c-storytelling__box__content {

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

@@ -29,7 +29,7 @@ interface SettingsProps {
     seo: SeoProps;
     iconSprite?: IconSprite;
 }
-export * from "../../BlogPostProps-1cfcf6e8.js";
+export * from "../../BlogPostProps-d9decb7c.js";
 export * from "../../BlogOverviewProps-1cfcf6e8.js";
 export * from "../../PageProps-1cfcf6e8.js";
 export { IconSprite, SettingsProps };

package/dist/components/mosaic/mosaic.css

@@ -1,6 +1,6 @@
 .dsa-mosaic {
   --dsa-mosaic--vertical-padding: var(--l-section--space-default);
-  --dsa-mosaic--horizontal-padding: var(--dsa-content--horizontal-spacing);
+  --dsa-mosaic--horizontal-padding: var(--dsa-content--spacing);
   --dsa-mosaic__copy--font: var(--dsa-rich-text--font);
   --dsa-mosaic__copy--color: var(--ks-text-color-default);
   --dsa-mosaic__headline--color: var(--dsa-headline--color);

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

@@ -282,6 +282,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": {
@@ -345,17 +351,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
@@ -390,9 +385,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",
@@ -401,12 +396,6 @@
                       ],
                       "default": "center"
                     },
-                    "padding": {
-                      "title": "Padding",
-                      "description": "Toggle padding of the content",
-                      "type": "boolean",
-                      "default": false
-                    },
                     "type": {
                       "const": "cta"
                     }
@@ -910,6 +899,12 @@
                       ],
                       "default": "16:9"
                     },
+                    "inverted": {
+                      "title": "Inverted",
+                      "description": "Invert the colors of the HTML",
+                      "type": "boolean",
+                      "default": false
+                    },
                     "className": {
                       "title": "Additional Classes",
                       "description": "Add additional css classes that should be applied to the element",
@@ -1549,6 +1544,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": {
@@ -1612,17 +1613,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
@@ -1657,9 +1647,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",
@@ -1668,12 +1658,6 @@
                                 ],
                                 "default": "center"
                               },
-                              "padding": {
-                                "title": "Padding",
-                                "description": "Toggle padding of the content",
-                                "type": "boolean",
-                                "default": false
-                              },
                               "type": {
                                 "const": "cta"
                               }

package/dist/components/page-wrapper/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 29 Jan 2025 08:51:33 GMT
+ * Generated on Tue, 04 Feb 2025 15:36:35 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);