@kickstartds/ds-agency-premium 1.6.71--canary.45.1768.0 → 1.6.71--canary.45.1774.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/{BlogPostProps-7caa223c.d.ts → BlogPostProps-6b3cff22.d.ts} +1 -1
  2. package/dist/SectionProps-7caa223c.d.ts +1 -1
  3. package/dist/components/blog-aside/index.d.ts +1 -1
  4. package/dist/components/blog-overview/index.d.ts +1 -1
  5. package/dist/components/blog-post/index.d.ts +1 -1
  6. package/dist/components/blog-post/index.js +2 -2
  7. package/dist/components/image-story/index.d.ts +1 -1
  8. package/dist/components/index/index.d.ts +3 -3
  9. package/dist/components/page/index.d.ts +1 -1
  10. package/dist/components/page-wrapper/tokens.css +1 -1
  11. package/dist/components/presets.json +32 -84
  12. package/dist/components/split-even/index.d.ts +5 -5
  13. package/dist/components/split-even/index.js +1 -1
  14. package/dist/components/split-even/split-even.css +6 -6
  15. package/dist/components/split-even/split-even.schema.dereffed.json +7 -11
  16. package/dist/components/split-even/split-even.schema.json +6 -7
  17. package/dist/components/split-weighted/index.d.ts +16 -13
  18. package/dist/components/split-weighted/index.js +5 -6
  19. package/dist/components/split-weighted/split-weighted.css +36 -27
  20. package/dist/components/split-weighted/split-weighted.schema.dereffed.json +20 -13
  21. package/dist/components/split-weighted/split-weighted.schema.json +15 -13
  22. package/dist/components/testimonials/testimonials.css +4 -0
  23. package/dist/static/img/people/author-alex.png +0 -0
  24. package/dist/static/img/people/author-john.png +0 -0
  25. package/dist/tokens/themes.css +4 -4
  26. package/dist/tokens/tokens.css +1 -1
  27. package/dist/tokens/tokens.js +1 -1
  28. package/package.json +1 -1
  29. /package/dist/{BlogAsideProps-fb0241df.d.ts → BlogAsideProps-c760fd2a.d.ts} +0 -0
  30. /package/dist/{BlogOverviewProps-7caa223c.d.ts → BlogOverviewProps-9f207f1c.d.ts} +0 -0
  31. /package/dist/{ImageStoryProps-00ddee3a.d.ts → ImageStoryProps-e853e1e7.d.ts} +0 -0
  32. /package/dist/{PageProps-7caa223c.d.ts → PageProps-aa29c554.d.ts} +0 -0
@@ -4,7 +4,7 @@
4
4
  * and run json-schema-to-typescript to regenerate this file.
5
5
  */
6
6
  import { BlogHeadProps } from "./BlogHeadProps-c04a5ed8.js";
7
- import { BlogAsideProps } from "./BlogAsideProps-fb0241df.js";
7
+ import { BlogAsideProps } from "./BlogAsideProps-c760fd2a.js";
8
8
  import { SectionProps } from "./SectionProps-7caa223c.js";
9
9
  import { CtaProps } from "./CtaProps-babe4ee6.js";
10
10
  import { SeoProps } from "./SeoProps-f2d6dcaa.js";
@@ -10,7 +10,7 @@ import { FeaturesProps } from "./FeaturesProps-a9041d97.js";
10
10
  import { GalleryProps } from "./GalleryProps-76e7de44.js";
11
11
  import { HeroProps } from "./HeroProps-40f6c7f5.js";
12
12
  import { HtmlProps } from "./HtmlProps-9d091769.js";
13
- import { ImageStoryProps } from "./ImageStoryProps-00ddee3a.js";
13
+ import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
14
14
  import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
15
15
  import { LogosProps } from "./LogosProps-f9474fe2.js";
16
16
  import { MosaicProps } from "./MosaicProps-d52c7151.js";
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { HTMLAttributes } from "react";
3
- import { BlogAsideProps } from "../../BlogAsideProps-fb0241df.js";
3
+ import { BlogAsideProps } from "../../BlogAsideProps-c760fd2a.js";
4
4
  declare const BlogAsideContextDefault: import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
5
5
  declare const BlogAsideContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
6
6
  declare const BlogAside: import("react").ForwardRefExoticComponent<BlogAsideProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,4 +1,4 @@
1
- import { BlogOverviewProps } from "../../BlogOverviewProps-7caa223c.js";
1
+ import { BlogOverviewProps } from "../../BlogOverviewProps-9f207f1c.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const BlogOverview: FC<PropsWithChildren<BlogOverviewProps>>;
4
4
  export type { BlogOverviewProps };
@@ -1,4 +1,4 @@
1
- import { BlogPostProps } from "../../BlogPostProps-7caa223c.js";
1
+ import { BlogPostProps } from "../../BlogPostProps-6b3cff22.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const BlogPost: FC<PropsWithChildren<BlogPostProps>>;
4
4
  export type { BlogPostProps };
@@ -30,9 +30,9 @@ import '@kickstartds/base/lib/button';
30
30
  import '../button-group/index.js';
31
31
  import '@kickstartds/base/lib/button-group';
32
32
 
33
- const BlogPost = ({ head, content, aside, cta, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsx(SplitWeighted, { sticky: true, horizontalGutter: "large", mainLayout: {
33
+ const BlogPost = ({ head, content, aside, cta, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsx(SplitWeighted, { verticalAlign: "sticky", horizontalGutter: "large", mainLayout: {
34
34
  minWidth: "narrow",
35
- }, main: jsxs(Fragment, { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), context: aside && jsx(BlogAside, { ...aside }) }) }), cta && (jsx(Fragment, { children: jsx(Section, { backgroundColor: "accent", content: { mode: "list" }, children: jsx(Cta, { ...cta }) }) }))] }));
35
+ }, main: jsxs(Fragment, { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), aside: aside && jsx(BlogAside, { ...aside }) }) }), cta && (jsx(Fragment, { children: jsx(Section, { backgroundColor: "accent", content: { mode: "list" }, children: jsx(Cta, { ...cta }) }) }))] }));
36
36
  BlogPost.displayName = "BlogPost";
37
37
 
38
38
  export { BlogPost };
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { HTMLAttributes } from "react";
3
- import { ImageStoryProps } from "../../ImageStoryProps-00ddee3a.js";
3
+ import { ImageStoryProps } from "../../ImageStoryProps-e853e1e7.js";
4
4
  declare const ImageStoryContextDefault: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
5
5
  declare const ImageStoryContext: import("react").Context<import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
6
6
  declare const ImageStory: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
@@ -29,8 +29,8 @@ interface SettingsProps {
29
29
  seo: SeoProps;
30
30
  iconSprite?: IconSprite;
31
31
  }
32
- export * from "../../BlogPostProps-7caa223c.js";
33
- export * from "../../BlogOverviewProps-7caa223c.js";
34
- export * from "../../PageProps-7caa223c.js";
32
+ export * from "../../BlogPostProps-6b3cff22.js";
33
+ export * from "../../BlogOverviewProps-9f207f1c.js";
34
+ export * from "../../PageProps-aa29c554.js";
35
35
  export { IconSprite, SettingsProps };
36
36
  export * from "../../EventDetailProps-42a7eebe.js";
@@ -1,4 +1,4 @@
1
- import { PageProps } from "../../PageProps-7caa223c.js";
1
+ import { PageProps } from "../../PageProps-aa29c554.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const Page: FC<PropsWithChildren<PageProps>>;
4
4
  export type { PageProps };
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 02 Jul 2025 12:38:34 GMT
3
+ * Generated on Thu, 03 Jul 2025 10:12:27 GMT
4
4
  */
5
5
  :root, [ks-theme] {
6
6
  --ks-background-color-accent-base: var(--ks-color-fg-to-bg-9-base);
@@ -3591,85 +3591,34 @@
3591
3591
  "id": "layout-split-even--text-with-logos",
3592
3592
  "group": "Layout/Split Even",
3593
3593
  "name": "TextWithLogos",
3594
- "code": "<SplitEven\n contentGutter=\"small\"\n contentMinWidth=\"medium\"\n first={<><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n horizontalGutter=\"default\"\n mobileLayout=\"stack\"\n second={<><Logos logo={[{alt: 'Logo 1', src: 'img/logos/logoipsum-344.svg'}, {alt: 'Logo 2', src: 'img/logos/logoipsum-347.svg'}, {alt: 'Logo 3', src: 'img/logos/logoipsum-352.svg'}, {alt: 'Logo 4', src: 'img/logos/logoipsum-356.svg'}, {alt: 'Logo 5', src: 'img/logos/logoipsum-358.svg'}, {alt: 'Logo 6', src: 'img/logos/logoipsum-369.svg'}]} logosPerRow={3}/></>}\n sectionMinWidth=\"wide\"\n verticalAlign=\"sticky\"\n verticalGutter=\"default\"\n/>",
3594
+ "code": "<SplitEven\n contentGutter=\"small\"\n contentMinWidth=\"wide\"\n first={<><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n horizontalGutter=\"default\"\n second={<><Logos logo={[{alt: 'Logo 1', src: 'img/logos/logoipsum-344.svg'}, {alt: 'Logo 2', src: 'img/logos/logoipsum-347.svg'}, {alt: 'Logo 3', src: 'img/logos/logoipsum-352.svg'}, {alt: 'Logo 4', src: 'img/logos/logoipsum-356.svg'}, {alt: 'Logo 5', src: 'img/logos/logoipsum-358.svg'}, {alt: 'Logo 6', src: 'img/logos/logoipsum-369.svg'}]} logosPerRow={3}/></>}\n verticalAlign=\"center\"\n verticalGutter=\"default\"\n/>",
3595
3595
  "args": {
3596
- "contentMinWidth": "medium",
3596
+ "contentMinWidth": "wide",
3597
3597
  "contentGutter": "small",
3598
- "mobileLayout": "stack",
3599
- "verticalAlign": "sticky",
3598
+ "mobileReverse": false,
3599
+ "verticalAlign": "center",
3600
3600
  "verticalGutter": "default",
3601
3601
  "horizontalGutter": "default",
3602
- "sectionMinWidth": "wide",
3603
3602
  "first": {
3604
3603
  "key": null,
3605
3604
  "ref": null,
3606
3605
  "props": {
3607
- "children": [
3608
- {
3609
- "type": {},
3610
- "key": null,
3611
- "ref": null,
3612
- "props": {
3613
- "highlightText": true,
3614
- "headline": "Discover our solutions for Industry 4.0",
3615
- "text": "We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.",
3616
- "buttons": [
3617
- {
3618
- "label": "Learn more"
3619
- }
3620
- ]
3621
- },
3622
- "_owner": null
3623
- },
3624
- {
3625
- "type": {},
3626
- "key": null,
3627
- "ref": null,
3628
- "props": {
3629
- "highlightText": true,
3630
- "headline": "Discover our solutions for Industry 4.0",
3631
- "text": "We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.",
3632
- "buttons": [
3633
- {
3634
- "label": "Learn more"
3635
- }
3636
- ]
3637
- },
3638
- "_owner": null
3639
- },
3640
- {
3641
- "type": {},
3642
- "key": null,
3643
- "ref": null,
3644
- "props": {
3645
- "highlightText": true,
3646
- "headline": "Discover our solutions for Industry 4.0",
3647
- "text": "We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.",
3648
- "buttons": [
3649
- {
3650
- "label": "Learn more"
3651
- }
3652
- ]
3653
- },
3654
- "_owner": null
3606
+ "children": {
3607
+ "type": {},
3608
+ "key": null,
3609
+ "ref": null,
3610
+ "props": {
3611
+ "highlightText": true,
3612
+ "headline": "Discover our solutions for Industry 4.0",
3613
+ "text": "We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.",
3614
+ "buttons": [
3615
+ {
3616
+ "label": "Learn more"
3617
+ }
3618
+ ]
3655
3619
  },
3656
- {
3657
- "type": {},
3658
- "key": null,
3659
- "ref": null,
3660
- "props": {
3661
- "highlightText": true,
3662
- "headline": "Discover our solutions for Industry 4.0",
3663
- "text": "We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.",
3664
- "buttons": [
3665
- {
3666
- "label": "Learn more"
3667
- }
3668
- ]
3669
- },
3670
- "_owner": null
3671
- }
3672
- ]
3620
+ "_owner": null
3621
+ }
3673
3622
  },
3674
3623
  "_owner": null
3675
3624
  },
@@ -3722,11 +3671,11 @@
3722
3671
  "id": "layout-split-even--faq-with-form",
3723
3672
  "group": "Layout/Split Even",
3724
3673
  "name": "FAQWithForm",
3725
- "code": "<SplitEven\n contentGutter=\"small\"\n contentMinWidth=\"medium\"\n first={<><Headline level=\"h2\" text=\"Frequently Asked Questions\"/><Faq questions={[{answer: 'Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.', question: 'What are the benefits of investing in a Design System?'}, {answer: 'Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.', question: 'What is a Design System?'}, {answer: 'A Headless CMS plays a crucial role in a Design System by providing a content-first approach. It separates the back-end content from the front-end presentation layer, allowing for seamless integration with any design system. This results in a flexible, scalable, and platform-agnostic system that ensures content consistency across all platforms and devices.', question: 'What is the role of a Headless CMS in a Design System?'}]} /></>}\n horizontalGutter=\"large\"\n mobileLayout=\"stack\"\n second={<><Headline level=\"h3\" spaceAfter=\"minimum\" style=\"h3\" text=\"Still have questions?\"/><No Display Name label=\"Ask us directly!\" /><Button label=\"Submit\" /></>}\n sectionMinWidth=\"medium\"\n verticalAlign=\"top\"\n verticalGutter=\"large\"\n/>",
3674
+ "code": "<SplitEven\n contentGutter=\"small\"\n contentMinWidth=\"medium\"\n first={<><Headline level=\"h2\" text=\"Frequently Asked Questions\"/><Faq questions={[{answer: 'Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.', question: 'What are the benefits of investing in a Design System?'}, {answer: 'Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.', question: 'What is a Design System?'}, {answer: 'A Headless CMS plays a crucial role in a Design System by providing a content-first approach. It separates the back-end content from the front-end presentation layer, allowing for seamless integration with any design system. This results in a flexible, scalable, and platform-agnostic system that ensures content consistency across all platforms and devices.', question: 'What is the role of a Headless CMS in a Design System?'}]} /></>}\n horizontalGutter=\"large\"\n second={<><Headline level=\"h3\" spaceAfter=\"minimum\" style=\"h3\" text=\"Still have questions?\"/><No Display Name label=\"Ask us directly!\" /><Button label=\"Submit\" /></>}\n sectionMinWidth=\"medium\"\n verticalAlign=\"top\"\n verticalGutter=\"large\"\n/>",
3726
3675
  "args": {
3727
3676
  "contentMinWidth": "medium",
3728
3677
  "contentGutter": "small",
3729
- "mobileLayout": "stack",
3678
+ "mobileReverse": false,
3730
3679
  "verticalAlign": "top",
3731
3680
  "verticalGutter": "large",
3732
3681
  "horizontalGutter": "large",
@@ -3818,16 +3767,16 @@
3818
3767
  "id": "layout-split-weighted--text-with-contact",
3819
3768
  "group": "Layout/Split Weighted",
3820
3769
  "name": "TextWithContact",
3821
- "code": "<SplitWeighted\n context={<><Contact image={{aspectRatio: 'wide', fullWidth: true, src: 'img/people/contact-isabella.png'}} links={[{ariaLabel: 'Isabella Doe on Twitter', icon: 'twitter', label: '@Isabella_Doe', url: '#'}, {ariaLabel: 'Isabella Doe on LinkedIn', icon: 'linkedin', label: 'Isabella.Doe', url: 'mailto:mail@example.com'}]} subtitle=\"Creative Director\" title=\"Isabella Doe\"/></>}\n contextLayout={{\n gutter: 'default',\n minWidth: 'wide'\n }}\n horizontalGutter=\"default\"\n main={<><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n mainLayout={{\n gutter: 'default',\n minWidth: 'wide'\n }}\n order={{\n desktop: 'mainFirst',\n mobile: 'mainFirst'\n }}\n verticalGutter=\"large\"\n/>",
3770
+ "code": "<SplitWeighted\n aside={<><Contact image={{aspectRatio: 'wide', src: 'img/people/contact-isabella.png'}} links={[{ariaLabel: 'Isabella Doe on Twitter', icon: 'twitter', label: '@Isabella_Doe', url: '#'}, {ariaLabel: 'Isabella Doe on LinkedIn', icon: 'linkedin', label: 'Isabella.Doe', url: 'mailto:mail@example.com'}]} subtitle=\"Creative Director\" title=\"Isabella Doe\"/></>}\n asideLayout={{\n gutter: 'default',\n minWidth: 'wide'\n }}\n horizontalGutter=\"default\"\n main={<><Cta buttons={[{label: 'Learn more'}]} headline=\"Discover our solutions for Industry 4.0\" text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n mainLayout={{\n gutter: 'default',\n minWidth: 'wide'\n }}\n order={{\n desktop: 'mainFirst',\n mobile: 'mainFirst'\n }}\n verticalAlign=\"top\"\n verticalGutter=\"large\"\n/>",
3822
3771
  "args": {
3823
3772
  "verticalGutter": "large",
3824
3773
  "horizontalGutter": "default",
3825
- "sticky": false,
3774
+ "verticalAlign": "top",
3826
3775
  "mainLayout": {
3827
3776
  "gutter": "default",
3828
3777
  "minWidth": "wide"
3829
3778
  },
3830
- "contextLayout": {
3779
+ "asideLayout": {
3831
3780
  "gutter": "default",
3832
3781
  "minWidth": "wide"
3833
3782
  },
@@ -3857,7 +3806,7 @@
3857
3806
  },
3858
3807
  "_owner": null
3859
3808
  },
3860
- "context": {
3809
+ "aside": {
3861
3810
  "key": null,
3862
3811
  "ref": null,
3863
3812
  "props": {
@@ -3870,8 +3819,7 @@
3870
3819
  "subtitle": "Creative Director",
3871
3820
  "image": {
3872
3821
  "src": "img/people/contact-isabella.png",
3873
- "aspectRatio": "wide",
3874
- "fullWidth": true
3822
+ "aspectRatio": "wide"
3875
3823
  },
3876
3824
  "links": [
3877
3825
  {
@@ -3900,18 +3848,18 @@
3900
3848
  "id": "layout-split-weighted--text-with-teaser",
3901
3849
  "group": "Layout/Split Weighted",
3902
3850
  "name": "TextWithTeaser",
3903
- "code": "<SplitWeighted\n context={<TeaserCard button={{chevron: false, hidden: false, label: 'Read more'}} headline=\"Transforming Industry\" image=\"img/logos/castaway.svg\" imageRatio=\"landscape\" layout=\"row\" text=\"with Smart Solutions\" url=\"#\"/>}\n contextLayout={{\n gutter: 'default',\n minWidth: 'narrow'\n }}\n horizontalGutter=\"default\"\n main={<><Headline level=\"h2\" spaceAfter=\"minimum\" text=\"Innovative solutions for Industry 4.0\"/><Text highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n mainLayout={{\n gutter: 'small',\n minWidth: 'wide'\n }}\n order={{\n desktop: 'mainFirst',\n mobile: 'mainFirst'\n }}\n verticalGutter=\"default\"\n/>",
3851
+ "code": "<SplitWeighted\n aside={<TeaserCard button={{chevron: false, hidden: false, label: 'Read more'}} headline=\"Transforming Industry\" image=\"img/logos/castaway.svg\" imageRatio=\"landscape\" layout=\"row\" text=\"with Smart Solutions\" url=\"#\"/>}\n asideLayout={{\n gutter: 'default',\n minWidth: 'wide'\n }}\n horizontalGutter=\"default\"\n main={<><Headline level=\"h2\" spaceAfter=\"minimum\" text=\"Innovative solutions for Industry 4.0\"/><Text highlightText text=\"We help companies make their production processes more efficient and future-proof through digitalization, automation, and smart technologies. Rely on our many years of experience in the industrial sector.\n\nRevolutionize your manufacturing with our tailored solutions designed to meet the specific needs of your industry.\"/></>}\n mainLayout={{\n gutter: 'small',\n minWidth: 'narrow'\n }}\n order={{\n desktop: 'mainFirst',\n mobile: 'mainFirst'\n }}\n verticalAlign=\"top\"\n verticalGutter=\"default\"\n/>",
3904
3852
  "args": {
3905
3853
  "verticalGutter": "default",
3906
3854
  "horizontalGutter": "default",
3907
- "sticky": false,
3855
+ "verticalAlign": "top",
3908
3856
  "mainLayout": {
3909
3857
  "gutter": "small",
3910
- "minWidth": "wide"
3858
+ "minWidth": "narrow"
3911
3859
  },
3912
- "contextLayout": {
3860
+ "asideLayout": {
3913
3861
  "gutter": "default",
3914
- "minWidth": "narrow"
3862
+ "minWidth": "wide"
3915
3863
  },
3916
3864
  "order": {
3917
3865
  "mobile": "mainFirst",
@@ -3947,7 +3895,7 @@
3947
3895
  },
3948
3896
  "_owner": null
3949
3897
  },
3950
- "context": {
3898
+ "aside": {
3951
3899
  "type": {},
3952
3900
  "key": null,
3953
3901
  "ref": null,
@@ -13,7 +13,7 @@ import { FeaturesProps } from "../../FeaturesProps-a9041d97.js";
13
13
  import { GalleryProps } from "../../GalleryProps-76e7de44.js";
14
14
  import { HeroProps } from "../../HeroProps-40f6c7f5.js";
15
15
  import { HtmlProps } from "../../HtmlProps-9d091769.js";
16
- import { ImageStoryProps } from "../../ImageStoryProps-00ddee3a.js";
16
+ import { ImageStoryProps } from "../../ImageStoryProps-e853e1e7.js";
17
17
  import { ImageTextProps } from "../../ImageTextProps-9286cca4.js";
18
18
  import { LogosProps } from "../../LogosProps-f9474fe2.js";
19
19
  import { MosaicProps } from "../../MosaicProps-d52c7151.js";
@@ -30,11 +30,11 @@ type ContentMinimumWidth = "narrow" | "medium" | "wide";
30
30
  /**
31
31
  * Sets the space between the content inside the two halves of the split layout
32
32
  */
33
- type ContentGutter = "narrow" | "default" | "wide" | "none";
33
+ type ContentGutter = "small" | "default" | "large" | "none";
34
34
  /**
35
- * Determines the layout of the sections on mobile devices
35
+ * Reverses the order of the sections on mobile devices
36
36
  */
37
- type MobileLayout = "stack" | "stackReverse";
37
+ type MobileReverse = boolean;
38
38
  /**
39
39
  * Aligns the content vertically within the sections
40
40
  */
@@ -58,7 +58,7 @@ type Second = (CtaProps | DividerProps | FaqProps | FeaturesProps | GalleryProps
58
58
  interface SplitEvenProps {
59
59
  contentMinWidth?: ContentMinimumWidth;
60
60
  contentGutter?: ContentGutter;
61
- mobileLayout?: MobileLayout;
61
+ mobileReverse?: MobileReverse;
62
62
  verticalAlign?: VerticalAlignment;
63
63
  verticalGutter?: VerticalGutter;
64
64
  horizontalGutter?: HorizontalGutter;
@@ -2,6 +2,6 @@ import "./split-even.css";
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import classnames from 'classnames';
4
4
 
5
- const SplitEven = ({ mobileLayout = "stack", contentMinWidth = "medium", verticalAlign = "top", horizontalGutter = "default", verticalGutter = "default", contentGutter = "default", first, second, }) => (jsxs("div", { className: classnames("l-split-even", mobileLayout === "stackReverse" && "l-split-even--mobile_stack-reverse", horizontalGutter && `l-split-even--h-gutter-${horizontalGutter}`, verticalGutter && `l-split-even--v-gutter-${verticalGutter}`, contentMinWidth && `l-split-even--width-${contentMinWidth}`, verticalAlign && `l-split-even--align-${verticalAlign}`), children: [jsx("div", { className: classnames("l-split-even__content l-split-even__content--first", contentGutter && `l-split-even__content--gutter-${contentGutter}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-even__sticky-container", children: first })) : (first) }), jsx("div", { className: classnames("l-split-even__content l-split-even__content--second", contentGutter && `l-split-even__content--gutter-${contentGutter}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-even__sticky-container", children: second })) : (second) })] }));
5
+ const SplitEven = ({ mobileReverse = false, contentMinWidth = "medium", verticalAlign = "top", horizontalGutter = "default", verticalGutter = "default", contentGutter = "default", first, second, }) => (jsxs("div", { className: classnames("l-split-even", mobileReverse && "l-split-even--mobile-reverse", horizontalGutter && `l-split-even--h-gutter-${horizontalGutter}`, verticalGutter && `l-split-even--v-gutter-${verticalGutter}`, contentMinWidth && `l-split-even--width-${contentMinWidth}`, verticalAlign && `l-split-even--align-${verticalAlign}`), children: [jsx("div", { className: classnames("l-split-even__content l-split-even__content--first", contentGutter && `l-split-even__content--gutter-${contentGutter}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-even__sticky-container", children: first })) : (first) }), jsx("div", { className: classnames("l-split-even__content l-split-even__content--second", contentGutter && `l-split-even__content--gutter-${contentGutter}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-even__sticky-container", children: second })) : (second) })] }));
6
6
 
7
7
  export { SplitEven };
@@ -9,9 +9,9 @@
9
9
  --dsa-split-even__content--gutter_small: var(--ks-spacing-stack-s);
10
10
  --dsa-split-even__content--gutter_default: var(--ks-spacing-stack-m);
11
11
  --dsa-split-even__content--gutter_large: var(--ks-spacing-stack-xl);
12
- --dsa-split-even__content--flex-basis_narrow: var(--dsa-tile--width_small);
13
- --dsa-split-even__content--flex-basis_medium: var(--dsa-tile--width_medium);
14
- --dsa-split-even__content--flex-basis_wide: var(--dsa-tile--width_large);
12
+ --dsa-split-even__content--flex-basis_narrow: var(--dsa-tile--width_medium);
13
+ --dsa-split-even__content--flex-basis_medium: var(--dsa-tile--width_large);
14
+ --dsa-split-even__content--flex-basis_wide: var(--dsa-tile--width_largest);
15
15
  }
16
16
 
17
17
  .l-split-even {
@@ -74,13 +74,13 @@
74
74
  top: var(--dsa-split-even--sticky-margin, var(--ks-spacing-stack-xl));
75
75
  height: fit-content;
76
76
  }
77
- .l-split-even--mobile_stack-reverse {
77
+ .l-split-even--mobile-reverse {
78
78
  flex-wrap: wrap-reverse;
79
79
  }
80
- .l-split-even--mobile_stack-reverse.l-split-even--align-top {
80
+ .l-split-even--mobile-reverse.l-split-even--align-top {
81
81
  align-items: flex-end;
82
82
  }
83
- .l-split-even--mobile_stack-reverse.l-split-even--align-bottom {
83
+ .l-split-even--mobile-reverse.l-split-even--align-bottom {
84
84
  align-items: flex-start;
85
85
  }
86
86
  .l-split-even__content {
@@ -20,22 +20,18 @@
20
20
  "description": "Sets the space between the content inside the two halves of the split layout",
21
21
  "type": "string",
22
22
  "enum": [
23
- "narrow",
23
+ "small",
24
24
  "default",
25
- "wide",
25
+ "large",
26
26
  "none"
27
27
  ],
28
28
  "default": "default"
29
29
  },
30
- "mobileLayout": {
31
- "title": "Mobile Layout",
32
- "description": "Determines the layout of the sections on mobile devices",
33
- "type": "string",
34
- "enum": [
35
- "stack",
36
- "stackReverse"
37
- ],
38
- "default": "stack"
30
+ "mobileReverse": {
31
+ "title": "Mobile Reverse",
32
+ "description": "Reverses the order of the sections on mobile devices",
33
+ "type": "boolean",
34
+ "default": false
39
35
  },
40
36
  "verticalAlign": {
41
37
  "title": "Vertical Alignment",
@@ -15,15 +15,14 @@
15
15
  "title": "Content Gutter",
16
16
  "description": "Sets the space between the content inside the two halves of the split layout",
17
17
  "type": "string",
18
- "enum": ["narrow", "default", "wide", "none"],
18
+ "enum": ["small", "default", "large", "none"],
19
19
  "default": "default"
20
20
  },
21
- "mobileLayout": {
22
- "title": "Mobile Layout",
23
- "description": "Determines the layout of the sections on mobile devices",
24
- "type": "string",
25
- "enum": ["stack", "stackReverse"],
26
- "default": "stack"
21
+ "mobileReverse": {
22
+ "title": "Mobile Reverse",
23
+ "description": "Reverses the order of the sections on mobile devices",
24
+ "type": "boolean",
25
+ "default": false
27
26
  },
28
27
  "verticalAlign": {
29
28
  "title": "Vertical Alignment",
@@ -13,7 +13,7 @@ import { FeaturesProps } from "../../FeaturesProps-a9041d97.js";
13
13
  import { GalleryProps } from "../../GalleryProps-76e7de44.js";
14
14
  import { HeroProps } from "../../HeroProps-40f6c7f5.js";
15
15
  import { HtmlProps } from "../../HtmlProps-9d091769.js";
16
- import { ImageStoryProps } from "../../ImageStoryProps-00ddee3a.js";
16
+ import { ImageStoryProps } from "../../ImageStoryProps-e853e1e7.js";
17
17
  import { ImageTextProps } from "../../ImageTextProps-9286cca4.js";
18
18
  import { LogosProps } from "../../LogosProps-f9474fe2.js";
19
19
  import { MosaicProps } from "../../MosaicProps-d52c7151.js";
@@ -32,9 +32,9 @@ type VerticalGutter = "large" | "default" | "small" | "none";
32
32
  */
33
33
  type HorizontalGutter = "large" | "default" | "small" | "none";
34
34
  /**
35
- * Makes the side part sticky on scroll
35
+ * Aligns the content vertically within the sections
36
36
  */
37
- type Sticky = boolean;
37
+ type VerticalAlignment = "top" | "center" | "bottom" | "sticky";
38
38
  /**
39
39
  * Sets the space between the content of the split layout
40
40
  */
@@ -54,39 +54,42 @@ type MinimumWidth1 = "narrow" | "default" | "wide";
54
54
  /**
55
55
  * Determines the order of sections on mobile devices
56
56
  */
57
- type MobileOrder = "mainFirst" | "contextFirst";
57
+ type MobileOrder = "mainFirst" | "asideFirst";
58
58
  /**
59
59
  * Determines the order of sections on desktop devices
60
60
  */
61
- type DesktopOrder = "mainFirst" | "contextFirst";
61
+ type DesktopOrder = "mainFirst" | "asideFirst";
62
62
  /**
63
63
  * Allowed components for the main half of the split layout
64
64
  */
65
65
  type Main = (CtaProps | DividerProps | FaqProps | FeaturesProps | GalleryProps | HeroProps | HtmlProps | ImageStoryProps | ImageTextProps | LogosProps | MosaicProps | SliderProps | StatsProps | TeaserCardProps | TestimonialsProps | TextProps | VideoCurtainProps)[];
66
66
  /**
67
- * Allowed components for the context half of the split layout
67
+ * Allowed components for the aside half of the split layout
68
68
  */
69
- type Context = (CtaProps | DividerProps | FaqProps | FeaturesProps | GalleryProps | HeroProps | HtmlProps | ImageStoryProps | ImageTextProps | LogosProps | MosaicProps | SliderProps | StatsProps | TeaserCardProps | TestimonialsProps | TextProps | VideoCurtainProps)[];
69
+ type Aside = (CtaProps | DividerProps | FaqProps | FeaturesProps | GalleryProps | HeroProps | HtmlProps | ImageStoryProps | ImageTextProps | LogosProps | MosaicProps | SliderProps | StatsProps | TeaserCardProps | TestimonialsProps | TextProps | VideoCurtainProps)[];
70
70
  interface SplitWeightedProps {
71
71
  verticalGutter?: VerticalGutter;
72
72
  horizontalGutter?: HorizontalGutter;
73
- sticky?: Sticky;
73
+ verticalAlign?: VerticalAlignment;
74
74
  mainLayout?: MainLayout;
75
- contextLayout?: ContextLayout;
75
+ asideLayout?: AsideLayout;
76
76
  order?: Order;
77
77
  mainComponents?: Main;
78
- contextComponents?: Context;
78
+ asideComponents?: Aside;
79
79
  }
80
80
  interface MainLayout {
81
81
  gutter?: ContentGutter;
82
82
  minWidth?: MinimumWidth;
83
83
  }
84
- interface ContextLayout {
84
+ /**
85
+ * Layout settings for the aside section of the split layout
86
+ */
87
+ interface AsideLayout {
85
88
  gutter?: Gutter;
86
89
  minWidth?: MinimumWidth1;
87
90
  }
88
91
  /**
89
- * Sets the order of the main and context sections in the split layout
92
+ * Sets the order of the main and aside sections in the split layout
90
93
  */
91
94
  interface Order {
92
95
  mobile?: MobileOrder;
@@ -94,7 +97,7 @@ interface Order {
94
97
  }
95
98
  interface ComponentProps {
96
99
  main?: React.ReactNode;
97
- context?: React.ReactNode;
100
+ aside?: React.ReactNode;
98
101
  }
99
102
  type SplitWeightedComponentProps = SplitWeightedProps & ComponentProps;
100
103
  declare const SplitWeighted: FC<SplitWeightedComponentProps>;
@@ -2,12 +2,11 @@ import "./split-weighted.css";
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import classnames from 'classnames';
4
4
 
5
- const SplitWeighted = ({ order, mainLayout, contextLayout, horizontalGutter = "default", verticalGutter = "default", main, context, sticky = false, }) => (jsxs("div", { className: classnames("l-split-weighted", order?.desktop === "contextFirst" &&
6
- "l-split-weighted--desktop-context-first", order?.mobile === "contextFirst" &&
7
- "l-split-weighted--mobile-context-first", horizontalGutter && `l-split-weighted--h-gutter-${horizontalGutter}`, verticalGutter && `l-split-weighted--v-gutter-${verticalGutter}`, sticky && `l-split-weighted--sticky`), children: [jsx("div", { className: classnames("l-split-weighted__main l-split-weighted__content", mainLayout?.gutter &&
5
+ const SplitWeighted = ({ order, mainLayout, asideLayout, horizontalGutter = "default", verticalGutter = "default", main, aside, verticalAlign = "top", }) => (jsxs("div", { className: classnames("l-split-weighted", order?.desktop === "asideFirst" &&
6
+ "l-split-weighted--desktop-aside-first", order?.mobile === "asideFirst" && "l-split-weighted--mobile-aside-first", horizontalGutter && `l-split-weighted--h-gutter-${horizontalGutter}`, verticalGutter && `l-split-weighted--v-gutter-${verticalGutter}`, verticalAlign && `l-split-weighted--align-${verticalAlign}`), children: [jsx("div", { className: classnames("l-split-weighted__main l-split-weighted__content", mainLayout?.gutter &&
8
7
  `l-split-weighted__main--gutter-${mainLayout.gutter}`, mainLayout?.minWidth &&
9
- `l-split-weighted__main--width-${mainLayout.minWidth}`), children: sticky ? (jsx("div", { className: "l-split-weighted__sticky-container", children: main })) : (main) }), jsx("div", { className: classnames("l-split-weighted__context l-split-weighted__content", contextLayout?.gutter &&
10
- `l-split-weighted__context--gutter-${contextLayout.gutter || "large"}`, contextLayout?.minWidth &&
11
- `l-split-weighted__context--width-${contextLayout.minWidth}`), children: sticky ? (jsx("div", { className: "l-split-weighted__sticky-container", children: context })) : (context) })] }));
8
+ `l-split-weighted__main--width-${mainLayout.minWidth}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-weighted__sticky-container", children: main })) : (main) }), jsx("div", { className: classnames("l-split-weighted__aside l-split-weighted__content", asideLayout?.gutter &&
9
+ `l-split-weighted__aside--gutter-${asideLayout.gutter || "large"}`, asideLayout?.minWidth &&
10
+ `l-split-weighted__aside--width-${asideLayout.minWidth}`), children: verticalAlign === "sticky" ? (jsx("div", { className: "l-split-weighted__sticky-container", children: aside })) : (aside) })] }));
12
11
 
13
12
  export { SplitWeighted };
@@ -1,23 +1,23 @@
1
1
  .l-split-weighted {
2
2
  --dsa-split-weighted--sticky-margin: var(--ks-spacing-stack-xl);
3
- --dsa-split-weighted--v-gutter_default: var(--ks-spacing-stack-m);
4
- --dsa-split-weighted--v-gutter_small: var(--ks-spacing-stack-l);
3
+ --dsa-split-weighted--v-gutter_default: var(--ks-spacing-stack-l);
4
+ --dsa-split-weighted--v-gutter_small: var(--ks-spacing-stack-s);
5
5
  --dsa-split-weighted--v-gutter_large: var(--dsa-content--vertical-spacing);
6
6
  --dsa-split-weighted--h-gutter_default: var(--ks-spacing-inline-l);
7
7
  --dsa-split-weighted--h-gutter_small: var(--ks-spacing-inline-m);
8
8
  --dsa-split-weighted--h-gutter_large: var(--ks-spacing-xxl);
9
- --dsa-split-weighted__main--flex-basis_default: var(--dsa-tile--width_large);
10
- --dsa-split-weighted__main--flex-basis_narrow: var(--dsa-tile--width_medium);
11
- --dsa-split-weighted__main--flex-basis_wide: var(--dsa-tile--width_largest);
9
+ --dsa-split-weighted__main--flex-basis_default: var(--dsa-tile--width_largest);
10
+ --dsa-split-weighted__main--flex-basis_narrow: var(--dsa-tile--width_large);
11
+ --dsa-split-weighted__main--flex-basis_wide: calc(var(--dsa-tile--width_largest) * 1.25);
12
12
  --dsa-split-weighted__main--gutter_default: var(--ks-spacing-stack-l);
13
13
  --dsa-split-weighted__main--gutter_small: var(--ks-spacing-stack-s);
14
14
  --dsa-split-weighted__main--gutter_large: var(--dsa-content--vertical-spacing);
15
- --dsa-split-weighted__context--flex-basis_default: var(--dsa-tile--width_medium);
16
- --dsa-split-weighted__context--flex-basis_narrow: var(--dsa-tile--width_small);
17
- --dsa-split-weighted__context--flex-basis_wide: var(--dsa-tile--width_large);
18
- --dsa-split-weighted__context--gutter_default: var(--ks-spacing-stack-s);
19
- --dsa-split-weighted__context--gutter_small: var(--ks-spacing-stack-xs);
20
- --dsa-split-weighted__context--gutter_large: var(--ks-spacing-stack-m);
15
+ --dsa-split-weighted__aside--flex-basis_default: var(--dsa-tile--width_medium);
16
+ --dsa-split-weighted__aside--flex-basis_narrow: var(--dsa-tile--width_small);
17
+ --dsa-split-weighted__aside--flex-basis_wide: var(--dsa-tile--width_large);
18
+ --dsa-split-weighted__aside--gutter_default: var(--ks-spacing-stack-s);
19
+ --dsa-split-weighted__aside--gutter_small: var(--ks-spacing-stack-xs);
20
+ --dsa-split-weighted__aside--gutter_large: var(--ks-spacing-stack-m);
21
21
  }
22
22
 
23
23
  .l-split-weighted {
@@ -27,18 +27,27 @@
27
27
  flex-wrap: wrap;
28
28
  gap: var(--dsa-split-weighted--v-gutter) var(--dsa-split-weighted--h-gutter);
29
29
  }
30
- .l-split-weighted--sticky {
30
+ .l-split-weighted--align-top {
31
+ align-items: flex-start;
32
+ }
33
+ .l-split-weighted--align-center {
34
+ align-items: center;
35
+ }
36
+ .l-split-weighted--align-bottom {
37
+ align-items: flex-end;
38
+ }
39
+ .l-split-weighted--align-sticky {
31
40
  position: relative;
32
41
  }
33
- .l-split-weighted--sticky .l-split-weighted__sticky-container {
42
+ .l-split-weighted--align-sticky .l-split-weighted__sticky-container {
34
43
  position: sticky;
35
44
  top: var(--dsa-split-weighted--sticky-margin, var(--ks-spacing-stack-xl));
36
45
  height: fit-content;
37
46
  }
38
- .l-split-weighted--desktop-context-first {
47
+ .l-split-weighted--desktop-aside-first {
39
48
  flex-direction: row-reverse;
40
49
  }
41
- .l-split-weighted--mobile-context-first {
50
+ .l-split-weighted--mobile-aside-first {
42
51
  flex-wrap: wrap-reverse;
43
52
  }
44
53
  .l-split-weighted--v-gutter-small {
@@ -87,23 +96,23 @@
87
96
  .l-split-weighted__main--gutter-none {
88
97
  gap: 0;
89
98
  }
90
- .l-split-weighted__context {
91
- flex-basis: var(--dsa-split-weighted__context--flex-basis_default, var(--dsa-tile--width_medium));
99
+ .l-split-weighted__aside {
100
+ flex-basis: var(--dsa-split-weighted__aside--flex-basis_default, var(--dsa-tile--width_medium));
92
101
  flex-grow: 1;
93
- gap: var(--dsa-split-weighted__context--gutter_default, var(--ks-spacing-stack-s));
102
+ gap: var(--dsa-split-weighted__aside--gutter_default, var(--ks-spacing-stack-s));
94
103
  }
95
- .l-split-weighted__context--width-narrow {
96
- flex-basis: var(--dsa-split-weighted__context--flex-basis_narrow, var(--dsa-tile--width_small));
104
+ .l-split-weighted__aside--width-narrow {
105
+ flex-basis: var(--dsa-split-weighted__aside--flex-basis_narrow, var(--dsa-tile--width_small));
97
106
  }
98
- .l-split-weighted__context--width-wide {
99
- flex-basis: var(--dsa-split-weighted__context--flex-basis_wide, var(--dsa-tile--width_large));
107
+ .l-split-weighted__aside--width-wide {
108
+ flex-basis: var(--dsa-split-weighted__aside--flex-basis_wide, var(--dsa-tile--width_large));
100
109
  }
101
- .l-split-weighted__context--gutter-small {
102
- gap: var(--dsa-split-weighted__context--gutter_small, var(--ks-spacing-stack-xs));
110
+ .l-split-weighted__aside--gutter-small {
111
+ gap: var(--dsa-split-weighted__aside--gutter_small, var(--ks-spacing-stack-xs));
103
112
  }
104
- .l-split-weighted__context--gutter-large {
105
- gap: var(--dsa-split-weighted__context--gutter_large, var(--ks-spacing-stack-m));
113
+ .l-split-weighted__aside--gutter-large {
114
+ gap: var(--dsa-split-weighted__aside--gutter_large, var(--ks-spacing-stack-m));
106
115
  }
107
- .l-split-weighted__context--gutter-none {
116
+ .l-split-weighted__aside--gutter-none {
108
117
  gap: 0;
109
118
  }
@@ -28,11 +28,17 @@
28
28
  ],
29
29
  "default": "default"
30
30
  },
31
- "sticky": {
32
- "title": "Sticky",
33
- "description": "Makes the side part sticky on scroll",
34
- "type": "boolean",
35
- "default": false
31
+ "verticalAlign": {
32
+ "title": "Vertical Alignment",
33
+ "type": "string",
34
+ "description": "Aligns the content vertically within the sections",
35
+ "enum": [
36
+ "top",
37
+ "center",
38
+ "bottom",
39
+ "sticky"
40
+ ],
41
+ "default": "top"
36
42
  },
37
43
  "mainLayout": {
38
44
  "title": "Main Layout",
@@ -64,8 +70,9 @@
64
70
  },
65
71
  "additionalProperties": false
66
72
  },
67
- "contextLayout": {
68
- "title": "Context Layout",
73
+ "asideLayout": {
74
+ "title": "Aside Layout",
75
+ "description": "Layout settings for the aside section of the split layout",
69
76
  "type": "object",
70
77
  "properties": {
71
78
  "gutter": {
@@ -97,14 +104,14 @@
97
104
  "order": {
98
105
  "type": "object",
99
106
  "title": "Order",
100
- "description": "Sets the order of the main and context sections in the split layout",
107
+ "description": "Sets the order of the main and aside sections in the split layout",
101
108
  "properties": {
102
109
  "mobile": {
103
110
  "title": "Mobile Order",
104
111
  "type": "string",
105
112
  "enum": [
106
113
  "mainFirst",
107
- "contextFirst"
114
+ "asideFirst"
108
115
  ],
109
116
  "default": "mainFirst",
110
117
  "description": "Determines the order of sections on mobile devices"
@@ -114,7 +121,7 @@
114
121
  "type": "string",
115
122
  "enum": [
116
123
  "mainFirst",
117
- "contextFirst"
124
+ "asideFirst"
118
125
  ],
119
126
  "default": "mainFirst",
120
127
  "description": "Determines the order of sections on desktop devices"
@@ -3033,10 +3040,10 @@
3033
3040
  ]
3034
3041
  }
3035
3042
  },
3036
- "contextComponents": {
3043
+ "asideComponents": {
3037
3044
  "type": "array",
3038
- "title": "Context",
3039
- "description": "Allowed components for the context half of the split layout",
3045
+ "title": "Aside",
3046
+ "description": "Allowed components for the aside half of the split layout",
3040
3047
  "items": {
3041
3048
  "anyOf": [
3042
3049
  {
@@ -18,11 +18,12 @@
18
18
  "enum": ["large", "default", "small", "none"],
19
19
  "default": "default"
20
20
  },
21
- "sticky": {
22
- "title": "Sticky",
23
- "description": "Makes the side part sticky on scroll",
24
- "type": "boolean",
25
- "default": false
21
+ "verticalAlign": {
22
+ "title": "Vertical Alignment",
23
+ "type": "string",
24
+ "description": "Aligns the content vertically within the sections",
25
+ "enum": ["top", "center", "bottom", "sticky"],
26
+ "default": "top"
26
27
  },
27
28
  "mainLayout": {
28
29
  "title": "Main Layout",
@@ -44,8 +45,9 @@
44
45
  }
45
46
  }
46
47
  },
47
- "contextLayout": {
48
- "title": "Context Layout",
48
+ "asideLayout": {
49
+ "title": "Aside Layout",
50
+ "description": "Layout settings for the aside section of the split layout",
49
51
  "type": "object",
50
52
  "properties": {
51
53
  "gutter": {
@@ -67,19 +69,19 @@
67
69
  "order": {
68
70
  "type": "object",
69
71
  "title": "Order",
70
- "description": "Sets the order of the main and context sections in the split layout",
72
+ "description": "Sets the order of the main and aside sections in the split layout",
71
73
  "properties": {
72
74
  "mobile": {
73
75
  "title": "Mobile Order",
74
76
  "type": "string",
75
- "enum": ["mainFirst", "contextFirst"],
77
+ "enum": ["mainFirst", "asideFirst"],
76
78
  "default": "mainFirst",
77
79
  "description": "Determines the order of sections on mobile devices"
78
80
  },
79
81
  "desktop": {
80
82
  "title": "Desktop Order",
81
83
  "type": "string",
82
- "enum": ["mainFirst", "contextFirst"],
84
+ "enum": ["mainFirst", "asideFirst"],
83
85
  "default": "mainFirst",
84
86
  "description": "Determines the order of sections on desktop devices"
85
87
  }
@@ -145,10 +147,10 @@
145
147
  ]
146
148
  }
147
149
  },
148
- "contextComponents": {
150
+ "asideComponents": {
149
151
  "type": "array",
150
- "title": "Context",
151
- "description": "Allowed components for the context half of the split layout",
152
+ "title": "Aside",
153
+ "description": "Allowed components for the aside half of the split layout",
152
154
  "items": {
153
155
  "anyOf": [
154
156
  {
@@ -2,6 +2,7 @@
2
2
  .dsa-testimonials {
3
3
  --dsa-testimonials--padding-left: calc(var(--dsa-testimonials__icon--font-size) / 6);
4
4
  --dsa-testimonials--padding-top: 0.5em;
5
+ --dsa-testimonials--gap: var(--ks-spacing-stack-s) var(--ks-spacing-inline-m);
5
6
  --dsa-testimonials__quote--font: var(--ks-font-copy-l);
6
7
  --dsa-testimonials__quote--font-weight: var(--ks-font-weight-regular);
7
8
  --dsa-testimonials__quote--margin-bottom: var(--ks-spacing-stack-s);
@@ -60,6 +61,9 @@
60
61
  flex-direction: column;
61
62
  gap: var(--dsa-testimonials__list--gap, var(--ks-spacing-stack-xl));
62
63
  }
64
+ .dsa-testimonials .c-quote {
65
+ gap: var(--dsa-testimonials--gap, var(--ks-spacing-stack-s) var(--ks-spacing-inline-m));
66
+ }
63
67
  .dsa-testimonials .c-quote__source {
64
68
  color: var(--dsa-testimonials__source--color, var(--ks-text-color-default));
65
69
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 02 Jul 2025 12:38:36 GMT
3
+ * Generated on Thu, 03 Jul 2025 10:12:29 GMT
4
4
  */
5
5
  :root [ks-theme=business] {
6
6
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -2727,7 +2727,7 @@
2727
2727
  }
2728
2728
  /**
2729
2729
  * Do not edit directly
2730
- * Generated on Wed, 02 Jul 2025 12:38:41 GMT
2730
+ * Generated on Thu, 03 Jul 2025 10:12:34 GMT
2731
2731
  */
2732
2732
  :root [ks-theme=google] {
2733
2733
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -5458,7 +5458,7 @@
5458
5458
  }
5459
5459
  /**
5460
5460
  * Do not edit directly
5461
- * Generated on Wed, 02 Jul 2025 12:38:39 GMT
5461
+ * Generated on Thu, 03 Jul 2025 10:12:32 GMT
5462
5462
  */
5463
5463
  :root [ks-theme=ngo] {
5464
5464
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -8459,7 +8459,7 @@
8459
8459
  }
8460
8460
  /**
8461
8461
  * Do not edit directly
8462
- * Generated on Wed, 02 Jul 2025 12:38:43 GMT
8462
+ * Generated on Thu, 03 Jul 2025 10:12:35 GMT
8463
8463
  */
8464
8464
  :root [ks-theme=telekom] {
8465
8465
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 02 Jul 2025 12:38:34 GMT
3
+ * Generated on Thu, 03 Jul 2025 10:12:27 GMT
4
4
  */
5
5
 
6
6
  :root, [ks-theme] {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 02 Jul 2025 12:38:34 GMT
3
+ * Generated on Thu, 03 Jul 2025 10:12:27 GMT
4
4
  */
5
5
 
6
6
  export const KsBackgroundColorAccentBase = "#f3f3f4";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kickstartds/ds-agency-premium",
3
- "version": "1.6.71--canary.45.1768.0",
3
+ "version": "1.6.71--canary.45.1774.0",
4
4
  "description": "",
5
5
  "homepage": "https://github.com/kickstartDS/ds-agency-premium#readme",
6
6
  "bugs": {