@kickstartds/ds-agency-premium 1.6.71--canary.54.2407.0 → 1.6.71

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

@@ -1,6 +1,6 @@
 {
   "$schema": "http://json-schema.org/draft-07/schema#",
-  "$id": "http://cms.mydesignsystem.com/blog-post.schema.json",
+  "$id": "http://schema.mydesignsystem.com/cms/blog-post.schema.json",
   "title": "Blog Post",
   "description": "Abstracts a blog post concept into JSON schema",
   "type": "object",
@@ -30,7 +30,7 @@
       "$ref": "http://schema.mydesignsystem.com/cta.schema.json"
     },
     "seo": {
-      "$ref": "http://cms.mydesignsystem.com/seo.schema.json"
+      "$ref": "http://schema.mydesignsystem.com/cms/seo.schema.json"
     }
   }
 }

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

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

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

@@ -1,5 +1,5 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { SplitWeighted } from '../split-weighted/index.js';
+import { Split } from '../split/index.js';
 import { BlogHead } from '../blog-head/index.js';
 import { Section } from '../section/index.js';
 import { BlogAside } from '../blog-aside/index.js';
@@ -7,7 +7,6 @@ import { Text } from '../text/index.js';
 import { Cta } from '../cta/index.js';
 import 'classnames';
 import 'react';
-import '../../helpers-12f48df8.js';
 import '@kickstartds/blog/lib/post-head';
 import '@kickstartds/core/lib/react';
 import '@kickstartds/base/lib/section';
@@ -31,9 +30,7 @@ import '@kickstartds/base/lib/button';
 import '../button-group/index.js';
 import '@kickstartds/base/lib/button-group';
 
-const BlogPost = ({ head, content, aside, cta, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsx(SplitWeighted, { verticalAlign: "sticky", horizontalGutter: "large", mainLayout: {
-                    minWidth: "narrow",
-                }, main: jsxs(Fragment, { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), aside: aside && jsx(BlogAside, { ...aside }) }) }), cta && (jsx(Fragment, { children: jsx(Section, { backgroundColor: "accent", content: { mode: "list" }, children: jsx(Cta, { ...cta }) }) }))] }));
+const BlogPost = ({ head, content, aside, cta, children, }) => (jsxs(Fragment, { children: [jsx(Section, { width: "wide", children: jsxs(Split, { mainSectionWidth: "narrow", layout: "sidebarRight", children: [jsxs("div", { children: [head && jsx(BlogHead, { ...head }), content ? jsx(Text, { text: content }) : children] }), jsx(BlogAside, { ...aside })] }) }), cta && (jsx(Fragment, { children: jsx(Section, { spaceAfter: "none", spaceBefore: "none", content: { mode: "list" }, children: jsx(Cta, { ...cta }) }) }))] }));
 BlogPost.displayName = "BlogPost";
 
 export { BlogPost };

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

@@ -9,6 +9,9 @@
       "title": "Entry",
       "description": "Name of the tag entry",
       "type": "string"
+    },
+    "type": {
+      "const": "blog-tag"
     }
   },
   "additionalProperties": false,

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

@@ -11,7 +11,7 @@
   --dsa-blog-teaser__topic--font-weight: var(--dsa-topic--font-weight);
   --dsa-blog-teaser__tag-label--font: var(--ks-font-interface-xs);
   --dsa-blog-teaser__copy--font: var(--ks-font-copy-s);
-  --dsa-blog-teaser__copy--color: var(--ks-text-color-copy);
+  --dsa-blog-teaser__copy--color: var(--dsa-rich-text--color);
   --dsa-blog-teaser__copy--color_hover: var(--ks-text-color-default);
   --dsa-blog-teaser__copy--margin-top: 0.5em;
   --dsa-blog-teaser__meta--font: var(--ks-spacing-stack-s);
@@ -43,7 +43,7 @@
   --c-teaser--background: var(--dsa-blog-teaser--background, transparent);
   --c-post-teaser--gap: var(--dsa-blog-teaser--gap, var(--ks-spacing-stack-s) var(--ks-spacing-inline-s));
   --c-teaser_text--spacing: var(--dsa-blog-teaser__copy--margin-top, var(--ks-spacing-stack-s));
-  --c-post-teaser--color: var(--dsa-blog-teaser__copy--color, var(--ks-text-color-copy));
+  --c-post-teaser--color: var(--dsa-blog-teaser__copy--color, var(--dsa-rich-text--color));
 }
 .dsa-blog-teaser.c-post-teaser .c-tag-label {
   --c-tag-label--font: var(--dsa-blog-teaser__tag-label--font, var(--ks-font-interface-s));

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

@@ -29,6 +29,9 @@
             "title": "Entry",
             "description": "Name of the tag entry",
             "type": "string"
+          },
+          "type": {
+            "const": "blog-tag"
           }
         },
         "additionalProperties": false,
@@ -147,6 +150,9 @@
     },
     "className": {
       "type": "string"
+    },
+    "type": {
+      "const": "blog-teaser"
     }
   },
   "additionalProperties": false,

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

@@ -4,15 +4,6 @@ import classnames from 'classnames';
 import { forwardRef, createContext, useContext } from 'react';
 import { PostTeaserContextDefault } from '@kickstartds/blog/lib/post-teaser';
 import { Container } from '@kickstartds/core/lib/container';
-import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
-
-const defaults = {
-    "tags": [],
-    "link": {
-        "text": "Read article"
-    },
-    "author": {}
-};
 
 const BlogTeaserContextDefault = forwardRef(({ date, tags = [], headline, teaserText, image, alt, link, readingTime, author, className, ...rest }, ref) => {
     const teaserMetaItems = [];
@@ -36,18 +27,20 @@ const BlogTeaserContextDefault = forwardRef(({ date, tags = [], headline, teaser
                     }
                     : undefined,
                 items: teaserMetaItems,
-            }, link: {
-                //@ts-expect-error
-                url: link.url,
-                label: link?.text || "Read article",
-            }, title: headline, body: teaserText, categories: tags.map((tag) => {
+            }, link: link
+                ? {
+                    // @ts-expect-error
+                    target: link.url,
+                    label: link.text || "Read article",
+                }
+                : undefined, title: headline, body: teaserText, categories: tags.map((tag) => {
                 return { label: tag.entry };
             }), ref: ref }) }));
 });
 const BlogTeaserContext = createContext(BlogTeaserContextDefault);
 const BlogTeaser = forwardRef((props, ref) => {
     const Component = useContext(BlogTeaserContext);
-    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
+    return jsx(Component, { ...props, ref: ref });
 });
 BlogTeaser.displayName = "BlogTeaser";
 

package/dist/components/button/button.css

@@ -1,7 +1,7 @@
 .dsa-button {
-  --dsa-button--padding: 0.75em 1.5em;
+  --dsa-button--padding: 0.75em 2em;
   --dsa-button--border-width: var(--ks-border-width-default);
-  --dsa-button--border-radius: var(--ks-border-radius-control);
+  --dsa-button--border-radius: var(--ks-border-radius-pill);
   --dsa-button--font-weight: var(--ks-font-weight-semi-bold);
   --dsa-button--text-transform: default;
   --dsa-button_small--font: var(--ks-font-interface-s);
@@ -16,11 +16,9 @@
   --dsa-button_secondary--color: var(--ks-text-color-default);
   --dsa-button_secondary--color_hover: var(--ks-text-color-default);
   --dsa-button_secondary--color_active: var(--ks-text-color-default);
-  --dsa-button_secondary--border-color: var(--ks-border-color-interface-interactive);
-  --dsa-button_secondary--border-color_hover: var(--ks-border-color-interface-interactive-hover);
-  --dsa-button_secondary--border-color_active: var(--ks-border-color-interface-interactive-active);
-  --dsa-button_secondary--background-color_hover: transparent;
-  --dsa-button_secondary--background-color_active: transparent;
+  --dsa-button_secondary--background-color: var(--ks-background-color-interface-interactive);
+  --dsa-button_secondary--background-color_hover: var(--ks-background-color-interface-interactive-hover);
+  --dsa-button_secondary--background-color_active: var(--ks-background-color-interface-interactive-active);
   --dsa-button_terciary--color: var(--ks-text-color-default);
   --dsa-button_terciary--color_hover: var(--ks-text-color-default);
   --dsa-button_terciary--color_active: var(--ks-text-color-default);

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

@@ -13,10 +13,10 @@
         "Book a meeting"
       ]
     },
-    "url": {
+    "target": {
       "type": "string",
-      "title": "URL",
-      "description": "The URL to link to when the button is clicked",
+      "title": "Target",
+      "description": "Target that should be linked, makes the button behave like a link semantically",
       "format": "uri"
     },
     "variant": {
@@ -54,13 +54,7 @@
       "default": false
     },
     "type": {
-      "type": "string",
-      "title": "Button Type",
-      "enum": [
-        "button",
-        "submit",
-        "reset"
-      ]
+      "const": "button"
     }
   },
   "additionalProperties": false,

package/dist/components/button/button.schema.json

@@ -11,10 +11,10 @@
       "description": "Text content to display inside the button",
       "examples": ["Book a meeting"]
     },
-    "url": {
+    "target": {
       "type": "string",
-      "title": "URL",
-      "description": "The URL to link to when the button is clicked",
+      "title": "Target",
+      "description": "Target that should be linked, makes the button behave like a link semantically",
       "format": "uri"
     },
     "variant": {
@@ -42,11 +42,6 @@
       "title": "Disabled?",
       "description": "Whether the button should be disabled",
       "default": false
-    },
-    "type": {
-      "type": "string",
-      "title": "Button Type",
-      "enum": ["button", "submit", "reset"]
     }
   },
   "additionalProperties": false,

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { HTMLAttributes, FC, PropsWithChildren } from "react";
-import { ButtonProps } from "../../ButtonProps-4e2b2ecf.js";
+import { ButtonProps } from "../../ButtonProps-03ff6d21.js";
 declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 declare const ButtonProvider: FC<PropsWithChildren>;
 export type { ButtonProps };

package/dist/components/button/index.js

@@ -3,26 +3,16 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import classnames from 'classnames';
 import { ButtonContextDefault, ButtonContext } from '@kickstartds/base/lib/button';
-import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
 
-const defaults = {
-    "variant": "secondary",
-    "size": "medium",
-    "disabled": false
-};
-
-const Button = forwardRef((props, ref) => {
-    const { label, url, size = "medium", variant = "secondary", icon, disabled = false, className, ...rest } = deepMergeDefaults(defaults, props);
-    return (jsx(ButtonContextDefault, { ...rest, className: classnames("dsa-button", className), href: url, label: label, size: size, variant: variant === "primary"
-            ? "solid"
-            : variant === "secondary"
-                ? "clear"
-                : variant === "tertiary"
-                    ? "outline"
-                    : "solid", disabled: disabled, iconAfter: {
-            icon: icon,
-        }, ref: ref }));
-});
+const Button = forwardRef(({ label, target, size = "medium", variant = "secondary", icon, disabled = false, className, ...props }, ref) => (jsx(ButtonContextDefault, { ...props, className: classnames("dsa-button", className), href: target, label: label, size: size, variant: variant === "primary"
+        ? "solid"
+        : variant === "secondary"
+            ? "clear"
+            : variant === "tertiary"
+                ? "outline"
+                : "solid", disabled: disabled, iconAfter: {
+        icon: icon,
+    }, ref: ref })));
 Button.displayName = "Button";
 const ButtonProvider = (props) => (jsx(ButtonContext.Provider, { ...props, value: Button }));
 

package/dist/components/button-group/button-group.schema.dereffed.json

@@ -23,10 +23,10 @@
               "Book a meeting"
             ]
           },
-          "url": {
+          "target": {
             "type": "string",
-            "title": "URL",
-            "description": "The URL to link to when the button is clicked",
+            "title": "Target",
+            "description": "Target that should be linked, makes the button behave like a link semantically",
             "format": "uri"
           },
           "variant": {
@@ -64,13 +64,7 @@
             "default": false
           },
           "type": {
-            "type": "string",
-            "title": "Button Type",
-            "enum": [
-              "button",
-              "submit",
-              "reset"
-            ]
+            "const": "button"
           }
         },
         "additionalProperties": false,
@@ -86,9 +80,9 @@
       "type": "boolean"
     },
     "size": {
+      "title": "Button Size",
+      "description": "Choose a size between small, medium and large",
       "type": "string",
-      "title": "Size",
-      "description": "Size of button to use",
       "enum": [
         "small",
         "medium",
@@ -113,6 +107,9 @@
       "title": "Additional Classes",
       "description": "Add additional css classes that should be applied to the button",
       "type": "string"
+    },
+    "type": {
+      "const": "button-group"
     }
   },
   "additionalProperties": false

package/dist/components/button-group/index.d.ts

@@ -6,7 +6,7 @@ import { FC, PropsWithChildren } 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 { ButtonProps } from "../../ButtonProps-4e2b2ecf.js";
+import { ButtonProps } from "../../ButtonProps-03ff6d21.js";
 /**
  * Buttons of the Button Group
  */
@@ -16,9 +16,9 @@ type Buttons = ButtonProps[];
  */
 type ColorNeutral = boolean;
 /**
- * Size of button to use
+ * Choose a size between small, medium and large
  */
-type Size = "small" | "medium" | "large";
+type ButtonSize = "small" | "medium" | "large";
 /**
  * Vertical arrangement of the buttons
  */
@@ -30,7 +30,7 @@ type AdditionalClasses = string;
 interface ButtonGroupProps {
     buttons?: Buttons;
     colorNeutral?: ColorNeutral;
-    size?: Size;
+    size?: ButtonSize;
     arrangement?: ButtonArrangement;
     className?: AdditionalClasses;
 }

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

@@ -2,18 +2,9 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useContext } from 'react';
 import { ButtonContext } from '@kickstartds/base/lib/button';
 import { ButtonGroupContextDefault, ButtonGroupContext } from '@kickstartds/base/lib/button-group';
-import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
 
-const defaults = {
-    "buttons": [],
-    "colorNeutral": false,
-    "size": "medium",
-    "arrangement": "left"
-};
-
-const ButtonGroup = forwardRef((props, ref) => {
-    const { buttons, colorNeutral, size, ...rest } = deepMergeDefaults(defaults, props);
-    return buttons && buttons.length > 0 ? (jsx(ButtonGroupContextDefault, { ...rest, items: buttons
+const ButtonGroup = forwardRef(({ buttons, colorNeutral, size, ...props }, ref) => {
+    return buttons && buttons.length > 0 ? (jsx(ButtonGroupContextDefault, { ...props, items: buttons
             .filter((button) => button.label)
             .map((button, index) => ({
             size: size,

package/dist/components/contact/contact.css

@@ -4,22 +4,22 @@
 }
 
 .dsa-contact {
-  --dsa-contact--gap-horizontal: var(--ks-spacing-inline-s);
-  --dsa-contact--gap-vertical: var(--ks-spacing-stack-s);
+  --dsa-contact--gap-horizontal: var(--ks-spacing-inline-m);
+  --dsa-contact--gap-vertical: var(--ks-spacing-stack-m);
   --dsa-contact__header--gap: 0;
-  --dsa-contact__image--flex-basis: var(--dsa-tile--width_smallest);
+  --dsa-contact__image--flex-basis: 200px;
   --dsa-contact__image--border-radius: var(--ks-border-radius-card);
   --dsa-contact__body--gap: var(--ks-spacing-stack-xs);
-  --dsa-contact__body--flex-basis: var(--dsa-tile--width_small);
-  --dsa-contact__copy--font: var(--ks-font-copy-m);
-  --dsa-contact__copy--color: var(--ks-text-color-copy);
+  --dsa-contact__body--flex-basis: 300px;
+  --dsa-contact__copy--font: var(--dsa-rich-text--font);
+  --dsa-contact__copy--color: var(--dsa-rich-text--color);
   --dsa-contact__title--color: var(--ks-text-color-display);
   --dsa-contact__title--font: var(--ks-font-copy-l);
   --dsa-contact__title--font-weight: var(--ks-font-weight-bold);
   --dsa-contact__subtitle--color: var(--ks-text-color-display);
   --dsa-contact__subtitle--font: var(--ks-font-copy-m);
   --dsa-contact__subtitle--font-weight: var(--ks-font-weight-regular);
-  --dsa-contact__links--gap: calc(var(--ks-spacing-xxs) * 0.5);
+  --dsa-contact__links--gap: 0;
   --dsa-contact__link--color: var(--dsa-link--color);
   --dsa-contact__link--color_hover: var(--dsa-link--color_hover);
   --dsa-contact__link--font: var(--ks-font-interface-m);
@@ -40,7 +40,7 @@
 .dsa-contact {
   display: flex;
   flex-wrap: wrap;
-  gap: var(--dsa-contact--gap-vertical) var(--dsa-contact--gap-horizontal);
+  gap: var(--dsa-contact--gap-horizontal) var(--dsa-contact--gap-vertical);
 }
 .dsa-contact__image-wrap, .dsa-contact__body {
   flex-grow: 1;
@@ -48,7 +48,7 @@
 .dsa-contact__body {
   display: flex;
   flex-grow: 1;
-  flex-shrink: 1;
+  flex-shrink: 0;
   flex-direction: column;
   gap: var(--dsa-contact__body--gap);
   flex-basis: var(--dsa-contact__body--flex-basis);
@@ -62,7 +62,6 @@
   flex-basis: var(--dsa-contact__image--flex-basis);
   height: 100%;
   width: 100%;
-  flex-shrink: 1;
 }
 .dsa-contact--image-full-width .dsa-contact__image-wrap {
   flex-grow: 1;
@@ -113,7 +112,6 @@
   font: var(--dsa-contact__link--font);
   font-weight: var(--dsa-contact__link--font-weight);
   text-decoration: var(--dsa-contact__link--text-decoration);
-  width: fit-content;
 }
 .dsa-contact a.dsa-contact__link .icon {
   width: var(--dsa-contact__link__icon--size);
@@ -124,4 +122,12 @@
 .dsa-contact a.dsa-contact__link:hover {
   color: var(--dsa-contact__link--color_hover);
   text-decoration: var(--dsa-contact__link--text-decoration_hover);
+}
+.dsa-contact .c-headline {
+  --c-headline--color: var(--dsa-contact__headline--color);
+  --c-headline--font: var(--dsa-contact__headline--font);
+  --c-headline--font-weight: var(--dsa-contact__headline--font-weight);
+  --c-headline__subheadline--color: var(--dsa-contact__headline__subheadline--color);
+  --c-headline__subheadline--font: var(--dsa-contact__headline__subheadline--font);
+  --c-headline__subheadline--font-weight: var(--dsa-contact__headline__subheadline--font-weight);
 }

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

@@ -22,7 +22,7 @@
           "title": "Alt Text",
           "description": "Alt text of the image",
           "examples": [
-            "Picture of Isabella Doe"
+            "Picture of Jane Smith"
           ]
         },
         "fullWidth": {
@@ -50,7 +50,7 @@
       "description": "Name, company name, etc.",
       "type": "string",
       "examples": [
-        "Isabella Doe"
+        "Jane Smith"
       ]
     },
     "subtitle": {
@@ -73,7 +73,7 @@
           "label": {
             "type": "string"
           },
-          "url": {
+          "href": {
             "type": "string",
             "format": "uri"
           },
@@ -82,14 +82,6 @@
             "description": "Open link in new Tab",
             "type": "boolean",
             "default": false
-          },
-          "ariaLabel": {
-            "title": "Aria Label",
-            "description": "Aria label for the link",
-            "type": "string",
-            "examples": [
-              "Link to Isabella Doe's social media profile"
-            ]
           }
         },
         "additionalProperties": false
@@ -99,12 +91,12 @@
           {
             "icon": "phone",
             "label": "0228 / 688 966 20",
-            "url": "tel:+4922868896620"
+            "href": "tel:+4922868896620"
           },
           {
             "icon": "email",
             "label": "mail@example.com",
-            "url": "mailto:mail@example.com"
+            "href": "mailto:mail@example.com"
           }
         ]
       ]
@@ -122,6 +114,9 @@
       "title": "`ks-component` attribute",
       "description": "Optional custom component identifier",
       "type": "string"
+    },
+    "type": {
+      "const": "contact"
     }
   },
   "additionalProperties": false,

package/dist/components/contact/contact.schema.json

@@ -19,7 +19,7 @@
           "type": "string",
           "title": "Alt Text",
           "description": "Alt text of the image",
-          "examples": ["Picture of Isabella Doe"]
+          "examples": ["Picture of Jane Smith"]
         },
         "fullWidth": {
           "type": "boolean",
@@ -40,7 +40,7 @@
       "title": "Title",
       "description": "Name, company name, etc.",
       "type": "string",
-      "examples": ["Isabella Doe"]
+      "examples": ["Jane Smith"]
     },
     "subtitle": {
       "title": "Subtitle",
@@ -60,7 +60,7 @@
           "label": {
             "type": "string"
           },
-          "url": {
+          "href": {
             "type": "string",
             "format": "uri"
           },
@@ -69,12 +69,6 @@
             "description": "Open link in new Tab",
             "type": "boolean",
             "default": false
-          },
-          "ariaLabel": {
-            "title": "Aria Label",
-            "description": "Aria label for the link",
-            "type": "string",
-            "examples": ["Link to Isabella Doe's social media profile"]
           }
         },
         "additionalProperties": false
@@ -84,12 +78,12 @@
           {
             "icon": "phone",
             "label": "0228 / 688 966 20",
-            "url": "tel:+4922868896620"
+            "href": "tel:+4922868896620"
           },
           {
             "icon": "email",
             "label": "mail@example.com",
-            "url": "mailto:mail@example.com"
+            "href": "mailto:mail@example.com"
           }
         ]
       ]

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

@@ -1,6 +1,70 @@
 /// <reference types="react" />
 import { HTMLAttributes, FC, PropsWithChildren } from "react";
-import { ContactProps } from "../../ContactProps-7cac90e5.js";
+/* eslint-disable */
+/**
+ * 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.
+ */
+/**
+ * URL of the image to display
+ */
+type ImageSource = string;
+/**
+ * Alt text of the image
+ */
+type AltText = string;
+/**
+ * Image uses all the horizontal space vailable
+ */
+type FullWidth = boolean;
+/**
+ * Aspect Ratio of the Images
+ */
+type AspectRatio = "wide" | "square" | "vertical";
+/**
+ * Name, company name, etc.
+ */
+type Title = string;
+/**
+ * Position, profession, department, location, etc.
+ */
+type Subtitle = string;
+/**
+ * Open link in new Tab
+ */
+type OpenLinkInNewTab = boolean;
+type CopyText = string;
+/**
+ * Additional css classes attached to the wrapping element
+ */
+type Class = string;
+/**
+ * Optional custom component identifier
+ */
+type KsComponentAttribute = string;
+/**
+ * Component used for user interaction
+ */
+interface ContactProps {
+    image?: {
+        src?: ImageSource;
+        alt?: AltText;
+        fullWidth?: FullWidth;
+        aspectRatio?: AspectRatio;
+    };
+    title?: Title;
+    subtitle?: Subtitle;
+    links?: {
+        icon?: string;
+        label?: string;
+        href?: string;
+        newTab?: OpenLinkInNewTab;
+    }[];
+    copy?: CopyText;
+    className?: Class;
+    component?: KsComponentAttribute;
+}
 declare const ContactContextDefault: import("react").ForwardRefExoticComponent<ContactProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
 declare const ContactContext: import("react").Context<import("react").ForwardRefExoticComponent<ContactProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>>;
 declare const Contact: import("react").ForwardRefExoticComponent<ContactProps & import("react").RefAttributes<HTMLDivElement>>;