@vodafone_de/brix-components 7.1.7 → 7.1.9

package/dist/components/GoogleMap/index.js

@@ -6,16 +6,16 @@ import ConsentMessage from "../ConsentMessage/index.js";
 import { a as spacingMd } from "../../Spacing-BMQelJYr.js";
 import { useThirdPartyConsent } from "../../hooks/useThirdPartyConsent/index.js";
 import styled from "styled-components";
-import { v as viewport } from "../../index-Ck2bCrhT.js";
+import viewport from "../../foundations/media-query/viewport/index.js";
 import { getBorderColor } from "../../foundations/token/getBorderColor/index.js";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
 import { getBorderWidth } from "../../foundations/token/getBorderWidth/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { f as colorBorderSubtle } from "../../BorderColor-CYdSW9dg.js";
-import { b as borderRadiusMd, a as borderRadiusNone } from "../../BorderRadius-ClUShVLu.js";
+import { b as borderRadiusMd, c as borderRadiusNone } from "../../BorderRadius-2LdggXbQ.js";
 import { d as borderWidthSm } from "../../BorderWidth-eg_mz82k.js";
 import { c as cornerStraight } from "../../CornerStyle-JEbGNArR.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 const MapInner = ({
   setMap,
   children

package/dist/components/Grid/index.js

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import { createContext } from "react";
 import { d as divTagName, u as ulTagName, o as olTagName } from "../../tags-38kBhOn6.js";
 import { a as spacingMd } from "../../Spacing-BMQelJYr.js";
-import { G as GridStyled } from "../../styled-CPNO3vN5.js";
+import { G as GridStyled } from "../../styled-BKmRVjNA.js";
 import { i as isObject, h as hasMatchingComponentName, a as isBottomSpacing } from "../../isObject-cuWKq2kY.js";
 const gridTags = [divTagName, ulTagName, olTagName];
 const gridAligns = ["left", "center", "right"];

package/dist/components/GridItem/index.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { useContext } from "react";
-import { d as divTagName, l as liTagName, n as navTagName, m as mainTagName, g as sectionTagName, i as asideTagName, j as articleTagName, u as ulTagName } from "../../tags-38kBhOn6.js";
+import { d as divTagName, l as liTagName, n as navTagName, m as mainTagName, g as sectionTagName, i as asideTagName, j as articleTagName, u as ulTagName, o as olTagName } from "../../tags-38kBhOn6.js";
 import { validateGridColSpan, GridContext } from "../Grid/index.js";
-import { G as GridItemStyled } from "../../styled-Djetw1lK.js";
+import { G as GridItemStyled } from "../../styled-D57p2ktn.js";
 import { i as isObject, h as hasMatchingComponentName } from "../../isObject-cuWKq2kY.js";
 const gridItemTags = [divTagName, liTagName, navTagName, mainTagName, sectionTagName, asideTagName, articleTagName];
 const gridItemAligns = ["left", "center", "right"];
@@ -40,12 +40,13 @@ const isGridItemProps = (props) => {
 };
 const GridItem = ({
   sm = 12,
+  tag = divTagName,
   ...props
 }) => {
   const gridTag = useContext(GridContext).tag;
   const gridSpacing = useContext(GridContext).spacing;
   const gridAutoLayout = useContext(GridContext).autoLayout;
-  return /* @__PURE__ */ jsx(GridItemStyled, { ...props, as: gridTag === ulTagName ? liTagName : divTagName, spacing: gridSpacing, sm, ...gridAutoLayout, children: props.children });
+  return /* @__PURE__ */ jsx(GridItemStyled, { ...props, as: gridTag === ulTagName || gridTag === olTagName ? liTagName : tag, spacing: gridSpacing, sm, ...gridAutoLayout, children: props.children });
 };
 export {
   GridItem as default,

package/dist/components/Heading/index.js

@@ -3,8 +3,8 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import FootnoteLink from "../FootnoteLink/index.js";
 import { a as spacingMd } from "../../Spacing-BMQelJYr.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
-import { H as HeadingStyled } from "../../styled-VAsSnb5y.js";
-import { a, h } from "../../styled-VAsSnb5y.js";
+import { H as HeadingStyled } from "../../styled-Csv7V9ez.js";
+import { a, h } from "../../styled-Csv7V9ez.js";
 import { a as h1TagName, b as h2TagName, h as h3TagName, c as h4TagName, e as h5TagName, f as h6TagName, d as divTagName, s as spanTagName, p as pTagName } from "../../tags-38kBhOn6.js";
 import { b as fontWeightLight, f as fontWeightRegular, a as fontWeightBold } from "../../FontWeight-C2pGs7aR.js";
 import { d as textHeadingXl, c as textHeadingLg, a as textHeadingMd, b as textHeadingSm, t as textHeadingXs } from "../../HeadingSize-CfCRn3Lh.js";

package/dist/components/HifiIcon/index.js

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import styled from "styled-components";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { a as spacingMd } from "../../Spacing-BMQelJYr.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 const IconStyled = styled.img.withConfig({
   shouldForwardProp: filterProps(),

package/dist/components/IconButton/index.js

@@ -2,7 +2,7 @@
 import { jsx } from "react/jsx-runtime";
 import { I as IconLoader } from "../../index-C3dW-7e_.js";
 import { b as iconSizeSm } from "../../props-7dcsjRUx.js";
-import "../../styled-RnVr222F.js";
+import "../../styled-DUsRG1Xh.js";
 import styled from "styled-components";
 import { s as shadow28 } from "../../shadow-u158mzuN.js";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
@@ -11,12 +11,12 @@ import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index
 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 { b as borderRadiusMd, c as borderRadiusFull } from "../../BorderRadius-ClUShVLu.js";
+import { b as borderRadiusMd, a as borderRadiusFull } from "../../BorderRadius-2LdggXbQ.js";
 import { c as borderWidthSelected } from "../../BorderWidth-eg_mz82k.js";
-import { b as buttonHeight, p as primaryAppearance } from "../../styled-q7r_5eaz.js";
+import { b as buttonHeight, p as primaryAppearance } from "../../styled-Dk6VS_Sg.js";
 import { a as opacityDisabled } from "../../Opacity-smkGiwsf.js";
 import { b as spacingXs, a as spacingMd } from "../../Spacing-BMQelJYr.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 import { g as getCssVar } from "../../getCssVar-BP6T9pFM.js";
 import { g as getButtonAppearance, B as ButtonAppearanceColor } from "../../ButtonAppearanceHelper-D2SlSoU8.js";
 const iconButtonShapeSquare = "square";

package/dist/components/IconSnippet/index.js

@@ -3,17 +3,17 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import Body from "../Body/index.js";
 import Heading from "../Heading/index.js";
 import { d as iconSizeLg, g as iconSize3xl, b as iconSizeSm } from "../../props-7dcsjRUx.js";
-import "../../styled-RnVr222F.js";
+import "../../styled-DUsRG1Xh.js";
 import InlineLink from "../InlineLink/index.js";
 import Link from "../Link/index.js";
-import { R as RichText } from "../../index-B5p4bosD.js";
+import { R as RichText } from "../../index-rbdl_kyF.js";
 import { d as divTagName } from "../../tags-38kBhOn6.js";
 import { c as spacingSm, a as spacingMd, s as spacingNone, b as spacingXs } from "../../Spacing-BMQelJYr.js";
 import styled from "styled-components";
 import { I as IconLoader } from "../../index-C3dW-7e_.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 const iconSnippetSizeSmall = "sm";
 const iconSnippetSizeLarge = "lg";
 const iconSnippetSize3Xl = "3xl";

package/dist/components/Image/index.js

@@ -1,17 +1,16 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { useImageComponent } from "../../hooks/useImageComponent/index.js";
 import styled from "styled-components";
 import { getBorderRadius } from "../../foundations/token/getBorderRadius/index.js";
-import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
-import { b as borderRadiusMd, a as borderRadiusNone } from "../../BorderRadius-ClUShVLu.js";
-import { c as cornerStraight } from "../../CornerStyle-JEbGNArR.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
-const objectFitContain = "contain";
-const objectFitCover = "cover";
-const objectFitNone = "none";
-const horizontalAlignmentLeft = "left";
-const horizontalAlignmentRight = "right";
-const horizontalAlignmentCenter = "center";
+import { b as borderRadiusMd, c as borderRadiusNone } from "../../BorderRadius-2LdggXbQ.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
+const aspectRatio1_1 = "1/1";
+const aspectRatio4_3 = "4/3";
+const aspectRatio16_9 = "16/9";
+const aspectRatio21_9 = "21/9";
+const aspectRatio32_9 = "32/9";
+const aspectRatio48_9 = "48/9";
 const objectPositionCenter = "center";
 const objectPositionLeftTop = "top left";
 const objectPositionLeftCenter = "center left";
@@ -19,47 +18,59 @@ const objectPositionLeftBottom = "bottom left";
 const objectPositionRightTop = "top right";
 const objectPositionRightCenter = "center right";
 const objectPositionRightBottom = "bottom right";
-const aspectRatio1_1 = "1/1";
-const aspectRatio4_3 = "4/3";
-const aspectRatio16_9 = "16/9";
-const aspectRatio21_9 = "21/9";
-const aspectRatio32_9 = "32/9";
-const aspectRatio48_9 = "48/9";
-const ImageStyled = styled.img.withConfig({
+const objectFitContain = "contain";
+const objectFitCover = "cover";
+const objectFitNone = "none";
+const ImageContainerStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
-  displayName: "ImageStyled",
+  displayName: "ImageContainerStyled",
   componentId: "sc-z3qszb-0"
 })({
-  display: "block",
-  width: "100%"
+  overflow: "hidden",
+  position: "relative",
+  width: "100%",
+  height: "100%",
+  "& img": {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    height: "100%",
+    objectFit: "cover",
+    width: "100%"
+  }
 }, ({
-  objectFit = "contain"
+  aspectRatio
 }) => ({
-  objectFit
+  aspectRatio
 }), ({
-  objectPosition
+  roundedCorners
 }) => ({
-  objectPosition
+  borderRadius: roundedCorners ? getBorderRadius(borderRadiusMd) : getBorderRadius(borderRadiusNone)
 }), ({
-  horizontalAlignment = "left"
+  objectFit = "contain"
 }) => ({
-  marginLeft: horizontalAlignment === "left" ? 0 : "auto",
-  marginRight: horizontalAlignment === "right" ? 0 : "auto"
+  "& img": {
+    objectFit
+  }
 }), ({
-  corners = cornerStraight
+  objectPosition
 }) => ({
-  borderRadius: corners === "rounded" ? getBorderRadius(borderRadiusMd) : getBorderRadius(borderRadiusNone)
+  "& img": {
+    objectPosition
+  }
 }), ({
-  aspectRatio
+  width,
+  height
 }) => ({
-  aspectRatio
-}), getBottomSpacing);
+  width: width ? width : "100%",
+  height: height ? height : "100%"
+}));
 const Image = ({
-  alt = "",
   ...props
-}) => /* @__PURE__ */ jsx(ImageStyled, { ..."" === alt ? {
-  "aria-hidden": true
-} : {}, ...props, alt });
+}) => {
+  const ImageComponent = useImageComponent();
+  return /* @__PURE__ */ jsx(ImageContainerStyled, { aspectRatio: props.aspectRatio, roundedCorners: props.roundedCorners, objectFit: props.objectFit, objectPosition: props.objectPosition, width: props.width, height: props.height, children: /* @__PURE__ */ jsx(ImageComponent, { ...props }) });
+};
 export {
   aspectRatio16_9,
   aspectRatio1_1,
@@ -68,9 +79,6 @@ export {
   aspectRatio48_9,
   aspectRatio4_3,
   Image as default,
-  horizontalAlignmentCenter,
-  horizontalAlignmentLeft,
-  horizontalAlignmentRight,
   objectFitContain,
   objectFitCover,
   objectFitNone,

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

@@ -1,14 +1,12 @@
 import { ImgHTMLAttributes } from 'react';
 import { PatternProps } from '../../foundations/PatternProps';
-import { CornerStyle } from '../../foundations/types/CornerStyle';
-export declare const objectFitContain = "contain";
-export declare const objectFitCover = "cover";
-export declare const objectFitNone = "none";
-export type ImageObjectFit = typeof objectFitContain | typeof objectFitCover | typeof objectFitNone;
-export declare const horizontalAlignmentLeft = "left";
-export declare const horizontalAlignmentRight = "right";
-export declare const horizontalAlignmentCenter = "center";
-export type ImageAlignment = typeof horizontalAlignmentLeft | typeof horizontalAlignmentRight | typeof horizontalAlignmentCenter;
+export declare const aspectRatio1_1 = "1/1";
+export declare const aspectRatio4_3 = "4/3";
+export declare const aspectRatio16_9 = "16/9";
+export declare const aspectRatio21_9 = "21/9";
+export declare const aspectRatio32_9 = "32/9";
+export declare const aspectRatio48_9 = "48/9";
+export type AspectRatio = typeof aspectRatio1_1 | typeof aspectRatio4_3 | typeof aspectRatio16_9 | typeof aspectRatio21_9 | typeof aspectRatio32_9 | typeof aspectRatio48_9;
 export declare const objectPositionCenter = "center";
 export declare const objectPositionLeftTop = "top left";
 export declare const objectPositionLeftCenter = "center left";
@@ -17,45 +15,50 @@ export declare const objectPositionRightTop = "top right";
 export declare const objectPositionRightCenter = "center right";
 export declare const objectPositionRightBottom = "bottom right";
 export type ImageObjectPosition = typeof objectPositionCenter | typeof objectPositionLeftTop | typeof objectPositionLeftCenter | typeof objectPositionLeftBottom | typeof objectPositionRightTop | typeof objectPositionRightCenter | typeof objectPositionRightBottom;
-export declare const aspectRatio1_1 = "1/1";
-export declare const aspectRatio4_3 = "4/3";
-export declare const aspectRatio16_9 = "16/9";
-export declare const aspectRatio21_9 = "21/9";
-export declare const aspectRatio32_9 = "32/9";
-export declare const aspectRatio48_9 = "48/9";
-export type AspectRatio = typeof aspectRatio1_1 | typeof aspectRatio4_3 | typeof aspectRatio16_9 | typeof aspectRatio21_9 | typeof aspectRatio32_9 | typeof aspectRatio48_9;
-export interface ImageProps extends PatternProps, ImgHTMLAttributes<HTMLImageElement & HTMLSourceElement> {
+export declare const objectFitContain = "contain";
+export declare const objectFitCover = "cover";
+export declare const objectFitNone = "none";
+export type ImageObjectFit = typeof objectFitContain | typeof objectFitCover | typeof objectFitNone;
+export interface ImageProps extends PatternProps, ImgHTMLAttributes<HTMLImageElement> {
     /**
      * Pin component's name from string to the concrete name
      */
     component?: 'Image';
     /**
-     * Object-fit variations
+     * Image source URL
      */
-    objectFit?: ImageObjectFit;
+    src: string;
     /**
-     * objectPosition can be used for fine-tuning if the aspect ratio of the asset
-     * does not match the aspect ratio for the component in the layout 100%.
+     * Multiple sources for responsiveness
      */
-    objectPosition?: ImageObjectPosition;
+    srcSet?: string;
     /**
-     * Horizontal alignment of image inside its container
+     * Alternative description of image. Leave empty to mark image as decorative and hidden for screen readers.
      */
-    horizontalAlignment?: ImageAlignment;
+    alt?: string;
     /**
-     * Corner variations
+     * Image aspect-ratio
      */
-    corners?: CornerStyle;
+    aspectRatio?: AspectRatio;
     /**
-     * Image source URL
+     * Images can optionally have rounded corners by using the “roundedCorners” property.
      */
-    src: string;
+    roundedCorners?: boolean;
     /**
-     * Alternative description of image. Leave empty to mark image as decorative and hidden for screen readers.
+     * Object-fit variations
      */
-    alt?: string;
+    objectFit?: ImageObjectFit;
     /**
-     * Image aspect-ratio
+     * objectPosition can be used for fine-tuning if the aspect ratio of the asset
+     * does not match the aspect ratio for the component in the layout 100%.
+     */
+    objectPosition?: ImageObjectPosition;
+    /**
+     * While using aspectRatio is preferred, setting of a fixed height is also valid
+     */
+    height?: number;
+    /**
+     * While using aspectRatio is preferred, setting of a fixed width is also valid
      */
-    aspectRatio: AspectRatio;
+    width?: number;
 }

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

@@ -1,2 +1,2 @@
 import { ImageProps } from './props';
-export declare const ImageStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, ImageProps>> & string;
+export declare const ImageContainerStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<ImageProps, "width" | "height" | "aspectRatio" | "objectFit" | "objectPosition" | "roundedCorners">>> & string;

package/dist/components/ImageHeader/index.js

@@ -4,25 +4,25 @@ import Body from "../Body/index.js";
 import Button from "../Button/index.js";
 import Container from "../Container/index.js";
 import Heading from "../Heading/index.js";
-import { P as Price, b as priceSizeSm } from "../../index-C69TqGKE.js";
-import { R as RichText } from "../../index-B5p4bosD.js";
+import { P as Price, b as priceSizeSm } from "../../index-Vub90geg.js";
+import { R as RichText } from "../../index-rbdl_kyF.js";
 import { b as fontWeightLight } from "../../FontWeight-C2pGs7aR.js";
 import { m as mediumSize } from "../../SizeTypes-Ck_RdzIf.js";
 import { a as spacingMd, c as spacingSm, d as spacingXl, b as spacingXs, e as spacing2Xs, s as spacingNone } from "../../Spacing-BMQelJYr.js";
 import styled from "styled-components";
+import ArtDirectedImage from "../ArtDirectedImage/index.js";
 import Badge from "../Badge/index.js";
 import ButtonGroup from "../ButtonGroup/index.js";
 import Grid from "../Grid/index.js";
 import GridItem from "../GridItem/index.js";
-import ResponsiveImage from "../ResponsiveImage/index.js";
-import { v as viewport } from "../../index-Ck2bCrhT.js";
+import viewport from "../../foundations/media-query/viewport/index.js";
 import { getBackgroundColor } from "../../foundations/token/getBackgroundColor/index.js";
 import { getBodySize } from "../../foundations/token/getBodySize/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { b as colorBackgroundOverlay } from "../../BackgroundColor-DSOSZvNi.js";
 import { t as textBodyMd } from "../../TextBodySize-BcZR9mh2.js";
-import { a as flexOrientationVertical } from "../../styled-CyZvsdJs.js";
-import { a as headingAlignCenter } from "../../styled-VAsSnb5y.js";
+import { a as flexOrientationVertical } from "../../styled-DG6HSLPJ.js";
+import { a as headingAlignCenter } from "../../styled-Csv7V9ez.js";
 const imageHeaderVariantFull = "full";
 const imageHeaderVariantSplit = "split";
 const imageHeaderPositionRight = "right";
@@ -87,7 +87,7 @@ const ImageHeaderImagesContainerStyled = styled(GridItem).withConfig({
     };
   }
 });
-const ImageHeaderResponsiveImageStyled = styled(ResponsiveImage).withConfig({
+const ImageHeaderResponsiveImageStyled = styled(ArtDirectedImage).withConfig({
   displayName: "ImageHeaderResponsiveImageStyled",
   componentId: "sc-7ig3h-2"
 })({

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

@@ -1,4 +1,5 @@
 import { HTMLAttributes } from 'react';
+import { ResponsiveImageProps } from '../ArtDirectedImage/props';
 import { BadgeProps } from '../Badge/props';
 import { BodyProps } from '../Body/props';
 import { ButtonProps } from '../Button/props';
@@ -7,7 +8,6 @@ import { ButtonGroupProps } from '../ButtonGroup/props';
 import { GridColSpan } from '../Grid/props';
 import { HeadingProps } from '../Heading/props';
 import { PriceProps } from '../Price/props';
-import { ResponsiveImageProps } from '../ResponsiveImage/props';
 import { RichTextProps } from '../RichText/props';
 import { PatternProps } from '../../foundations/PatternProps';
 import { Theme } from '../../foundations/types/Theme';

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

@@ -2,7 +2,7 @@ import { ImageHeaderProps } from './props';
 export declare const getBadgeTopPosition: () => string;
 export declare const ImageHeaderStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../Grid').GridProps, Pick<ImageHeaderProps, "position" | "variant">>> & string & Omit<import('react').FC<import('../Grid').GridProps>, keyof import('react').Component<any, {}, any>>;
 export declare const ImageHeaderImagesContainerStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../GridItem').GridItemProps, Pick<ImageHeaderProps, "position" | "variant">>> & string & Omit<import('react').FC<import('../GridItem').GridItemProps>, keyof import('react').Component<any, {}, any>>;
-export declare const ImageHeaderResponsiveImageStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../ResponsiveImage').ResponsiveImageProps, Pick<ImageHeaderProps, "position" | "variant">>> & string & Omit<import('react').FC<import('../ResponsiveImage').ResponsiveImageProps>, keyof import('react').Component<any, {}, any>>;
+export declare const ImageHeaderResponsiveImageStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../ArtDirectedImage').ArtDirectedImageProps, Pick<ImageHeaderProps, "position" | "variant">>> & string & Omit<import('react').FC<import('../ArtDirectedImage').ArtDirectedImageProps>, keyof import('react').Component<any, {}, any>>;
 export declare const ImageHeaderContentStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('../GridItem').GridItemProps, Pick<ImageHeaderProps, "position" | "contentGridDesktopColumns" | "variant">>> & string & Omit<import('react').FC<import('../GridItem').GridItemProps>, keyof import('react').Component<any, {}, any>>;
 export declare const ImageHeaderBadgeStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('../Badge').BadgeProps, never>> & string & Omit<import('react').FC<import('../Badge').BadgeProps>, keyof import('react').Component<any, {}, any>>;
 export declare const ImageHeaderHeadingStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('../Heading').HeadingProps, never>> & string & Omit<import('react').FC<import('../Heading').HeadingProps>, keyof import('react').Component<any, {}, any>>;

package/dist/components/InfoBanner/index.js

@@ -4,7 +4,7 @@ import Button from "../Button/index.js";
 import Heading from "../Heading/index.js";
 import Icon from "../Icon/index.js";
 import { d as iconSizeLg } from "../../props-7dcsjRUx.js";
-import "../../styled-RnVr222F.js";
+import "../../styled-DUsRG1Xh.js";
 import { f as fontWeightRegular } from "../../FontWeight-C2pGs7aR.js";
 import { t as textHeadingXs } from "../../HeadingSize-CfCRn3Lh.js";
 import { a as spacingMd, s as spacingNone } from "../../Spacing-BMQelJYr.js";
@@ -17,7 +17,7 @@ import { getSpacing } from "../../foundations/token/getSpacing/index.js";
 import { a as colorBackgroundSubtle, e as colorBackgroundBrand } from "../../BackgroundColor-DSOSZvNi.js";
 import { c as colorObjectNeutral } from "../../ObjectColor-0RAzLGI5.js";
 import { g as getForegroundColor } from "../../colorUtils-lb0oJttx.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 const InfoBannerContainerStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "InfoBannerContainerStyled",

package/dist/components/InlineIcon/index.js

@@ -2,7 +2,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { l as inlineIconModeStroke } from "../../props-7dcsjRUx.js";
 import { I, f, i, g, h, j, d, c, b, e, a, k } from "../../props-7dcsjRUx.js";
-import { I as InlineIconStyled } from "../../styled-RnVr222F.js";
+import { I as InlineIconStyled } from "../../styled-DUsRG1Xh.js";
 const InlineIcon = ({
   className,
   alt = "",

package/dist/components/InlineLink/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { useLinkComponent } from "../../hooks/useLinkComponent/index.js";
-import { f as filterPropsForUnstyledComponent } from "../../filterProps-CTn92eZw.js";
+import { f as filterPropsForUnstyledComponent } from "../../filterProps-CPul3CC8.js";
 import { s as sanitizeLinkProps } from "../../sanitizeLinkProps-D2Kkovy1.js";
 import styled from "styled-components";
 import forcedColors from "../../foundations/media-query/forcedColors/index.js";

package/dist/components/Input/index.js

@@ -9,7 +9,7 @@ import { a as spacingMd, b as spacingXs } from "../../Spacing-BMQelJYr.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 import { a as inputStateError } from "../../props-DDpgcryb.js";
 import { i } from "../../props-DDpgcryb.js";
-import { I as InputWrapperStyled, a as InputStyled } from "../../styled-BTBLpB_G.js";
+import { I as InputWrapperStyled, a as InputStyled } from "../../styled-CWusLu5R.js";
 const Input = forwardRef(({
   uid,
   status,

package/dist/components/Label/index.js

@@ -4,7 +4,7 @@ import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTex
 import styled from "styled-components";
 import { getBodySize } from "../../foundations/token/getBodySize/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 const LabelStyled = styled.label.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "LabelStyled",

package/dist/components/Legend/index.js

@@ -3,7 +3,7 @@ import { jsx, Fragment } from "react/jsx-runtime";
 import Body from "../Body/index.js";
 import Heading from "../Heading/index.js";
 import IconSnippet, { iconSnippetAlignCenter } from "../IconSnippet/index.js";
-import { R as RichText } from "../../index-B5p4bosD.js";
+import { R as RichText } from "../../index-rbdl_kyF.js";
 import { L as LegendStyled } from "../../styled-CH1kr8ZR.js";
 const Legend = ({
   contents,

package/dist/components/Link/index.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { L as LinkAsButton, p as primaryAppearance, a as LinkStyled, g as getLinkIcon } from "../../index-M27FMM9r.js";
+import { L as LinkAsButton, p as primaryAppearance, a as LinkStyled, g as getLinkIcon } from "../../index-tpq3BGwZ.js";
 import { useLinkComponent } from "../../hooks/useLinkComponent/index.js";
-import { f as filterPropsForUnstyledComponent } from "../../filterProps-CTn92eZw.js";
+import { f as filterPropsForUnstyledComponent } from "../../filterProps-CPul3CC8.js";
 import { r as renderInlineRichTextFromOpenText } from "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 import { s as sanitizeLinkProps } from "../../sanitizeLinkProps-D2Kkovy1.js";
 const isLinkAsButtonProp = (props) => {

package/dist/components/LinkAsButton/index.js

@@ -1,6 +1,6 @@
 "use client";
 import "react/jsx-runtime";
-import { L } from "../../index-M27FMM9r.js";
+import { L } from "../../index-tpq3BGwZ.js";
 import "../../renderInlineRichTextFromOpenText-RvOG3QbI.js";
 export {
   L as default

package/dist/components/LinkList/index.js

@@ -5,7 +5,7 @@ import { u as ulTagName, l as liTagName } from "../../tags-38kBhOn6.js";
 import { s as spacingNone } from "../../Spacing-BMQelJYr.js";
 import { L as LinkListStyled, b as LinkListLiStyled, l as linkListVariantRow } from "../../styled-BlHKbHF4.js";
 import { a } from "../../styled-BlHKbHF4.js";
-import { l as linkListItemVariantVertical, a as linkListItemVariantHorizontal } from "../../styled-SllFJc7o.js";
+import { l as linkListItemVariantVertical, a as linkListItemVariantHorizontal } from "../../styled-CKK_LUlC.js";
 const LinkList = ({
   items,
   variant,

package/dist/components/LinkListItem/index.js

@@ -3,15 +3,15 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import Badge from "../Badge/index.js";
 import { I as IconLoader } from "../../index-C3dW-7e_.js";
 import { c as iconSizeMd } from "../../props-7dcsjRUx.js";
-import "../../styled-RnVr222F.js";
+import "../../styled-DUsRG1Xh.js";
 import { s as spanTagName } from "../../tags-38kBhOn6.js";
 import { s as smallSize } from "../../SizeTypes-Ck_RdzIf.js";
 import { s as spacingNone } from "../../Spacing-BMQelJYr.js";
 import { useLinkComponent } from "../../hooks/useLinkComponent/index.js";
-import { f as filterPropsForUnstyledComponent } from "../../filterProps-CTn92eZw.js";
+import { f as filterPropsForUnstyledComponent } from "../../filterProps-CPul3CC8.js";
 import { s as sanitizeLinkProps } from "../../sanitizeLinkProps-D2Kkovy1.js";
-import { L as LinkListItemElevatedStyled, b as LinkListItemStyled, c as LinkListItemButtonStyled, d as LinkListItemAnchorStyled, e as LinkListItemContentWrapperStyled, a as linkListItemVariantHorizontal, f as LinkListItemContentStyled, g as LinkListItemLabelWrapperStyled, h as LinkListItemVerticalContentStyled, i as LinkListItemChevronStyled, j as LinkListLabelStyled, k as LinkListSuffixStyled } from "../../styled-SllFJc7o.js";
-import { l } from "../../styled-SllFJc7o.js";
+import { L as LinkListItemElevatedStyled, b as LinkListItemStyled, c as LinkListItemButtonStyled, d as LinkListItemAnchorStyled, e as LinkListItemContentWrapperStyled, a as linkListItemVariantHorizontal, f as LinkListItemContentStyled, g as LinkListItemLabelWrapperStyled, h as LinkListItemVerticalContentStyled, i as LinkListItemChevronStyled, j as LinkListLabelStyled, k as LinkListSuffixStyled } from "../../styled-CKK_LUlC.js";
+import { l } from "../../styled-CKK_LUlC.js";
 const isLinkListItemAsButtonProp = (props) => {
   return props.href === void 0;
 };

package/dist/components/LoadingSpinner/index.js

@@ -3,7 +3,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import { createPortal } from "react-dom";
 import ScreenreaderOnly from "../ScreenreaderOnly/index.js";
-import { L as LoadingSpinnerSVGStyled, a as LoadingSpinnerPathXsStyled, b as LoadingSpinnerPathOuter3Styled, c as LoadingSpinnerPathOuter2Styled, d as LoadingSpinnerPathOuter1Styled, e as LoadingSpinnerPathCenterStyled, f as LoadingSpinnerContainerStyled, g as LoadingSpinnerContentStyled, h as LoadingSpinnerLabelStyled, i as LoadingSpinnerChildrenStyled } from "../../styled-U9du2n1i.js";
+import { L as LoadingSpinnerSVGStyled, a as LoadingSpinnerPathXsStyled, b as LoadingSpinnerPathOuter3Styled, c as LoadingSpinnerPathOuter2Styled, d as LoadingSpinnerPathOuter1Styled, e as LoadingSpinnerPathCenterStyled, f as LoadingSpinnerContainerStyled, g as LoadingSpinnerContentStyled, h as LoadingSpinnerLabelStyled, i as LoadingSpinnerChildrenStyled } from "../../styled-D_F38PuI.js";
 const LoadingSpinnerSVG = ({
   size = "lg",
   ...props

package/dist/components/LocalStyle/index.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import styled, { css } from "styled-components";
-import { a as cssVarsString } from "../../cssVars-C3-c3zhv.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
+import { a as cssVarsString } from "../../cssVars-_wntC-Ac.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
 const LocalStyleStyled = styled.div.withConfig({
   shouldForwardProp: filterProps(),
   displayName: "LocalStyleStyled",

package/dist/components/MediaText/index.js

@@ -6,20 +6,20 @@ import FlexItem from "../FlexItem/index.js";
 import Heading from "../Heading/index.js";
 import Image, { aspectRatio16_9 } from "../Image/index.js";
 import Link from "../Link/index.js";
-import { R as RichText } from "../../index-B5p4bosD.js";
+import { R as RichText } from "../../index-rbdl_kyF.js";
 import YoutubeVideo from "../YoutubeVideo/index.js";
 import { p as pTagName, u as ulTagName, d as divTagName, l as liTagName } from "../../tags-38kBhOn6.js";
 import { f as fontWeightRegular } from "../../FontWeight-C2pGs7aR.js";
 import { b as textHeadingSm, t as textHeadingXs } from "../../HeadingSize-CfCRn3Lh.js";
 import { a as spacingMd, e as spacing2Xs, c as spacingSm, s as spacingNone } from "../../Spacing-BMQelJYr.js";
-import { u as useViewport } from "../../index-G2mpsxF7.js";
+import { u as useViewport } from "../../index-DKCzYjXw.js";
 import styled from "styled-components";
-import { v as viewport } from "../../index-Ck2bCrhT.js";
+import viewport from "../../foundations/media-query/viewport/index.js";
 import { getBottomSpacing } from "../../foundations/token/getBottomSpacing/index.js";
 import { getSpacing } from "../../foundations/token/getSpacing/index.js";
-import { a as filterProps } from "../../filterProps-CTn92eZw.js";
-import { h as headingAlignLeft } from "../../styled-VAsSnb5y.js";
-import { a as flexOrientationVertical, f as flexOrientationHorizontal, b as flexJustifyStart } from "../../styled-CyZvsdJs.js";
+import { a as filterProps } from "../../filterProps-CPul3CC8.js";
+import { h as headingAlignLeft } from "../../styled-Csv7V9ez.js";
+import { a as flexOrientationVertical, f as flexOrientationHorizontal, b as flexJustifyStart } from "../../styled-DG6HSLPJ.js";
 const mediaTextPositionTop = "top";
 const mediaTextPositionLeft = "left";
 const mediaTextPositionRight = "right";