@kickstartds/ds-agency-premium 1.6.68--canary.45.1707.0 → 1.6.68--canary.45.1713.0

package/dist/components/cta/cta.schema.dereffed.json

@@ -60,10 +60,10 @@
             "title": "Icon",
             "description": "Choose an icon"
           },
-          "target": {
+          "url": {
             "type": "string",
-            "title": "Target",
-            "description": "Target that should be linked, makes the button behave like a link semantically",
+            "title": "URL",
+            "description": "The URL to link to when the button is clicked",
             "format": "uri"
           }
         },

package/dist/components/cta/cta.schema.json

@@ -48,8 +48,8 @@
           "icon": {
             "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/icon"
           },
-          "target": {
-            "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/target"
+          "url": {
+            "$ref": "http://schema.mydesignsystem.com/button.schema.json#/properties/url"
           }
         }
       }

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { CtaProps } from "../../CtaProps-8a0dba0d.js";
+import { CtaProps } from "../../CtaProps-babe4ee6.js";
 declare const CtaContextDefault: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const CtaContext: import("react").Context<import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Cta: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/event-detail/event-detail.schema.dereffed.json

@@ -80,8 +80,8 @@
                     "Register"
                   ]
                 },
-                "href": {
-                  "title": "Href",
+                "url": {
+                  "title": "URL",
                   "description": "URL for the call to action button",
                   "type": "string",
                   "format": "uri",
@@ -129,7 +129,7 @@
             "items": {
               "type": "object",
               "properties": {
-                "href": {
+                "url": {
                   "type": "string",
                   "format": "uri"
                 },
@@ -143,7 +143,7 @@
                 }
               },
               "required": [
-                "href",
+                "url",
                 "label"
               ],
               "additionalProperties": false
@@ -260,9 +260,9 @@
             "See all Events"
           ]
         },
-        "target": {
+        "url": {
           "type": "string",
-          "title": "Target",
+          "title": "Url",
           "description": "URL the button links to",
           "format": "uri"
         }

package/dist/components/event-detail/event-detail.schema.json

@@ -61,9 +61,9 @@
           "description": "Label of the button",
           "examples": ["See all Events"]
         },
-        "target": {
+        "url": {
           "type": "string",
-          "title": "Target",
+          "title": "Url",
           "description": "URL the button links to",
           "format": "uri"
         }

package/dist/components/event-detail/index.d.ts

@@ -1,5 +1,5 @@
 import { FC, PropsWithChildren } from "react";
-import { EventDetailProps } from "../../EventDetailProps-19b81db8.js";
+import { EventDetailProps } from "../../EventDetailProps-52321b9e.js";
 declare const EventDetail: FC<PropsWithChildren<EventDetailProps>>;
 export type { EventDetailProps };
 export { EventDetail };

package/dist/components/event-detail/index.js

@@ -27,7 +27,7 @@ const EventDetail = ({ title, categories, locations, description, intro, images,
             }, spaceAfter: "none", children: [jsx(Headline, { text: "Downloads", level: "h3", style: "h3" }), jsx(Downloads, { downloads: downloads })] })), jsx(Section, { width: "narrow", buttons: [
                 {
                     label: "See all Events",
-                    target: "/#",
+                    url: "/#",
                 },
             ] })] }));
 EventDetail.displayName = "EventDetail";

package/dist/components/event-latest/event-latest.schema.dereffed.json

@@ -31,7 +31,7 @@
         "$schema": "http://json-schema.org/draft-07/schema#",
         "$id": "http://schema.mydesignsystem.com/event-teaser.schema.json",
         "title": "Event Teaser",
-        "description": "Display an event teaser with date, headline and location",
+        "description": "Display an event teaser with date, title and location",
         "type": "object",
         "properties": {
           "date": {
@@ -40,16 +40,40 @@
             "type": "string",
             "format": "date",
             "examples": [
-              "12/30/2022"
+              "12.30.2022"
             ]
           },
-          "headline": {
+          "calendar": {
+            "type": "object",
+            "title": "Calendar",
+            "description": "Calendar icon to display the date",
+            "properties": {
+              "month": {
+                "title": "Month",
+                "description": "The month of the event",
+                "type": "string",
+                "examples": [
+                  "Dec"
+                ]
+              },
+              "day": {
+                "title": "Day",
+                "description": "The day of the event",
+                "type": "string",
+                "examples": [
+                  "30"
+                ]
+              }
+            },
+            "additionalProperties": false
+          },
+          "title": {
             "title": "Headline",
             "description": "Title of the event",
             "type": "string",
             "format": "markdown",
             "examples": [
-              "This is a blog post headline"
+              "This is a event teaser title"
             ]
           },
           "location": {
@@ -58,36 +82,32 @@
             "type": "string",
             "format": "markdown",
             "examples": [
-              "This is a teaser text for the blog post"
+              "This is a location"
             ]
           },
-          "link": {
-            "type": "object",
-            "title": "Link",
-            "description": "URL and label for the event linked",
-            "properties": {
-              "url": {
-                "title": "URL",
-                "description": "The event entry URL to link",
-                "type": "string",
-                "format": "uri",
-                "examples": [
-                  "https://example.com"
-                ]
-              },
-              "text": {
-                "title": "Text",
-                "description": "The text for the link",
-                "type": "string",
-                "default": "Show event",
-                "examples": [
-                  "Show event"
-                ]
-              }
-            },
-            "additionalProperties": false,
-            "required": [
-              "url"
+          "url": {
+            "title": "URL",
+            "description": "The event entry URL to link",
+            "type": "string",
+            "format": "uri",
+            "examples": [
+              "https://example.com"
+            ]
+          },
+          "cta": {
+            "title": "Call to Action",
+            "description": "Text for the call to action",
+            "type": "string",
+            "examples": [
+              "Show event"
+            ]
+          },
+          "ariaLabel": {
+            "title": "ARIA Label",
+            "description": "ARIA label for accessibility",
+            "type": "string",
+            "examples": [
+              "Event teaser for "
             ]
           },
           "className": {
@@ -99,7 +119,7 @@
         },
         "additionalProperties": false,
         "required": [
-          "headline",
+          "title",
           "date",
           "location"
         ]

package/dist/components/event-latest/index.d.ts

@@ -6,7 +6,7 @@ import { HTMLAttributes } from "react";
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run json-schema-to-typescript to regenerate this file.
  */
-import { EventTeaserProps } from "../../EventTeaserProps-5f865346.js";
+import { EventTeaserProps } from "../../EventTeaserProps-e00ea659.js";
 /**
  * Headline for the listing
  */

package/dist/components/event-list-appointment/event-list-appointment.schema.dereffed.json

@@ -29,8 +29,8 @@
         "Register"
       ]
     },
-    "href": {
-      "title": "Href",
+    "url": {
+      "title": "URL",
       "description": "URL for the call to action button",
       "type": "string",
       "format": "uri",

package/dist/components/event-list-appointment/event-list-appointment.schema.json

@@ -23,8 +23,8 @@
       "type": "string",
       "examples": ["Register"]
     },
-    "href": {
-      "title": "Href",
+    "url": {
+      "title": "URL",
       "description": "URL for the call to action button",
       "type": "string",
       "format": "uri",

package/dist/components/event-list-appointment/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { EventListAppointmentProps } from "../../EventListAppointmentProps-da54c3b9.js";
+import { EventListAppointmentProps } from "../../EventListAppointmentProps-eee8b4ec.js";
 declare const EventListAppointmentContextDefault: import("react").ForwardRefExoticComponent<EventListAppointmentProps & import("react").RefAttributes<HTMLAnchorElement>>;
 declare const EventListAppointmentContext: import("react").Context<import("react").ForwardRefExoticComponent<EventListAppointmentProps & import("react").RefAttributes<HTMLAnchorElement>>>;
 declare const EventListAppointment: import("react").ForwardRefExoticComponent<EventListAppointmentProps & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist/components/event-list-appointment/index.js

@@ -3,7 +3,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
 import { Icon } from '@kickstartds/base/lib/icon';
 
-const EventListAppointmentContextDefault = forwardRef(({ date, time, label, href, newTab, ariaLabel }, ref) => (jsxs("a", { className: "dsa-event-list-appointment", target: newTab ? "_blank" : "_self", "aria-label": ariaLabel, href: href, ref: ref, children: [jsxs("span", { className: "dsa-event-list-appointment__infos", children: [date && (jsxs("span", { className: "dsa-event-list-appointment__info", children: [jsx(Icon, { className: "dsa-event-list-appointment__icon", "aria-hidden": true, icon: "date" }), date] })), time && (jsxs("span", { className: "dsa-event-list-appointment__info", children: [jsx(Icon, { className: "dsa-event-list-appointment__icon", "aria-hidden": true, icon: "time" }), time] }))] }), jsxs("span", { className: "dsa-event-list-appointment__label", children: [label, jsx(Icon, { icon: "chevron-right" })] })] })));
+const EventListAppointmentContextDefault = forwardRef(({ date, time, label, url, newTab, ariaLabel }, ref) => (jsxs("a", { className: "dsa-event-list-appointment", target: newTab ? "_blank" : "_self", "aria-label": ariaLabel, href: url, ref: ref, children: [jsxs("span", { className: "dsa-event-list-appointment__infos", children: [date && (jsxs("span", { className: "dsa-event-list-appointment__info", children: [jsx(Icon, { className: "dsa-event-list-appointment__icon", "aria-hidden": true, icon: "date" }), date] })), time && (jsxs("span", { className: "dsa-event-list-appointment__info", children: [jsx(Icon, { className: "dsa-event-list-appointment__icon", "aria-hidden": true, icon: "time" }), time] }))] }), jsxs("span", { className: "dsa-event-list-appointment__label", children: [label, jsx(Icon, { icon: "chevron-right" })] })] })));
 const EventListAppointmentContext = createContext(EventListAppointmentContextDefault);
 const EventListAppointment = forwardRef((props, ref) => {
     const Component = useContext(EventListAppointmentContext);

package/dist/components/event-list-location/event-list-location.schema.dereffed.json

@@ -39,8 +39,8 @@
               "Register"
             ]
           },
-          "href": {
-            "title": "Href",
+          "url": {
+            "title": "URL",
             "description": "URL for the call to action button",
             "type": "string",
             "format": "uri",
@@ -88,7 +88,7 @@
       "items": {
         "type": "object",
         "properties": {
-          "href": {
+          "url": {
             "type": "string",
             "format": "uri"
           },
@@ -102,7 +102,7 @@
           }
         },
         "required": [
-          "href",
+          "url",
           "label"
         ],
         "additionalProperties": false

package/dist/components/event-list-location/event-list-location.schema.json

@@ -33,7 +33,7 @@
       "items": {
         "type": "object",
         "properties": {
-          "href": {
+          "url": {
             "type": "string",
             "format": "uri"
           },
@@ -46,7 +46,7 @@
             "description": "Open link in a new tab"
           }
         },
-        "required": ["href", "label"]
+        "required": ["url", "label"]
       }
     }
   },

package/dist/components/event-list-location/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { EventListLocationProps } from "../../EventListLocationProps-d4345e0e.js";
+import { EventListLocationProps } from "../../EventListLocationProps-f9d48acc.js";
 declare const EventListLocationContextDefault: import("react").ForwardRefExoticComponent<EventListLocationProps & import("react").RefAttributes<HTMLDivElement>>;
 declare const EventListLocationContext: import("react").Context<import("react").ForwardRefExoticComponent<EventListLocationProps & import("react").RefAttributes<HTMLDivElement>>>;
 declare const EventListLocation: import("react").ForwardRefExoticComponent<EventListLocationProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/event-list-location/index.js

@@ -5,7 +5,7 @@ import { RichText } from '@kickstartds/base/lib/rich-text';
 import { Icon } from '@kickstartds/base/lib/icon';
 import { EventListAppointment } from '../event-list-appointment/index.js';
 
-const EventListLocationContextDefault = forwardRef(({ locationName, address, dates, links, ...rest }, ref) => (jsxs("div", { className: "dsa-event-list-location", ...rest, ref: ref, children: [address && (jsx("div", { className: "dsa-event-list-location__row", children: jsxs("div", { className: "dsa-event-list-location__item ", children: [jsx(Icon, { className: "dsa-event-list-location__icon", icon: "map-pin", "aria-hidden": true }), jsxs("div", { className: "dsa-event-list-location__content", children: [jsx("span", { className: "sr-only", children: "Address:" }), jsxs("address", { className: "dsa-event-list-location__address", children: [locationName && (jsx("span", { className: "dsa-event-list-location__name", children: locationName })), address && jsx(RichText, { text: address })] }), links && links.length > 0 && (jsx("div", { className: "dsa-event-list-location__links", children: links.map((link, index) => (jsx("a", { href: link.href, target: link.newTab ? "_blank" : "_self", className: "dsa-event-list-location__link", children: link.label }, index))) }))] })] }) })), dates && dates.length > 0 && (jsxs("div", { className: "dsa-event-list-location__appointments", children: [jsx("span", { className: "sr-only", children: "Appointments:" }), dates.map((item, index) => (createElement(EventListAppointment, { ...item, key: index })))] }))] })));
+const EventListLocationContextDefault = forwardRef(({ locationName, address, dates, links, ...rest }, ref) => (jsxs("div", { className: "dsa-event-list-location", ...rest, ref: ref, children: [address && (jsx("div", { className: "dsa-event-list-location__row", children: jsxs("div", { className: "dsa-event-list-location__item ", children: [jsx(Icon, { className: "dsa-event-list-location__icon", icon: "map-pin", "aria-hidden": true }), jsxs("div", { className: "dsa-event-list-location__content", children: [jsx("span", { className: "sr-only", children: "Address:" }), jsxs("address", { className: "dsa-event-list-location__address", children: [locationName && (jsx("span", { className: "dsa-event-list-location__name", children: locationName })), address && jsx(RichText, { text: address })] }), links && links.length > 0 && (jsx("div", { className: "dsa-event-list-location__links", children: links.map((link, index) => (jsx("a", { href: link.url, target: link.newTab ? "_blank" : "_self", className: "dsa-event-list-location__link", children: link.label }, index))) }))] })] }) })), dates && dates.length > 0 && (jsxs("div", { className: "dsa-event-list-location__appointments", children: [jsx("span", { className: "sr-only", children: "Appointments:" }), dates.map((item, index) => (createElement(EventListAppointment, { ...item, key: index })))] }))] })));
 const EventListLocationContext = createContext(EventListLocationContextDefault);
 const EventListLocation = forwardRef((props, ref) => {
     const Component = useContext(EventListLocationContext);

package/dist/components/event-teaser/event-teaser.css

@@ -0,0 +1,82 @@
+.dsa-event-teaser {
+  --g-link--border-radius: var(--ks-border-radius-surface);
+  display: flex;
+  align-items: center;
+  gap: var(--ks-spacing-inline-m);
+  padding: var(--ks-spacing-inset-s);
+  border: var(--ks-border-width-default) solid var(--ks-border-color-card-interactive);
+}
+.dsa-event-teaser:hover {
+  border-color: var(--ks-border-color-card-interactive-hover);
+}
+.dsa-event-teaser__calendar {
+  align-self: start;
+  position: relative;
+  container-type: inline-size;
+  background-color: var(--ks-background-color-primary);
+  color: var(--ks-color-fg-inverted);
+  border-radius: var(--ks-border-radius-control);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: var(--ks-spacing-inset-stretch-xs);
+  flex-shrink: 0;
+  width: calc(var(--ks-spacing-l) * 3);
+  height: calc(var(--ks-spacing-l) * 3);
+}
+.dsa-event-teaser__content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ks-spacing-stack-xs);
+  flex-grow: 1;
+}
+.dsa-event-teaser__title {
+  font: var(--ks-font-display-m);
+  font-weight: var(--ks-font-weight-semi-bold);
+  color: var(--ks-text-color-display);
+}
+.dsa-event-teaser__month, .dsa-event-teaser__day {
+  font-weight: var(--ks-font-weight-semi-bold);
+  font-family: var(--ks-font-family-display);
+}
+.dsa-event-teaser__day {
+  font-size: 50cqw;
+}
+.dsa-event-teaser__month {
+  font-size: 25cqw;
+}
+.dsa-event-teaser__infos {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--ks-spacing-xxs) var(--ks-spacing-inline-s);
+}
+.dsa-event-teaser__info {
+  display: flex;
+  gap: var(--ks-spacing-xxs);
+  font: var(--ks-font-interface-s);
+  align-items: center;
+  color: var(--ks-text-color-interface);
+}
+.dsa-event-teaser__info .icon {
+  width: calc(var(--ks-font-size-interface-s) * var(--ks-line-height-interface-s));
+  height: calc(var(--ks-font-size-interface-s) * var(--ks-line-height-interface-s));
+  color: var(--ks-text-color-primary);
+  flex-shrink: 0;
+  flex-grow: 1;
+}
+.dsa-event-teaser__cta {
+  font: var(--ks-font-interface-s);
+  font-weight: var(--ks-font-weight-semi-bold);
+  color: var(--ks-text-color-primary);
+  display: flex;
+  align-items: center;
+  text-wrap: nowrap;
+}
+.dsa-event-teaser__cta .icon {
+  width: calc(var(--ks-font-size-interface-s) * var(--ks-line-height-interface-s));
+  height: calc(var(--ks-font-size-interface-s) * var(--ks-line-height-interface-s));
+  color: var(--ks-text-color-primary);
+  flex-shrink: 0;
+  flex-grow: 1;
+}

package/dist/components/event-teaser/event-teaser.schema.dereffed.json

@@ -2,7 +2,7 @@
   "$schema": "http://json-schema.org/draft-07/schema#",
   "$id": "http://schema.mydesignsystem.com/event-teaser.schema.json",
   "title": "Event Teaser",
-  "description": "Display an event teaser with date, headline and location",
+  "description": "Display an event teaser with date, title and location",
   "type": "object",
   "properties": {
     "date": {
@@ -11,16 +11,40 @@
       "type": "string",
       "format": "date",
       "examples": [
-        "12/30/2022"
+        "12.30.2022"
       ]
     },
-    "headline": {
+    "calendar": {
+      "type": "object",
+      "title": "Calendar",
+      "description": "Calendar icon to display the date",
+      "properties": {
+        "month": {
+          "title": "Month",
+          "description": "The month of the event",
+          "type": "string",
+          "examples": [
+            "Dec"
+          ]
+        },
+        "day": {
+          "title": "Day",
+          "description": "The day of the event",
+          "type": "string",
+          "examples": [
+            "30"
+          ]
+        }
+      },
+      "additionalProperties": false
+    },
+    "title": {
       "title": "Headline",
       "description": "Title of the event",
       "type": "string",
       "format": "markdown",
       "examples": [
-        "This is a blog post headline"
+        "This is a event teaser title"
       ]
     },
     "location": {
@@ -29,36 +53,32 @@
       "type": "string",
       "format": "markdown",
       "examples": [
-        "This is a teaser text for the blog post"
+        "This is a location"
       ]
     },
-    "link": {
-      "type": "object",
-      "title": "Link",
-      "description": "URL and label for the event linked",
-      "properties": {
-        "url": {
-          "title": "URL",
-          "description": "The event entry URL to link",
-          "type": "string",
-          "format": "uri",
-          "examples": [
-            "https://example.com"
-          ]
-        },
-        "text": {
-          "title": "Text",
-          "description": "The text for the link",
-          "type": "string",
-          "default": "Show event",
-          "examples": [
-            "Show event"
-          ]
-        }
-      },
-      "additionalProperties": false,
-      "required": [
-        "url"
+    "url": {
+      "title": "URL",
+      "description": "The event entry URL to link",
+      "type": "string",
+      "format": "uri",
+      "examples": [
+        "https://example.com"
+      ]
+    },
+    "cta": {
+      "title": "Call to Action",
+      "description": "Text for the call to action",
+      "type": "string",
+      "examples": [
+        "Show event"
+      ]
+    },
+    "ariaLabel": {
+      "title": "ARIA Label",
+      "description": "ARIA label for accessibility",
+      "type": "string",
+      "examples": [
+        "Event teaser for "
       ]
     },
     "className": {
@@ -70,7 +90,7 @@
   },
   "additionalProperties": false,
   "required": [
-    "headline",
+    "title",
     "date",
     "location"
   ]