@kickstartds/ds-agency-premium 1.6.0--canary.17.1001.0 → 1.6.0--canary.18.1019.0

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/footer/footer.css

@@ -10,7 +10,7 @@
   --dsa-footer__link--font-weight: var(--dsa-link--font-weight);
   --dsa-footer__link--color: var(--dsa-link--color);
   --dsa-footer__link--text-tecoration: none;
-  --dsa-footer__link--text-tecorationhover: underline;
+  --dsa-footer__link--text-tecoration_hover: underline;
   --dsa-footer__logo--height: 1.5rem;
 }
 @media (min-width: 62em) {
@@ -57,6 +57,6 @@
   text-decoration: var(--dsa-footer__link--text-tecoration, none);
 }
 .dsa-footer__link:not(.c-button):hover {
-  text-decoration: var(--dsa-footer__link--text-tecoration-hover, underline);
+  text-decoration: var(--dsa-footer__link--text-tecoration_hover, underline);
   color: var(--dsa-footer__link--color_hover, var(--dsa-link--color_hover));
 }

package/dist/components/html/html.schema.json

@@ -1,6 +1,6 @@
 {
   "$schema": "http://json-schema.org/draft-07/schema#",
-  "$id": "http://schema.mydesignsystem.com/html.schema.json",
+  "$id": "http://schema.kickstartds.com/base/html.schema.json",
   "title": "HTML",
   "description": "Display raw HTML.",
   "type": "object",
@@ -8,34 +8,7 @@
     "html": {
       "title": "HTML string",
       "type": "string",
-      "examples": [
-        "<p style=\"color: var(--ks-text-color-default);\">Hello World</p>"
-      ]
-    },
-    "consent": {
-      "title": "Show HTML after consent",
-      "type": "boolean",
-      "default": false
-    },
-    "consentText": {
-      "type": "string"
-    },
-    "consentButtonLabel": {
-      "type": "string"
-    },
-    "consentBackgroundImage": {
-      "type": "string",
-      "format": "image"
-    },
-    "consentAspectRatio": {
-      "type": "string",
-      "enum": [
-        "16:9",
-        "16:10",
-        "4:3",
-        "1:1"
-      ],
-      "default": "16:9"
+      "examples": ["<p>Hello world!</p>"]
     },
     "className": {
       "title": "Additional Classes",

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

@@ -4,10 +4,9 @@ import { HTMLAttributes } from "react";
 /**
  * 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.
+ * and run `yarn run schema` to regenerate this file.
  */
 type HTMLString = string;
-type ShowHTMLAfterConsent = boolean;
 /**
  * Add additional css classes that should be applied to the element
  */
@@ -21,15 +20,10 @@ type KsComponentAttribute = string;
  */
 interface HTMLProps {
     html?: HTMLString;
-    consent?: ShowHTMLAfterConsent;
-    consentText?: string;
-    consentButtonLabel?: string;
-    consentBackgroundImage?: string;
-    consentAspectRatio?: "16:9" | "16:10" | "4:3" | "1:1";
     className?: AdditionalClasses;
     component?: KsComponentAttribute;
 }
 declare const HtmlContextDefault: import("react").ForwardRefExoticComponent<HTMLProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const HtmlContext: import("react").Context<import("react").ForwardRefExoticComponent<HTMLProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
-declare const Html: import("react").ForwardRefExoticComponent<HTMLProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const Html: import("react").ForwardRefExoticComponent<HTMLProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export { HtmlContextDefault, HtmlContext, Html };

package/dist/components/html/index.js

@@ -1,22 +1,9 @@
-import "./html.css";
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
 import classnames from 'classnames';
-import { Button } from '@kickstartds/base/lib/button';
-import './HtmlConsent.client.js';
-import '@kickstartds/core/lib/component';
 
-const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBackgroundImage, consentButtonLabel, consentAspectRatio = "16:9", className, component, ...props }, ref) => {
-    return (jsx("div", { ref: ref, className: classnames("c-html", className), dangerouslySetInnerHTML: consent ? undefined : { __html: html }, "ks-component": component || (consent ? "dsa.html-consent" : undefined), ...props, children: consent ? (jsxs(Fragment, { children: [jsx("template", { dangerouslySetInnerHTML: { __html: html } }), jsxs("div", { style: {
-                        backgroundImage: consentBackgroundImage
-                            ? `url(${consentBackgroundImage})`
-                            : undefined,
-                    }, className: classnames("c-html__consent", {
-                        "c-html__consent--sixteen-to-nine": consentAspectRatio === "16:9",
-                        "c-html__consent--sixteen-to-ten": consentAspectRatio === "16:10",
-                        "c-html__consent--four-to-three": consentAspectRatio === "4:3",
-                        "c-html__consent--square": consentAspectRatio === "1:1",
-                    }), children: [jsx("p", { children: consentText }), jsx(Button, { type: "button", label: consentButtonLabel, className: "c-html__consent-button" })] })] })) : undefined }));
+const HtmlContextDefault = forwardRef(({ html, className, component, ...props }, ref) => {
+    return (jsx("div", { ref: ref, className: classnames("c-html", className), dangerouslySetInnerHTML: { __html: html }, "ks-component": component, ...props }));
 });
 const HtmlContext = createContext(HtmlContextDefault);
 const Html = forwardRef((props, ref) => {

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, 11 Sep 2024 09:53:01 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:47 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);

package/dist/components/presets.json

@@ -2154,33 +2154,6 @@
     },
     "screenshot": "img/screenshots/components-hero--text-box-on-full-screen.png"
   },
-  {
-    "id": "components-html--html",
-    "group": "Components/HTML",
-    "name": "HTML",
-    "code": "<Html\n  consentAspectRatio=\"16:9\"\n  html=\"<p style=&quot;color: var(--ks-text-color-default);&quot;>Hello World</p>\"\n/>",
-    "args": {
-      "html": "<p style=\"color: var(--ks-text-color-default);\">Hello World</p>",
-      "consent": false,
-      "consentAspectRatio": "16:9"
-    },
-    "screenshot": "img/screenshots/components-html--html.png"
-  },
-  {
-    "id": "components-html--with-consent",
-    "group": "Components/HTML",
-    "name": "WithConsent",
-    "code": "<Html\n  consent\n  consentAspectRatio=\"16:9\"\n  consentBackgroundImage=\"img/02.jpg\"\n  consentButtonLabel=\"yes!\"\n  consentText=\"would you like to watch the youtube video?\"\n  html=\"<iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube-nocookie.com/embed/oGGIkuGY-7U?si=Y5_JHflGsNwRCLu_&quot; title=&quot;YouTube video player&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share&quot; referrerpolicy=&quot;strict-origin-when-cross-origin&quot; allowfullscreen></iframe>\"\n/>",
-    "args": {
-      "html": "<iframe width=\"560\" height=\"315\" src=\"https://www.youtube-nocookie.com/embed/oGGIkuGY-7U?si=Y5_JHflGsNwRCLu_\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>",
-      "consent": true,
-      "consentAspectRatio": "16:9",
-      "consentText": "would you like to watch the youtube video?",
-      "consentButtonLabel": "yes!",
-      "consentBackgroundImage": "img/02.jpg"
-    },
-    "screenshot": "img/screenshots/components-html--with-consent.png"
-  },
   {
     "id": "components-image-story--sticky-image-next-to-scrolling-text",
     "group": "Components/Image Story",

package/dist/components/testimonial/index.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef, createContext, useContext } from 'react';
 import { Quote } from '@kickstartds/content/lib/quote';
 
-const TestimonialContextDefault = forwardRef(({ image, quote, name, title, layout, index, rating, ...rest }, ref) => (jsx(Quote, { ...rest, ref: ref, className: layout === "alternating" && index % 2 === 1 ? "c-quote--reverse" : "", text: quote, source: name, byline: title, image: image.src, renderSource: () => (jsxs(Fragment, { children: [rating ? (jsx("div", { children: [...Array(rating)].map((_, index) => (jsx("span", { children: "\u2605" }, index))) })) : (""), jsx("div", { className: "c-quote__source", children: name })] })) })));
+const TestimonialContextDefault = forwardRef(({ image, quote, name, title, layout, index, rating, ...rest }, ref) => (jsx(Quote, { ...rest, ref: ref, className: layout === "alternating" && index % 2 === 1 ? "c-quote--reverse" : "", text: quote, source: name, byline: title, image: image && image.src, renderSource: () => (jsxs(Fragment, { children: [rating ? (jsx("div", { children: [...Array(rating)].map((_, index) => (jsx("span", { children: "\u2605" }, index))) })) : (""), jsx("div", { className: "c-quote__source", children: name })] })) })));
 const TestimonialContext = createContext(TestimonialContextDefault);
 const Testimonial = forwardRef((props, ref) => {
     const Component = useContext(TestimonialContext);

package/dist/tokens/themes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 11 Sep 2024 09:53:03 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:50 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, 11 Sep 2024 09:53:06 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:55 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, 11 Sep 2024 09:53:05 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:52 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, 11 Sep 2024 09:53:08 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:57 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, 11 Sep 2024 09:53:01 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:47 GMT
  */
 
 :root, [ks-theme] {

package/dist/tokens/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 11 Sep 2024 09:53:01 GMT
+ * Generated on Fri, 20 Sep 2024 10:59:48 GMT
  */
 
 export const KsBackgroundColorAccentBase = "#230a2b";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kickstartds/ds-agency-premium",
-  "version": "1.6.0--canary.17.1001.0",
+  "version": "1.6.0--canary.18.1019.0",
   "description": "",
   "homepage": "https://github.com/kickstartDS/ds-agency-premium#readme",
   "bugs": {
@@ -74,17 +74,20 @@
     "@bedrock-layout/primitives": "^3.0.23",
     "@bedrock-layout/spacing-constants": "^3.2.5",
     "classnames": "^2.3.2",
-    "markdown-to-jsx": "^7.3.2"
+    "markdown-to-jsx": "^7.3.2",
+    "react-browser-ui": "^1.3.5",
+    "react-loader-spinner": "^6.1.6"
   },
   "devDependencies": {
     "@auto-it/npm": "^11.0.1",
     "@auto-it/released": "^11.0.1",
     "@kickstartds/base": "^4.0.2",
     "@kickstartds/blog": "^4.0.2",
+    "@kickstartds/cambria": "^1.0.5",
     "@kickstartds/content": "^4.0.0",
     "@kickstartds/core": "^4.0.2",
     "@kickstartds/form": "^4.0.2",
-    "@kickstartds/jsonschema-utils": "^3.0.13",
+    "@kickstartds/jsonschema-utils": "^3.4.1",
     "@kickstartds/jsonschema2types": "^1.1.37",
     "@kickstartds/storybook-addon-component-tokens": "^3.0.0",
     "@kickstartds/storybook-addon-html": "^1.0.0",
@@ -114,9 +117,11 @@
     "happy-dom": "^13.3.1",
     "husky": "^8.0.3",
     "jest-image-snapshot": "^6.4.0",
+    "json-schema-traverse": "^1.0.0",
     "kickstartds": "^3.0.0",
     "lazysizes": "^5.3.2",
     "npm-run-all": "^4.1.5",
+    "object-traversal": "^1.0.1",
     "patch-package": "^8.0.0",
     "playroom": "^0.34.1",
     "postcss": "^8.4.29",

package/dist/components/html/HtmlConsent.client.d.ts

@@ -1,5 +0,0 @@
-declare class Html {
-    static identifier: string;
-    constructor(element: any);
-}
-export { Html as default };

package/dist/components/html/HtmlConsent.client.js

@@ -1,25 +0,0 @@
-import { define, Component } from '@kickstartds/core/lib/component';
-
-const consentButtonSelector = ".c-html__consent-button";
-class Html extends Component {
-    constructor(element) {
-        super(element);
-        const consentButton = element.querySelector(consentButtonSelector);
-        if (consentButton) {
-            const replaceHtml = () => {
-                const template = element.querySelector("template");
-                const clone = template?.content.cloneNode(true);
-                element.replaceChildren(clone);
-                consentButton.removeEventListener("click", replaceHtml);
-            };
-            consentButton.addEventListener("click", replaceHtml);
-            this.onDisconnect(() => {
-                consentButton.removeEventListener("click", replaceHtml);
-            });
-        }
-    }
-}
-Html.identifier = "dsa.html-consent";
-define(Html.identifier, Html);
-
-export { Html as default };

package/dist/components/html/html.css

@@ -1,20 +0,0 @@
-.c-html__consent {
-  color: var(--ks-text-color-default);
-  font: var(--ks-font-interface-m);
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  justify-content: center;
-}
-.c-html__consent--sixteen-to-nine {
-  aspect-ratio: 16/9;
-}
-.c-html__consent--sixteen-to-ten {
-  aspect-ratio: 16/10;
-}
-.c-html__consent--four-to-three {
-  aspect-ratio: 4/3;
-}
-.c-html__consent--square {
-  aspect-ratio: 1;
-}

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

@@ -1,55 +0,0 @@
-{
-  "$schema": "http://json-schema.org/draft-07/schema#",
-  "$id": "http://schema.mydesignsystem.com/html.schema.json",
-  "title": "HTML",
-  "description": "Display raw HTML.",
-  "type": "object",
-  "properties": {
-    "html": {
-      "title": "HTML string",
-      "type": "string",
-      "examples": [
-        "<p style=\"color: var(--ks-text-color-default);\">Hello World</p>"
-      ]
-    },
-    "consent": {
-      "title": "Show HTML after consent",
-      "type": "boolean",
-      "default": false
-    },
-    "consentText": {
-      "type": "string"
-    },
-    "consentButtonLabel": {
-      "type": "string"
-    },
-    "consentBackgroundImage": {
-      "type": "string",
-      "format": "image"
-    },
-    "consentAspectRatio": {
-      "type": "string",
-      "enum": [
-        "16:9",
-        "16:10",
-        "4:3",
-        "1:1"
-      ],
-      "default": "16:9"
-    },
-    "className": {
-      "title": "Additional Classes",
-      "description": "Add additional css classes that should be applied to the element",
-      "type": "string"
-    },
-    "component": {
-      "title": "`ks-component` attribute",
-      "description": "Optional custom component identifier",
-      "type": "string"
-    },
-    "type": {
-      "const": "html"
-    }
-  },
-  "additionalProperties": false
-}