@kickstartds/ds-agency-premium 1.7.0--canary.46.1837.0 → 1.7.0--canary.43.2352.0

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

@@ -0,0 +1,148 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/event-list-teaser.schema.json",
+  "title": "Event List Teaser",
+  "description": "Display an event teaser with date, title and location",
+  "type": "object",
+  "properties": {
+    "category": {
+      "title": "Category",
+      "description": "Category of the event teaser",
+      "type": "string",
+      "examples": [
+        "Buyers"
+      ]
+    },
+    "title": {
+      "title": "Headline",
+      "description": "Title of the event",
+      "type": "string",
+      "format": "markdown",
+      "examples": [
+        "This is a event teaser title"
+      ]
+    },
+    "text": {
+      "title": "Text",
+      "description": "Short teaser text for the event",
+      "type": "string",
+      "format": "markdown",
+      "examples": [
+        "The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence."
+      ]
+    },
+    "date": {
+      "title": "Date",
+      "description": "The date of the event",
+      "type": "string",
+      "format": "date",
+      "examples": [
+        "FRI, JAN 16"
+      ]
+    },
+    "time": {
+      "title": "Time",
+      "description": "The time of the event",
+      "type": "string",
+      "examples": [
+        "10:00"
+      ]
+    },
+    "location": {
+      "title": "Location",
+      "description": "Location of the event",
+      "type": "object",
+      "properties": {
+        "name": {
+          "type": "string",
+          "title": "Location Name",
+          "description": "Name of the location",
+          "examples": [
+            "Stadthalle"
+          ]
+        },
+        "address": {
+          "type": "string",
+          "title": "Address",
+          "description": "Address of the location",
+          "examples": [
+            "Köln"
+          ]
+        }
+      },
+      "additionalProperties": false
+    },
+    "tags": {
+      "title": "Tags",
+      "description": "Tags associated with the event",
+      "type": "array",
+      "items": {
+        "type": "string",
+        "examples": [
+          "AI",
+          "Technology",
+          "Innovation"
+        ]
+      },
+      "default": [
+        "AI"
+      ]
+    },
+    "image": {
+      "title": "Image",
+      "description": "Image to display in the teaser",
+      "type": "object",
+      "properties": {
+        "src": {
+          "type": "string",
+          "format": "image",
+          "title": "Image Source",
+          "description": "URL of the image to display",
+          "examples": [
+            "https://picsum.photos/seed/flower/800/600"
+          ]
+        },
+        "alt": {
+          "type": "string",
+          "title": "Alt Text",
+          "description": "Alt text of the image",
+          "examples": [
+            "This is an image of a flower"
+          ]
+        }
+      },
+      "additionalProperties": false
+    },
+    "url": {
+      "title": "URL",
+      "description": "The event entry URL to link",
+      "type": "string",
+      "format": "uri",
+      "examples": [
+        "https://example.com"
+      ]
+    },
+    "ctaText": {
+      "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"
+    },
+    "className": {
+      "type": "string"
+    }
+  },
+  "additionalProperties": false,
+  "required": [
+    "title",
+    "date",
+    "location"
+  ]
+}

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

@@ -0,0 +1,116 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/event-list-teaser.schema.json",
+  "title": "Event List Teaser",
+  "description": "Display an event teaser with date, title and location",
+  "type": "object",
+  "properties": {
+    "category": {
+      "title": "Category",
+      "description": "Category of the event teaser",
+      "type": "string",
+      "examples": ["Buyers"]
+    },
+    "title": {
+      "title": "Headline",
+      "description": "Title of the event",
+      "type": "string",
+      "format": "markdown",
+      "examples": ["This is a event teaser title"]
+    },
+    "text": {
+      "title": "Text",
+      "description": "Short teaser text for the event",
+      "type": "string",
+      "format": "markdown",
+      "examples": [
+        "The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence."
+      ]
+    },
+    "date": {
+      "title": "Date",
+      "description": "The date of the event",
+      "type": "string",
+      "format": "date",
+      "examples": ["FRI, JAN 16"]
+    },
+    "time": {
+      "title": "Time",
+      "description": "The time of the event",
+      "type": "string",
+      "examples": ["10:00"]
+    },
+    "location": {
+      "title": "Location",
+      "description": "Location of the event",
+      "type": "object",
+      "properties": {
+        "name": {
+          "type": "string",
+          "title": "Location Name",
+          "description": "Name of the location",
+          "examples": ["Stadthalle"]
+        },
+        "address": {
+          "type": "string",
+          "title": "Address",
+          "description": "Address of the location",
+          "examples": ["Köln"]
+        }
+      }
+    },
+    "tags": {
+      "title": "Tags",
+      "description": "Tags associated with the event",
+      "type": "array",
+      "items": {
+        "type": "string",
+        "examples": ["AI", "Technology", "Innovation"]
+      },
+      "default": ["AI"]
+    },
+    "image": {
+      "title": "Image",
+      "description": "Image to display in the teaser",
+      "type": "object",
+      "properties": {
+        "src": {
+          "type": "string",
+          "format": "image",
+          "title": "Image Source",
+          "description": "URL of the image to display",
+          "examples": ["https://picsum.photos/seed/flower/800/600"]
+        },
+        "alt": {
+          "type": "string",
+          "title": "Alt Text",
+          "description": "Alt text of the image",
+          "examples": ["This is an image of a flower"]
+        }
+      }
+    },
+    "url": {
+      "title": "URL",
+      "description": "The event entry URL to link",
+      "type": "string",
+      "format": "uri",
+      "examples": ["https://example.com"]
+    },
+    "ctaText": {
+      "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"
+    },
+    "className": {
+      "type": "string"
+    }
+  },
+  "additionalProperties": false,
+  "required": ["title", "date", "location"]
+}

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { HTMLAttributes } from "react";
+import { EventListTeaserProps } from "../../EventListTeaserProps-5cc94436.js";
+declare const EventListTeaserContextDefault: import("react").ForwardRefExoticComponent<EventListTeaserProps & HTMLAttributes<HTMLAnchorElement> & import("react").RefAttributes<HTMLAnchorElement>>;
+declare const EventListTeaserContext: import("react").Context<import("react").ForwardRefExoticComponent<EventListTeaserProps & HTMLAttributes<HTMLAnchorElement> & import("react").RefAttributes<HTMLAnchorElement>>>;
+declare const EventListTeaser: import("react").ForwardRefExoticComponent<EventListTeaserProps & HTMLAttributes<HTMLAnchorElement> & import("react").RefAttributes<HTMLAnchorElement>>;
+export type { EventListTeaserProps };
+export { EventListTeaserContextDefault, EventListTeaserContext, EventListTeaser };

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

@@ -0,0 +1,28 @@
+import "./event-list-teaser.css";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import classnames from 'classnames';
+import { forwardRef, createContext, useContext } from 'react';
+import { Icon } from '@kickstartds/base/lib/icon';
+import { Container } from '@kickstartds/core/lib/container';
+import { Picture } from '@kickstartds/base/lib/picture';
+import Markdown from 'markdown-to-jsx';
+import { TagLabel } from '@kickstartds/base/lib/tag-label';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
+
+const defaults = {
+    "location": {},
+    "tags": [],
+    "image": {}
+};
+
+const EventListTeaserContextDefault = forwardRef(({ category, title, text, date, time, tags, location, image, ctaText, url, ariaLabel, className, ...rest }, ref) => {
+    return (jsx(Container, { name: "event-list-teaser", children: jsxs("a", { className: classnames(className, "dsa-event-list-teaser"), ...rest, href: url, ref: ref, "aria-label": ariaLabel, children: [jsxs("div", { className: "dsa-event-list-teaser__content", children: [jsxs("div", { className: "dsa-event-list-teaser__header", children: [category && (jsx("span", { className: "dsa-event-list-teaser__category", children: category })), jsx("span", { className: "dsa-event-list-teaser__title", children: title })] }), tags && tags.length > 0 && (jsx("div", { className: "dsa-event-list-teaser__tags", children: tags.map((category) => (jsx(TagLabel, { label: category, size: "s" }, category))) })), jsx("div", { className: "dsa-event-list-teaser__infos", children: jsxs("div", { className: "dsa-event-list-teaser__details", children: [jsxs("div", { className: "dsa-event-list-teaser__date", children: [jsxs("span", { className: "dsa-event-list-teaser__info", children: [jsx(Icon, { "aria-hidden": true, icon: "date" }), date] }), jsxs("span", { className: "dsa-event-list-teaser__info", children: [jsx(Icon, { "aria-hidden": true, icon: "time" }), time] })] }), jsxs("div", { className: "dsa-event-list-teaser__location dsa-event-list-teaser__info", children: [jsx(Icon, { "aria-hidden": true, icon: "map-pin" }), jsxs("address", { children: [location?.name && (jsx("span", { className: "dsa-event-list-teaser__location-name", children: location.name })), jsx(Markdown, { className: "dsa-event-list-teaser__location-address", children: location?.address })] })] })] }) }), text && (jsx("p", { className: "dsa-event-list-teaser__teaser-text", children: text })), jsxs("div", { className: "dsa-event-list-teaser__cta", children: [jsx("span", { children: ctaText }), jsx(Icon, { "aria-hidden": true, icon: "chevron-right" })] })] }), image && image.src && (jsx("div", { className: "dsa-event-list-teaser__image", children: jsx(Picture, { src: image?.src, alt: image?.alt }) }))] }) }));
+});
+const EventListTeaserContext = createContext(EventListTeaserContextDefault);
+const EventListTeaser = forwardRef((props, ref) => {
+    const Component = useContext(EventListTeaserContext);
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
+});
+EventListTeaser.displayName = "EventListTeaser";
+
+export { EventListTeaser, EventListTeaserContext, EventListTeaserContextDefault };

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

@@ -0,0 +1,71 @@
+.l-container--event-location {
+  /* stylelint-disable-next-line property-no-unknown */
+  container-name: event-location;
+}
+
+.l-container--event-location + .l-container--event-location {
+  margin-top: var(--ks-spacing-stack-m);
+}
+
+.dsa-event-location {
+  --dsa-event-location__icon--size: calc(var(--ks-font-size-copy-m) * var(--ks-line-height-copy-m));
+  flex-wrap: wrap;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  gap: var(--ks-spacing-stack-s) var(--ks-spacing-inline-m);
+  background-color: var(--ks-background-color-accent);
+  padding: var(--ks-spacing-inset-m);
+  border-radius: var(--ks-border-radius-surface);
+  --dsa-event-location__info--flex-basis: 280px;
+  --dsa-event-location__appointments--min-width: 12em;
+}
+.dsa-event-location--spacious {
+  --dsa-event-location__info--flex-basis: 50%;
+  --dsa-event-location__appointments--min-width: 20em;
+}
+.dsa-event-location__info {
+  display: flex;
+  gap: var(--ks-spacing-inline-xs);
+  flex-shrink: 1;
+  flex-grow: 1;
+  flex-basis: var(--dsa-event-location__info--flex-basis, 280px);
+}
+.dsa-event-location__icon {
+  color: var(--ks-text-color-primary);
+  width: var(--dsa-event-location__icon--size);
+  height: var(--dsa-event-location__icon--size);
+  flex-shrink: 0;
+}
+.dsa-event-location__text {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ks-spacing-stack-s);
+}
+.dsa-event-location__name {
+  font: var(--ks-font-interface-m);
+  color: var(--dsa-topic--color);
+  font-weight: var(--dsa-topic--font-weight);
+}
+.dsa-event-location__links {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  gap: var(--ks-spacing-xxs);
+}
+.dsa-event-location__link {
+  width: fit-content;
+  font: var(--ks-font-interface-s);
+}
+.dsa-event-location__appointments {
+  display: grid;
+  justify-content: flex-end;
+  gap: var(--ks-spacing-stack-s);
+  flex-grow: 100;
+  flex-shrink: 0;
+  grid-template-columns: repeat(auto-fill, minmax(min(var(--dsa-event-location__appointments--min-width, 12em), 100%), 1fr));
+  font: var(--ks-font-interface-s);
+}
+.dsa-event-location .l-container--rich-text {
+  container-type: normal;
+}

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

@@ -0,0 +1,120 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/event-location.schema.json",
+  "title": "Event Location",
+  "type": "object",
+  "properties": {
+    "dates": {
+      "title": "Dates",
+      "description": "List of dates of the event",
+      "type": "array",
+      "items": {
+        "$schema": "http://json-schema.org/draft-07/schema#",
+        "$id": "http://schema.mydesignsystem.com/event-appointment.schema.json",
+        "title": "Event Appointment",
+        "type": "object",
+        "properties": {
+          "date": {
+            "title": "Date",
+            "description": "Date of the appointment",
+            "type": "string",
+            "format": "date",
+            "examples": [
+              "18.09.2025"
+            ]
+          },
+          "time": {
+            "title": "Time",
+            "description": "Time of the appointment",
+            "type": "string",
+            "examples": [
+              "09:00 – 17:00"
+            ]
+          },
+          "label": {
+            "title": "CTA Label",
+            "description": "Label for the call to action button",
+            "type": "string",
+            "examples": [
+              "Register"
+            ]
+          },
+          "url": {
+            "title": "URL",
+            "description": "URL for the call to action button",
+            "type": "string",
+            "format": "uri",
+            "default": "#"
+          },
+          "newTab": {
+            "title": "Open in New Tab",
+            "description": "Whether the link should open in a new tab",
+            "type": "boolean",
+            "default": true
+          },
+          "ariaLabel": {
+            "title": "Aria Label",
+            "description": "Aria label for the link",
+            "type": "string",
+            "default": "Event Appointment"
+          }
+        },
+        "additionalProperties": false
+      }
+    },
+    "locationName": {
+      "title": "Location Name",
+      "description": "Name of the event location",
+      "type": "string",
+      "examples": [
+        "Berlin Congress Center"
+      ]
+    },
+    "displayMode": {
+      "title": "Display Mode",
+      "description": "Spacious is recommended for 1-2 appointments, Compact for more than 2.",
+      "type": "string",
+      "enum": [
+        "spacious",
+        "compact"
+      ],
+      "default": "spacious"
+    },
+    "address": {
+      "title": "Address",
+      "description": "Address of the appointment",
+      "type": "string",
+      "examples": [
+        "Berlin Congress Center<br />Alexanderplatz 1<br />10178 Berlin"
+      ]
+    },
+    "links": {
+      "title": "Links",
+      "description": "Links related to the event location",
+      "type": "array",
+      "items": {
+        "type": "object",
+        "properties": {
+          "url": {
+            "type": "string",
+            "format": "uri"
+          },
+          "label": {
+            "type": "string"
+          },
+          "newTab": {
+            "type": "boolean",
+            "default": true,
+            "description": "Open link in a new tab"
+          }
+        },
+        "required": [
+          "url",
+          "label"
+        ],
+        "additionalProperties": false
+      }
+    }
+  },
+  "additionalProperties": false
+}

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

@@ -0,0 +1,61 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "http://schema.mydesignsystem.com/event-location.schema.json",
+  "title": "Event Location",
+  "type": "object",
+  "properties": {
+    "dates": {
+      "title": "Dates",
+      "description": "List of dates of the event",
+      "type": "array",
+      "items": {
+        "$ref": "http://schema.mydesignsystem.com/event-appointment.schema.json"
+      }
+    },
+    "locationName": {
+      "title": "Location Name",
+      "description": "Name of the event location",
+      "type": "string",
+      "examples": ["Berlin Congress Center"]
+    },
+    "displayMode": {
+      "title": "Display Mode",
+      "description": "Spacious is recommended for 1-2 appointments, Compact for more than 2.",
+      "type": "string",
+      "enum": ["spacious", "compact"],
+      "default": "spacious"
+    },
+    "address": {
+      "title": "Address",
+      "description": "Address of the appointment",
+      "type": "string",
+      "examples": [
+        "Berlin Congress Center<br />Alexanderplatz 1<br />10178 Berlin"
+      ]
+    },
+    "links": {
+      "title": "Links",
+      "description": "Links related to the event location",
+      "type": "array",
+      "items": {
+        "type": "object",
+        "properties": {
+          "url": {
+            "type": "string",
+            "format": "uri"
+          },
+          "label": {
+            "type": "string"
+          },
+          "newTab": {
+            "type": "boolean",
+            "default": true,
+            "description": "Open link in a new tab"
+          }
+        },
+        "required": ["url", "label"]
+      }
+    }
+  },
+  "additionalProperties": false
+}

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { EventLocationProps } from "../../EventLocationProps-871bc198.js";
+declare const EventLocationContextDefault: import("react").ForwardRefExoticComponent<EventLocationProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const EventLocationContext: import("react").Context<import("react").ForwardRefExoticComponent<EventLocationProps & import("react").RefAttributes<HTMLDivElement>>>;
+declare const EventLocation: import("react").ForwardRefExoticComponent<EventLocationProps & import("react").RefAttributes<HTMLDivElement>>;
+export type { EventLocationProps };
+export { EventLocationContextDefault, EventLocationContext, EventLocation };

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

@@ -0,0 +1,25 @@
+import "./event-location.css";
+import { forwardRef, createElement, createContext, useContext } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import classnames from 'classnames';
+import { RichText } from '@kickstartds/base/lib/rich-text';
+import { Icon } from '@kickstartds/base/lib/icon';
+import { EventAppointment } from '../event-appointment/index.js';
+import { Container } from '@kickstartds/core/lib/container';
+import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
+
+const defaults = {
+    "dates": [],
+    "displayMode": "spacious",
+    "links": []
+};
+
+const EventLocationContextDefault = forwardRef(({ locationName, address, dates, links, displayMode, ...rest }, ref) => (jsx(Container, { name: "event-location", children: jsxs("div", { className: classnames("dsa-event-location", displayMode === "spacious" && `dsa-event-location--spacious`), ...rest, ref: ref, children: [address && (jsxs("div", { className: "dsa-event-location__info ", children: [jsx(Icon, { className: "dsa-event-location__icon", icon: "map-pin", "aria-hidden": true }), jsxs("div", { className: "dsa-event-location__text", children: [jsx("span", { className: "sr-only", children: "Address:" }), jsxs("address", { className: "dsa-event-location__address", children: [locationName && (jsx("span", { className: "dsa-event-location__name", children: locationName })), address && jsx(RichText, { text: address })] }), links && links.length > 0 && (jsx("div", { className: "dsa-event-location__links", children: links.map((link, index) => (jsx("a", { href: link.url, target: link.newTab ? "_blank" : "_self", className: "dsa-event-location__link", children: link.label }, index))) }))] })] })), dates && dates.length > 0 && (jsxs("div", { className: "dsa-event-location__appointments", children: [jsx("span", { className: "sr-only", children: "Appointments:" }), dates.map((item, index) => (createElement(EventAppointment, { ...item, key: index })))] }))] }) })));
+const EventLocationContext = createContext(EventLocationContextDefault);
+const EventLocation = forwardRef((props, ref) => {
+    const Component = useContext(EventLocationContext);
+    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
+});
+EventLocation.displayName = "EventLocation";
+
+export { EventLocation, EventLocationContext, EventLocationContextDefault };

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

@@ -0,0 +1,31 @@
+.dsa-event-login {
+  display: flex;
+  flex-direction: column;
+}
+.dsa-event-login__text {
+  font: var(--ks-font-copy-m);
+  color: var(--ks-text-color-copy);
+  margin-top: var(--ks-spacing-stack-xs);
+}
+.dsa-event-login__link {
+  width: fit-content;
+  font: var(--ks-font-interface-s);
+}
+.dsa-event-login__form {
+  display: flex;
+  flex-direction: column;
+  margin-top: var(--ks-spacing-stack-m);
+}
+.dsa-event-login__inputs {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ks-spacing-stack-s);
+}
+.dsa-event-login__actions {
+  margin-top: var(--ks-spacing-stack-m);
+  display: flex;
+  flex-wrap: wrap-reverse;
+  align-items: center;
+  gap: var(--ks-spacing-stack-m) var(--ks-spacing-inline-xs);
+  justify-content: space-between;
+}