@vodafone_de/brix-components 9.0.5 → 10.0.0

package/dist/{BorderRadius-ClUShVLu.js → BorderRadius-2LdggXbQ.js}

@@ -3,8 +3,8 @@ const borderRadiusSm = "borderRadiusSm";
 const borderRadiusMd = "borderRadiusMd";
 const borderRadiusFull = "borderRadiusFull";
 export {
-  borderRadiusNone as a,
+  borderRadiusFull as a,
   borderRadiusMd as b,
-  borderRadiusFull as c,
+  borderRadiusNone as c,
   borderRadiusSm as d
 };

package/dist/components/Accordion/index.js

@@ -21,7 +21,7 @@ import { g as borderWidthNone, b as borderWidthUnselected, a as borderWidthFocus
 import { a as fontWeightRegular, f as fontWeightBold } from "../../FontWeight-DEBGHbtO.js";
 import { s as spacingMd, c as spacingNone, a as spacingXs } from "../../Spacing-8v6hcO2x.js";
 import { a as colorTextNeutral, g as colorTextBrand } from "../../TextColor-BXVMXUVE.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";
 import { i as isBottomSpacing } from "../../isBottomSpacing-BxfreCZU.js";
 const accordionToggleExpanded = "expanded";

package/dist/components/AccordionGroup/index.js

@@ -5,7 +5,7 @@ import { s as spacingMd, c as spacingNone } from "../../Spacing-8v6hcO2x.js";
 import { useState } from "react";
 import styled from "styled-components";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";
 import { i as isBottomSpacing } from "../../isBottomSpacing-BxfreCZU.js";
 const AccordionGroupSingleExpand = ({

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

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { ArtDirectedImageProps } from './props';
+declare const ArtDirectedImage: FC<ArtDirectedImageProps>;
+export default ArtDirectedImage;
+export * from './props';

package/dist/components/ArtDirectedImage/index.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { a as ContainerContext } from "../../index-DbG0QL9D.js";
+import { d as GridContext, b as GridItemContext } from "../../index-Bu-7sSif.js";
+import { b as breakpoint_medium, a as breakpoint_large, c as breakpoint_medium_number } from "../../breakpoint-CzBSbbY7.js";
+import { usePictureComponent, filterAspectRatioFromSources, filterImagePropsToPictureComponentImageProps } from "../../hooks/usePictureComponent/index.js";
+import { g as getSizesFromGridConfig } from "../../getSizesFromGridConfig-DKOLupyb.js";
+import styled from "styled-components";
+import viewport from "../../foundations/media-query/viewport/index.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
+const ArtDirectedImageContainerStyled = styled.div.withConfig({
+  shouldForwardProp: filterProps(),
+  displayName: "ArtDirectedImageContainerStyled",
+  componentId: "sc-1iidohy-0"
+})({
+  position: "relative",
+  "& picture > img": {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    height: "100%",
+    objectFit: "cover",
+    width: "100%"
+  }
+}, ({
+  sources
+}) => {
+  var _a, _b, _c;
+  return {
+    aspectRatio: (_a = sources.sm) == null ? void 0 : _a.aspectRatio,
+    ...viewport.md({
+      aspectRatio: (_b = sources.md) == null ? void 0 : _b.aspectRatio
+    }),
+    ...viewport.lg({
+      aspectRatio: (_c = sources.lg) == null ? void 0 : _c.aspectRatio
+    })
+  };
+});
+const ArtDirectedImage = ({
+  ...props
+}) => {
+  const PictureComponent = usePictureComponent();
+  const gridContext = useContext(GridContext);
+  const gridItemContext = useContext(GridItemContext);
+  const containerContext = useContext(ContainerContext);
+  const calculatedSizes = (gridContext == null ? void 0 : gridContext.nestedGridConfig) ? getSizesFromGridConfig(gridContext.nestedGridConfig, containerContext) : gridItemContext.nestedGridConfig ? getSizesFromGridConfig(gridItemContext.nestedGridConfig, containerContext) : getSizesFromGridConfig({
+    sm: 12
+  }, containerContext);
+  const mediaMap = {
+    lg: `(min-width: ${breakpoint_large})`,
+    md: `(min-width: ${breakpoint_medium})`,
+    sm: `(max-width: ${breakpoint_medium_number - 1}px)`
+  };
+  const order = ["lg", "md", "sm"];
+  console.log(props.sources);
+  const sources = Object.entries(props.sources).sort(([a], [b]) => order.indexOf(a) - order.indexOf(b)).map(([viewport2, source]) => ({
+    ...filterAspectRatioFromSources(source),
+    media: mediaMap[viewport2],
+    sizes: source.sizes || calculatedSizes
+  }));
+  const image = {
+    ...filterImagePropsToPictureComponentImageProps(props.image),
+    // fallback value is needed because alt is optional in ImageProps but required in PictureComponentProps
+    alt: props.image.alt || ""
+  };
+  const pictureComponentProps = {
+    sources,
+    image
+  };
+  return /* @__PURE__ */ jsx(ArtDirectedImageContainerStyled, { ...props, children: /* @__PURE__ */ jsx(PictureComponent, { ...pictureComponentProps }) });
+};
+export {
+  ArtDirectedImage as default
+};

package/dist/components/ArtDirectedImage/props.d.ts

@@ -0,0 +1,24 @@
+import { HTMLAttributes, JSX } from 'react';
+import { AspectRatio, ImageProps } from '../Image';
+import { PatternProps } from '../../foundations/PatternProps';
+import { ViewportName } from '../../foundations/types/Viewport';
+export type ArtDirectedImageSourceType = JSX.IntrinsicElements['source'] & {
+    srcSet: string;
+    aspectRatio: AspectRatio;
+};
+export type ArtDirectedImageSourcesType = {
+    [key in ViewportName]?: ArtDirectedImageSourceType;
+};
+export interface ArtDirectedImageProps extends PatternProps, HTMLAttributes<HTMLPictureElement> {
+    /**
+     * Pin component's name from string to the concrete name
+     */
+    component?: 'ArtDirectedImage';
+    sources: ArtDirectedImageSourcesType;
+    image: ImageProps & {
+        /**
+         * aspectRatio is mandatory for image because it is mandatory for the sources that can't take width & height
+         */
+        aspectRatio: AspectRatio;
+    };
+}

package/dist/components/ArtDirectedImage/styled.d.ts

@@ -0,0 +1,2 @@
+import { ArtDirectedImageProps } from './props';
+export declare const ArtDirectedImageContainerStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ArtDirectedImageProps>> & string;

package/dist/components/ArtDirectedImage/validate.d.ts

@@ -0,0 +1,3 @@
+import { ArtDirectedImageProps } from './props';
+export declare const validateArtDirectedImageProps: (props: unknown) => props is ArtDirectedImageProps;
+export declare const isArtDirectedImageProps: (props: unknown) => props is ArtDirectedImageProps;

package/dist/components/Badge/index.js

@@ -1,11 +1,10 @@
 "use client";
 import "react/jsx-runtime";
-import "../../index-BJHhIBYl.js";
+import "../../index-BsykXBqC.js";
 import "../../IconSize-AJp7xdJi.js";
 import "../../SizeTypes-Ck_RdzIf.js";
 import "../../Spacing-8v6hcO2x.js";
-import "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
-import { b, c, d, B, i, p, s, a, t, v } from "../../index-j22agtAk.js";
+import { b, c, d, B, i, p, s, a, t, v } from "../../index-DwGcrvTh.js";
 export {
   b as BadgeAppearanceColor,
   c as badgeAppearances,

package/dist/components/Body/index.js

@@ -1,9 +1,8 @@
 "use client";
 import { jsxs, jsx } from "react/jsx-runtime";
-import { F as FootnoteLink } from "../../index-BJHhIBYl.js";
+import { F as FootnoteLink } from "../../index-BsykXBqC.js";
 import { b as spacingSm, s as spacingMd } from "../../Spacing-8v6hcO2x.js";
 import { t as textBodyMd, a as textBodySm } from "../../TextBodySize-BcZR9mh2.js";
-import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 import styled from "styled-components";
 import { getBodySize } from "../../foundations/token/getBodySize/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
@@ -11,8 +10,8 @@ import { getFontWeight } from "../../foundations/token/getFontWeight/index.js";
 import { getTextColor } from "../../foundations/token/getTextColor/index.js";
 import { f as fontWeightBold, b as fontWeightLight, a as fontWeightRegular } from "../../FontWeight-DEBGHbtO.js";
 import { a as colorTextNeutral } from "../../TextColor-BXVMXUVE.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
-import { r as pTagName, d as divTagName, c as spanTagName, f as strongTagName, g as supTagName } from "../../tags-D7CRQqc1.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
+import { p as pTagName, d as divTagName, c as spanTagName, f as strongTagName, g as supTagName } from "../../tags-Cwgg3Gx2.js";
 const BodyStyled = styled.p.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "BodyStyled",
@@ -103,7 +102,7 @@ const Body = ({
     bottomSpacing = textBodySm === props.size ? spacingSm : spacingMd;
   }
   return /* @__PURE__ */ jsxs(BodyStyled, { ...props, bottomSpacing, as: tag, tag, children: [
-    renderInlineRichTextFromOpenText(props.children),
+    props.children,
     footnoteLink && /* @__PURE__ */ jsx(FootnoteLink, { ...footnoteLink })
   ] });
 };

package/dist/components/BottomBar/index.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { useRef, useState, useEffect } from "react";
-import Container from "../Container/index.js";
+import { C as Container } from "../../index-DbG0QL9D.js";
 import { s as spacingMd, c as spacingNone } from "../../Spacing-8v6hcO2x.js";
 import styled from "styled-components";
-import { a as CardStyled } from "../../styled-Dq0NuP5r.js";
+import { a as CardStyled } from "../../styled-rsUoUFyl.js";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { a as borderRadiusNone } from "../../BorderRadius-ClUShVLu.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { c as borderRadiusNone } from "../../BorderRadius-2LdggXbQ.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 const bottomBarExtraPadding = 100;
 const BottomBarStyled = styled(CardStyled).withConfig({
   shouldForwardProp: filterProps(),

package/dist/components/Button/index.js

@@ -1,9 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { B as ButtonAsLink, g as getButtonIcon } from "../../validate-Dlzxlfzp.js";
-import { c, a, b, d, f, e } from "../../validate-Dlzxlfzp.js";
-import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
-import { B as ButtonStyled } from "../../styled-7vJ7mrAA.js";
+import { B as ButtonAsLink, g as getButtonIcon } from "../../validate-CLBUbscx.js";
+import { c, a, b, d, f, e } from "../../validate-CLBUbscx.js";
+import { B as ButtonStyled } from "../../styled-BKH3egch.js";
 const isButtonAsLinkProp = (props) => {
   return props.href !== void 0;
 };
@@ -12,7 +11,7 @@ const Button = (props) => {
     return /* @__PURE__ */ jsx(ButtonAsLink, { ...props });
   }
   return /* @__PURE__ */ jsxs(ButtonStyled, { ...props, children: [
-    renderInlineRichTextFromOpenText(props.children),
+    props.children,
     getButtonIcon(props.icon, props.iconPosition)
   ] });
 };

package/dist/components/ButtonAsLink/index.js

@@ -1,9 +1,8 @@
 "use client";
 import "react/jsx-runtime";
-import { B, i, v } from "../../validate-Dlzxlfzp.js";
+import { B, i, v } from "../../validate-CLBUbscx.js";
 import "../../hooks/useLinkComponent/index.js";
-import "../../filterProps-BJ5SpbnA.js";
-import "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
+import "../../filterProps-CxkibNnG.js";
 import "../../sanitizeLinkProps-D2Kkovy1.js";
 export {
   B as default,

package/dist/components/ButtonGroup/index.js

@@ -2,11 +2,11 @@
 import { jsx } from "react/jsx-runtime";
 import Button from "../Button/index.js";
 import Flex from "../Flex/index.js";
-import { b as flexJustifyStart, c as flexJustifyEnd, d as flexJustifyCenter, e as flexJustifyBetween, f as flexOrientationHorizontal, a as flexOrientationVertical } from "../../styled-KWWOgO_h.js";
+import { b as flexJustifyStart, c as flexJustifyEnd, d as flexJustifyCenter, e as flexJustifyBetween, f as flexOrientationHorizontal, a as flexOrientationVertical } from "../../styled-CUp4EbPh.js";
 import FlexItem from "../FlexItem/index.js";
 import { b as spacingSm, s as spacingMd } from "../../Spacing-8v6hcO2x.js";
-import { useViewport } from "../../hooks/useViewport/index.js";
-import { e as validateButtonProps, v as validateButtonAsLinkProps } from "../../validate-Dlzxlfzp.js";
+import { u as useViewport } from "../../index-DKCzYjXw.js";
+import { e as validateButtonProps, v as validateButtonAsLinkProps } from "../../validate-CLBUbscx.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";
 import { i as isBottomSpacing } from "../../isBottomSpacing-BxfreCZU.js";
 const flexJustifyBehaviours = [flexJustifyStart, flexJustifyEnd, flexJustifyCenter, flexJustifyBetween];

package/dist/components/Calendar/index.js

@@ -22,7 +22,7 @@ import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { getTextColor } from "../../foundations/token/getTextColor/index.js";
 import { a as colorBackgroundSubtle, c as colorBackgroundNeutral } from "../../BackgroundColor-e0N9tdDR.js";
 import { c as colorBorderFocus, a as colorBorderNeutral } from "../../BorderColor-BummoQ1-.js";
-import { c as borderRadiusFull, d as borderRadiusSm } from "../../BorderRadius-ClUShVLu.js";
+import { a as borderRadiusFull, d as borderRadiusSm } from "../../BorderRadius-2LdggXbQ.js";
 import { a as borderWidthFocus } from "../../BorderWidth-BjXpOdM5.js";
 import { a as fontWeightRegular, f as fontWeightBold } from "../../FontWeight-DEBGHbtO.js";
 import { b as colorIconBrand } from "../../IconColor-CtC9WUgr.js";
@@ -30,7 +30,7 @@ import { d as colorObjectSelected } from "../../ObjectColor-DxgEnOBM.js";
 import { a as opacityDisabled, o as opacityOverlay } from "../../Opacity-smkGiwsf.js";
 import { s as spacingMd, b as spacingSm, g as spacingLg, f as spacing2Xs, a as spacingXs } from "../../Spacing-8v6hcO2x.js";
 import { a as colorTextNeutral, e as colorTextInverse } from "../../TextColor-BXVMXUVE.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 const millisecondsInWeek = 6048e5;
 const millisecondsInDay = 864e5;
 const constructFromSymbol = Symbol.for("constructDateFrom");

package/dist/components/Card/index.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import { d as divTagName, s as sectionTagName, b as articleTagName, a as asideTagName, c as spanTagName } from "../../tags-D7CRQqc1.js";
-import { a as CardStyled } from "../../styled-Dq0NuP5r.js";
-import { C } from "../../styled-Dq0NuP5r.js";
+import { d as divTagName, s as sectionTagName, a as articleTagName, b as asideTagName, c as spanTagName } from "../../tags-Cwgg3Gx2.js";
+import { a as CardStyled } from "../../styled-rsUoUFyl.js";
+import { C } from "../../styled-rsUoUFyl.js";
 const cardAppearances = ["primary", "secondary"];
 const cardTags = [divTagName, sectionTagName, articleTagName, asideTagName, spanTagName];
 const validateCardProps = (props) => {

package/dist/components/Carousel/index.js

@@ -3,12 +3,11 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import "@af-utils/scrollend-polyfill";
 import { createContext, useRef, useState, useEffect, useContext, createElement } from "react";
 import { useFocusWithin } from "../../hooks/useFocusWithin/index.js";
-import { l as liTagName, u as ulTagName } from "../../tags-D7CRQqc1.js";
+import { l as liTagName, u as ulTagName } from "../../tags-Cwgg3Gx2.js";
 import { s as spacingMd } from "../../Spacing-8v6hcO2x.js";
 import styled from "styled-components";
-import { a as CardStyled } from "../../styled-Dq0NuP5r.js";
-import { G as GridStyled } from "../../styled-BiCOjvNq.js";
-import { G as GridItemStyled } from "../../styled-0KSRG-Fv.js";
+import { a as CardStyled } from "../../styled-rsUoUFyl.js";
+import { a as GridStyled, G as GridItemStyled } from "../../styled-DdeOXNN9.js";
 import forcedColors from "../../foundations/media-query/forcedColors/index.js";
 import viewport from "../../foundations/media-query/viewport/index.js";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
@@ -16,12 +15,12 @@ import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js"
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getObjectColor } from "../../foundations/token/getObjectColor/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { c as borderRadiusFull } from "../../BorderRadius-ClUShVLu.js";
+import { a as borderRadiusFull } from "../../BorderRadius-2LdggXbQ.js";
 import { d as borderWidthSm } from "../../BorderWidth-BjXpOdM5.js";
 import { a as colorObjectBrand, e as colorObjectUnselected } from "../../ObjectColor-DxgEnOBM.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import IconButton from "../IconButton/index.js";
-import { S as ScreenreaderOnly } from "../../index-DCE5HNIR.js";
+import { S as ScreenreaderOnly } from "../../index-C2E3JrhF.js";
 const getItems = (items, loop) => {
   const normalizedItems = [...items].map((item, index) => ({
     ...item,

package/dist/components/Checkbox/index.js

@@ -18,11 +18,11 @@ import { getObjectColor } from "../../foundations/token/getObjectColor/index.js"
 import { getOpacity } from "../../foundations/token/getOpacity/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { c as colorBorderFocus } from "../../BorderColor-BummoQ1-.js";
-import { d as borderRadiusSm } from "../../BorderRadius-ClUShVLu.js";
+import { d as borderRadiusSm } from "../../BorderRadius-2LdggXbQ.js";
 import { a as borderWidthFocus } from "../../BorderWidth-BjXpOdM5.js";
 import { a as opacityDisabled } from "../../Opacity-smkGiwsf.js";
 import { s as spacingMd } from "../../Spacing-8v6hcO2x.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 const CheckboxLabelStyled = styled(Label).withConfig({
   shouldForwardProp: filterProps(),

package/dist/components/CheckboxGroup/index.js

@@ -5,10 +5,10 @@ import Checkbox from "../Checkbox/index.js";
 import Fieldset from "../Fieldset/index.js";
 import { g as spacingLg, s as spacingMd, c as spacingNone } from "../../Spacing-8v6hcO2x.js";
 import styled from "styled-components";
-import { F as FlexStyled } from "../../styled-KWWOgO_h.js";
+import { F as FlexStyled } from "../../styled-CUp4EbPh.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 const CheckboxGroupStyled = styled(FlexStyled).withConfig({
   shouldForwardProp: filterProps(),
   displayName: "CheckboxGroupStyled",

package/dist/components/Collapsible/index.js

@@ -8,7 +8,7 @@ import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js"
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { a as borderWidthFocus } from "../../BorderWidth-BjXpOdM5.js";
 import { c as spacingNone } from "../../Spacing-8v6hcO2x.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 const CollapsibleStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "CollapsibleStyled",

package/dist/components/ColorSwatch/index.js

@@ -9,7 +9,7 @@ import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index
 import { a as colorBorderNeutral } from "../../BorderColor-BummoQ1-.js";
 import { c as iconSizeMd } from "../../IconSize-AJp7xdJi.js";
 import { c as spacingNone } from "../../Spacing-8v6hcO2x.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";
 const colorSwatchSizeSmall = "sm";

package/dist/components/ColorSwatchGroup/index.js

@@ -3,10 +3,10 @@ import { jsx } from "react/jsx-runtime";
 import ColorSwatch, { colorSwatchSizeSmall, colorSwatchSizes } from "../ColorSwatch/index.js";
 import { s as spacingMd, f as spacing2Xs } from "../../Spacing-8v6hcO2x.js";
 import styled from "styled-components";
-import { F as FlexStyled } from "../../styled-KWWOgO_h.js";
+import { F as FlexStyled } from "../../styled-CUp4EbPh.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { c as iconSizeMd } from "../../IconSize-AJp7xdJi.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 import "react";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";

package/dist/components/ConsentMessage/index.js

@@ -3,9 +3,9 @@ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import Body, { bodyAlignCenter } from "../Body/index.js";
 import Button from "../Button/index.js";
-import { a as buttonAutoWidth } from "../../validate-Dlzxlfzp.js";
+import { a as buttonAutoWidth } from "../../validate-CLBUbscx.js";
 import styled from "styled-components";
-import { B as ButtonStyled, t as tertiaryAppearance } from "../../styled-7vJ7mrAA.js";
+import { B as ButtonStyled, t as tertiaryAppearance } from "../../styled-BKH3egch.js";
 import viewport from "../../foundations/media-query/viewport/index.js";
 import { getBackgroundColor } from "../../foundations/token/getBackgroundColor/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";

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

@@ -1,5 +1,6 @@
 import { FC } from 'react';
 import { ContainerProps } from './props';
+export declare const ContainerContext: import('react').Context<boolean>;
 declare const Container: FC<ContainerProps>;
 export default Container;
 export * from './props';

package/dist/components/Container/index.js

@@ -1,108 +1,13 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
-import styled from "styled-components";
-import { getBackgroundColor } from "../../foundations/token/getBackgroundColor/index.js";
-import { getBorderColor } from "../../foundations/token/getBorderColor/index.js";
-import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js";
-import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { getTextColor } from "../../foundations/token/getTextColor/index.js";
-import { j as colorBorderSubtle } from "../../BorderColor-BummoQ1-.js";
-import { f as borderWidthDivider } from "../../BorderWidth-BjXpOdM5.js";
-import { e as spacingXl, s as spacingMd, c as spacingNone, h as spacing5Xl } from "../../Spacing-8v6hcO2x.js";
-import { a as colorTextNeutral } from "../../TextColor-BXVMXUVE.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
-import { f as colorBackgroundBrand, e as colorBackgroundBrandGradient, a as colorBackgroundSubtle, c as colorBackgroundNeutral } from "../../BackgroundColor-e0N9tdDR.js";
-const ContainerAppearanceColor = {
-  primary: colorBackgroundNeutral,
-  secondary: colorBackgroundSubtle,
-  tertiary: colorBackgroundBrandGradient,
-  alternative: colorBackgroundBrand
-};
-const ContainerBackgroundStyled = styled.div.withConfig({
-  shouldForwardProp: filterProps(),
-  displayName: "ContainerBackgroundStyled",
-  componentId: "sc-a9r652-0"
-})({
-  color: getTextColor(colorTextNeutral)
-}, ({
-  padding = spacingXl
-}) => ({
-  paddingTop: getSpacing(padding),
-  paddingBottom: getSpacing(padding)
-}), ({
-  appearance = "primary"
-}) => {
-  return {
-    background: getBackgroundColor(ContainerAppearanceColor[appearance])
-  };
-}, ({
-  border = false
-}) => {
-  if (!border) {
-    return {};
-  }
-  return {
-    borderBottom: `${getBorderWidth(borderWidthDivider)} solid ${getBorderColor(colorBorderSubtle)}`
-  };
-});
-const maxWidthBreakpoint = "1280px";
-const maxWidthViewport = (stylesInViewport) => {
-  return {
-    [`@media screen and (min-width: ${maxWidthBreakpoint})`]: {
-      ...stylesInViewport
-    }
-  };
-};
-const ContainerCenterStyled = styled.div.withConfig({
-  displayName: "ContainerCenterStyled",
-  componentId: "sc-a9r652-1"
-})({
-  marginLeft: getSpacing(spacingMd),
-  marginRight: getSpacing(spacingMd)
-}, maxWidthViewport({
-  maxWidth: `1240px`,
-  marginLeft: "auto",
-  marginRight: "auto"
-}));
-const containerAppearances = ["primary", "secondary", "tertiary", "alternative"];
-const containerPaddings = [spacingNone, spacingXl, spacing5Xl];
-const validateContainerProps = (props) => {
-  if (!props || typeof props !== "object") {
-    return false;
-  }
-  const containerProps = props;
-  if (!containerProps.component || containerProps.component !== "Container") {
-    return false;
-  }
-  if (containerProps.appearance !== void 0 && !containerAppearances.includes(containerProps.appearance)) {
-    return false;
-  }
-  if (containerProps.border !== void 0 && typeof containerProps.border !== "boolean") {
-    return false;
-  }
-  if (containerProps.padding !== void 0 && !containerPaddings.includes(containerProps.padding)) {
-    return false;
-  }
-  if (containerProps.children === void 0) {
-    return false;
-  }
-  return true;
-};
-const isContainerProps = (props) => {
-  return validateContainerProps(props);
-};
-const Container = ({
-  className,
-  children,
-  appearance = "primary",
-  tag = "div",
-  ...props
-}) => /* @__PURE__ */ jsx(ContainerBackgroundStyled, { className: `${className ? className : ""} ${["tertiary", "alternative"].indexOf(appearance) > -1 ? "Dark" : props.theme}`, appearance, as: tag, ...props, children: /* @__PURE__ */ jsx(ContainerCenterStyled, { children }) });
+import "react/jsx-runtime";
+import "react";
+import { b, a, c, d, C, i, v } from "../../index-DbG0QL9D.js";
 export {
-  ContainerAppearanceColor,
-  containerAppearances,
-  containerPaddings,
-  Container as default,
-  isContainerProps,
-  validateContainerProps
+  b as ContainerAppearanceColor,
+  a as ContainerContext,
+  c as containerAppearances,
+  d as containerPaddings,
+  C as default,
+  i as isContainerProps,
+  v as validateContainerProps
 };

package/dist/components/Container/styled.d.ts

@@ -1,3 +1,5 @@
 import { ContainerProps } from './props';
 export declare const ContainerBackgroundStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ContainerProps>> & string;
+export declare const maxWidthBreakpoint = 1280;
+export declare const containerMaxWidth = 1240;
 export declare const ContainerCenterStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/DateInput/index.js

@@ -6,7 +6,7 @@ import FormHelperLabel from "../FormHelperLabel/index.js";
 import FormHelperMessage from "../FormHelperMessage/index.js";
 import FormHelperStatusIcon from "../FormHelperStatusIcon/index.js";
 import { a as inputStateError } from "../../props-DDpgcryb.js";
-import { a as InputStyled, I as InputWrapperStyled } from "../../styled-xKyZg4q9.js";
+import { a as InputStyled, I as InputWrapperStyled } from "../../styled-DmMk0W0J.js";
 import { i as iconSizeSm } from "../../IconSize-AJp7xdJi.js";
 import { s as spacingMd, a as spacingXs } from "../../Spacing-8v6hcO2x.js";
 import { aW as CalendarMonthIcon } from "../../_5gPlusIcon-CnxmOo1u.js";

package/dist/components/DemoBox/index.js

@@ -2,7 +2,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import IconSnippet from "../IconSnippet/index.js";
 import { t as textHeadingXs } from "../../HeadingSize-CfCRn3Lh.js";
-import { D as DemoBoxStyled } from "../../styled-Dw5c-xwf.js";
+import { D as DemoBoxStyled } from "../../styled-BIcsESkS.js";
 const DemoBox = ({
   children,
   ...props

package/dist/components/Dialog/index.js

@@ -16,7 +16,7 @@ import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js"
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { d as colorBackgroundOverlayStatic } from "../../BackgroundColor-e0N9tdDR.js";
 import { a as borderWidthFocus } from "../../BorderWidth-BjXpOdM5.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 const DialogOverlayStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "DialogOverlayStyled",

package/dist/components/DiscoveryCard/index.js

@@ -1,32 +1,35 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Fragment } from "react";
-import { e as BadgeStyled, i as isBadgeProps, B as Badge } from "../../index-j22agtAk.js";
+import { e as BadgeStyled, i as isBadgeProps, B as Badge } from "../../index-DwGcrvTh.js";
 import Body, { isBodyProps, bodyAlignLeft, bodyAlignCenter } from "../Body/index.js";
 import Heading, { isHeadingProps } from "../Heading/index.js";
 import Link, { isLinkProps } from "../Link/index.js";
-import { k as isPriceProps, b as priceSizeSm, P as Price, f as priceAlignLeft, g as priceAlignCenter, a as priceOrientationVertical } from "../../index-TL0X3rXH.js";
-import { R as RichText } from "../../index-C4eCcl02.js";
+import { k as isPriceProps, b as priceSizeSm, P as Price, f as priceAlignLeft, g as priceAlignCenter, a as priceOrientationVertical } from "../../index-DCXRnuHz.js";
+import { R as RichText } from "../../index-DP6Nlg-a.js";
 import { f as fontWeightBold } from "../../FontWeight-DEBGHbtO.js";
 import { b as textHeadingSm } from "../../HeadingSize-CfCRn3Lh.js";
 import { s as smallSize } from "../../SizeTypes-Ck_RdzIf.js";
 import { s as spacingMd, c as spacingNone, a as spacingXs, b as spacingSm } from "../../Spacing-8v6hcO2x.js";
-import "../../index-DCE5HNIR.js";
-import "../../index-BJHhIBYl.js";
-import "html-react-parser";
-import "../../styled-7vJ7mrAA.js";
-import { a as LinkStyled } from "../../index-CEotMXpL.js";
+import "../../index-C2E3JrhF.js";
+import "../../index-BsykXBqC.js";
+import "../../styled-BKH3egch.js";
+import { a as LinkStyled } from "../../index-Dd-A7i9Y.js";
 import "../../hooks/useLinkComponent/index.js";
+import "html-react-parser";
 import "../InlineLink/index.js";
 import "../../TableWrapper-Do9KCTGV.js";
 import styled from "styled-components";
 import Card from "../Card/index.js";
-import Image from "../Image/index.js";
+import Image, { aspectRatio16_9, aspectRatio1_1, isImageProps } from "../Image/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { a as filterProps } from "../../filterProps-BJ5SpbnA.js";
-import { p as aspectRatio16_9, m as aspectRatio1_1, z as isImageProps } from "../../validate-DYmFz2FF.js";
+import { a as filterProps } from "../../filterProps-CxkibNnG.js";
 import { a as cornerRounded } from "../../CornerStyle-JEbGNArR.js";
+import "../../index-DbG0QL9D.js";
+import "../../index-Bu-7sSif.js";
+import "../UtilityLink/index.js";
+import "../../hooks/useImageComponent/index.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-BYBrvoVW.js";
 const discoveryCardOrientationVertical = "vertical";
 const discoveryCardOrientationHorizontal = "horizontal";