@kickstartds/ds-agency-premium 1.2.18 → 1.2.20

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 (45) hide show
  1. package/dist/{TestimonialsProps-4b94faa8.d.ts → TestimonialProps-94bdeac9.d.ts} +5 -16
  2. package/dist/TestimonialsProps-72bb9288.d.ts +22 -0
  3. package/dist/components/blog-overview/index.d.ts +36 -1
  4. package/dist/components/blog-post/index.d.ts +36 -1
  5. package/dist/components/feature/index.js +0 -1
  6. package/dist/components/features/features.css +98 -0
  7. package/dist/components/footer/index.d.ts +37 -1
  8. package/dist/components/header/index.d.ts +42 -1
  9. package/dist/components/page/page.schema.dereffed.json +12 -6
  10. package/dist/components/page-wrapper/index.d.ts +3 -2
  11. package/dist/components/page-wrapper/index.js +471 -6
  12. package/dist/components/page-wrapper/tokens.css +1 -1
  13. package/dist/components/presets.json +25 -181
  14. package/dist/components/section/index.d.ts +141 -1
  15. package/dist/components/section/section.schema.dereffed.json +12 -6
  16. package/dist/components/testimonial/index.d.ts +13 -41
  17. package/dist/components/testimonial/index.js +4 -11
  18. package/dist/components/testimonial/testimonial.schema.dereffed.json +7 -0
  19. package/dist/components/testimonial/testimonial.schema.json +7 -0
  20. package/dist/components/testimonials/index.d.ts +1 -1
  21. package/dist/components/testimonials/index.js +6 -7
  22. package/dist/components/testimonials/testimonials.schema.dereffed.json +12 -6
  23. package/dist/components/testimonials/testimonials.schema.json +3 -48
  24. package/dist/global.css +1 -1
  25. package/dist/tokens/themes.css +11186 -0
  26. package/dist/tokens/themes.css.d.ts +0 -0
  27. package/dist/tokens/themes.css.js +1 -0
  28. package/dist/tokens/tokens.css +1 -1
  29. package/dist/tokens/tokens.js +1 -1
  30. package/package.json +4 -3
  31. package/dist/BlogOverviewProps-525f7f9f.d.ts +0 -36
  32. package/dist/BlogPostProps-e1cbd5d3.d.ts +0 -36
  33. package/dist/FooterProps-b5c16ab5.d.ts +0 -37
  34. package/dist/HeaderProps-ae331ab2.d.ts +0 -42
  35. package/dist/SectionProps-83d399b4.d.ts +0 -141
  36. package/dist/components/feature/feature.css +0 -99
  37. package/dist/components/index/index.d.ts +0 -50
  38. package/dist/components/index/index.js +0 -1
  39. package/dist/components/raw-page-wrapper/index.d.ts +0 -3
  40. package/dist/components/raw-page-wrapper/index.js +0 -492
  41. package/dist/static/tokens-business.css +0 -2725
  42. package/dist/static/tokens-google.css +0 -2729
  43. package/dist/static/tokens-ngo.css +0 -2999
  44. package/dist/static/tokens-telekom.css +0 -2725
  45. package/dist/static/tokens.css +0 -2730
@@ -6,11 +6,7 @@
6
6
  /**
7
7
  * The testimonial quote
8
8
  */
9
- type Quote = "slider" | "list" | "alternating";
10
- /**
11
- * The testimonial quote
12
- */
13
- type Quote1 = string;
9
+ type Quote = string;
14
10
  /**
15
11
  * The name of the quote author
16
12
  */
@@ -32,10 +28,10 @@ type AltText = string;
32
28
  */
33
29
  type Rating = number;
34
30
  /**
35
- * Add testimonials featuring an image, a quote, a source and a rating
31
+ * Testimonial entry of Testimonials component
36
32
  */
37
- type Items = {
38
- quote: Quote1;
33
+ interface TestimonialProps {
34
+ quote: Quote;
39
35
  name: Name;
40
36
  title?: Title;
41
37
  image: {
@@ -43,12 +39,5 @@ type Items = {
43
39
  alt?: AltText;
44
40
  };
45
41
  rating?: Rating;
46
- }[];
47
- /**
48
- * Display testimonials with an optional image and rating
49
- */
50
- interface TestimonialsProps {
51
- layout?: Quote;
52
- items?: Items;
53
42
  }
54
- export { Quote, Quote1, Name, Title, Source, AltText, Rating, Items, TestimonialsProps };
43
+ export { Quote, Name, Title, Source, AltText, Rating, TestimonialProps };
@@ -0,0 +1,22 @@
1
+ /**
2
+ * This file was automatically generated by json-schema-to-typescript.
3
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
4
+ * and run json-schema-to-typescript to regenerate this file.
5
+ */
6
+ import { TestimonialProps } from "./TestimonialProps-94bdeac9.js";
7
+ /**
8
+ * The testimonial quote
9
+ */
10
+ type Quote = "slider" | "list" | "alternating";
11
+ /**
12
+ * Add testimonials featuring an image, a quote, a source and a rating
13
+ */
14
+ type Testimonials = TestimonialProps[];
15
+ /**
16
+ * Display testimonials with an optional image and rating
17
+ */
18
+ interface TestimonialsProps {
19
+ layout?: Quote;
20
+ testimonial?: Testimonials;
21
+ }
22
+ export { Quote, Testimonials, TestimonialsProps };
@@ -1,4 +1,39 @@
1
1
  /// <reference types="react" />
2
- import { BlogOverviewProps } from "../../BlogOverviewProps-525f7f9f.js";
2
+ /* eslint-disable */
3
+ /**
4
+ * This file was automatically generated by json-schema-to-typescript.
5
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
6
+ * and run json-schema-to-typescript to regenerate this file.
7
+ */
8
+ import { BlogTeaserProps } from "../../BlogTeaserProps-525f7f9f.js";
9
+ import { CtaProps } from "../../CtaProps-93230a76.js";
10
+ import { SeoProps } from "../../SeoProps-f2d6dcaa.js";
11
+ /**
12
+ * Collection of posts to list on the page
13
+ */
14
+ type Posts = BlogTeaserProps[];
15
+ /**
16
+ * Collection of posts to list on the page
17
+ */
18
+ type Posts1 = BlogTeaserProps[];
19
+ /**
20
+ * Abstracts a blog overview concept into JSON schema
21
+ */
22
+ interface BlogOverviewProps {
23
+ /**
24
+ * Referenced component BlogTeaserProps
25
+ */
26
+ latest?: BlogTeaserProps;
27
+ list?: Posts;
28
+ more?: Posts1;
29
+ /**
30
+ * Referenced component CtaProps
31
+ */
32
+ cta?: CtaProps;
33
+ /**
34
+ * Referenced component SeoProps
35
+ */
36
+ seo: SeoProps;
37
+ }
3
38
  declare const BlogOverview: ({ latest, more, }: BlogOverviewProps) => import("react/jsx-runtime").JSX.Element;
4
39
  export { BlogOverview };
@@ -1,4 +1,39 @@
1
1
  /// <reference types="react" />
2
- import { BlogPostProps } from "../../BlogPostProps-e1cbd5d3.js";
2
+ /* eslint-disable */
3
+ /**
4
+ * This file was automatically generated by json-schema-to-typescript.
5
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
6
+ * and run json-schema-to-typescript to regenerate this file.
7
+ */
8
+ import { BlogHeadProps } from "../../BlogHeadProps-f9a49428.js";
9
+ import { BlogAsideProps } from "../../BlogAsideProps-e1cbd5d3.js";
10
+ import { CtaProps } from "../../CtaProps-93230a76.js";
11
+ import { SeoProps } from "../../SeoProps-f2d6dcaa.js";
12
+ /**
13
+ * Body text for the blog post
14
+ */
15
+ type Text = string;
16
+ /**
17
+ * Abstracts a blog post concept into JSON schema
18
+ */
19
+ interface BlogPostProps {
20
+ /**
21
+ * Referenced component BlogHeadProps
22
+ */
23
+ head?: BlogHeadProps;
24
+ /**
25
+ * Referenced component BlogAsideProps
26
+ */
27
+ aside?: BlogAsideProps;
28
+ content?: Text;
29
+ /**
30
+ * Referenced component CtaProps
31
+ */
32
+ cta?: CtaProps;
33
+ /**
34
+ * Referenced component SeoProps
35
+ */
36
+ seo: SeoProps;
37
+ }
3
38
  declare const BlogPost: ({ head, content, aside, cta }: BlogPostProps) => import("react/jsx-runtime").JSX.Element;
4
39
  export { BlogPost };
@@ -1,4 +1,3 @@
1
- import "./feature.css";
2
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
2
  import { forwardRef, createContext, useContext } from 'react';
4
3
  import classnames from 'classnames';
@@ -1,6 +1,21 @@
1
1
  .c-features {
2
2
  --dsa-features--gap-vertical: var(--ks-spacing-stack-l);
3
3
  --dsa-features--gap-horizontal: var(--ks-spacing-inline-m);
4
+ --dsa-feature__title--color: var(--dsa-topic--color);
5
+ --dsa-feature__title--font: var(--ks-font-interface-m);
6
+ --dsa-feature__title--font-family: var(--dsa-topic--font-family);
7
+ --dsa-feature__copy--color: var(--dsa-rich-text--color);
8
+ --dsa-feature__copy--font: var(--ks-font-copy-s);
9
+ --dsa-feature__link-font: var(--ks-font-copy-s);
10
+ --dsa-feature__icon--color: var(--ks-text-color-primary);
11
+ --dsa-feature_small__icon--size: calc(
12
+ var(--ks-line-height-interface-m) * var(--ks-font-size-interface-m)
13
+ );
14
+ --dsa-feature_large__icon--size: calc(var(--ks-font-size-copy-m) * 2.5);
15
+ --dsa-feature_small--gap: var(--ks-spacing-stack-xs);
16
+ --dsa-feature_large--gap: var(--ks-spacing-stack-s);
17
+ --dsa-feature_small__icon--gap: var(--ks-spacing-xs);
18
+ --dsa-feature_large__icon--gap: var(--ks-spacing-s);
4
19
  }
5
20
 
6
21
  .c-features {
@@ -26,4 +41,87 @@
26
41
  }
27
42
  .l-section--align-center .c-features--small-tiles {
28
43
  justify-content: center;
44
+ }
45
+ .c-features .c-feature {
46
+ display: flex;
47
+ position: relative;
48
+ flex-direction: column;
49
+ gap: var(--dsa-feature--gap);
50
+ }
51
+ .c-features .c-feature--large {
52
+ --dsa-feature__icon--size: var(--dsa-feature_large__icon--size, calc(var(--ks-font-size-copy-m) * 2.5));
53
+ --dsa-feature__icon--gap: var(--dsa-feature_large__icon--gap, var(--ks-spacing-xs));
54
+ --dsa-feature--gap: var(--dsa-feature_large--gap, var(--ks-spacing-stack-s));
55
+ }
56
+ .c-features .c-feature--small {
57
+ --dsa-feature__icon--size: var(
58
+ --dsa-feature_small__icon--size,
59
+ calc(var(--ks-line-height-interface-m) * var(--ks-font-size-interface-m))
60
+ );
61
+ --dsa-feature__icon--gap: var(--dsa-feature_small__icon--gap, var(--ks-spacing-xs));
62
+ --dsa-feature--gap: var(--dsa-feature_small--gap, var(--ks-spacing-stack-xs));
63
+ }
64
+ .c-features .c-feature--beside {
65
+ padding-left: calc(var(--dsa-feature__icon--size) + var(--dsa-feature__icon--gap));
66
+ }
67
+ .c-features .c-feature--beside .c-feature__icon {
68
+ position: absolute;
69
+ top: 0;
70
+ left: 0;
71
+ }
72
+ .c-features .c-feature--stack .c-feature__header {
73
+ display: flex;
74
+ flex-direction: column;
75
+ align-items: flex-start;
76
+ }
77
+ .c-features .c-feature--centered .c-feature__header {
78
+ display: flex;
79
+ flex-direction: column;
80
+ align-items: center;
81
+ }
82
+ .c-features .c-feature--centered .c-feature__title,
83
+ .c-features .c-feature--centered .c-feature__text {
84
+ text-align: center;
85
+ }
86
+ .c-features .c-feature--centered .c-feature__cta {
87
+ display: flex;
88
+ justify-content: center;
89
+ }
90
+ .c-features .c-feature__header {
91
+ display: flex;
92
+ align-items: center;
93
+ gap: var(--dsa-feature__icon--gap);
94
+ }
95
+ .c-features .c-feature__title {
96
+ font: var(--dsa-feature__title--font, var(--ks-font-interface-m));
97
+ color: var(--dsa-feature__title--color, var(--ks-topic-color));
98
+ font-family: var(--dsa-feature__title--font-family, var(--ks-font-family-display));
99
+ font-weight: var(--dsa-feature__title--font-weight, var(--ks-font-weight-semi-bold));
100
+ }
101
+ .c-features .c-feature__text {
102
+ color: var(--dsa-feature__copy--color, var(--dsa-rich-text-color), var(--ks-text-color-default));
103
+ font: var(--dsa-feature__copy--font, var(--ks-font-copy-s));
104
+ margin: 0;
105
+ }
106
+ .c-features .c-feature__icon {
107
+ color: var(--dsa-feature__icon--color, var(--ks-text-color-primary));
108
+ width: var(--dsa-feature__icon--size);
109
+ height: var(--dsa-feature__icon--size);
110
+ }
111
+ .c-features .c-feature__cta {
112
+ margin-top: auto;
113
+ }
114
+ .c-features .c-feature__link {
115
+ font: var(--dsa-feature__link-font, var(--ks-font-copy-s));
116
+ display: flex;
117
+ align-items: center;
118
+ gap: var(--ks-spacing-xxs);
119
+ width: fit-content;
120
+ }
121
+ .c-features .c-feature__link .icon {
122
+ width: 1.125em;
123
+ height: 1.125em;
124
+ }
125
+ .c-features .c-feature__button {
126
+ margin-top: calc(var(--dsa-feature--gap) * 0.5);
29
127
  }
@@ -1,4 +1,40 @@
1
1
  import { FC } from "react";
2
- import { FooterProps } from "../../FooterProps-b5c16ab5.js";
2
+ /* eslint-disable */
3
+ /**
4
+ * This file was automatically generated by json-schema-to-typescript.
5
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
6
+ * and run json-schema-to-typescript to regenerate this file.
7
+ */
8
+ /**
9
+ * Picture source
10
+ */
11
+ type Source = string;
12
+ /**
13
+ * Alt text to display for picture
14
+ */
15
+ type AltText = string;
16
+ /**
17
+ * Width of the picture
18
+ */
19
+ type Width = number;
20
+ /**
21
+ * Height of the picture
22
+ */
23
+ type Height = number;
24
+ interface FooterProps {
25
+ logo: Logo;
26
+ logoHref?: string;
27
+ navItems?: {
28
+ href: string;
29
+ label: string;
30
+ target?: string;
31
+ }[];
32
+ }
33
+ interface Logo {
34
+ src?: Source;
35
+ alt?: AltText;
36
+ width?: Width;
37
+ height?: Height;
38
+ }
3
39
  declare const Footer: FC<FooterProps>;
4
40
  export { Footer };
@@ -1,4 +1,45 @@
1
1
  import { FC } from "react";
2
- import { HeaderProps } from "../../HeaderProps-ae331ab2.js";
2
+ /* eslint-disable */
3
+ /**
4
+ * This file was automatically generated by json-schema-to-typescript.
5
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
6
+ * and run json-schema-to-typescript to regenerate this file.
7
+ */
8
+ /**
9
+ * Picture source
10
+ */
11
+ type Source = string;
12
+ /**
13
+ * Alt text to display for picture
14
+ */
15
+ type AltText = string;
16
+ /**
17
+ * Width of the picture
18
+ */
19
+ type Width = number;
20
+ /**
21
+ * Height of the picture
22
+ */
23
+ type Height = number;
24
+ /**
25
+ * Make the header float over the first Section
26
+ */
27
+ type Floating = boolean;
28
+ interface HeaderProps {
29
+ logo: Logo;
30
+ logoHref?: string;
31
+ floating?: Floating;
32
+ navItems?: {
33
+ href: string;
34
+ label: string;
35
+ active?: boolean;
36
+ }[];
37
+ }
38
+ interface Logo {
39
+ src?: Source;
40
+ alt?: AltText;
41
+ width?: Width;
42
+ height?: Height;
43
+ }
3
44
  declare const Header: FC<HeaderProps>;
4
45
  export { Header };
@@ -1575,17 +1575,22 @@
1575
1575
  ],
1576
1576
  "default": "slider"
1577
1577
  },
1578
- "items": {
1578
+ "testimonial": {
1579
1579
  "type": "array",
1580
- "title": "Items",
1580
+ "title": "Testimonials",
1581
1581
  "description": "Add testimonials featuring an image, a quote, a source and a rating",
1582
1582
  "items": {
1583
+ "$schema": "http://json-schema.org/draft-07/schema#",
1584
+ "$id": "http://schema.mydesignsystem.com/testimonial.schema.json",
1585
+ "title": "Testimonial",
1586
+ "description": "Testimonial entry of Testimonials component",
1583
1587
  "type": "object",
1584
1588
  "properties": {
1585
1589
  "quote": {
1586
1590
  "title": "Quote",
1587
1591
  "description": "The testimonial quote",
1588
1592
  "type": "string",
1593
+ "format": "markdown",
1589
1594
  "examples": [
1590
1595
  "This product is amazing!"
1591
1596
  ]
@@ -1601,10 +1606,7 @@
1601
1606
  "title": {
1602
1607
  "title": "Title",
1603
1608
  "description": "The title of the quote author",
1604
- "type": "string",
1605
- "examples": [
1606
- "CEO"
1607
- ]
1609
+ "type": "string"
1608
1610
  },
1609
1611
  "image": {
1610
1612
  "type": "object",
@@ -1613,6 +1615,7 @@
1613
1615
  "title": "Source",
1614
1616
  "description": "The image to display with the testimonial",
1615
1617
  "type": "string",
1618
+ "format": "image",
1616
1619
  "examples": [
1617
1620
  "https://example.com/image.jpg"
1618
1621
  ]
@@ -1631,6 +1634,9 @@
1631
1634
  "type": "integer",
1632
1635
  "minimum": 1,
1633
1636
  "maximum": 5
1637
+ },
1638
+ "type": {
1639
+ "const": "testimonial"
1634
1640
  }
1635
1641
  },
1636
1642
  "additionalProperties": false,
@@ -1,2 +1,3 @@
1
- import { RawPageWrapper as PageWrapper } from "../raw-page-wrapper/index.js";
2
- export { PageWrapper as default, PageWrapper };
1
+ import { FC, PropsWithChildren } from "react";
2
+ declare const PageWrapper: FC<PropsWithChildren>;
3
+ export { PageWrapper };