@kickstartds/ds-agency-premium 1.2.34 → 1.3.0--canary.8.347.0

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

@@ -58,5 +58,6 @@ const BlogAside = forwardRef((props, ref) => {
     const Component = useContext(BlogAsideContext);
     return jsx(Component, { ...props, ref: ref });
 });
+BlogAside.displayName = "BlogAside";
 
 export { BlogAside, BlogAsideContext, BlogAsideContextDefault };

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

@@ -13,5 +13,6 @@ const BlogHead = forwardRef((props, ref) => {
     const Component = useContext(BlogHeadContext);
     return jsx(Component, { ...props, ref: ref });
 });
+BlogHead.displayName = "BlogHead";
 
 export { BlogHead, BlogHeadContext, BlogHeadContextDefault };

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

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { BlogOverviewProps } from "../../BlogOverviewProps-f385fc47.js";
-declare const BlogOverview: ({ latest, more, }: BlogOverviewProps) => import("react/jsx-runtime").JSX.Element;
+declare const BlogOverview: {
+    ({ latest, more }: BlogOverviewProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { BlogOverview };

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

@@ -10,8 +10,9 @@ import '@kickstartds/core/lib/component';
 import '@kickstartds/blog/lib/post-teaser';
 import '@kickstartds/core/lib/container';
 
-const BlogOverview = ({ latest, more = [], }) => {
+const BlogOverview = ({ latest, more = [] }) => {
     return (jsxs(Fragment, { children: [latest && (jsx(Section, { width: "wide", children: jsx(BlogTeaser, { ...latest }) })), more.length > 0 && (jsx(Section, { headline: { text: "More articles" }, children: more.map((article) => (createElement(BlogTeaser, { ...article, key: article.headline }))) }))] }));
 };
+BlogOverview.displayName = "BlogOverview";
 
 export { BlogOverview };

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

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import { BlogPostProps } from "../../BlogPostProps-0910f130.js";
-declare const BlogPost: ({ head, content, aside, cta }: BlogPostProps) => import("react/jsx-runtime").JSX.Element;
+declare const BlogPost: {
+    ({ head, content, aside, cta }: BlogPostProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export { BlogPost };

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

@@ -20,5 +20,6 @@ import '../button-group/index.js';
 import '@kickstartds/base/lib/button-group';
 
 const BlogPost = ({ head, content, aside, cta }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsxs(Split, { layout: "sidebarRight", children: [jsxs("div", { children: [head && jsx(BlogHead, { ...head }), jsx(Text, { text: content })] }), jsx(BlogAside, { ...aside })] }) }), cta && (jsx(Section, { children: jsx(Cta, { ...cta }) }))] }));
+BlogPost.displayName = "BlogPost";
 
 export { BlogPost };

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

@@ -42,5 +42,6 @@ const BlogTeaser = forwardRef((props, ref) => {
     const Component = useContext(BlogTeaserContext);
     return jsx(Component, { ...props, ref: ref });
 });
+BlogTeaser.displayName = "BlogTeaser";
 
 export { BlogTeaser, BlogTeaserContext, BlogTeaserContextDefault };

package/dist/components/button-group/index.js

@@ -20,6 +20,7 @@ const ButtonGroup = forwardRef(({ buttons, colorNeutral, size, ...props }, ref)
                         : "tertiary",
         })), ref: ref })) : null;
 });
+ButtonGroup.displayName = "ButtonGroup";
 const ButtonGroupProvider = (props) => (jsx(ButtonGroupContext.Provider, { ...props, value: ButtonGroup }));
 // hook to create a ButtonGroup, that can be used as ButtonContext.Provider value
 const useButtonGroup = () => {

package/dist/components/cta/index.js

@@ -37,5 +37,6 @@ const Cta = ({ headline, highlightText = false, sub, image, text, textAlign, bac
                 },
             } }) }));
 };
+Cta.displayName = "Cta";
 
 export { Cta };

package/dist/components/faq/index.js

@@ -9,5 +9,6 @@ const Faq = forwardRef((props, ref) => {
     const Component = useContext(FaqContext);
     return jsx(Component, { ...props, ref: ref });
 });
+Faq.displayName = "Faq";
 
 export { Faq, FaqContext, FaqContextDefault };

package/dist/components/feature/index.js

@@ -22,5 +22,6 @@ const Feature = forwardRef((props, ref) => {
     const Component = useContext(FeatureContext);
     return jsx(Component, { ...props, ref: ref });
 });
+Feature.displayName = "Feature";
 
 export { Feature, FeatureContext, FeatureContextDefault };

package/dist/components/features/index.js

@@ -21,5 +21,6 @@ const Features = forwardRef((props, ref) => {
     const Component = useContext(FeaturesContext);
     return jsx(Component, { ...props, ref: ref });
 });
+Features.displayName = "Features";
 
 export { Features, FeaturesContext, FeaturesContextDefault };

package/dist/components/footer/index.js

@@ -7,5 +7,6 @@ import { Link } from '@kickstartds/base/lib/link';
 
 const now = new Date();
 const Footer = ({ logo, logoHref = "/", navItems = [], }) => (jsx("div", { className: classnames("c-footer"), children: jsxs("div", { className: "c-footer__content", children: [jsx(Link, { className: "c-footer__logo", href: logoHref, children: jsx(Picture, { ...logo, lazy: true }) }), jsxs("span", { className: "c-footer__trademark", children: ["\u00A9 ", now.getFullYear(), " systemics Inc. All rights reserved."] }), navItems.length > 0 ? (jsx("div", { className: "c-footer__links", children: navItems.map(({ label, ...linkProps }) => (createElement(Link, { ...linkProps, className: "c-footer__link", key: linkProps.href + label }, label))) })) : null] }) }));
+Footer.displayName = "Footer";
 
 export { Footer };

package/dist/components/gallery/index.js

@@ -36,5 +36,6 @@ const Gallery = forwardRef((props, ref) => {
     const Component = useContext(GalleryContext);
     return jsx(Component, { ...props, ref: ref });
 });
+Gallery.displayName = "Gallery";
 
 export { Gallery, GalleryContext, GalleryContextDefault };

package/dist/components/header/index.js

@@ -12,5 +12,6 @@ import '@kickstartds/core/lib/core';
 import '../nav-main/js/body.client.js';
 
 const Header = ({ logo, floating, logoHref = "/", navItems = [], }) => (jsx(Fragment, { children: jsx("div", { className: classnames("dsa-header", floating ? `dsa-header--floating` : ""), children: jsxs("div", { className: "dsa-header__content", children: [jsx(Link, { className: "dsa-header__logo", href: logoHref, children: jsx(Picture, { ...logo, lazy: false }) }), jsx(NavMain, { logo: logo, logoHref: logoHref, items: navItems })] }) }) }));
+Header.displayName = "Header";
 
 export { Header };

package/dist/components/headline/index.js

@@ -2,13 +2,12 @@ import "./headline.css";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import classnames from 'classnames';
 import { forwardRef } from 'react';
-import ReactMarkdown from 'react-markdown';
+import { compiler } from 'markdown-to-jsx';
 import { HeadlineContext } from '@kickstartds/base/lib/headline';
 
-const markdownRenderFn = (text) => (jsx(ReactMarkdown, { children: text, components: { p: "span" } }));
 const Headline = forwardRef(({ content, text = content, sub, align = "left", switchOrder = false, level = "h2", 
 // @ts-expect-error: Some kDS Components set the `styleAs`Props (e.g. https://github.com/kickstartDS/content/blob/next/source/storytelling/StorytellingComponent.tsx#L146)
-styleAs, style = styleAs || "h2", spaceAfter = "small", className, renderContent = markdownRenderFn, renderSubheadline = markdownRenderFn, ...props }, ref) => {
+styleAs, style = styleAs || "h2", spaceAfter = "small", className, renderContent = compiler, renderSubheadline = compiler, ...props }, ref) => {
     const TagName = level;
     return text || sub ? (jsxs("header", { className: classnames("dsa-headline", `dsa-headline--${style}`, style !== "none" && style !== level && `dsa-headline--${style}`, `dsa-headline--align-${align}`, spaceAfter && `dsa-headline--space-after-${spaceAfter}`, className), ref: ref, ...props, children: [sub && switchOrder && (jsx("p", { className: "dsa-headline__subheadline", children: renderSubheadline(sub) })), jsx(TagName, { className: classnames("dsa-headline__headline"), children: renderContent(text) }), sub && !switchOrder && (jsx("p", { className: "dsa-headline__subheadline", children: renderSubheadline(sub) }))] })) : null;
 });

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

@@ -1,4 +1,7 @@
-import { FC } from "react";
+/// <reference types="react" />
+import { HTMLAttributes } from "react";
 import { HeroProps } from "../../HeroProps-cf82a16d.js";
-declare const Hero: FC<HeroProps>;
-export { Hero };
+declare const HeroContextDefault: import("react").ForwardRefExoticComponent<HeroProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+declare const HeroContext: import("react").Context<import("react").ForwardRefExoticComponent<HeroProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const Hero: import("react").ForwardRefExoticComponent<HeroProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { HeroContextDefault, HeroContext, Hero };

package/dist/components/hero/index.js

@@ -1,20 +1,20 @@
 import "./hero.css";
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef, createContext, useContext } from 'react';
 import { VisualContextDefault } from '@kickstartds/content/lib/visual';
 import classnames from 'classnames';
 import { Container } from '@kickstartds/core/lib/container';
 import { ButtonContext } from '@kickstartds/base/lib/button';
 import { useButtonGroup } from '../button-group/index.js';
-import 'react';
 import '@kickstartds/base/lib/button-group';
 
-const Hero = ({ headline, sub, height, text, highlightText, textPosition = "center", colorNeutral, image, overlay, textbox, buttons = [], }) => {
+const HeroContextDefault = forwardRef(({ headline, sub, height, text, highlightText, textPosition = "center", colorNeutral, image, overlay, textbox, buttons = [], ...rest }, ref) => {
     const ButtonGroup = useButtonGroup();
     return (jsx(ButtonContext.Provider
     // @ts-expect-error
     , { 
         // @ts-expect-error
-        value: ButtonGroup, children: jsx(Container, { name: "visual", children: jsx(VisualContextDefault, { className: classnames(`dsa-hero dsa-hero--content-${textPosition}`, highlightText ? `dsa-hero--highlight-text` : "", colorNeutral ? `dsa-hero--color-neutral` : ""), height: height, overlay: overlay, box: {
+        value: ButtonGroup, children: jsx(Container, { name: "visual", children: jsx(VisualContextDefault, { ...rest, ref: ref, className: classnames(`dsa-hero dsa-hero--content-${textPosition}`, highlightText ? `dsa-hero--highlight-text` : "", colorNeutral ? `dsa-hero--color-neutral` : ""), height: height, overlay: overlay, box: {
                     background: textbox === true ? "solid" : "transparent",
                     enabled: true,
                     vertical: textPosition === "below" ? "bottom" : "center",
@@ -50,6 +50,12 @@ const Hero = ({ headline, sub, height, text, highlightText, textPosition = "cent
                         srcDesktop: image.srcDesktop,
                     },
                 } }) }) }));
-};
+});
+const HeroContext = createContext(HeroContextDefault);
+const Hero = forwardRef((props, ref) => {
+    const Component = useContext(HeroContext);
+    return jsx(Component, { ...props, ref: ref });
+});
+Hero.displayName = "Hero";
 
-export { Hero };
+export { Hero, HeroContext, HeroContextDefault };

package/dist/components/image-story/index.d.ts

@@ -1,4 +1,7 @@
-import { FC } from "react";
+/// <reference types="react" />
+import { HTMLAttributes } from "react";
 import { ImageStoryProps } from "../../ImageStoryProps-24e0335c.js";
-declare const ImageStory: FC<ImageStoryProps>;
-export { ImageStory };
+declare const ImageStoryContextDefault: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ImageStoryContext: import("react").Context<import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const ImageStory: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { ImageStoryContextDefault, ImageStoryContext, ImageStory };

package/dist/components/image-story/index.js

@@ -1,19 +1,19 @@
 import "./image-story.css";
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef, createContext, useContext } from 'react';
 import { Storytelling } from '@kickstartds/content/lib/storytelling';
 import { ButtonContext } from '@kickstartds/base/lib/button';
 import classnames from 'classnames';
 import { useButtonGroup } from '../button-group/index.js';
-import 'react';
 import '@kickstartds/base/lib/button-group';
 
-const ImageStory = ({ headline, largeHeadline = false, sub, image, padding = false, textAlign = "left", layout = "textLeft", buttons = [], text, }) => {
+const ImageStoryContextDefault = forwardRef(({ headline, largeHeadline = false, sub, image, padding = false, textAlign = "left", layout = "textLeft", buttons = [], text, ...rest }, ref) => {
     const ButtonGroup = useButtonGroup();
     return (jsx(ButtonContext.Provider
     // @ts-expect-error
     , { 
         // @ts-expect-error
-        value: ButtonGroup, children: jsx(Storytelling, { className: classnames("c-image-story"), full: padding === false ? true : false, image: {
+        value: ButtonGroup, children: jsx(Storytelling, { ...rest, ref: ref, className: classnames("c-image-story"), full: padding === false ? true : false, image: {
                 source: image?.src,
                 order: {
                     desktopImageLast: layout === "imageLeft" ? false : true,
@@ -34,6 +34,12 @@ const ImageStory = ({ headline, largeHeadline = false, sub, image, padding = fal
                     align: textAlign,
                 },
             } }) }));
-};
+});
+const ImageStoryContext = createContext(ImageStoryContextDefault);
+const ImageStory = forwardRef((props, ref) => {
+    const Component = useContext(ImageStoryContext);
+    return jsx(Component, { ...props, ref: ref });
+});
+ImageStory.displayName = "ImageStory";
 
-export { ImageStory };
+export { ImageStory, ImageStoryContext, ImageStoryContextDefault };

package/dist/components/image-text/index.js

@@ -21,6 +21,7 @@ const ImageText = forwardRef((props, ref) => {
     const Component = useContext(ImageTextContext);
     return jsx(Component, { ...props, ref: ref });
 });
+ImageText.displayName = "ImageText";
 const ImageTextProvider = (props) => (jsx(TextMediaContext.Provider, { ...props, value: ImageTextContextDefault }));
 
 export { ImageText, ImageTextContext, ImageTextContextDefault, ImageTextProvider };

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

@@ -1,4 +1,7 @@
-import { HTMLAttributes, FC } from "react";
+/// <reference types="react" />
+import { HTMLAttributes } from "react";
 import { LogosProps } from "../../LogosProps-58c84ccc.js";
-declare const Logos: FC<LogosProps & HTMLAttributes<HTMLElement>>;
-export { Logos };
+declare const LogosContextDefault: import("react").ForwardRefExoticComponent<LogosProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+declare const LogosContext: import("react").Context<import("react").ForwardRefExoticComponent<LogosProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const Logos: import("react").ForwardRefExoticComponent<LogosProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { LogosContextDefault, LogosContext, Logos };

package/dist/components/logos/index.js

@@ -1,12 +1,18 @@
 import "./logos.css";
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { forwardRef, createContext, useContext } from 'react';
 import classnames from 'classnames';
 import { LogoTiles } from '@kickstartds/content/lib/logo-tiles';
 import { Button } from '@kickstartds/base/lib/button';
 import { Link } from '@kickstartds/base/lib/link';
+import { Container } from '@kickstartds/core/lib/container';
 
-const Logos = ({ logo: logos = [], tagline, align, cta, logosPerRow = "6", }) => {
-    return (jsx(Fragment, { children: jsxs("div", { className: classnames(`dsa-logos dsa-logos--align-${align}`), children: [jsx("div", { className: "dsa-logos__tagline", children: tagline }), jsx(LogoTiles, { className: classnames(`dsa-logo-tiles dsa-logo-tiles--cols-${logosPerRow}`), logos: logos }), cta?.toggle ? (jsxs("div", { className: "dsa-logos__cta", children: [jsxs("div", { className: "dsa-logos__cta__text", children: [cta?.text, cta?.style === "text" ? (jsxs(Fragment, { children: [" ", jsx(Link, { className: "dsa-logos__cta__link", href: cta.link, children: cta.label })] })) : ("")] }), cta?.style === "button" ? (jsx(Button, { href: cta.link, label: cta.label })) : ("")] })) : ("")] }) }));
-};
+const LogosContextDefault = forwardRef(({ logo: logos = [], tagline, align, cta, logosPerRow = "6", ...rest }, ref) => (jsx("div", { ...rest, ref: ref, children: jsx(Container, { name: "logos", children: jsxs("div", { className: classnames(`dsa-logos dsa-logos--align-${align}`), children: [jsx("div", { className: "dsa-logos__tagline", children: tagline }), jsx(LogoTiles, { className: classnames(`dsa-logo-tiles dsa-logo-tiles--cols-${logosPerRow}`), logos: logos }), cta?.toggle ? (jsxs("div", { className: "dsa-logos__cta", children: [jsxs("div", { className: "dsa-logos__cta__text", children: [cta?.text, cta?.style === "text" ? (jsxs(Fragment, { children: [" ", jsx(Link, { className: "dsa-logos__cta__link", href: cta.link, children: cta.label })] })) : ("")] }), cta?.style === "button" ? (jsx(Button, { href: cta.link, label: cta.label })) : ("")] })) : ("")] }) }) })));
+const LogosContext = createContext(LogosContextDefault);
+const Logos = forwardRef((props, ref) => {
+    const Component = useContext(LogosContext);
+    return jsx(Component, { ...props, ref: ref });
+});
+Logos.displayName = "Logos";
 
-export { Logos };
+export { Logos, LogosContext, LogosContextDefault };

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

@@ -1,4 +1,7 @@
-import { FC } from "react";
+/// <reference types="react" />
+import { HTMLAttributes } from "react";
 import { MosaicProps } from "../../MosaicProps-aacb9422.js";
-declare const Mosaic: FC<MosaicProps>;
-export { Mosaic };
+declare const MosaicContextDefault: import("react").ForwardRefExoticComponent<MosaicProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+declare const MosaicContext: import("react").Context<import("react").ForwardRefExoticComponent<MosaicProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const Mosaic: import("react").ForwardRefExoticComponent<MosaicProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { MosaicContextDefault, MosaicContext, Mosaic };

package/dist/components/mosaic/index.js

@@ -1,8 +1,9 @@
 import "./mosaic.css";
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef, createContext, useContext } from 'react';
 import { Storytelling } from '@kickstartds/content/lib/storytelling';
 
-const Mosaic = ({ layout, largeHeadlines, tiles }) => (jsx("div", { className: "dsa-mosaic", children: tiles.map((tile, index) => (jsx(Storytelling, { full: true, backgroundColor: tile.backgroundColor, backgroundImage: tile.backgroundImage, box: {
+const MosaicContextDefault = forwardRef(({ layout, largeHeadlines, tiles, ...rest }, ref) => (jsx("div", { ...rest, ref: ref, className: "dsa-mosaic", children: tiles.map((tile, index) => (jsx(Storytelling, { full: true, backgroundColor: tile.backgroundColor, backgroundImage: tile.backgroundImage, box: {
             headline: {
                 text: tile?.headline,
                 sub: tile?.sub,
@@ -28,6 +29,12 @@ const Mosaic = ({ layout, largeHeadlines, tiles }) => (jsx("div", { className: "
                         ? false
                         : index % 2 !== 0,
             },
-        } }, index))) }));
+        } }, index))) })));
+const MosaicContext = createContext(MosaicContextDefault);
+const Mosaic = forwardRef((props, ref) => {
+    const Component = useContext(MosaicContext);
+    return jsx(Component, { ...props, ref: ref });
+});
+Mosaic.displayName = "Mosaic";
 
-export { Mosaic };
+export { Mosaic, MosaicContext, MosaicContextDefault };

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

@@ -1397,7 +1397,14 @@
                       "type": "string"
                     },
                     "typeProp": {
-                      "const": "slider"
+                      "title": "Type",
+                      "description": "Type of the movement",
+                      "type": "string",
+                      "enum": [
+                        "slider",
+                        "carousel"
+                      ],
+                      "default": "carousel"
                     }
                   },
                   "additionalProperties": false

package/dist/components/page-wrapper/index.js

@@ -16,7 +16,7 @@ import '../teaser-card/index.js';
 import '@kickstartds/base/lib/teaser-box';
 import '@kickstartds/core/lib/container';
 import '../headline/index.js';
-import 'react-markdown';
+import 'markdown-to-jsx';
 import '@kickstartds/base/lib/headline';
 import '@bedrock-layout/spacing-constants';
 import '../button-group/index.js';

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

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 14 Mar 2024 14:06:57 GMT
+ * Generated on Mon, 15 Apr 2024 13:52:27 GMT
  */
 :root, [ks-theme] {
   --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);