@kickstartds/ds-agency-premium 1.6.71--canary.45.1846.0 → 1.7.0--canary.18.1660.0

package/dist/components/features/features.css

@@ -4,7 +4,7 @@
   --dsa-feature__title--color: var(--dsa-topic--color);
   --dsa-feature__title--font: var(--ks-font-interface-m);
   --dsa-feature__title--font-family: var(--dsa-topic--font-family);
-  --dsa-feature__copy--color: var(--ks-text-color-copy);
+  --dsa-feature__copy--color: var(--dsa-rich-text--color);
   --dsa-feature__copy--font: var(--ks-font-copy-s);
   --dsa-feature__link--font: var(--ks-font-copy-s);
   --dsa-feature__link--font-weight: var(--dsa-link--font-weight);
@@ -14,9 +14,9 @@
   --dsa-feature__link--text-decoration_hover: none;
   --dsa-feature__icon--color: var(--ks-text-color-primary);
   --dsa-feature_small__icon--size: calc(var(--ks-line-height-interface-m) * var(--ks-font-size-interface-m));
-  --dsa-feature_large__icon--size-multiplier: 2.5;
-  --dsa-feature_small--gap: var(--ks-spacing-xs);
-  --dsa-feature_large--gap: var(--ks-spacing-s);
+  --dsa-feature_large__icon--size: calc(var(--ks-font-size-copy-m) * 2.5);
+  --dsa-feature_small--gap: var(--ks-spacing-stack-xs);
+  --dsa-feature_large--gap: var(--ks-spacing-stack-s);
   --dsa-feature_small__icon--gap: var(--ks-spacing-xs);
   --dsa-feature_large__icon--gap: var(--ks-spacing-s);
 }
@@ -46,9 +46,6 @@
   justify-content: center;
 }
 .dsa-features .dsa-feature {
-  --dsa-feature_large__icon--size: calc(
-    var(--dsa-feature_small__icon--size) * var(--dsa-feature_large__icon--size-multiplier)
-  );
   display: flex;
   position: relative;
   flex-direction: column;
@@ -75,9 +72,6 @@
   top: 0;
   left: 0;
 }
-.dsa-features .dsa-feature--beside.dsa-feature--large {
-  padding-top: calc(var(--dsa-feature__icon--size) / 2 - var(--dsa-feature_small__icon--size) / 2);
-}
 .dsa-features .dsa-feature--stack .dsa-feature__header {
   display: flex;
   flex-direction: column;
@@ -96,9 +90,6 @@
   display: flex;
   justify-content: center;
 }
-.dsa-features .dsa-feature--centered .dsa-feature__icon {
-  align-self: center;
-}
 .dsa-features .dsa-feature__header {
   display: flex;
   align-items: center;
@@ -106,12 +97,12 @@
 }
 .dsa-features .dsa-feature__title {
   font: var(--dsa-feature__title--font, var(--ks-font-interface-m));
-  color: var(--dsa-feature__title--color, var(--dsa-topic--color));
+  color: var(--dsa-feature__title--color, var(--ks-topic-color));
   font-family: var(--dsa-feature__title--font-family, var(--ks-font-family-display));
   font-weight: var(--dsa-feature__title--font-weight, var(--ks-font-weight-semi-bold));
 }
 .dsa-features .dsa-feature__text {
-  color: var(--dsa-feature__copy--color, var(--ks-text-color-copy));
+  color: var(--dsa-feature__copy--color, var(--dsa-rich-text-color), var(--ks-text-color-default));
   font: var(--dsa-feature__copy--font, var(--ks-font-copy-s));
   margin: 0;
 }
@@ -119,10 +110,6 @@
   color: var(--dsa-feature__icon--color, var(--ks-text-color-primary));
   width: var(--dsa-feature__icon--size);
   height: var(--dsa-feature__icon--size);
-  min-width: var(--dsa-feature__icon--size);
-  min-height: var(--dsa-feature__icon--size);
-  flex-basis: var(--dsa-feature__icon--size);
-  align-self: flex-start;
 }
 .dsa-features .dsa-feature__cta {
   margin-top: auto;

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

@@ -53,12 +53,14 @@
       "title": "Features",
       "description": "The features to display",
       "items": {
-        "type": "object",
+        "$schema": "http://json-schema.org/draft-07/schema#",
+        "$id": "http://schema.mydesignsystem.com/feature.schema.json",
         "title": "Feature",
+        "description": "Partial Component used to display a feature",
+        "type": "object",
         "properties": {
           "icon": {
             "type": "string",
-            "format": "icon",
             "title": "Icon",
             "description": "The icon for the feature",
             "examples": [
@@ -82,13 +84,26 @@
               "This is a feature"
             ]
           },
+          "style": {
+            "type": "string",
+            "enum": [
+              "intext",
+              "stack",
+              "centered",
+              "besideLarge",
+              "besideSmall"
+            ],
+            "default": "stack"
+          },
           "cta": {
             "type": "object",
+            "title": "Call to Action",
+            "description": "The call to action",
             "properties": {
-              "url": {
+              "target": {
                 "type": "string",
-                "title": "Call to Action url",
-                "description": "The CTA url",
+                "title": "Call to Action target",
+                "description": "The CTA target",
                 "default": "#",
                 "format": "uri"
               },
@@ -101,21 +116,33 @@
                   "See all our partners"
                 ]
               },
-              "icon": {
+              "toggle": {
+                "type": "boolean",
+                "title": "Call to Action Toggle",
+                "description": "Activate/disable the CTAs",
+                "default": true
+              },
+              "style": {
                 "type": "string",
-                "format": "icon",
-                "title": "Icon",
-                "description": "Icon for the link style of the cta",
-                "examples": [
-                  "arrow-right"
+                "description": "Choose the style of the CTA",
+                "enum": [
+                  "button",
+                  "link",
+                  "intext"
                 ],
-                "default": "arrow-right"
+                "default": "link"
               }
             },
             "additionalProperties": false
+          },
+          "type": {
+            "const": "feature"
           }
         },
-        "additionalProperties": false
+        "additionalProperties": false,
+        "required": [
+          "title"
+        ]
       },
       "minItems": 1,
       "maxItems": 8

package/dist/components/features/features.schema.json

@@ -39,33 +39,7 @@
       "title": "Features",
       "description": "The features to display",
       "items": {
-        "type": "object",
-        "title": "Feature",
-        "properties": {
-          "icon": {
-            "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/icon"
-          },
-          "title": {
-            "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/title"
-          },
-          "text": {
-            "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/text"
-          },
-          "cta": {
-            "type": "object",
-            "properties": {
-              "url": {
-                "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/cta/properties/url"
-              },
-              "label": {
-                "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/cta/properties/label"
-              },
-              "icon": {
-                "$ref": "http://schema.mydesignsystem.com/feature.schema.json#/properties/cta/properties/icon"
-              }
-            }
-          }
-        }
+        "$ref": "http://schema.mydesignsystem.com/feature.schema.json"
       },
       "minItems": 1,
       "maxItems": 8

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

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { FeaturesProps } from "../../FeaturesProps-a9041d97.js";
+import { FeaturesProps } from "../../FeaturesProps-b05859d6.js";
 declare const FeaturesContextDefault: import("react").ForwardRefExoticComponent<FeaturesProps & Omit<HTMLAttributes<HTMLDivElement>, "style"> & import("react").RefAttributes<HTMLDivElement>>;
 declare const FeaturesContext: import("react").Context<import("react").ForwardRefExoticComponent<FeaturesProps & Omit<HTMLAttributes<HTMLDivElement>, "style"> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Features: import("react").ForwardRefExoticComponent<FeaturesProps & Omit<HTMLAttributes<HTMLDivElement>, "style"> & import("react").RefAttributes<HTMLDivElement>>;
-export type { FeaturesProps };
 export { FeaturesContextDefault, FeaturesContext, Features };

package/dist/components/features/index.js

@@ -1,6 +1,6 @@
 import "./features.css";
 import { jsx } from 'react/jsx-runtime';
-import { forwardRef, createElement, createContext, useContext } from 'react';
+import { forwardRef, createContext, useContext } from 'react';
 import classnames from 'classnames';
 import { Feature } from '../feature/index.js';
 import '@kickstartds/base/lib/icon';
@@ -15,16 +15,7 @@ const FeaturesContextDefault = forwardRef(({ layout = "largeTiles", ctas = {
         ? "large-tiles"
         : layout === "smallTiles"
             ? "small-tiles"
-            : `${layout}`}`), children: features.map((feature, index) => {
-        const { icon, title, text, cta, ...rest } = feature;
-        return (createElement(Feature, { ...rest, key: index, icon: icon, style: style, title: title, text: text, cta: {
-                label: cta?.label,
-                url: cta?.url,
-                style: ctas.style,
-                toggle: ctas.toggle,
-                icon: cta?.icon,
-            } }));
-    }) })));
+            : `${layout}`}`), children: features.map((feature, index) => (jsx(Feature, { ...feature, style: style }, index))) })));
 const FeaturesContext = createContext(FeaturesContextDefault);
 const Features = forwardRef((props, ref) => {
     const Component = useContext(FeaturesContext);

package/dist/components/footer/footer.css

@@ -1,7 +1,7 @@
 .dsa-footer {
   --dsa-footer--background-color: var(--ks-background-color-default);
-  --dsa-footer--border-top: 1px solid var(--ks-border-color-default);
-  --dsa-footer--max-width: var(--dsa-content--width_wide);
+  --dsa-footer--border-top: 1px solid var(--ks-border-color-accent);
+  --dsa-footer--max-width: var(--l-section--content-width-wide);
   --dsa-footer--gap-vertical: var(--ks-spacing-stack-m);
   --dsa-footer__byline--font: var(--ks-font-copy-xs);
   --dsa-footer__byline--color: var(--ks-text-color-default);
@@ -27,9 +27,9 @@
   background-color: var(--dsa-footer--background-color, var(--ks-background-color-default));
 }
 .dsa-footer__content {
-  padding: var(--l-section--space-small) var(--dsa-content--horizontal-spacing);
-  border-top: var(--dsa-footer--border-top, 1px solid var(--ks-border-color-default));
-  max-width: var(--dsa-footer--max-width, var(--dsa-content--width_wide));
+  padding: var(--l-section--space-small) var(--dsa-content--spacing);
+  border-top: var(--dsa-footer--border-top, 1px solid var(--ks-border-color-accent));
+  max-width: var(--dsa-footer--max-width, var(--l-section--content-width-wide));
   width: 100%;
   margin: auto;
   display: flex;

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

@@ -68,7 +68,7 @@
       "items": {
         "type": "object",
         "properties": {
-          "url": {
+          "href": {
             "type": "string",
             "format": "uri"
           },
@@ -83,7 +83,7 @@
             "items": {
               "type": "object",
               "properties": {
-                "url": {
+                "href": {
                   "type": "string",
                   "format": "uri"
                 },
@@ -100,7 +100,7 @@
         },
         "additionalProperties": false,
         "required": [
-          "url",
+          "href",
           "label"
         ]
       },
@@ -108,43 +108,43 @@
         [
           {
             "label": "Active Item",
-            "url": "#",
+            "href": "#",
             "active": true
           },
           {
             "label": "Navigation Item",
-            "url": "#"
+            "href": "#"
           },
           {
             "label": "Dropdown",
-            "url": "#",
+            "href": "#",
             "items": [
               {
                 "label": "Level 2 Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Active Item",
                 "active": true,
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "An Item with a longer Label",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "And One last one",
-                "url": "#"
+                "href": "#"
               }
             ]
           },
           {
             "label": "One more Item",
-            "url": "#"
+            "href": "#"
           },
           {
             "label": "Last Item",
-            "url": "#"
+            "href": "#"
           }
         ]
       ]

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

@@ -1,8 +1,7 @@
 /// <reference types="react" />
-import { FooterProps } from "../../FooterProps-a0a104ca.js";
+import { FooterProps } from "../../FooterProps-171a3067.js";
 import { HTMLAttributes } from "react";
 declare const FooterContextDefault: import("react").ForwardRefExoticComponent<FooterProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const FooterContext: import("react").Context<import("react").ForwardRefExoticComponent<FooterProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Footer: import("react").ForwardRefExoticComponent<FooterProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export type { FooterProps };
 export { FooterContextDefault, FooterContext, Footer };

package/dist/components/footer/index.js

@@ -6,7 +6,7 @@ import { Link } from '@kickstartds/base/lib/link';
 import { Logo } from '../logo/index.js';
 import '@kickstartds/base/lib/picture';
 
-const FooterContextDefault = forwardRef(({ byline, navItems, inverted, logo }, ref) => navItems && navItems.length > 0 ? (jsx("div", { className: classnames("dsa-footer"), "ks-inverted": inverted.toString(), ref: ref, children: jsxs("div", { className: "dsa-footer__content", children: [jsx(Logo, { ...logo, inverted: inverted }), byline && jsx("span", { className: "dsa-footer__byline", children: byline }), navItems.length > 0 ? (jsx("div", { className: "dsa-footer__links", children: navItems.map(({ label, active, ...linkProps }) => (createElement(Link, { ...linkProps, className: "dsa-footer__link", key: linkProps.url + label }, label))) })) : null] }) })) : null);
+const FooterContextDefault = forwardRef(({ byline, navItems, inverted, logo }, ref) => navItems && navItems.length > 0 ? (jsx("div", { className: classnames("dsa-footer"), "ks-inverted": inverted.toString(), ref: ref, children: jsxs("div", { className: "dsa-footer__content", children: [jsx(Logo, { ...logo, inverted: inverted }), byline && jsx("span", { className: "dsa-footer__byline", children: byline }), navItems.length > 0 ? (jsx("div", { className: "dsa-footer__links", children: navItems.map(({ label, active, ...linkProps }) => (createElement(Link, { ...linkProps, className: "dsa-footer__link", key: linkProps.href + label }, label))) })) : null] }) })) : null);
 const FooterContext = createContext(FooterContextDefault);
 const Footer = forwardRef((props, ref) => {
     const Component = useContext(FooterContext);

package/dist/components/gallery/gallery.css

@@ -37,4 +37,22 @@
 .dsa-gallery__image--landscape img {
   aspect-ratio: var(--dsa-gallery--image-ratio-landscape);
   object-fit: cover;
+}
+
+.pswp .pswp__img {
+  object-fit: contain;
+}
+.pswp .pswp__caption {
+  background-color: var(--ks-color-bg-alpha-3);
+  color: var(--dsa-text-color-on-primary);
+}
+
+:root, [ks-inverted], [ks-theme] {
+  --c-lightbox--bg: var(--ks-background-color-default) !important;
+  --c-lightbox--placeholder-bg: var(--ks-color-fg-to-bg-1) !important;
+  --c-lightbox--root-z-index: var(--ks-depth-modal) !important;
+  --c-lightbox--icon-color: var(--dsa-text-color-on-primary) !important;
+  --c-lightbox--icon-color-secondary: var(--ks-color-fg-inverted) !important;
+  --c-lightbox--stroke-width: 0px !important;
+  --c-lightbox--error-text-color: var(--ks-color-error) !important;
 }

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

@@ -55,8 +55,7 @@
         "stack",
         "smallTiles",
         "largeTiles"
-      ],
-      "default": "smallTiles"
+      ]
     },
     "aspectRatio": {
       "type": "string",

package/dist/components/gallery/gallery.schema.json

@@ -43,8 +43,7 @@
       "type": "string",
       "title": "Layout",
       "description": "The layout of the gallery images",
-      "enum": ["stack", "smallTiles", "largeTiles"],
-      "default": "smallTiles"
+      "enum": ["stack", "smallTiles", "largeTiles"]
     },
     "aspectRatio": {
       "type": "string",

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

@@ -4,5 +4,4 @@ import { GalleryProps } from "../../GalleryProps-76e7de44.js";
 declare const GalleryContextDefault: import("react").ForwardRefExoticComponent<GalleryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 declare const GalleryContext: import("react").Context<import("react").ForwardRefExoticComponent<GalleryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
 declare const Gallery: import("react").ForwardRefExoticComponent<GalleryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export type { GalleryProps };
 export { GalleryContextDefault, GalleryContext, Gallery };

package/dist/components/gallery/index.js

@@ -4,7 +4,7 @@ import { forwardRef, useMemo, createContext, useContext } from 'react';
 import classnames from 'classnames';
 import { TextMedia } from '@kickstartds/base/lib/text-media';
 
-const GalleryContextDefault = forwardRef(({ lightbox = false, layout = "smallTiles", aspectRatio = "square", images = [], ...rest }, ref) => {
+const GalleryContextDefault = forwardRef(({ lightbox = false, layout = "tiles", aspectRatio = "square", images = [], ...rest }, ref) => {
     const galleryId = useMemo(() => `gallery-${Date.now()}`, []);
     return (jsx("div", { ...rest, ref: ref, className: `dsa-gallery`, children: jsx("div", { className: classnames(`dsa-gallery__grid`, `dsa-gallery__grid--${layout === "smallTiles"
                 ? "small-tiles"

package/dist/components/header/header.css

@@ -1,91 +1,49 @@
 :root,
 [ks-theme],
 [ks-inverted] {
-  --dsa-header--height: calc(var(--dsa-logo--height) + var(--dsa-header--spacing-vertical) * 2);
   --dsa-header--spacing-vertical: var(--ks-spacing-inset-m);
   --dsa-header--spacing-horizontal: var(--ks-spacing-inset-xl);
-  --dsa-header_floating--spacing-horizontal: var(--ks-spacing-inset-l);
-  --dsa-header_open--shadow: 0 0 0 100px var(--ks-color-fg-alpha-3);
 }
 @media (min-width: 62em) {
   :root,
   [ks-theme],
   [ks-inverted] {
-    --dsa-header--spacing-horizontal: var(--dsa-content--horizontal-spacing);
+    --dsa-header--spacing-vertical: var(--ks-spacing-stack-s);
+    --dsa-header--spacing-horizontal: var(--dsa-content--spacing);
   }
 }
 
 .dsa-header {
-  --dsa-header--max-width: var(--dsa-content--width_wide);
+  --dsa-header--max-width: var(--l-section--content-width-max);
   --dsa-header--background: var(--ks-background-color-default);
-  --dsa-header_floating--background: var(--dsa-overlay-box_opaque--background-color);
-  --dsa-header_floating--backdrop-filter: var(--dsa-overlay-box_opaque--backdrop-filter);
+  --dsa-header_floating--background: linear-gradient(var(--ks-color-bg), transparent);
   --dsa-header__logo--height: var(--dsa-logo--height);
 }
 
 .dsa-header {
-  z-index: 999;
   background: var(--dsa-header--background, var(--ks-background-color-default));
+  z-index: 1;
   width: 100%;
   display: flex;
   padding: var(--dsa-header--spacing-vertical) 0;
-  transition: height var(--ks-transition-collapse);
-  height: calc(var(--dsa-logo--height) + var(--dsa-header--spacing-vertical) * 2);
-  justify-content: center;
-}
-.dsa-header--overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 998;
-  width: 100vw;
-  height: 100vh;
-  background-color: var(--ks-color-fg-alpha-3);
-  opacity: 0;
-  transition: opacity var(--ks-transition-fade);
-  pointer-events: none;
-}
-.overlay-open .dsa-header--overlay {
-  opacity: 1;
-}
-.overlay-open .dsa-header {
-  height: 100vh;
+  position: relative;
 }
 .dsa-header--floating {
-  width: calc(100vw - var(--dsa-header_floating--spacing-horizontal) * 2);
-  max-width: calc(var(--dsa-header--max-width) + var(--dsa-header_floating--spacing-horizontal) * 2);
-  top: 10px;
-  padding: var(--dsa-header--spacing-vertical) 0;
-  left: 50%;
-  transform: translate(-50%, 0);
-  background: var(--dsa-header_floating--background, var(--dsa-overlay-box_opaque--background-color));
-  backdrop-filter: var(--dsa-header_floating--backdrop-filter, blur(10px));
+  background: var(--dsa-header_floating--background, linear-gradient(var(--ks-color-bg-alpha-5), transparent));
   position: absolute;
-  border-radius: var(--ks-border-radius-surface);
-}
-.overlay-open .dsa-header--floating {
-  background: var(--dsa-header--background, var(--ks-background-color-default));
-  height: 95%;
+  z-index: 999;
 }
 .dsa-header--floating .c-nav-main__link {
   text-shadow: 0 0 10px var(--ks-color-bg-alpha-5);
 }
 .dsa-header__content {
   padding: 0 var(--dsa-header--spacing-horizontal);
-  max-width: calc(var(--dsa-header--max-width) + var(--dsa-header--spacing-horizontal) * 2);
+  max-width: var(--dsa-header--max-width);
   width: 100%;
+  margin: auto;
   display: flex;
   justify-content: space-between;
-  align-items: flex-start;
-}
-@media (min-width: 62rem) {
-  .dsa-header__content {
-    align-items: center;
-  }
-}
-.dsa-header--floating .dsa-header__content {
-  max-width: calc(var(--dsa-header--max-width) + var(--dsa-header_floating--spacing-horizontal) * 2);
-  padding: 0 var(--dsa-header_floating--spacing-horizontal);
+  align-items: center;
 }
 
 .dsa-header--spacer {

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

@@ -81,7 +81,7 @@
       "items": {
         "type": "object",
         "properties": {
-          "url": {
+          "href": {
             "type": "string",
             "format": "uri"
           },
@@ -96,7 +96,7 @@
             "items": {
               "type": "object",
               "properties": {
-                "url": {
+                "href": {
                   "type": "string",
                   "format": "uri"
                 },
@@ -113,7 +113,7 @@
         },
         "additionalProperties": false,
         "required": [
-          "url",
+          "href",
           "label"
         ]
       },
@@ -121,43 +121,43 @@
         [
           {
             "label": "Active Item",
-            "url": "#",
+            "href": "#",
             "active": true
           },
           {
             "label": "Navigation Item",
-            "url": "#"
+            "href": "#"
           },
           {
             "label": "Dropdown",
-            "url": "#",
+            "href": "#",
             "items": [
               {
                 "label": "Level 2 Item",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "Active Item",
                 "active": true,
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "An Item with a longer Label",
-                "url": "#"
+                "href": "#"
               },
               {
                 "label": "And One last one",
-                "url": "#"
+                "href": "#"
               }
             ]
           },
           {
             "label": "One more Item",
-            "url": "#"
+            "href": "#"
           },
           {
             "label": "Last Item",
-            "url": "#"
+            "href": "#"
           }
         ]
       ]

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

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import { HTMLAttributes } from "react";
-import { HeaderProps } from "../../HeaderProps-72763967.js";
-declare const HeaderContextDefault: import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
-declare const HeaderContext: import("react").Context<import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>>;
-declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
-export type { HeaderProps };
+import { HeaderProps } from "../../HeaderProps-e22382f1.js";
+declare const HeaderContextDefault: import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+declare const HeaderContext: import("react").Context<import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export { HeaderContextDefault, HeaderContext, Header };

package/dist/components/header/index.js

@@ -1,5 +1,5 @@
 import "./header.css";
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import classnames from 'classnames';
 import { forwardRef, createContext, useContext } from 'react';
 import { NavMain } from '../nav-main/index.js';
@@ -17,10 +17,10 @@ import '../nav-dropdown/index.js';
 import '../nav-flyout/index.js';
 import '@kickstartds/base/lib/picture';
 
-const HeaderContextDefault = forwardRef(({ logo, floating, inverted = false, flyoutInverted = false, dropdownInverted = false, navItems = [], }, ref) => (jsxs(Fragment, { children: [jsx("header", { className: classnames("dsa-header", floating && `dsa-header--floating`), "ks-inverted": inverted.toString(), ref: ref, children: jsxs("div", { className: "dsa-header__content", children: [jsx(Logo, { ...logo, className: "dsa-header__logo", inverted: inverted }), jsx(NavMain, { flyoutInverted: flyoutInverted, dropdownInverted: dropdownInverted, items: navItems, logo: {
-                            ...logo,
-                            inverted: flyoutInverted,
-                        } })] }) }), floating && jsx("div", { className: "dsa-header--overlay" })] })));
+const HeaderContextDefault = forwardRef(({ logo, floating, inverted = false, flyoutInverted = false, dropdownInverted = false, navItems = [], }, ref) => (jsx("div", { className: classnames("dsa-header", floating ? `dsa-header--floating` : ""), "ks-inverted": inverted.toString(), ref: ref, children: jsxs("div", { className: "dsa-header__content", children: [jsx(Logo, { ...logo, className: "dsa-header__logo", inverted: inverted }), jsx(NavMain, { flyoutInverted: flyoutInverted, dropdownInverted: dropdownInverted, items: navItems, logo: {
+                    ...logo,
+                    inverted: flyoutInverted,
+                } })] }) })));
 const HeaderContext = createContext(HeaderContextDefault);
 const Header = forwardRef((props, ref) => {
     const Component = useContext(HeaderContext);