@kickstartds/ds-agency-premium 1.4.6--canary.764.6e5c982.0 → 1.4.6
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.
- package/dist/{BlogHeadProps-f9a49428.d.ts → BlogHeadProps-3f6e4072.d.ts} +2 -1
- package/dist/BlogOverviewProps-9f207f1c.d.ts +1 -1
- package/dist/BlogPostProps-440f88a5.d.ts +1 -1
- package/dist/BlogTagProps-f5855e93.d.ts +16 -0
- package/dist/{BlogTeaserProps-525f7f9f.d.ts → BlogTeaserProps-f5855e93.d.ts} +2 -1
- package/dist/components/blog-head/blog-head.schema.dereffed.json +18 -4
- package/dist/components/blog-head/blog-head.schema.json +1 -2
- package/dist/components/blog-head/index.d.ts +1 -1
- package/dist/components/blog-head/index.js +1 -1
- package/dist/components/blog-overview/blog-overview.schema.dereffed.json +54 -12
- package/dist/components/blog-post/blog-post.schema.dereffed.json +18 -4
- package/dist/components/blog-tag/blog-tag.schema.dereffed.json +21 -0
- package/dist/components/blog-tag/blog-tag.schema.json +16 -0
- package/dist/components/blog-teaser/blog-teaser.schema.dereffed.json +18 -4
- package/dist/components/blog-teaser/blog-teaser.schema.json +1 -2
- package/dist/components/blog-teaser/index.d.ts +1 -1
- package/dist/components/blog-teaser/index.js +1 -1
- package/dist/components/page-wrapper/tokens.css +1 -1
- package/dist/components/presets.json +36 -82
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +1 -1
- package/dist/tokens/tokens.js +1 -1
- package/package.json +1 -1
- package/dist/components/contact/contact.css +0 -74
- package/dist/components/contact/contact.schema.dereffed.json +0 -108
- package/dist/components/contact/contact.schema.json +0 -94
- package/dist/components/contact/index.d.ts +0 -59
- package/dist/components/contact/index.js +0 -13
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
|
+
import { BlogTagProps } from "./BlogTagProps-f5855e93.js";
|
|
6
7
|
/**
|
|
7
8
|
* The date when the blog post was published
|
|
8
9
|
*/
|
|
@@ -10,7 +11,7 @@ type PublishedDate = string;
|
|
|
10
11
|
/**
|
|
11
12
|
* The tags associated with the blog post
|
|
12
13
|
*/
|
|
13
|
-
type Tags =
|
|
14
|
+
type Tags = BlogTagProps[];
|
|
14
15
|
/**
|
|
15
16
|
* The headline of the blog post
|
|
16
17
|
*/
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
6
|
import { SectionProps } from "./SectionProps-83d399b4.js";
|
|
7
|
-
import { BlogTeaserProps } from "./BlogTeaserProps-
|
|
7
|
+
import { BlogTeaserProps } from "./BlogTeaserProps-f5855e93.js";
|
|
8
8
|
import { CtaProps } from "./CtaProps-93230a76.js";
|
|
9
9
|
import { SeoProps } from "./SeoProps-f2d6dcaa.js";
|
|
10
10
|
/**
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
|
-
import { BlogHeadProps } from "./BlogHeadProps-
|
|
6
|
+
import { BlogHeadProps } from "./BlogHeadProps-3f6e4072.js";
|
|
7
7
|
import { BlogAsideProps } from "./BlogAsideProps-e1cbd5d3.js";
|
|
8
8
|
import { SectionProps } from "./SectionProps-83d399b4.js";
|
|
9
9
|
import { CtaProps } from "./CtaProps-93230a76.js";
|
|
@@ -0,0 +1,16 @@
|
|
|
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
|
+
/**
|
|
7
|
+
* Name of the tag entry
|
|
8
|
+
*/
|
|
9
|
+
type Entry = string;
|
|
10
|
+
/**
|
|
11
|
+
* Tag given to a blog post
|
|
12
|
+
*/
|
|
13
|
+
interface BlogTagProps {
|
|
14
|
+
entry: Entry;
|
|
15
|
+
}
|
|
16
|
+
export { Entry, BlogTagProps };
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
|
+
import { BlogTagProps } from "./BlogTagProps-f5855e93.js";
|
|
6
7
|
/**
|
|
7
8
|
* The date of the blog post
|
|
8
9
|
*/
|
|
@@ -10,7 +11,7 @@ type Date = string;
|
|
|
10
11
|
/**
|
|
11
12
|
* The tags for the blog post
|
|
12
13
|
*/
|
|
13
|
-
type Tags =
|
|
14
|
+
type Tags = BlogTagProps[];
|
|
14
15
|
/**
|
|
15
16
|
* The headline of the blog post
|
|
16
17
|
*/
|
|
@@ -19,10 +19,24 @@
|
|
|
19
19
|
"title": "Tags",
|
|
20
20
|
"description": "The tags associated with the blog post",
|
|
21
21
|
"items": {
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
23
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
24
|
+
"title": "Blog Tag",
|
|
25
|
+
"description": "Tag given to a blog post",
|
|
26
|
+
"type": "object",
|
|
27
|
+
"properties": {
|
|
28
|
+
"entry": {
|
|
29
|
+
"title": "Entry",
|
|
30
|
+
"description": "Name of the tag entry",
|
|
31
|
+
"type": "string"
|
|
32
|
+
},
|
|
33
|
+
"type": {
|
|
34
|
+
"const": "blog-tag"
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
"additionalProperties": false,
|
|
38
|
+
"required": [
|
|
39
|
+
"entry"
|
|
26
40
|
]
|
|
27
41
|
}
|
|
28
42
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { BlogHeadProps } from "../../BlogHeadProps-
|
|
2
|
+
import { BlogHeadProps } from "../../BlogHeadProps-3f6e4072.js";
|
|
3
3
|
declare const BlogHeadContextDefault: import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
4
4
|
declare const BlogHeadContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>>;
|
|
5
5
|
declare const BlogHead: import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -5,7 +5,7 @@ import { PostHead } from '@kickstartds/blog/lib/post-head';
|
|
|
5
5
|
|
|
6
6
|
const BlogHeadContextDefault = forwardRef(({ date, tags = [], headline, image, ...rest }, ref) => {
|
|
7
7
|
return (jsx(PostHead, { ...rest, date: date, headline: { text: headline, level: "h1", align: "left" }, image: { src: image }, categories: tags.map((tag) => {
|
|
8
|
-
return { label: tag };
|
|
8
|
+
return { label: tag.entry };
|
|
9
9
|
}), ref: ref }));
|
|
10
10
|
});
|
|
11
11
|
const BlogHeadContext = createContext(BlogHeadContextDefault);
|
|
@@ -3129,10 +3129,24 @@
|
|
|
3129
3129
|
"title": "Tags",
|
|
3130
3130
|
"description": "The tags for the blog post",
|
|
3131
3131
|
"items": {
|
|
3132
|
-
"
|
|
3133
|
-
"
|
|
3134
|
-
|
|
3135
|
-
|
|
3132
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3133
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
3134
|
+
"title": "Blog Tag",
|
|
3135
|
+
"description": "Tag given to a blog post",
|
|
3136
|
+
"type": "object",
|
|
3137
|
+
"properties": {
|
|
3138
|
+
"entry": {
|
|
3139
|
+
"title": "Entry",
|
|
3140
|
+
"description": "Name of the tag entry",
|
|
3141
|
+
"type": "string"
|
|
3142
|
+
},
|
|
3143
|
+
"type": {
|
|
3144
|
+
"const": "blog-tag"
|
|
3145
|
+
}
|
|
3146
|
+
},
|
|
3147
|
+
"additionalProperties": false,
|
|
3148
|
+
"required": [
|
|
3149
|
+
"entry"
|
|
3136
3150
|
]
|
|
3137
3151
|
}
|
|
3138
3152
|
},
|
|
@@ -3280,10 +3294,24 @@
|
|
|
3280
3294
|
"title": "Tags",
|
|
3281
3295
|
"description": "The tags for the blog post",
|
|
3282
3296
|
"items": {
|
|
3283
|
-
"
|
|
3284
|
-
"
|
|
3285
|
-
|
|
3286
|
-
|
|
3297
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3298
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
3299
|
+
"title": "Blog Tag",
|
|
3300
|
+
"description": "Tag given to a blog post",
|
|
3301
|
+
"type": "object",
|
|
3302
|
+
"properties": {
|
|
3303
|
+
"entry": {
|
|
3304
|
+
"title": "Entry",
|
|
3305
|
+
"description": "Name of the tag entry",
|
|
3306
|
+
"type": "string"
|
|
3307
|
+
},
|
|
3308
|
+
"type": {
|
|
3309
|
+
"const": "blog-tag"
|
|
3310
|
+
}
|
|
3311
|
+
},
|
|
3312
|
+
"additionalProperties": false,
|
|
3313
|
+
"required": [
|
|
3314
|
+
"entry"
|
|
3287
3315
|
]
|
|
3288
3316
|
}
|
|
3289
3317
|
},
|
|
@@ -3432,10 +3460,24 @@
|
|
|
3432
3460
|
"title": "Tags",
|
|
3433
3461
|
"description": "The tags for the blog post",
|
|
3434
3462
|
"items": {
|
|
3435
|
-
"
|
|
3436
|
-
"
|
|
3437
|
-
|
|
3438
|
-
|
|
3463
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3464
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
3465
|
+
"title": "Blog Tag",
|
|
3466
|
+
"description": "Tag given to a blog post",
|
|
3467
|
+
"type": "object",
|
|
3468
|
+
"properties": {
|
|
3469
|
+
"entry": {
|
|
3470
|
+
"title": "Entry",
|
|
3471
|
+
"description": "Name of the tag entry",
|
|
3472
|
+
"type": "string"
|
|
3473
|
+
},
|
|
3474
|
+
"type": {
|
|
3475
|
+
"const": "blog-tag"
|
|
3476
|
+
}
|
|
3477
|
+
},
|
|
3478
|
+
"additionalProperties": false,
|
|
3479
|
+
"required": [
|
|
3480
|
+
"entry"
|
|
3439
3481
|
]
|
|
3440
3482
|
}
|
|
3441
3483
|
},
|
|
@@ -29,10 +29,24 @@
|
|
|
29
29
|
"title": "Tags",
|
|
30
30
|
"description": "The tags associated with the blog post",
|
|
31
31
|
"items": {
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
33
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
34
|
+
"title": "Blog Tag",
|
|
35
|
+
"description": "Tag given to a blog post",
|
|
36
|
+
"type": "object",
|
|
37
|
+
"properties": {
|
|
38
|
+
"entry": {
|
|
39
|
+
"title": "Entry",
|
|
40
|
+
"description": "Name of the tag entry",
|
|
41
|
+
"type": "string"
|
|
42
|
+
},
|
|
43
|
+
"type": {
|
|
44
|
+
"const": "blog-tag"
|
|
45
|
+
}
|
|
46
|
+
},
|
|
47
|
+
"additionalProperties": false,
|
|
48
|
+
"required": [
|
|
49
|
+
"entry"
|
|
36
50
|
]
|
|
37
51
|
}
|
|
38
52
|
},
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
4
|
+
"title": "Blog Tag",
|
|
5
|
+
"description": "Tag given to a blog post",
|
|
6
|
+
"type": "object",
|
|
7
|
+
"properties": {
|
|
8
|
+
"entry": {
|
|
9
|
+
"title": "Entry",
|
|
10
|
+
"description": "Name of the tag entry",
|
|
11
|
+
"type": "string"
|
|
12
|
+
},
|
|
13
|
+
"type": {
|
|
14
|
+
"const": "blog-tag"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
17
|
+
"additionalProperties": false,
|
|
18
|
+
"required": [
|
|
19
|
+
"entry"
|
|
20
|
+
]
|
|
21
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
4
|
+
"title": "Blog Tag",
|
|
5
|
+
"description": "Tag given to a blog post",
|
|
6
|
+
"type": "object",
|
|
7
|
+
"properties": {
|
|
8
|
+
"entry": {
|
|
9
|
+
"title": "Entry",
|
|
10
|
+
"description": "Name of the tag entry",
|
|
11
|
+
"type": "string"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
"additionalProperties": false,
|
|
15
|
+
"required": ["entry"]
|
|
16
|
+
}
|
|
@@ -19,10 +19,24 @@
|
|
|
19
19
|
"title": "Tags",
|
|
20
20
|
"description": "The tags for the blog post",
|
|
21
21
|
"items": {
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
23
|
+
"$id": "http://schema.mydesignsystem.com/blog-tag.schema.json",
|
|
24
|
+
"title": "Blog Tag",
|
|
25
|
+
"description": "Tag given to a blog post",
|
|
26
|
+
"type": "object",
|
|
27
|
+
"properties": {
|
|
28
|
+
"entry": {
|
|
29
|
+
"title": "Entry",
|
|
30
|
+
"description": "Name of the tag entry",
|
|
31
|
+
"type": "string"
|
|
32
|
+
},
|
|
33
|
+
"type": {
|
|
34
|
+
"const": "blog-tag"
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
"additionalProperties": false,
|
|
38
|
+
"required": [
|
|
39
|
+
"entry"
|
|
26
40
|
]
|
|
27
41
|
}
|
|
28
42
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { BlogTeaserProps } from "../../BlogTeaserProps-
|
|
2
|
+
import { BlogTeaserProps } from "../../BlogTeaserProps-f5855e93.js";
|
|
3
3
|
declare const BlogTeaserContextDefault: import("react").ForwardRefExoticComponent<BlogTeaserProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
4
4
|
declare const BlogTeaserContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogTeaserProps & import("react").RefAttributes<HTMLDivElement>>>;
|
|
5
5
|
declare const BlogTeaser: import("react").ForwardRefExoticComponent<BlogTeaserProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -34,7 +34,7 @@ const BlogTeaserContextDefault = forwardRef(({ date, tags = [], headline, teaser
|
|
|
34
34
|
target: link.url,
|
|
35
35
|
}
|
|
36
36
|
: undefined, title: headline, body: teaserText, categories: tags.map((tag) => {
|
|
37
|
-
return { label: tag };
|
|
37
|
+
return { label: tag.entry };
|
|
38
38
|
}), ref: ref }) }));
|
|
39
39
|
});
|
|
40
40
|
const BlogTeaserContext = createContext(BlogTeaserContextDefault);
|
|
@@ -36,12 +36,12 @@
|
|
|
36
36
|
"code": "<BlogHead\n date=\"12/30/2022\"\n headline=\"The Future of AI\"\n image=\"img/close-up-young-business-team-working.png\"\n tags={[\n 'Technology',\n 'AI'\n ]}\n/>",
|
|
37
37
|
"args": {
|
|
38
38
|
"date": "12/30/2022",
|
|
39
|
+
"headline": "The Future of AI",
|
|
40
|
+
"image": "img/close-up-young-business-team-working.png",
|
|
39
41
|
"tags": [
|
|
40
42
|
"Technology",
|
|
41
43
|
"AI"
|
|
42
|
-
]
|
|
43
|
-
"headline": "The Future of AI",
|
|
44
|
-
"image": "img/close-up-young-business-team-working.png"
|
|
44
|
+
]
|
|
45
45
|
},
|
|
46
46
|
"screenshot": "img/screenshots/blog-blog-head--default.png"
|
|
47
47
|
},
|
|
@@ -52,10 +52,6 @@
|
|
|
52
52
|
"code": "<BlogTeaser\n author={{\n image: 'img/people/author-emily.png',\n name: 'Jane Smith',\n title: 'Senior AI Researcher'\n }}\n date=\"12/30/2022\"\n headline=\"The Future of AI\"\n image=\"img/close-up-young-business-team-working.png\"\n link={{\n label: 'Read more',\n url: 'https://example.com'\n }}\n readingTime=\"5 min read\"\n tags={[\n 'Technology',\n 'AI'\n ]}\n teaserText=\"Dive into the future of AI in this detailed blog post. Discover how technology is rapidly evolving, the impact of AI on various industries, and what to expect in the coming years. Learn about the latest advancements, challenges, and the potential solutions that AI brings to the table.\"\n/>",
|
|
53
53
|
"args": {
|
|
54
54
|
"date": "12/30/2022",
|
|
55
|
-
"tags": [
|
|
56
|
-
"Technology",
|
|
57
|
-
"AI"
|
|
58
|
-
],
|
|
59
55
|
"headline": "The Future of AI",
|
|
60
56
|
"teaserText": "Dive into the future of AI in this detailed blog post. Discover how technology is rapidly evolving, the impact of AI on various industries, and what to expect in the coming years. Learn about the latest advancements, challenges, and the potential solutions that AI brings to the table.",
|
|
61
57
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -68,7 +64,11 @@
|
|
|
68
64
|
"name": "Jane Smith",
|
|
69
65
|
"title": "Senior AI Researcher",
|
|
70
66
|
"image": "img/people/author-emily.png"
|
|
71
|
-
}
|
|
67
|
+
},
|
|
68
|
+
"tags": [
|
|
69
|
+
"Technology",
|
|
70
|
+
"AI"
|
|
71
|
+
]
|
|
72
72
|
},
|
|
73
73
|
"screenshot": "img/screenshots/blog-blog-teaser--default.png"
|
|
74
74
|
},
|
|
@@ -128,7 +128,7 @@
|
|
|
128
128
|
"id": "pages-archetypes--blog-overview",
|
|
129
129
|
"group": "Pages/Archetypes",
|
|
130
130
|
"name": "BlogOverview",
|
|
131
|
-
"code": "<BlogOverview\n cta={{\n buttons: [\n {\n label: 'Book a meeting'\n },\n {\n label: 'Book a meeting'\n },\n {\n label: 'Book a meeting'\n }\n ],\n colorNeutral: false,\n contentAlign: 'center',\n fullWidth: false,\n headline: 'Headline',\n highlightText: false,\n image: {\n padding: true\n },\n order: {\n desktopImageLast: true,\n mobileImageLast: false\n },\n sub: 'Subheadline',\n textAlign: 'left'\n }}\n latest={{\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n 'Design Systems',\n 'Headless Websites',\n 'Training'\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences. Learn how we transform ideas into tangible results with our Design System Creation service, empowering your brand to communicate effectively across digital platforms.'\n }}\n latestTitle=\"Latest Post\"\n list={[\n {\n author: {\n image: 'img/people/author-emily.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'This is a blog post headline',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com'\n },\n readingTime: '5 min read',\n
|
|
131
|
+
"code": "<BlogOverview\n cta={{\n buttons: [\n {\n label: 'Book a meeting'\n },\n {\n label: 'Book a meeting'\n },\n {\n label: 'Book a meeting'\n }\n ],\n colorNeutral: false,\n contentAlign: 'center',\n fullWidth: false,\n headline: 'Headline',\n highlightText: false,\n image: {\n padding: true\n },\n order: {\n desktopImageLast: true,\n mobileImageLast: false\n },\n sub: 'Subheadline',\n textAlign: 'left'\n }}\n latest={{\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n 'Design Systems',\n 'Headless Websites',\n 'Training'\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences. Learn how we transform ideas into tangible results with our Design System Creation service, empowering your brand to communicate effectively across digital platforms.'\n }}\n latestTitle=\"Latest Post\"\n list={[\n {\n author: {\n image: 'img/people/author-emily.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'This is a blog post headline',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com'\n },\n readingTime: '5 min read',\n teaserText: 'This is a teaser text for the blog post'\n },\n {\n author: {\n image: 'img/people/author-emily.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'This is a blog post headline',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com'\n },\n readingTime: '5 min read',\n teaserText: 'This is a teaser text for the blog post'\n },\n {\n author: {\n image: 'img/people/author-emily.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'This is a blog post headline',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com'\n },\n readingTime: '5 min read',\n teaserText: 'This is a teaser text for the blog post'\n }\n ]}\n listTitle=\"Recent Posts\"\n more={[\n {\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n 'Design Systems',\n 'Headless Websites',\n 'Training'\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences. Learn how we transform ideas into tangible results with our Design System Creation service, empowering your brand to communicate effectively across digital platforms.'\n },\n {\n author: {\n image: 'img/people/author-emily.png',\n name: 'Jane Doe',\n title: 'CTO'\n },\n date: '12/30/2022',\n headline: 'Unleashing Innovation with Headless Websites: The Future of Digital Experiences',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com/article2'\n },\n readingTime: '5 min read',\n tags: [\n 'Innovation',\n 'Headless Websites',\n 'Systemics'\n ],\n teaserText: 'Dive into the exciting world of headless architecture with Systemics. This article explores our Headless Websites service, a playground of innovation and creativity for brands seeking to redefine their digital journey. Discover how our experts leverage headless CMS architecture to provide unparalleled flexibility while maintaining design integrity. We make content distribution dynamic and responsive, tailoring it to users\\' preferences for a seamless journey across devices and platforms.'\n },\n {\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Investing in Digital Excellence: Systemics\\' Design System Trainings',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n url: 'https://example.com/article3'\n },\n readingTime: '5 min read',\n tags: [\n 'Digital Excellence',\n 'Systemics',\n 'Design System Trainings'\n ],\n teaserText: 'Investing in your digital team\\'s growth is crucial for sustainable success. In this article, we highlight Systemics\\' Design System Trainings, designed to equip your team with the skills they need to harness your design system effectively. Understand how our trainings promote collaboration, shared understanding, and continuous learning, ensuring your design system remains an evolving cornerstone of your digital success.'\n }\n ]}\n moreTitle=\"Featured Posts\"\n section={[\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n style: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n style: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n style: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
132
132
|
"args": {
|
|
133
133
|
"section": [
|
|
134
134
|
{
|
|
@@ -261,11 +261,6 @@
|
|
|
261
261
|
"latestTitle": "Latest Post",
|
|
262
262
|
"latest": {
|
|
263
263
|
"date": "12/30/2022",
|
|
264
|
-
"tags": [
|
|
265
|
-
"Design Systems",
|
|
266
|
-
"Headless Websites",
|
|
267
|
-
"Training"
|
|
268
|
-
],
|
|
269
264
|
"headline": "Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality",
|
|
270
265
|
"teaserText": "In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand's digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences. Learn how we transform ideas into tangible results with our Design System Creation service, empowering your brand to communicate effectively across digital platforms.",
|
|
271
266
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -278,17 +273,17 @@
|
|
|
278
273
|
"name": "John Doe",
|
|
279
274
|
"title": "CEO",
|
|
280
275
|
"image": "img/people/author-alex.png"
|
|
281
|
-
}
|
|
276
|
+
},
|
|
277
|
+
"tags": [
|
|
278
|
+
"Design Systems",
|
|
279
|
+
"Headless Websites",
|
|
280
|
+
"Training"
|
|
281
|
+
]
|
|
282
282
|
},
|
|
283
283
|
"listTitle": "Recent Posts",
|
|
284
284
|
"list": [
|
|
285
285
|
{
|
|
286
286
|
"date": "12/30/2022",
|
|
287
|
-
"tags": [
|
|
288
|
-
"tech",
|
|
289
|
-
"tech",
|
|
290
|
-
"tech"
|
|
291
|
-
],
|
|
292
287
|
"headline": "This is a blog post headline",
|
|
293
288
|
"teaserText": "This is a teaser text for the blog post",
|
|
294
289
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -305,11 +300,6 @@
|
|
|
305
300
|
},
|
|
306
301
|
{
|
|
307
302
|
"date": "12/30/2022",
|
|
308
|
-
"tags": [
|
|
309
|
-
"tech",
|
|
310
|
-
"tech",
|
|
311
|
-
"tech"
|
|
312
|
-
],
|
|
313
303
|
"headline": "This is a blog post headline",
|
|
314
304
|
"teaserText": "This is a teaser text for the blog post",
|
|
315
305
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -326,11 +316,6 @@
|
|
|
326
316
|
},
|
|
327
317
|
{
|
|
328
318
|
"date": "12/30/2022",
|
|
329
|
-
"tags": [
|
|
330
|
-
"tech",
|
|
331
|
-
"tech",
|
|
332
|
-
"tech"
|
|
333
|
-
],
|
|
334
319
|
"headline": "This is a blog post headline",
|
|
335
320
|
"teaserText": "This is a teaser text for the blog post",
|
|
336
321
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -350,11 +335,6 @@
|
|
|
350
335
|
"more": [
|
|
351
336
|
{
|
|
352
337
|
"date": "12/30/2022",
|
|
353
|
-
"tags": [
|
|
354
|
-
"Design Systems",
|
|
355
|
-
"Headless Websites",
|
|
356
|
-
"Training"
|
|
357
|
-
],
|
|
358
338
|
"headline": "Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality",
|
|
359
339
|
"teaserText": "In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand's digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences. Learn how we transform ideas into tangible results with our Design System Creation service, empowering your brand to communicate effectively across digital platforms.",
|
|
360
340
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -367,15 +347,15 @@
|
|
|
367
347
|
"name": "John Doe",
|
|
368
348
|
"title": "CEO",
|
|
369
349
|
"image": "img/people/author-alex.png"
|
|
370
|
-
}
|
|
350
|
+
},
|
|
351
|
+
"tags": [
|
|
352
|
+
"Design Systems",
|
|
353
|
+
"Headless Websites",
|
|
354
|
+
"Training"
|
|
355
|
+
]
|
|
371
356
|
},
|
|
372
357
|
{
|
|
373
358
|
"date": "12/30/2022",
|
|
374
|
-
"tags": [
|
|
375
|
-
"Innovation",
|
|
376
|
-
"Headless Websites",
|
|
377
|
-
"Systemics"
|
|
378
|
-
],
|
|
379
359
|
"headline": "Unleashing Innovation with Headless Websites: The Future of Digital Experiences",
|
|
380
360
|
"teaserText": "Dive into the exciting world of headless architecture with Systemics. This article explores our Headless Websites service, a playground of innovation and creativity for brands seeking to redefine their digital journey. Discover how our experts leverage headless CMS architecture to provide unparalleled flexibility while maintaining design integrity. We make content distribution dynamic and responsive, tailoring it to users' preferences for a seamless journey across devices and platforms.",
|
|
381
361
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -388,15 +368,15 @@
|
|
|
388
368
|
"name": "Jane Doe",
|
|
389
369
|
"title": "CTO",
|
|
390
370
|
"image": "img/people/author-emily.png"
|
|
391
|
-
}
|
|
371
|
+
},
|
|
372
|
+
"tags": [
|
|
373
|
+
"Innovation",
|
|
374
|
+
"Headless Websites",
|
|
375
|
+
"Systemics"
|
|
376
|
+
]
|
|
392
377
|
},
|
|
393
378
|
{
|
|
394
379
|
"date": "12/30/2022",
|
|
395
|
-
"tags": [
|
|
396
|
-
"Digital Excellence",
|
|
397
|
-
"Systemics",
|
|
398
|
-
"Design System Trainings"
|
|
399
|
-
],
|
|
400
380
|
"headline": "Investing in Digital Excellence: Systemics' Design System Trainings",
|
|
401
381
|
"teaserText": "Investing in your digital team's growth is crucial for sustainable success. In this article, we highlight Systemics' Design System Trainings, designed to equip your team with the skills they need to harness your design system effectively. Understand how our trainings promote collaboration, shared understanding, and continuous learning, ensuring your design system remains an evolving cornerstone of your digital success.",
|
|
402
382
|
"image": "img/close-up-young-business-team-working.png",
|
|
@@ -409,7 +389,12 @@
|
|
|
409
389
|
"name": "John Doe",
|
|
410
390
|
"title": "CEO",
|
|
411
391
|
"image": "img/people/author-alex.png"
|
|
412
|
-
}
|
|
392
|
+
},
|
|
393
|
+
"tags": [
|
|
394
|
+
"Digital Excellence",
|
|
395
|
+
"Systemics",
|
|
396
|
+
"Design System Trainings"
|
|
397
|
+
]
|
|
413
398
|
}
|
|
414
399
|
],
|
|
415
400
|
"cta": {
|
|
@@ -450,12 +435,12 @@
|
|
|
450
435
|
"args": {
|
|
451
436
|
"head": {
|
|
452
437
|
"date": "12/30/2022",
|
|
438
|
+
"headline": "The Future of AI: A Glimpse into the Unseen",
|
|
439
|
+
"image": "img/close-up-young-business-team-working.png",
|
|
453
440
|
"tags": [
|
|
454
441
|
"Technology",
|
|
455
442
|
"AI"
|
|
456
|
-
]
|
|
457
|
-
"headline": "The Future of AI: A Glimpse into the Unseen",
|
|
458
|
-
"image": "img/close-up-young-business-team-working.png"
|
|
443
|
+
]
|
|
459
444
|
},
|
|
460
445
|
"aside": {
|
|
461
446
|
"author": {
|
|
@@ -641,37 +626,6 @@
|
|
|
641
626
|
},
|
|
642
627
|
"screenshot": "img/screenshots/pages-archetypes--blog-post.png"
|
|
643
628
|
},
|
|
644
|
-
{
|
|
645
|
-
"id": "components-contact--person",
|
|
646
|
-
"group": "Components/Contact",
|
|
647
|
-
"name": "Person",
|
|
648
|
-
"code": "<Contact\n image={{\n alt: 'Picture of Jane Smith',\n src: 'img/people/author-emily.png',\n width: 300\n }}\n links={[\n {\n href: '#',\n icon: 'twitter',\n label: '@jane_smith',\n newTab: false\n },\n {\n href: 'mailto:mail@example.com',\n icon: 'email',\n label: 'jane.smith@example.com',\n newTab: false\n }\n ]}\n name=\"CEO at Company\"\n subtitle=\"Geschäftsführer\"\n title=\"Jane Smith\"\n/>",
|
|
649
|
-
"args": {
|
|
650
|
-
"image": {
|
|
651
|
-
"src": "img/people/author-emily.png",
|
|
652
|
-
"alt": "Picture of Jane Smith",
|
|
653
|
-
"width": 300
|
|
654
|
-
},
|
|
655
|
-
"title": "Jane Smith",
|
|
656
|
-
"subtitle": "Geschäftsführer",
|
|
657
|
-
"links": [
|
|
658
|
-
{
|
|
659
|
-
"icon": "twitter",
|
|
660
|
-
"label": "@jane_smith",
|
|
661
|
-
"href": "#",
|
|
662
|
-
"newTab": false
|
|
663
|
-
},
|
|
664
|
-
{
|
|
665
|
-
"icon": "email",
|
|
666
|
-
"label": "jane.smith@example.com",
|
|
667
|
-
"href": "mailto:mail@example.com",
|
|
668
|
-
"newTab": false
|
|
669
|
-
}
|
|
670
|
-
],
|
|
671
|
-
"name": "CEO at Company"
|
|
672
|
-
},
|
|
673
|
-
"screenshot": "img/screenshots/components-contact--person.png"
|
|
674
|
-
},
|
|
675
629
|
{
|
|
676
630
|
"id": "components-cta--banner",
|
|
677
631
|
"group": "Components/Cta",
|
package/dist/tokens/themes.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Mon, 26 Aug 2024
|
|
3
|
+
* Generated on Mon, 26 Aug 2024 14:46:35 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 Mon, 26 Aug 2024
|
|
2730
|
+
* Generated on Mon, 26 Aug 2024 14:46:39 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 Mon, 26 Aug 2024
|
|
5461
|
+
* Generated on Mon, 26 Aug 2024 14:46:37 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 Mon, 26 Aug 2024
|
|
8462
|
+
* Generated on Mon, 26 Aug 2024 14:46:41 GMT
|
|
8463
8463
|
*/
|
|
8464
8464
|
:root [ks-theme=telekom] {
|
|
8465
8465
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
package/dist/tokens/tokens.css
CHANGED
package/dist/tokens/tokens.js
CHANGED
package/package.json
CHANGED
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
.dsa-contact {
|
|
2
|
-
--dsa-contact--gap: var(--ks-spacing-stack-m) var(--ks-spacing-inline-m);
|
|
3
|
-
--dsa-contact--flex-basis: 150px;
|
|
4
|
-
--dsa-contact__header--gap: 0;
|
|
5
|
-
--dsa-contact__body--gap: var(--ks-spacing-stack-s) var(--ks-spacing-inline-m);
|
|
6
|
-
--dsa-contact__title--color: var(--ks-text-color-display);
|
|
7
|
-
--dsa-contact__title--font: var(--ks-font-display-l);
|
|
8
|
-
--dsa-contact__title--font-weight: var(--dsa-topic--font-weight);
|
|
9
|
-
--dsa-contact__subtitle--color: var(--ks-text-color-copy);
|
|
10
|
-
--dsa-contact__subtitle--font: var(--ks-font-copy-m);
|
|
11
|
-
--dsa-contact__subtitle--font-weight: var(--ks-font-weight-regular);
|
|
12
|
-
--dsa-contact__links--gap: 0;
|
|
13
|
-
--dsa-contact__links--color: var(--dsa-link--color);
|
|
14
|
-
--dsa-contact__links--font: var(--ks-font-interface-s);
|
|
15
|
-
--dsa-contact__links__icon--margin-right: var(--ks-spacing-inline-xs);
|
|
16
|
-
--dsa-contact__links__icon--size: 1.5rem;
|
|
17
|
-
--dsa-contact__links__icon--color: var(--dsa-link--color);
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.dsa-contact {
|
|
21
|
-
display: flex;
|
|
22
|
-
flex-wrap: wrap;
|
|
23
|
-
gap: var(--dsa-contact--gap);
|
|
24
|
-
}
|
|
25
|
-
.dsa-contact > * {
|
|
26
|
-
flex-basis: var(--dsa-contact--flex-basis);
|
|
27
|
-
flex-grow: 1;
|
|
28
|
-
}
|
|
29
|
-
.dsa-contact__body {
|
|
30
|
-
display: flex;
|
|
31
|
-
flex-direction: column;
|
|
32
|
-
gap: var(--dsa-contact__body--gap);
|
|
33
|
-
}
|
|
34
|
-
.dsa-contact__header {
|
|
35
|
-
display: flex;
|
|
36
|
-
flex-direction: column;
|
|
37
|
-
gap: var(--dsa-contact__header--gap);
|
|
38
|
-
}
|
|
39
|
-
.dsa-contact__title {
|
|
40
|
-
font: var(--dsa-contact__title--font);
|
|
41
|
-
color: var(--dsa-contact__title--color);
|
|
42
|
-
font-weight: var(--dsa-contact__title--font-weight);
|
|
43
|
-
}
|
|
44
|
-
.dsa-contact__subtitle {
|
|
45
|
-
font: var(--dsa-contact__subtitle--font);
|
|
46
|
-
color: var(--dsa-contact__subtitle--color);
|
|
47
|
-
font-weight: var(--dsa-contact__subtitle--font-weight);
|
|
48
|
-
}
|
|
49
|
-
.dsa-contact__image {
|
|
50
|
-
text-align: right;
|
|
51
|
-
}
|
|
52
|
-
.dsa-contact__links {
|
|
53
|
-
display: flex;
|
|
54
|
-
flex-direction: column;
|
|
55
|
-
gap: var(--dsa-contact__links--gap);
|
|
56
|
-
font: var(--dsa-contact__links--font);
|
|
57
|
-
list-style: none;
|
|
58
|
-
padding: 0;
|
|
59
|
-
margin: 0;
|
|
60
|
-
}
|
|
61
|
-
.dsa-contact__links .icon {
|
|
62
|
-
width: var(--dsa-contact__links__icon--size);
|
|
63
|
-
height: var(--dsa-contact__links__icon--size);
|
|
64
|
-
color: var(--dsa-contact__links__icon--color);
|
|
65
|
-
margin-right: var(--dsa-contact__links__icon--margin-right);
|
|
66
|
-
}
|
|
67
|
-
.dsa-contact .c-headline {
|
|
68
|
-
--c-headline--color: var(--dsa-contact__headline--color);
|
|
69
|
-
--c-headline--font: var(--dsa-contact__headline--font);
|
|
70
|
-
--c-headline--font-weight: var(--dsa-contact__headline--font-weight);
|
|
71
|
-
--c-headline__subheadline--color: var(--dsa-contact__headline__subheadline--color);
|
|
72
|
-
--c-headline__subheadline--font: var(--dsa-contact__headline__subheadline--font);
|
|
73
|
-
--c-headline__subheadline--font-weight: var(--dsa-contact__headline__subheadline--font-weight);
|
|
74
|
-
}
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
-
"$id": "http://schema.mydesignsystem.com/contact.schema.json",
|
|
4
|
-
"title": "Contact",
|
|
5
|
-
"description": "Component used for user interaction",
|
|
6
|
-
"type": "object",
|
|
7
|
-
"properties": {
|
|
8
|
-
"image": {
|
|
9
|
-
"type": "object",
|
|
10
|
-
"properties": {
|
|
11
|
-
"src": {
|
|
12
|
-
"type": "string",
|
|
13
|
-
"format": "image",
|
|
14
|
-
"title": "Image Source",
|
|
15
|
-
"description": "URL of the image to display",
|
|
16
|
-
"examples": [
|
|
17
|
-
"img/people/author-emily.png"
|
|
18
|
-
]
|
|
19
|
-
},
|
|
20
|
-
"alt": {
|
|
21
|
-
"type": "string",
|
|
22
|
-
"title": "Alt Text",
|
|
23
|
-
"description": "Alt text of the image",
|
|
24
|
-
"examples": [
|
|
25
|
-
"Picture of Jane Smith"
|
|
26
|
-
]
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
"additionalProperties": false
|
|
30
|
-
},
|
|
31
|
-
"title": {
|
|
32
|
-
"title": "Title",
|
|
33
|
-
"description": "Name, company name, etc.",
|
|
34
|
-
"type": "string",
|
|
35
|
-
"examples": [
|
|
36
|
-
"Max Mütze"
|
|
37
|
-
]
|
|
38
|
-
},
|
|
39
|
-
"subtitle": {
|
|
40
|
-
"title": "Subtitle",
|
|
41
|
-
"description": "Position, profession, department, location, etc.",
|
|
42
|
-
"type": "string",
|
|
43
|
-
"examples": [
|
|
44
|
-
"Geschäftsführer"
|
|
45
|
-
]
|
|
46
|
-
},
|
|
47
|
-
"links": {
|
|
48
|
-
"type": "array",
|
|
49
|
-
"items": {
|
|
50
|
-
"type": "object",
|
|
51
|
-
"properties": {
|
|
52
|
-
"icon": {
|
|
53
|
-
"type": "string"
|
|
54
|
-
},
|
|
55
|
-
"label": {
|
|
56
|
-
"type": "string"
|
|
57
|
-
},
|
|
58
|
-
"href": {
|
|
59
|
-
"type": "string",
|
|
60
|
-
"format": "uri"
|
|
61
|
-
},
|
|
62
|
-
"newTab": {
|
|
63
|
-
"title": "Open link in new Tab",
|
|
64
|
-
"description": "Open link in new Tab",
|
|
65
|
-
"type": "boolean",
|
|
66
|
-
"default": false
|
|
67
|
-
}
|
|
68
|
-
},
|
|
69
|
-
"additionalProperties": false
|
|
70
|
-
},
|
|
71
|
-
"examples": [
|
|
72
|
-
[
|
|
73
|
-
{
|
|
74
|
-
"icon": "phone",
|
|
75
|
-
"label": "0228 / 688 966 20",
|
|
76
|
-
"href": "tel:+4922868896620"
|
|
77
|
-
},
|
|
78
|
-
{
|
|
79
|
-
"icon": "email",
|
|
80
|
-
"label": "mail@example.com",
|
|
81
|
-
"href": "mailto:mail@example.com"
|
|
82
|
-
}
|
|
83
|
-
]
|
|
84
|
-
]
|
|
85
|
-
},
|
|
86
|
-
"copy": {
|
|
87
|
-
"title": "Copy text",
|
|
88
|
-
"type": "string"
|
|
89
|
-
},
|
|
90
|
-
"className": {
|
|
91
|
-
"title": "Class",
|
|
92
|
-
"description": "Additional css classes attached to the wrapping element",
|
|
93
|
-
"type": "string"
|
|
94
|
-
},
|
|
95
|
-
"component": {
|
|
96
|
-
"title": "`ks-component` attribute",
|
|
97
|
-
"description": "Optional custom component identifier",
|
|
98
|
-
"type": "string"
|
|
99
|
-
},
|
|
100
|
-
"type": {
|
|
101
|
-
"const": "contact"
|
|
102
|
-
}
|
|
103
|
-
},
|
|
104
|
-
"additionalProperties": false,
|
|
105
|
-
"required": [
|
|
106
|
-
"name"
|
|
107
|
-
]
|
|
108
|
-
}
|
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
-
"$id": "http://schema.mydesignsystem.com/contact.schema.json",
|
|
4
|
-
"title": "Contact",
|
|
5
|
-
"description": "Component used for user interaction",
|
|
6
|
-
"type": "object",
|
|
7
|
-
"properties": {
|
|
8
|
-
"image": {
|
|
9
|
-
"type": "object",
|
|
10
|
-
"properties": {
|
|
11
|
-
"src": {
|
|
12
|
-
"type": "string",
|
|
13
|
-
"format": "image",
|
|
14
|
-
"title": "Image Source",
|
|
15
|
-
"description": "URL of the image to display",
|
|
16
|
-
"examples": ["img/people/author-emily.png"]
|
|
17
|
-
},
|
|
18
|
-
"alt": {
|
|
19
|
-
"type": "string",
|
|
20
|
-
"title": "Alt Text",
|
|
21
|
-
"description": "Alt text of the image",
|
|
22
|
-
"examples": ["Picture of Jane Smith"]
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
"title": {
|
|
27
|
-
"title": "Title",
|
|
28
|
-
"description": "Name, company name, etc.",
|
|
29
|
-
"type": "string",
|
|
30
|
-
"examples": ["Max Mütze"]
|
|
31
|
-
},
|
|
32
|
-
"subtitle": {
|
|
33
|
-
"title": "Subtitle",
|
|
34
|
-
"description": "Position, profession, department, location, etc.",
|
|
35
|
-
"type": "string",
|
|
36
|
-
"examples": ["Geschäftsführer"]
|
|
37
|
-
},
|
|
38
|
-
"links": {
|
|
39
|
-
"type": "array",
|
|
40
|
-
"items": {
|
|
41
|
-
"type": "object",
|
|
42
|
-
"properties": {
|
|
43
|
-
"icon": {
|
|
44
|
-
"type": "string"
|
|
45
|
-
},
|
|
46
|
-
"label": {
|
|
47
|
-
"type": "string"
|
|
48
|
-
},
|
|
49
|
-
"href": {
|
|
50
|
-
"type": "string",
|
|
51
|
-
"format": "uri"
|
|
52
|
-
},
|
|
53
|
-
"newTab": {
|
|
54
|
-
"title": "Open link in new Tab",
|
|
55
|
-
"description": "Open link in new Tab",
|
|
56
|
-
"type": "boolean",
|
|
57
|
-
"default": false
|
|
58
|
-
}
|
|
59
|
-
},
|
|
60
|
-
"additionalProperties": false
|
|
61
|
-
},
|
|
62
|
-
"examples": [
|
|
63
|
-
[
|
|
64
|
-
{
|
|
65
|
-
"icon": "phone",
|
|
66
|
-
"label": "0228 / 688 966 20",
|
|
67
|
-
"href": "tel:+4922868896620"
|
|
68
|
-
},
|
|
69
|
-
{
|
|
70
|
-
"icon": "email",
|
|
71
|
-
"label": "mail@example.com",
|
|
72
|
-
"href": "mailto:mail@example.com"
|
|
73
|
-
}
|
|
74
|
-
]
|
|
75
|
-
]
|
|
76
|
-
},
|
|
77
|
-
"copy": {
|
|
78
|
-
"title": "Copy text",
|
|
79
|
-
"type": "string"
|
|
80
|
-
},
|
|
81
|
-
"className": {
|
|
82
|
-
"title": "Class",
|
|
83
|
-
"description": "Additional css classes attached to the wrapping element",
|
|
84
|
-
"type": "string"
|
|
85
|
-
},
|
|
86
|
-
"component": {
|
|
87
|
-
"title": "`ks-component` attribute",
|
|
88
|
-
"description": "Optional custom component identifier",
|
|
89
|
-
"type": "string"
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
"additionalProperties": false,
|
|
93
|
-
"required": ["name"]
|
|
94
|
-
}
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { HTMLAttributes } from "react";
|
|
3
|
-
/* eslint-disable */
|
|
4
|
-
/**
|
|
5
|
-
* This file was automatically generated by json-schema-to-typescript.
|
|
6
|
-
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
7
|
-
* and run json-schema-to-typescript to regenerate this file.
|
|
8
|
-
*/
|
|
9
|
-
/**
|
|
10
|
-
* URL of the image to display
|
|
11
|
-
*/
|
|
12
|
-
type ImageSource = string;
|
|
13
|
-
/**
|
|
14
|
-
* Alt text of the image
|
|
15
|
-
*/
|
|
16
|
-
type AltText = string;
|
|
17
|
-
/**
|
|
18
|
-
* Name, company name, etc.
|
|
19
|
-
*/
|
|
20
|
-
type Title = string;
|
|
21
|
-
/**
|
|
22
|
-
* Position, profession, department, location, etc.
|
|
23
|
-
*/
|
|
24
|
-
type Subtitle = string;
|
|
25
|
-
/**
|
|
26
|
-
* Open link in new Tab
|
|
27
|
-
*/
|
|
28
|
-
type OpenLinkInNewTab = boolean;
|
|
29
|
-
type CopyText = string;
|
|
30
|
-
/**
|
|
31
|
-
* Additional css classes attached to the wrapping element
|
|
32
|
-
*/
|
|
33
|
-
type Class = string;
|
|
34
|
-
/**
|
|
35
|
-
* Optional custom component identifier
|
|
36
|
-
*/
|
|
37
|
-
type KsComponentAttribute = string;
|
|
38
|
-
/**
|
|
39
|
-
* Component used for user interaction
|
|
40
|
-
*/
|
|
41
|
-
interface ContactProps {
|
|
42
|
-
image?: {
|
|
43
|
-
src?: ImageSource;
|
|
44
|
-
alt?: AltText;
|
|
45
|
-
};
|
|
46
|
-
title?: Title;
|
|
47
|
-
subtitle?: Subtitle;
|
|
48
|
-
links?: {
|
|
49
|
-
icon?: string;
|
|
50
|
-
label?: string;
|
|
51
|
-
href?: string;
|
|
52
|
-
newTab?: OpenLinkInNewTab;
|
|
53
|
-
}[];
|
|
54
|
-
copy?: CopyText;
|
|
55
|
-
className?: Class;
|
|
56
|
-
component?: KsComponentAttribute;
|
|
57
|
-
}
|
|
58
|
-
declare const Contact: import("react").ForwardRefExoticComponent<ContactProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
59
|
-
export { Contact };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import "./contact.css";
|
|
2
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { forwardRef } from 'react';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { Picture } from '@kickstartds/base/lib/picture';
|
|
6
|
-
import { Link } from '@kickstartds/base/lib/link';
|
|
7
|
-
import { Icon } from '@kickstartds/base/lib/icon';
|
|
8
|
-
import { RichText } from '@kickstartds/base/lib/rich-text';
|
|
9
|
-
|
|
10
|
-
const Contact = forwardRef(({ title, subtitle, image, links, copy, className, ...props }, ref) => (jsxs("address", { className: classnames("dsa-contact", className), ref: ref, ...props, children: [image && image.src ? (jsx("div", { className: "dsa-contact__image", children: jsx(Picture, { ...image }) })) : (""), jsxs("div", { className: "dsa-contact__body", children: [title && (jsxs("div", { className: "dsa-contact__header", children: [jsx("span", { className: "dsa-contact__title", children: title }), jsx("span", { className: "dsa-contact__subtitle", children: subtitle })] })), links.length ? (jsx("ul", { className: "dsa-contact__links", children: links.map(({ icon, href, label, newTab }, i) => (jsx("li", { children: jsxs(Link, { className: "dsa-contact__link", href: href, ...(newTab ? { target: "_blank", rel: "noopener" } : {}), children: [jsx(Icon, { icon: icon }), label] }) }, i))) })) : (""), copy && jsx(RichText, { text: copy, className: "dsa-contact__copy" })] })] })));
|
|
11
|
-
Contact.displayName = "Contact";
|
|
12
|
-
|
|
13
|
-
export { Contact };
|