@kickstartds/ds-agency-premium 1.6.71--canary.45.1843.0 → 1.7.0--canary.18.1660.0

package/dist/{VideoCurtainProps-a2c0cc7f.d.ts → VideoCurtainProps-6c625a69.d.ts}

@@ -32,9 +32,9 @@ type Label = string;
  */
 type Icon = string;
 /**
- * The URL to link to when the button is clicked
+ * Target that should be linked, makes the button behave like a link semantically
  */
-type URL = string;
+type Target = string;
 /**
  * Enable grid layer
  */
@@ -54,7 +54,7 @@ type DesktopVideoSource = string;
 /**
  * Choose the alginment of the module content
  */
-type ModuleAligment = "center" | "bottom" | "left" | "right" | "corner";
+type ModuleAligment = "center" | "left" | "right";
 interface VideoCurtainProps {
     headline?: Headline;
     sub?: ModuleSubheadline;
@@ -69,7 +69,7 @@ interface VideoCurtainProps {
 interface Button {
     label?: Label;
     icon?: Icon;
-    url?: URL;
+    target?: Target;
 }
 /**
  * Sources of background videos for different screen sizes
@@ -79,4 +79,4 @@ interface BackgroundVideo {
     srcTablet?: TabletVideoSource;
     srcDesktop?: DesktopVideoSource;
 }
-export { Headline, ModuleSubheadline, ModuleText, HighlightText, ColorNeutral, Label, Icon, URL, GridLayer, MobileVideoSource, TabletVideoSource, DesktopVideoSource, ModuleAligment, VideoCurtainProps, Button, BackgroundVideo };
+export { Headline, ModuleSubheadline, ModuleText, HighlightText, ColorNeutral, Label, Icon, Target, GridLayer, MobileVideoSource, TabletVideoSource, DesktopVideoSource, ModuleAligment, VideoCurtainProps, Button, BackgroundVideo };

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

@@ -4,13 +4,13 @@
 }
 
 .dsa-blog-aside {
-  --dsa-blog-aside--gap: var(--ks-spacing-stack-s);
+  --dsa-blog-aside--gap: var(--ks-spacing-stack-xs);
   --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: 100px;
+  --dsa-blog-aside__author__body--flex-basis: 240px;
   --dsa-blog-aside__author__link--font: var(--ks-font-interface-s);
-  --dsa-blog-aside__author--gap-horizontal: var(--ks-spacing-inline-s);
+  --dsa-blog-aside__author--gap-horizontal: var(--ks-spacing-inline-xs);
   --dsa-blog-aside__author--gap-vertical: var(--ks-spacing-stack-xs);
   --dsa-blog-aside__meta__item--font: var(--ks-font-interface-s);
   --dsa-blog-aside__meta__item--color: var(--ks-text-color-interface);
@@ -19,7 +19,7 @@
   --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: 370px) {
+@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);

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

@@ -45,7 +45,7 @@
               "title": "Alt Text",
               "description": "Alt text of the image",
               "examples": [
-                "Picture of Isabella Doe"
+                "Picture of Jane Smith"
               ]
             },
             "fullWidth": {
@@ -74,13 +74,12 @@
             "type": "object",
             "properties": {
               "icon": {
-                "type": "string",
-                "format": "icon"
+                "type": "string"
               },
               "label": {
                 "type": "string"
               },
-              "url": {
+              "href": {
                 "type": "string",
                 "format": "uri"
               },
@@ -89,14 +88,6 @@
                 "description": "Open link in new Tab",
                 "type": "boolean",
                 "default": false
-              },
-              "ariaLabel": {
-                "title": "Aria Label",
-                "description": "Aria label for the link",
-                "type": "string",
-                "examples": [
-                  "Link to Isabella Doe's social media profile"
-                ]
               }
             },
             "additionalProperties": false
@@ -106,12 +97,12 @@
               {
                 "icon": "phone",
                 "label": "0228 / 688 966 20",
-                "url": "tel:+4922868896620"
+                "href": "tel:+4922868896620"
               },
               {
                 "icon": "email",
                 "label": "mail@example.com",
-                "url": "mailto:mail@example.com"
+                "href": "mailto:mail@example.com"
               }
             ]
           ]
@@ -136,15 +127,14 @@
             "title": "Icon",
             "description": "The icon name for the social link",
             "type": "string",
-            "format": "icon",
             "examples": [
               "twitter",
               "facebook"
             ]
           },
-          "url": {
-            "title": "URL",
-            "description": "The url for the social link",
+          "href": {
+            "title": "Href",
+            "description": "The href for the social link",
             "type": "string",
             "format": "uri",
             "examples": [
@@ -163,7 +153,7 @@
         "additionalProperties": false,
         "required": [
           "icon",
-          "url",
+          "href",
           "title"
         ]
       }

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

@@ -19,12 +19,11 @@
             "title": "Icon",
             "description": "The icon name for the social link",
             "type": "string",
-            "format": "icon",
             "examples": ["twitter", "facebook"]
           },
-          "url": {
-            "title": "URL",
-            "description": "The url for the social link",
+          "href": {
+            "title": "Href",
+            "description": "The href for the social link",
             "type": "string",
             "format": "uri",
             "examples": [
@@ -39,7 +38,7 @@
           }
         },
         "additionalProperties": false,
-        "required": ["icon", "url", "title"]
+        "required": ["icon", "href", "title"]
       }
     },
     "readingTime": {

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

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { BlogAsideProps } from "../../BlogAsideProps-c760fd2a.js";
+import { BlogAsideProps } from "../../BlogAsideProps-d9decb7c.js";
 declare const BlogAsideContextDefault: import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const BlogAsideContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const BlogAside: import("react").ForwardRefExoticComponent<BlogAsideProps & import("react").RefAttributes<HTMLDivElement>>;
-export type { BlogAsideProps };
 export { BlogAsideContextDefault, BlogAsideContext, BlogAside };

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

@@ -1,5 +1,5 @@
 import "./blog-aside.css";
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import classnames from 'classnames';
 import { forwardRef, createContext, useContext } from 'react';
 import { PostMeta } from '@kickstartds/blog/lib/post-meta';
@@ -20,7 +20,7 @@ const BlogAsideContextDefault = forwardRef(({ author, socialSharing, readingTime
     const socialLinks = socialSharing?.map((link) => {
         return {
             icon: link.icon,
-            href: link.url,
+            href: link.href,
             title: link.title,
         };
     });
@@ -35,7 +35,7 @@ const BlogAsideContextDefault = forwardRef(({ author, socialSharing, readingTime
             icon: "time",
             text: readingTime,
         });
-    return (jsx(Container, { name: "blog-aside", children: jsxs("div", { ref: ref, className: classnames(className, "dsa-blog-aside"), ...props, children: [jsx(BlogAuthor, { ...author }), metaItems && (jsx(PostMeta, { className: "dsa-blog-aside__meta", items: metaItems })), socialLinks && (jsxs("div", { children: [jsx(Headline, { text: "Share this Article", level: "p", style: "p", spaceAfter: "minimum" }), jsx(PostShareBar, { className: "dsa-blog-aside__share-bar", links: socialLinks })] }))] }) }));
+    return (jsx(Container, { name: "blog-aside", children: jsxs("div", { ref: ref, className: classnames(className, "dsa-blog-aside"), ...props, children: [jsx(BlogAuthor, { ...author }), metaItems && (jsx(Fragment, { children: jsx(PostMeta, { className: "dsa-blog-aside__meta", items: metaItems }) })), socialLinks && (jsxs("div", { children: [jsx(Headline, { text: "Share this Article", level: "p", style: "p", spaceAfter: "minimum" }), jsx(PostShareBar, { className: "dsa-blog-aside__share-bar", links: socialLinks })] }))] }) }));
 });
 const BlogAsideContext = createContext(BlogAsideContextDefault);
 const BlogAside = forwardRef((props, ref) => {

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

@@ -38,7 +38,7 @@
           "title": "Alt Text",
           "description": "Alt text of the image",
           "examples": [
-            "Picture of Isabella Doe"
+            "Picture of Jane Smith"
           ]
         },
         "fullWidth": {
@@ -67,13 +67,12 @@
         "type": "object",
         "properties": {
           "icon": {
-            "type": "string",
-            "format": "icon"
+            "type": "string"
           },
           "label": {
             "type": "string"
           },
-          "url": {
+          "href": {
             "type": "string",
             "format": "uri"
           },
@@ -82,14 +81,6 @@
             "description": "Open link in new Tab",
             "type": "boolean",
             "default": false
-          },
-          "ariaLabel": {
-            "title": "Aria Label",
-            "description": "Aria label for the link",
-            "type": "string",
-            "examples": [
-              "Link to Isabella Doe's social media profile"
-            ]
           }
         },
         "additionalProperties": false
@@ -99,12 +90,12 @@
           {
             "icon": "phone",
             "label": "0228 / 688 966 20",
-            "url": "tel:+4922868896620"
+            "href": "tel:+4922868896620"
           },
           {
             "icon": "email",
             "label": "mail@example.com",
-            "url": "mailto:mail@example.com"
+            "href": "mailto:mail@example.com"
           }
         ]
       ]

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

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { BlogAuthorProps } from "../../BlogAuthorProps-fb0241df.js";
+import { BlogAuthorProps } from "../../BlogAuthorProps-88a11566.js";
 declare const BlogAuthorContextDefault: import("react").ForwardRefExoticComponent<BlogAuthorProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const BlogAuthorContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogAuthorProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const BlogAuthor: import("react").ForwardRefExoticComponent<BlogAuthorProps & import("react").RefAttributes<HTMLDivElement>>;
-export type { BlogAuthorProps };
 export { BlogAuthorContextDefault, BlogAuthorContext, BlogAuthor };

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

@@ -8,16 +8,16 @@
   --dsa-blog-head--margin-bottom: var(--ks-spacing-stack-m);
 }
 
-.dsa-blog-head.c-post-head {
+.dsa-post-head.c-post-head {
   --c-post-head_date--font: var(--dsa-blog-head__date--font, var(--ks-font-interface-xs));
   --c-post-head_date--font-weight: var(--dsa-blog-head__date--font-weight, var(--ks-font-weight-bold));
   --c-post-head_date--color: var(--dsa-blog-head__date--color, var(--ks-text-color-interface));
 }
-.dsa-blog-head.c-post-head .dsa-headline__headline {
+.dsa-post-head.c-post-head .dsa-headline__headline {
   font: var(--dsa-blog-head__headline--font, var(--dsa-headline_h2--font, var(--ks-font-display-l)));
   font-weight: var(--dsa-blog-head__headline--font-weight, var(--dsa-headline--font-weight, var(--ks-font-weight-medium)));
   color: var(--dsa-blog-head__headline--color, var(--dsa-headline--color, var(--ks-text-color-display)));
 }
-.dsa-blog-head.c-post-head .c-post-head__image {
+.dsa-post-head.c-post-head .c-post-head__image {
   margin-bottom: var(--dsa-blog-head--margin-bottom, var(--ks-spacing-stack-m));
 }

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

@@ -58,14 +58,6 @@
         "img/close-up-young-business-team-working.png"
       ]
     },
-    "alt": {
-      "title": "Alt Text",
-      "description": "The alt text for the cover image",
-      "type": "string",
-      "examples": [
-        "Image of a business team working"
-      ]
-    },
     "type": {
       "const": "blog-head"
     }

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

@@ -33,12 +33,6 @@
       "type": "string",
       "format": "image",
       "examples": ["img/close-up-young-business-team-working.png"]
-    },
-    "alt": {
-      "title": "Alt Text",
-      "description": "The alt text for the cover image",
-      "type": "string",
-      "examples": ["Image of a business team working"]
     }
   },
   "additionalProperties": false,

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

@@ -1,7 +1,6 @@
 /// <reference types="react" />
-import { BlogHeadProps } from "../../BlogHeadProps-c04a5ed8.js";
+import { BlogHeadProps } from "../../BlogHeadProps-3f6e4072.js";
 declare const BlogHeadContextDefault: import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>;
 declare const BlogHeadContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>>;
 declare const BlogHead: import("react").ForwardRefExoticComponent<BlogHeadProps & import("react").RefAttributes<HTMLDivElement>>;
-export type { BlogHeadProps };
 export { BlogHeadContextDefault, BlogHeadContext, BlogHead };

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

@@ -3,8 +3,8 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
 import { PostHead } from '@kickstartds/blog/lib/post-head';
 
-const BlogHeadContextDefault = forwardRef(({ date, tags = [], headline, image, alt, ...rest }, ref) => {
-    return (jsx(PostHead, { ...rest, className: "dsa-blog-head", date: date, headline: { text: headline, level: "h1", align: "left" }, image: { src: image, alt: alt || headline }, categories: tags.map((tag) => {
+const BlogHeadContextDefault = forwardRef(({ date, tags = [], headline, image, ...rest }, ref) => {
+    return (jsx(PostHead, { ...rest, date: date, headline: { text: headline, level: "h1", align: "left" }, image: { src: image }, categories: tags.map((tag) => {
             return { label: tag.entry };
         }), ref: ref }));
 });