@kickstartds/ds-agency-premium 1.6.65 → 1.6.67

package/dist/{HtmlProps-8e95ed81.d.ts → HtmlProps-9d091769.d.ts}

@@ -5,6 +5,10 @@
  */
 type HTMLString = string;
 type ShowHTMLAfterConsent = boolean;
+/**
+ * Invert the colors of the HTML
+ */
+type Inverted = boolean;
 /**
  * Add additional css classes that should be applied to the element
  */
@@ -23,7 +27,8 @@ interface HtmlProps {
     consentButtonLabel?: string;
     consentBackgroundImage?: string;
     consentAspectRatio?: "16:9" | "16:10" | "4:3" | "1:1";
+    inverted?: Inverted;
     className?: AdditionalClasses;
     component?: KsComponentAttribute;
 }
-export { HTMLString, ShowHTMLAfterConsent, AdditionalClasses, KsComponentAttribute, HtmlProps };
+export { HTMLString, ShowHTMLAfterConsent, Inverted, AdditionalClasses, KsComponentAttribute, HtmlProps };

package/dist/SectionProps-1cfcf6e8.d.ts

@@ -9,7 +9,7 @@ import { FaqProps } from "./FaqProps-ad618cd5.js";
 import { FeaturesProps } from "./FeaturesProps-e58616a5.js";
 import { GalleryProps } from "./GalleryProps-76e7de44.js";
 import { HeroProps } from "./HeroProps-f704d270.js";
-import { HtmlProps } from "./HtmlProps-8e95ed81.js";
+import { HtmlProps } from "./HtmlProps-9d091769.js";
 import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
 import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
 import { LogosProps } from "./LogosProps-f9474fe2.js";

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

@@ -899,6 +899,12 @@
                       ],
                       "default": "16:9"
                     },
+                    "inverted": {
+                      "title": "Inverted",
+                      "description": "Invert the colors of the HTML",
+                      "type": "boolean",
+                      "default": false
+                    },
                     "className": {
                       "title": "Additional Classes",
                       "description": "Add additional css classes that should be applied to the element",

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

@@ -1175,6 +1175,12 @@
                       ],
                       "default": "16:9"
                     },
+                    "inverted": {
+                      "title": "Inverted",
+                      "description": "Invert the colors of the HTML",
+                      "type": "boolean",
+                      "default": false
+                    },
                     "className": {
                       "title": "Additional Classes",
                       "description": "Add additional css classes that should be applied to the element",

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

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

package/dist/components/html/html.css

@@ -1,7 +1,8 @@
 .dsa-html {
   --dsa-html__consent--color: var(--ks-text-color-display);
   --dsa-html__consent--font: var(--ks-font-copy-m);
-  --dsa-html__consent--background: var(--ks-color-fg-inverted-alpha-4);
+  --dsa-html__consent--font-weight: var(--ks-font-weight-regular);
+  --dsa-html__consent--background: var(--ks-color-fg-inverted-alpha-2);
 }
 
 .dsa-html__consent {
@@ -20,6 +21,7 @@
 .dsa-html__consent .c-rich-text {
   color: var(--dsa-html__consent--color, var(--ks-text-color-display));
   font: var(--dsa-html__consent--font, var(--ks-font-interface-m));
+  font-weight: var(--dsa-html__consent--font-weight, var(--ks-font-weight-regular));
   text-align: center;
 }
 .dsa-html__consent:after {

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

@@ -37,6 +37,12 @@
       ],
       "default": "16:9"
     },
+    "inverted": {
+      "title": "Inverted",
+      "description": "Invert the colors of the HTML",
+      "type": "boolean",
+      "default": false
+    },
     "className": {
       "title": "Additional Classes",
       "description": "Add additional css classes that should be applied to the element",

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

@@ -29,14 +29,15 @@
     },
     "consentAspectRatio": {
       "type": "string",
-      "enum": [
-        "16:9",
-        "16:10",
-        "4:3",
-        "1:1"
-      ],
+      "enum": ["16:9", "16:10", "4:3", "1:1"],
       "default": "16:9"
     },
+    "inverted": {
+      "title": "Inverted",
+      "description": "Invert the colors of the HTML",
+      "type": "boolean",
+      "default": false
+    },
     "className": {
       "title": "Additional Classes",
       "description": "Add additional css classes that should be applied to the element",

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { HtmlProps } from "../../HtmlProps-8e95ed81.js";
+import { HtmlProps } from "../../HtmlProps-9d091769.js";
 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 & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/html/index.js

@@ -7,8 +7,8 @@ import { RichText } from '@kickstartds/base/lib/rich-text';
 import './Html.client.js';
 import '@kickstartds/core/lib/component';
 
-const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBackgroundImage, consentButtonLabel, consentAspectRatio = "16:9", className, component = "dsa.html", ...props }, ref) => {
-    return (jsxs("div", { ref: ref, className: classnames("dsa-html", className), "ks-component": component, ...props, children: [jsx("template", { dangerouslySetInnerHTML: { __html: html } }), consent && (jsxs("div", { style: {
+const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBackgroundImage, consentButtonLabel, consentAspectRatio = "16:9", inverted, className, component = "dsa.html", ...props }, ref) => {
+    return (jsxs("div", { ref: ref, className: classnames("dsa-html", className), "ks-component": component, "ks-inverted": inverted ? "true" : undefined, ...props, children: [jsx("template", { dangerouslySetInnerHTML: { __html: html } }), consent && (jsxs("div", { style: {
                     backgroundImage: consentBackgroundImage
                         ? `url(${consentBackgroundImage})`
                         : undefined,
@@ -17,7 +17,7 @@ const HtmlContextDefault = forwardRef(({ html, consent, consentText, consentBack
                     "dsa-html__consent--sixteen-to-ten": consentAspectRatio === "16:10",
                     "dsa-html__consent--four-to-three": consentAspectRatio === "4:3",
                     "dsa-html__consent--square": consentAspectRatio === "1:1",
-                }), children: [consentText && jsx(RichText, { text: consentText }), jsx(Button, { type: "button", label: consentButtonLabel, className: "dsa-html__consent-button", variant: "tertiary" })] }))] }));
+                }), children: [consentText && jsx(RichText, { text: consentText }), jsx(Button, { type: "button", label: consentButtonLabel, className: "dsa-html__consent-button", variant: "primary" })] }))] }));
 });
 const HtmlContext = createContext(HtmlContextDefault);
 const Html = forwardRef((props, ref) => {

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

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

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

@@ -899,6 +899,12 @@
                       ],
                       "default": "16:9"
                     },
+                    "inverted": {
+                      "title": "Inverted",
+                      "description": "Invert the colors of the HTML",
+                      "type": "boolean",
+                      "default": false
+                    },
                     "className": {
                       "title": "Additional Classes",
                       "description": "Add additional css classes that should be applied to the element",

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 04 Feb 2025 15:27:01 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:23 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);

package/dist/components/presets.json

@@ -2095,7 +2095,8 @@
     "args": {
       "html": "<p style=\"color: var(--ks-text-color-default);\">Hello World</p>",
       "consent": false,
-      "consentAspectRatio": "16:9"
+      "consentAspectRatio": "16:9",
+      "inverted": false
     },
     "screenshot": "img/screenshots/components-html--html.png"
   },
@@ -2108,6 +2109,7 @@
       "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",
+      "inverted": false,
       "consentText": "would you like to watch the youtube video?",
       "consentButtonLabel": "yes!",
       "consentBackgroundImage": "img/02.jpg"
@@ -2123,6 +2125,7 @@
       "html": "<script>alert(\"Hello :)\")</script><p style=\"color: var(--ks-text-color-default);\">Nice to meet you!</p>",
       "consent": true,
       "consentAspectRatio": "16:9",
+      "inverted": false,
       "consentButtonLabel": "Say hello"
     },
     "screenshot": "img/screenshots/components-html--with-script.png"

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

@@ -885,6 +885,12 @@
                 ],
                 "default": "16:9"
               },
+              "inverted": {
+                "title": "Inverted",
+                "description": "Invert the colors of the HTML",
+                "type": "boolean",
+                "default": false
+              },
               "className": {
                 "title": "Additional Classes",
                 "description": "Add additional css classes that should be applied to the element",

package/dist/tokens/themes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 04 Feb 2025 15:27:04 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:25 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 Tue, 04 Feb 2025 15:27:08 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:29 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 Tue, 04 Feb 2025 15:27:06 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:27 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 Tue, 04 Feb 2025 15:27:11 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:31 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 Tue, 04 Feb 2025 15:27:01 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:23 GMT
  */
 
 :root, [ks-theme] {

package/dist/tokens/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 04 Feb 2025 15:27:02 GMT
+ * Generated on Wed, 05 Feb 2025 16:02:23 GMT
  */
 
 export const KsBackgroundColorAccentBase = "#230a2b";

package/package.json

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