@kickstartds/ds-agency-premium 1.5.6 → 1.5.8

package/dist/{BlogPostProps-d9decb7c.d.ts → BlogPostProps-6b3cff22.d.ts}

@@ -6,7 +6,7 @@
 import { BlogHeadProps } from "./BlogHeadProps-3f6e4072.js";
 import { BlogAsideProps } from "./BlogAsideProps-d9decb7c.js";
 import { SectionProps } from "./SectionProps-83d399b4.js";
-import { ContactProps } from "./ContactProps-68c71984.js";
+import { CtaProps } from "./CtaProps-93230a76.js";
 import { SeoProps } from "./SeoProps-f2d6dcaa.js";
 /**
  * Body text for the blog post, overwrites sections if present
@@ -31,9 +31,9 @@ interface BlogPostProps {
     content?: Text;
     section?: BlogSections;
     /**
-     * Referenced component ContactProps
+     * Referenced component CtaProps
      */
-    contact?: ContactProps;
+    cta?: CtaProps;
     /**
      * Referenced component SeoProps
      */

package/dist/components/blog-aside/blog-aside.css

@@ -8,6 +8,7 @@
   --dsa-blog-aside__author__title--font: var(--ks-font-copy-m);
   --dsa-blog-aside__author__subtitle--font: var(--ks-font-copy-s);
   --dsa-blog-aside__author__image--flex-basis: 120px;
+  --dsa-blog-aside__author__body--flex-basis: 240px;
   --dsa-blog-aside__author__link--font: var(--ks-font-interface-s);
   --dsa-blog-aside__meta__item--font: var(--ks-font-interface-s);
   --dsa-blog-aside__meta__item--color: var(--ks-text-color-interface);
@@ -16,8 +17,9 @@
   --dsa-blog-aside__sharebar__link--color: var(--dsa-link--color);
   --dsa-blog-aside__sharebar__link--color_hover: var(--dsa-link--color_hover);
 }
-@container blog-aside (min-width: 640px) {
+@container blog-aside (min-width: 500px) {
   .dsa-blog-aside {
+    --dsa-blog-aside__author__image--flex-basis: 180px;
     --dsa-blog-aside__author__title--font: var(--ks-font-copy-l);
     --dsa-blog-aside__author__subtitle--font: var(--ks-font-copy-m);
     --dsa-blog-aside__author__link--font: var(--ks-font-interface-m);
@@ -40,6 +42,7 @@
   --dsa-contact--gap-vertical: var(--dsa-blog-asde__author--gap-vertical, var(--ks-spacing-stack-xs));
   --dsa-contact--gap-horizontal: var(--dsa-blog-asde__author--gap-horizontal, var(--ks-spacing-inline-xs));
   --dsa-contact__image--flex-basis: var(--dsa-blog-aside__author__image--flex-basis, 200px);
+  --dsa-contact__body--flex-basis: var(--dsa-blog-aside__author__body--flex-basis, 300px);
   --dsa-contact__title--font: var(--dsa-blog-aside__author__title--font, var(--ks-font-copy-m));
   --dsa-contact__subtitle--font: var(--dsa-blog-aside__author__subtitle--font, var(--ks-font-copy-s));
   --dsa-contact__link--font: var(--dsa-blog-aside__author__link--font, var(--ks-font-interface-s));

package/dist/components/blog-post/blog-post.schema.dereffed.json

@@ -3368,130 +3368,166 @@
         "required": []
       }
     },
-    "contact": {
+    "cta": {
       "$schema": "http://json-schema.org/draft-07/schema#",
-      "$id": "http://schema.mydesignsystem.com/contact.schema.json",
-      "title": "Contact",
-      "description": "Component used for user interaction",
+      "$id": "http://schema.mydesignsystem.com/cta.schema.json",
+      "title": "Cta",
       "type": "object",
       "properties": {
-        "image": {
-          "type": "object",
-          "properties": {
-            "src": {
-              "type": "string",
-              "format": "image",
-              "title": "Image Source",
-              "description": "URL of the image to display",
-              "examples": [
-                "img/people/author-emily.png"
-              ]
-            },
-            "alt": {
-              "type": "string",
-              "title": "Alt Text",
-              "description": "Alt text of the image",
-              "examples": [
-                "Picture of Jane Smith"
-              ]
-            },
-            "fullWidth": {
-              "type": "boolean",
-              "title": "Full Width",
-              "description": "Image uses all the horizontal space vailable",
-              "default": false
-            },
-            "aspectRatio": {
-              "type": "string",
-              "title": "aspectRatio",
-              "description": "Aspect Ratio of the Images",
-              "enum": [
-                "wide",
-                "square",
-                "vertical"
-              ],
-              "default": "square"
-            }
-          },
-          "additionalProperties": false
-        },
-        "title": {
-          "title": "Title",
-          "description": "Name, company name, etc.",
+        "headline": {
+          "title": "Component Headline",
+          "description": "Headline for the Component element",
           "type": "string",
+          "format": "markdown",
           "examples": [
-            "Jane Smith"
+            "Headline"
           ]
         },
-        "subtitle": {
-          "title": "Subtitle",
-          "description": "Position, profession, department, location, etc.",
+        "sub": {
+          "title": "Component Subheadline",
+          "description": "Subheadline below the component headline",
           "type": "string",
+          "format": "markdown",
           "examples": [
-            "CEO at Company"
+            "Subheadline"
           ]
         },
-        "links": {
+        "text": {
+          "title": "Component Text",
+          "description": "Info text for the component element",
+          "type": "string",
+          "format": "markdown"
+        },
+        "highlightText": {
+          "type": "boolean",
+          "title": "Highlight Text",
+          "description": "Visually highlight the text",
+          "default": false
+        },
+        "colorNeutral": {
+          "title": "Color Neutral",
+          "description": "Make the text and buttons color neutral",
+          "default": false,
+          "type": "boolean"
+        },
+        "fullWidth": {
+          "title": "Width",
+          "description": "Set the width of the content to the full width of the element",
+          "type": "boolean",
+          "default": false
+        },
+        "buttons": {
           "type": "array",
           "items": {
+            "title": "Button",
             "type": "object",
             "properties": {
-              "icon": {
-                "type": "string"
-              },
               "label": {
-                "type": "string"
+                "type": "string",
+                "title": "Label",
+                "description": "Text content to display inside the button",
+                "examples": [
+                  "Book a meeting"
+                ]
               },
-              "href": {
+              "icon": {
                 "type": "string",
-                "format": "uri"
+                "title": "Icon",
+                "description": "Choose an icon"
               },
-              "newTab": {
-                "title": "Open link in new Tab",
-                "description": "Open link in new Tab",
-                "type": "boolean",
-                "default": false
+              "target": {
+                "type": "string",
+                "title": "Target",
+                "description": "Target that should be linked, makes the button behave like a link semantically",
+                "format": "uri"
               }
             },
             "additionalProperties": false
+          }
+        },
+        "backgroundColor": {
+          "title": "Background color",
+          "description": "Background color for the whole element",
+          "type": "string",
+          "format": "color"
+        },
+        "backgroundImage": {
+          "title": "Background image",
+          "description": "Background image for the whole element",
+          "type": "string",
+          "format": "image"
+        },
+        "image": {
+          "title": "Image",
+          "description": "Image displayed alongside the text content",
+          "type": "object",
+          "properties": {
+            "src": {
+              "title": "Image source",
+              "description": "Image source to use",
+              "type": "string",
+              "format": "image"
+            },
+            "padding": {
+              "title": "Padding",
+              "description": "Toggle padding of the image",
+              "type": "boolean",
+              "default": true
+            },
+            "alt": {
+              "title": "Alt text",
+              "description": "Image description",
+              "type": "string"
+            }
           },
-          "examples": [
-            [
-              {
-                "icon": "phone",
-                "label": "0228 / 688 966 20",
-                "href": "tel:+4922868896620"
-              },
-              {
-                "icon": "email",
-                "label": "mail@example.com",
-                "href": "mailto:mail@example.com"
-              }
-            ]
-          ]
+          "additionalProperties": false
         },
-        "copy": {
-          "title": "Copy text",
-          "type": "string"
+        "order": {
+          "title": "Order",
+          "description": "Choose what comes first on mobile and desktop: image or text",
+          "type": "object",
+          "properties": {
+            "mobileImageLast": {
+              "title": "Mobile image after text",
+              "description": "Switch to displaying the image after the text on mobile",
+              "type": "boolean",
+              "default": false
+            },
+            "desktopImageLast": {
+              "title": "Desktop image after text",
+              "description": "Switch to displaying the image after the text on desktop",
+              "type": "boolean",
+              "default": true
+            }
+          },
+          "additionalProperties": false
         },
-        "className": {
-          "title": "Class",
-          "description": "Additional css classes attached to the wrapping element",
-          "type": "string"
+        "textAlign": {
+          "title": "Text Alignment",
+          "description": "Choose the alginment of the text",
+          "enum": [
+            "left",
+            "center"
+          ],
+          "type": "string",
+          "default": "left"
         },
-        "component": {
-          "title": "`ks-component` attribute",
-          "description": "Optional custom component identifier",
-          "type": "string"
+        "contentAlign": {
+          "title": "Vertical alignment of the content",
+          "description": "Select a vertical alignment for the image",
+          "type": "string",
+          "enum": [
+            "center",
+            "top",
+            "bottom"
+          ],
+          "default": "center"
         },
         "type": {
-          "const": "contact"
+          "const": "cta"
         }
       },
-      "additionalProperties": false,
-      "required": [
-        "name"
-      ]
+      "additionalProperties": false
     },
     "seo": {
       "$schema": "http://json-schema.org/draft-07/schema#",

package/dist/components/blog-post/blog-post.schema.json

@@ -26,8 +26,8 @@
         "$ref": "http://schema.mydesignsystem.com/section.schema.json"
       }
     },
-    "contact": {
-      "$ref": "http://schema.mydesignsystem.com/contact.schema.json"
+    "cta": {
+      "$ref": "http://schema.mydesignsystem.com/cta.schema.json"
     },
     "seo": {
       "$ref": "http://schema.mydesignsystem.com/cms/seo.schema.json"

package/dist/components/blog-post/index.d.ts

@@ -1,4 +1,4 @@
-import { BlogPostProps } from "../../BlogPostProps-d9decb7c.js";
+import { BlogPostProps } from "../../BlogPostProps-6b3cff22.js";
 import { FC, PropsWithChildren } from "react";
 declare const BlogPost: FC<PropsWithChildren<BlogPostProps>>;
 export { BlogPost };

package/dist/components/blog-post/index.js

@@ -4,8 +4,7 @@ import { BlogHead } from '../blog-head/index.js';
 import { Section } from '../section/index.js';
 import { BlogAside } from '../blog-aside/index.js';
 import { Text } from '../text/index.js';
-import { Contact } from '../contact/index.js';
-import { Divider } from '@kickstartds/base/lib/divider';
+import { Cta } from '../cta/index.js';
 import 'classnames';
 import 'react';
 import '@kickstartds/blog/lib/post-head';
@@ -17,6 +16,7 @@ import '@kickstartds/blog/lib/post-meta';
 import '@kickstartds/blog/lib/post-share-bar';
 import '@kickstartds/core/lib/container';
 import '../blog-author/index.js';
+import '../contact/index.js';
 import '@kickstartds/base/lib/picture';
 import '@kickstartds/base/lib/contact';
 import '@kickstartds/base/lib/link';
@@ -25,8 +25,12 @@ import '@kickstartds/base/lib/rich-text';
 import '../headline/index.js';
 import 'markdown-to-jsx';
 import '@kickstartds/base/lib/headline';
+import '@kickstartds/content/lib/storytelling';
+import '@kickstartds/base/lib/button';
+import '../button-group/index.js';
+import '@kickstartds/base/lib/button-group';
 
-const BlogPost = ({ head, content, aside, contact, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsxs(Split, { mainSectionWidth: "narrow", layout: "sidebarRight", children: [jsxs("div", { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), jsx(BlogAside, { ...aside })] }) }), contact && (jsxs(Fragment, { children: [jsx(Section, { spaceAfter: "none", spaceBefore: "none", children: jsx(Divider, {}) }), jsx(Section, { content: { mode: "list" }, children: jsx(Contact, { ...contact }) })] }))] }));
+const BlogPost = ({ head, content, aside, cta, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsxs(Split, { mainSectionWidth: "narrow", layout: "sidebarRight", children: [jsxs("div", { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), jsx(BlogAside, { ...aside })] }) }), cta && (jsx(Fragment, { children: jsx(Section, { spaceAfter: "none", spaceBefore: "none", content: { mode: "list" }, children: jsx(Cta, { ...cta }) }) }))] }));
 BlogPost.displayName = "BlogPost";
 
 export { BlogPost };

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

@@ -1,6 +1,70 @@
 /// <reference types="react" />
 import { HTMLAttributes, FC, PropsWithChildren } from "react";
-import { ContactProps } from "../../ContactProps-68c71984.js";
+/* eslint-disable */
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+/**
+ * URL of the image to display
+ */
+type ImageSource = string;
+/**
+ * Alt text of the image
+ */
+type AltText = string;
+/**
+ * Image uses all the horizontal space vailable
+ */
+type FullWidth = boolean;
+/**
+ * Aspect Ratio of the Images
+ */
+type AspectRatio = "wide" | "square" | "vertical";
+/**
+ * Name, company name, etc.
+ */
+type Title = string;
+/**
+ * Position, profession, department, location, etc.
+ */
+type Subtitle = string;
+/**
+ * Open link in new Tab
+ */
+type OpenLinkInNewTab = boolean;
+type CopyText = string;
+/**
+ * Additional css classes attached to the wrapping element
+ */
+type Class = string;
+/**
+ * Optional custom component identifier
+ */
+type KsComponentAttribute = string;
+/**
+ * Component used for user interaction
+ */
+interface ContactProps {
+    image?: {
+        src?: ImageSource;
+        alt?: AltText;
+        fullWidth?: FullWidth;
+        aspectRatio?: AspectRatio;
+    };
+    title?: Title;
+    subtitle?: Subtitle;
+    links?: {
+        icon?: string;
+        label?: string;
+        href?: string;
+        newTab?: OpenLinkInNewTab;
+    }[];
+    copy?: CopyText;
+    className?: Class;
+    component?: KsComponentAttribute;
+}
 declare const ContactContextDefault: import("react").ForwardRefExoticComponent<ContactProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
 declare const ContactContext: import("react").Context<import("react").ForwardRefExoticComponent<ContactProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>>;
 declare const Contact: import("react").ForwardRefExoticComponent<ContactProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/contact/index.js

@@ -9,7 +9,7 @@ import { Icon } from '@kickstartds/base/lib/icon';
 import { RichText } from '@kickstartds/base/lib/rich-text';
 import { Container } from '@kickstartds/core/lib/container';
 
-const ContactContextDefault = forwardRef(({ title, subtitle, image, links, copy, className, ...props }, ref) => (jsx(Container, { name: "contact", children: jsxs("address", { className: classnames("dsa-contact", image?.aspectRatio && `dsa-contact--image-${image?.aspectRatio}`, image?.fullWidth && `dsa-contact--image-full-width`, className), ref: ref, ...props, children: [image && image.src ? (jsx("div", { className: "dsa-contact__image-wrap", children: jsx(Picture, { ...image, className: "dsa-contact__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 })] })), copy && jsx(RichText, { text: copy, className: "dsa-contact__copy" }), links && 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))) })) : ("")] })] }) })));
+const ContactContextDefault = forwardRef(({ title, subtitle, image, links, copy, className, ...props }, ref) => (jsx(Container, { name: "contact", children: jsxs("address", { className: classnames("dsa-contact", image?.aspectRatio && `dsa-contact--image-${image?.aspectRatio}`, image?.fullWidth && `dsa-contact--image-full-width`, className), ref: ref, ...props, children: [image && image.src ? (jsx("div", { className: "dsa-contact__image-wrap", children: jsx(Picture, { src: image?.src, alt: image?.alt, className: "dsa-contact__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 })] })), copy && jsx(RichText, { text: copy, className: "dsa-contact__copy" }), links && 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))) })) : ("")] })] }) })));
 const ContactContext = createContext(ContactContextDefault);
 const Contact = forwardRef((props, ref) => {
     const Component = useContext(ContactContext);

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

@@ -24,7 +24,7 @@ interface SettingsProps {
      */
     seo: SeoProps;
 }
-export * from "../../BlogPostProps-d9decb7c.js";
+export * from "../../BlogPostProps-6b3cff22.js";
 export * from "../../BlogOverviewProps-9f207f1c.js";
 export * from "../../PageProps-aa29c554.js";
 export { SettingsProps };

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:03 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:37 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);

package/dist/components/presets.json

@@ -461,7 +461,7 @@
     "id": "pages-archetypes--blog-post",
     "group": "Pages/Archetypes",
     "name": "BlogPost",
-    "code": "<BlogPost\n  aside={{\n    author: {\n      byline: 'Senior Developer',\n      email: 'Jane.doe@example.com',\n      image: {\n        alt: 'Picture of Jane Smith',\n        aspectRatio: 'square',\n        fullWidth: false,\n        src: 'img/people/author-emily.png'\n      },\n      links: [\n        {\n          href: 'tel:+4922868896620',\n          icon: 'phone',\n          label: '0228 / 688 966 20',\n          newTab: false\n        },\n        {\n          href: 'mailto:mail@example.com',\n          icon: 'email',\n          label: 'mail@example.com',\n          newTab: false\n        }\n      ],\n      name: 'Jane Doe',\n      twitter: 'Janedoe'\n    },\n    date: '12/30/2022',\n    readingTime: '5 min read',\n    socialSharing: [\n      {\n        href: 'https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog',\n        icon: 'twitter',\n        title: 'Share on Twitter'\n      },\n      {\n        href: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline',\n        icon: 'linkedin',\n        title: 'Share on LinkedIn'\n      }\n    ]\n  }}\n  contact={{\n    copy: 'Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences.',\n    image: {\n      alt: 'Picture of Jane Smith',\n      aspectRatio: 'vertical',\n      fullWidth: false,\n      src: 'img/people/contact-john.png'\n    },\n    links: [\n      {\n        href: 'mailto:mail@example.com',\n        icon: 'xing',\n        label: 'john.smith',\n        newTab: false\n      },\n      {\n        href: '#',\n        icon: 'twitter',\n        label: '@john_smith',\n        newTab: false\n      }\n    ],\n    subtitle: 'Sales Representative',\n    title: 'John Smith'\n  }}\n  content=\"\n## Introduction\nThe future of **Artificial Intelligence (AI)** is a topic that has been the subject of much debate. It's a field that's constantly evolving, with new advancements and breakthroughs happening all the time. [Learn more about AI](https://en.wikipedia.org/wiki/Artificial_intelligence)\n\n## The Current State of AI\nToday, AI is already a part of our daily lives. From *smart home devices* to *recommendation algorithms* on our favorite streaming services, AI is everywhere.\n\n## The Potential of AI\nThe potential of AI is immense. It has the ability to revolutionize industries, from healthcare to finance, and everything in between.\n\n## The Challenges of AI\nHowever, with great potential comes great challenges. Issues such as data privacy and the ethical implications of AI are just some of the hurdles that need to be overcome.\n\n## The Role of AI in Society\nAI has the potential to greatly impact society. It can lead to job creation in new industries, and can also help solve complex societal problems.\n\n## Conclusion\nThe future of AI is exciting and full of potential. However, it's important that we navigate this future with caution, ensuring that the benefits of AI are accessible to all, while minimizing its potential risks.\n          \"\n  head={{\n    date: '12/30/2022',\n    headline: 'The Future of AI: A Glimpse into the Unseen',\n    image: 'img/close-up-young-business-team-working.png',\n    tags: [\n      {\n        entry: 'Technology'\n      },\n      {\n        entry: 'AI'\n      }\n    ]\n  }}\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/>",
+    "code": "<BlogPost\n  aside={{\n    author: {\n      byline: 'Senior Developer',\n      email: 'Jane.doe@example.com',\n      image: {\n        alt: 'Picture of Jane Smith',\n        aspectRatio: 'square',\n        fullWidth: false,\n        src: 'img/people/author-emily.png'\n      },\n      links: [\n        {\n          href: 'tel:+4922868896620',\n          icon: 'phone',\n          label: '0228 / 688 966 20',\n          newTab: false\n        },\n        {\n          href: 'mailto:mail@example.com',\n          icon: 'email',\n          label: 'mail@example.com',\n          newTab: false\n        }\n      ],\n      name: 'Jane Doe',\n      twitter: 'Janedoe'\n    },\n    date: '12/30/2022',\n    readingTime: '5 min read',\n    socialSharing: [\n      {\n        href: 'https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog',\n        icon: 'twitter',\n        title: 'Share on Twitter'\n      },\n      {\n        href: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline',\n        icon: 'linkedin',\n        title: 'Share on LinkedIn'\n      }\n    ]\n  }}\n  contact={{\n    copy: 'Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences.',\n    image: {\n      alt: 'Picture of Jane Smith',\n      aspectRatio: 'vertical',\n      fullWidth: false,\n      src: 'img/people/contact-john.png'\n    },\n    links: [\n      {\n        href: 'mailto:mail@example.com',\n        icon: 'xing',\n        label: 'john.smith',\n        newTab: false\n      },\n      {\n        href: '#',\n        icon: 'twitter',\n        label: '@john_smith',\n        newTab: false\n      }\n    ],\n    subtitle: 'Sales Representative',\n    title: 'John Smith'\n  }}\n  content=\"\n## Introduction\nThe future of **Artificial Intelligence (AI)** is a topic that has been the subject of much debate. It's a field that's constantly evolving, with new advancements and breakthroughs happening all the time. [Learn more about AI](https://en.wikipedia.org/wiki/Artificial_intelligence)\n\n## The Current State of AI\nToday, AI is already a part of our daily lives. From *smart home devices* to *recommendation algorithms* on our favorite streaming services, AI is everywhere.\n\n## The Potential of AI\nThe potential of AI is immense. It has the ability to revolutionize industries, from healthcare to finance, and everything in between.\n\n## The Challenges of AI\nHowever, with great potential comes great challenges. Issues such as data privacy and the ethical implications of AI are just some of the hurdles that need to be overcome.\n\n## The Role of AI in Society\nAI has the potential to greatly impact society. It can lead to job creation in new industries, and can also help solve complex societal problems.\n\n## Conclusion\nThe future of AI is exciting and full of potential. However, it's important that we navigate this future with caution, ensuring that the benefits of AI are accessible to all, while minimizing its potential risks.\n          \"\n  cta={{\n    buttons: [\n      {\n        icon: 'person',\n        label: 'Contact Us',\n        target: '#'\n      },\n      {\n        icon: 'date',\n        label: 'Learn More',\n        target: '#'\n      }\n    ],\n    colorNeutral: false,\n    contentAlign: 'center',\n    fullWidth: false,\n    headline: 'Ready to Transform Your Development Process?',\n    highlightText: false,\n    image: {\n      padding: true\n    },\n    order: {\n      desktopImageLast: true,\n      mobileImageLast: false\n    },\n    sub: 'Start your journey today.',\n    text: 'Get started with our design system today and experience a new level of efficiency and consistency in your projects.',\n    textAlign: 'center'\n  }}\n  head={{\n    date: '12/30/2022',\n    headline: 'The Future of AI: A Glimpse into the Unseen',\n    image: 'img/close-up-young-business-team-working.png',\n    tags: [\n      {\n        entry: 'Technology'\n      },\n      {\n        entry: 'AI'\n      }\n    ]\n  }}\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/>",
     "args": {
       "head": {
         "date": "12/30/2022",
@@ -646,6 +646,36 @@
           ]
         }
       ],
+      "cta": {
+        "headline": "Ready to Transform Your Development Process?",
+        "sub": "Start your journey today.",
+        "highlightText": false,
+        "colorNeutral": false,
+        "fullWidth": false,
+        "buttons": [
+          {
+            "label": "Contact Us",
+            "target": "#",
+            "icon": "person"
+          },
+          {
+            "label": "Learn More",
+            "target": "#",
+            "icon": "date"
+          }
+        ],
+        "image": {
+          "padding": true
+        },
+        "order": {
+          "mobileImageLast": false,
+          "desktopImageLast": true
+        },
+        "textAlign": "center",
+        "contentAlign": "center",
+        "text": "Get started with our design system today and experience a new level of efficiency and consistency in your projects."
+      },
+      "content": "\n## Introduction\nThe future of **Artificial Intelligence (AI)** is a topic that has been the subject of much debate. It's a field that's constantly evolving, with new advancements and breakthroughs happening all the time. [Learn more about AI](https://en.wikipedia.org/wiki/Artificial_intelligence)\n\n## The Current State of AI\nToday, AI is already a part of our daily lives. From *smart home devices* to *recommendation algorithms* on our favorite streaming services, AI is everywhere.\n\n## The Potential of AI\nThe potential of AI is immense. It has the ability to revolutionize industries, from healthcare to finance, and everything in between.\n\n## The Challenges of AI\nHowever, with great potential comes great challenges. Issues such as data privacy and the ethical implications of AI are just some of the hurdles that need to be overcome.\n\n## The Role of AI in Society\nAI has the potential to greatly impact society. It can lead to job creation in new industries, and can also help solve complex societal problems.\n\n## Conclusion\nThe future of AI is exciting and full of potential. However, it's important that we navigate this future with caution, ensuring that the benefits of AI are accessible to all, while minimizing its potential risks.\n          ",
       "contact": {
         "image": {
           "src": "img/people/contact-john.png",
@@ -670,8 +700,7 @@
           }
         ],
         "copy": "Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences."
-      },
-      "content": "\n## Introduction\nThe future of **Artificial Intelligence (AI)** is a topic that has been the subject of much debate. It's a field that's constantly evolving, with new advancements and breakthroughs happening all the time. [Learn more about AI](https://en.wikipedia.org/wiki/Artificial_intelligence)\n\n## The Current State of AI\nToday, AI is already a part of our daily lives. From *smart home devices* to *recommendation algorithms* on our favorite streaming services, AI is everywhere.\n\n## The Potential of AI\nThe potential of AI is immense. It has the ability to revolutionize industries, from healthcare to finance, and everything in between.\n\n## The Challenges of AI\nHowever, with great potential comes great challenges. Issues such as data privacy and the ethical implications of AI are just some of the hurdles that need to be overcome.\n\n## The Role of AI in Society\nAI has the potential to greatly impact society. It can lead to job creation in new industries, and can also help solve complex societal problems.\n\n## Conclusion\nThe future of AI is exciting and full of potential. However, it's important that we navigate this future with caution, ensuring that the benefits of AI are accessible to all, while minimizing its potential risks.\n          "
+      }
     },
     "screenshot": "img/screenshots/pages-archetypes--blog-post.png"
   },

package/dist/tokens/themes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:06 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:40 GMT
  */
 :root [ks-theme=business] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -2727,7 +2727,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:10 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:43 GMT
  */
 :root [ks-theme=google] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -5458,7 +5458,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:08 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:41 GMT
  */
 :root [ks-theme=ngo] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -8459,7 +8459,7 @@
 }
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:13 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:45 GMT
  */
 :root [ks-theme=telekom] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);

package/dist/tokens/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:03 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:37 GMT
  */
 
 :root, [ks-theme] {

package/dist/tokens/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 04 Sep 2024 07:52:04 GMT
+ * Generated on Wed, 04 Sep 2024 09:41:38 GMT
  */
 
 export const KsBackgroundColorAccentBase = "#230a2b";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kickstartds/ds-agency-premium",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "",
   "homepage": "https://github.com/kickstartDS/ds-agency-premium#readme",
   "bugs": {

package/dist/ContactProps-68c71984.d.ts

@@ -1,65 +0,0 @@
-/**
- * This file was automatically generated by json-schema-to-typescript.
- * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
- * and run json-schema-to-typescript to regenerate this file.
- */
-/**
- * URL of the image to display
- */
-type ImageSource = string;
-/**
- * Alt text of the image
- */
-type AltText = string;
-/**
- * Image uses all the horizontal space vailable
- */
-type FullWidth = boolean;
-/**
- * Aspect Ratio of the Images
- */
-type AspectRatio = "wide" | "square" | "vertical";
-/**
- * Name, company name, etc.
- */
-type Title = string;
-/**
- * Position, profession, department, location, etc.
- */
-type Subtitle = string;
-/**
- * Open link in new Tab
- */
-type OpenLinkInNewTab = boolean;
-type CopyText = string;
-/**
- * Additional css classes attached to the wrapping element
- */
-type Class = string;
-/**
- * Optional custom component identifier
- */
-type KsComponentAttribute = string;
-/**
- * Component used for user interaction
- */
-interface ContactProps {
-    image?: {
-        src?: ImageSource;
-        alt?: AltText;
-        fullWidth?: FullWidth;
-        aspectRatio?: AspectRatio;
-    };
-    title?: Title;
-    subtitle?: Subtitle;
-    links?: {
-        icon?: string;
-        label?: string;
-        href?: string;
-        newTab?: OpenLinkInNewTab;
-    }[];
-    copy?: CopyText;
-    className?: Class;
-    component?: KsComponentAttribute;
-}
-export { ImageSource, AltText, FullWidth, AspectRatio, Title, Subtitle, OpenLinkInNewTab, CopyText, Class, KsComponentAttribute, ContactProps };