@vodafone_de/brix-components 3.1.6 → 3.1.8

package/components/GoogleMap/index.js

@@ -0,0 +1,195 @@
+"use client";
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const reactGoogleMaps = require("@vis.gl/react-google-maps");
+const react = require("react");
+const Spacing = require("../../Spacing-Cu_j2b83.cjs");
+const hooks_useThirdPartyConsent = require("../../hooks/useThirdPartyConsent/index.js");
+const components_Body = require("../Body/index.js");
+const components_Button = require("../Button/index.js");
+const styled = require("styled-components");
+const styled$1 = require("../../styled-nCWTwQUZ.cjs");
+const foundations_mediaQuery_viewport = require("../../index-DuE6C2cO.cjs");
+const foundations_token_getBackgroundColor = require("../../foundations/token/getBackgroundColor/index.js");
+const foundations_token_getSpacing = require("../../foundations/token/getSpacing/index.js");
+const BackgroundColor = require("../../BackgroundColor-C3dayRDw.cjs");
+const components_Heading = require("../Heading/index.js");
+const HeadingSize = require("../../HeadingSize-cjNplkhN.cjs");
+const foundations_token_getBorderColor = require("../../foundations/token/getBorderColor/index.js");
+const foundations_token_getBorderRadius = require("../../foundations/token/getBorderRadius/index.js");
+const foundations_token_getBorderWidth = require("../../foundations/token/getBorderWidth/index.js");
+const foundations_token_getBottomSpacing = require("../../foundations/token/getBottomSpacing/index.js");
+const BorderColor = require("../../BorderColor-Bl18ZGTj.cjs");
+const BorderRadius = require("../../BorderRadius-tg_0N_aM.cjs");
+const BorderWidth = require("../../BorderWidth-BLS_JGlE.cjs");
+const CornerStyle = require("../../CornerStyle-Dp7lKShv.cjs");
+const filterProps = require("../../filterProps-D3K8rtOg.cjs");
+const mapBG = "R0lGODlhjABPANUAAJfU/sHeosfhrOj1/tXezKvYyqXX+9Xu/7XasbDd/cno/bvj/vP47M7ltNDe6Nrg1e/25s3eu/f7897uzdbpweDl29LnuvL6/tTr5+by2rra7qTX4cvlxczn1eHx5Onv4+ry4b/i4tTpy+/z6uPo7evr7PHx8eXl5uHh4uPj5O3t7unp6v39/fn5+fv7++r04OLw0/v9+drryPX38/j8/97w/PP18fn79/Pz8/X19efn6Pf39+/v8L3cm////9/f4CH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4xLWMwMDIgNzkuYjdjNjRjY2Y5LCAyMDI0LzA3LzE2LTEyOjM5OjA0ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjYuMCAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDozRDlBQzk4M0VEMjIxMUVGOUMyN0NBQUIzREFFNTdENCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDozRDlBQzk4NEVEMjIxMUVGOUMyN0NBQUIzREFFNTdENCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjNEOUFDOTgxRUQyMjExRUY5QzI3Q0FBQjNEQUU1N0Q0IiBzdFJlZjpkb2N1bWVudElEPSJ4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";
+const ConsentMessageBackgroundStyled = styled.div.withConfig({
+  displayName: "ConsentMessageBackgroundStyled",
+  componentId: "sc-la2plq-0"
+})({
+  position: "absolute",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+  overflow: "hidden"
+});
+const ConsentMessageBackgroundMapStyled = styled.div.withConfig({
+  displayName: "ConsentMessageBackgroundMapStyled",
+  componentId: "sc-la2plq-1"
+})({
+  position: "absolute",
+  top: "-10%",
+  left: "-10%",
+  right: "-10%",
+  bottom: "-10%",
+  backgroundImage: `url("data:image/gif;base64, ${mapBG} ")`,
+  backgroundPosition: "center",
+  backgroundSize: "cover",
+  backgroundColor: foundations_token_getBackgroundColor.getBackgroundColor(BackgroundColor.colorBackgroundOverlay),
+  backgroundBlendMode: "overlay",
+  filter: "blur(8px)"
+});
+const ConsentMessageStyled = styled.div.withConfig({
+  displayName: "ConsentMessageStyled",
+  componentId: "sc-la2plq-2"
+})({
+  position: "absolute",
+  top: "50%",
+  transform: "translate(0, -50%)",
+  left: foundations_token_getSpacing.getSpacing(Spacing.spacingMd),
+  right: foundations_token_getSpacing.getSpacing(Spacing.spacingMd),
+  ...foundations_mediaQuery_viewport.viewport.md({
+    /* no token for this maxWidth, but invented by Daniel */
+    maxWidth: "600px",
+    left: "50%",
+    right: "unset",
+    transform: "translate(-50%, -50%)"
+  })
+}, () => {
+  const css = {};
+  const buttonSelector = `& ${styled$1.ButtonStyled.toString()}`;
+  css[buttonSelector] = {
+    marginLeft: "auto",
+    marginRight: "auto"
+  };
+  return css;
+});
+const ConsentMessage = ({
+  heading,
+  body,
+  button
+}) => {
+  const [render, setRender] = react.useState(false);
+  react.useEffect(() => {
+    setRender(true);
+  }, []);
+  if (!render) {
+    return null;
+  }
+  const openConsentBanner = () => {
+    try {
+      window.adv_lib.consent.showBanner();
+    } catch (e) {
+      console.log("Could not open consentBanner");
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ConsentMessageBackgroundStyled, { children: /* @__PURE__ */ jsxRuntime.jsx(ConsentMessageBackgroundMapStyled, {}) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(ConsentMessageStyled, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(components_Heading.default, { size: HeadingSize.textHeadingXs, bottomSpacing: Spacing.spacingXs, align: components_Heading.headingAlignCenter, children: heading }),
+      /* @__PURE__ */ jsxRuntime.jsx(components_Body.default, { bottomSpacing: Spacing.spacingMd, align: components_Body.bodyAlignCenter, children: body }),
+      /* @__PURE__ */ jsxRuntime.jsx(components_Button.default, { appearance: styled$1.tertiaryAppearance, width: components_Button.buttonAutoWidth, onClick: openConsentBanner, bottomSpacing: Spacing.spacingNone, children: button })
+    ] })
+  ] });
+};
+const MapInner = ({
+  setMap,
+  children
+}) => {
+  const mapIdentifier = void 0 !== children.props.id ? children.props.id : void 0;
+  const map = reactGoogleMaps.useMap(mapIdentifier);
+  react.useEffect(() => {
+    if (!map) {
+      return;
+    }
+    setMap(map);
+  }, [map, setMap]);
+  return children;
+};
+const MapProvider = ({
+  apiKey,
+  children,
+  setMap
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(reactGoogleMaps.APIProvider, { apiKey, children: /* @__PURE__ */ jsxRuntime.jsx(MapInner, { setMap, children }) });
+};
+const GoogleMapStyled = styled.div.withConfig({
+  shouldForwardProp: filterProps.filterProps(),
+  displayName: "GoogleMapStyled",
+  componentId: "sc-jtxldi-0"
+})({
+  position: "relative",
+  borderWidth: foundations_token_getBorderWidth.getBorderWidth(BorderWidth.borderWidthSm),
+  borderColor: foundations_token_getBorderColor.getBorderColor(BorderColor.colorBorderSubtle),
+  borderStyle: "solid"
+}, ({
+  viewportHeight
+}) => {
+  let height = {
+    height: `${viewportHeight.sm}px`
+  };
+  if (viewportHeight.md) {
+    height = {
+      ...height,
+      ...foundations_mediaQuery_viewport.viewport.md({
+        height: `${viewportHeight.md}px`
+      })
+    };
+  }
+  if (viewportHeight.lg) {
+    height = {
+      ...height,
+      ...foundations_mediaQuery_viewport.viewport.lg({
+        height: `${viewportHeight.lg}px`
+      })
+    };
+  }
+  return height;
+}, ({
+  corners = CornerStyle.cornerStraight
+}) => ({
+  borderRadius: corners === "rounded" ? foundations_token_getBorderRadius.getBorderRadius(BorderRadius.borderRadiusMd) : foundations_token_getBorderRadius.getBorderRadius(BorderRadius.borderRadiusNone),
+  "& > div > div": {
+    borderRadius: corners === "rounded" ? foundations_token_getBorderRadius.getBorderRadius(BorderRadius.borderRadiusMd) : foundations_token_getBorderRadius.getBorderRadius(BorderRadius.borderRadiusNone)
+  }
+}), foundations_token_getBottomSpacing.getBottomSpacing);
+const defaultBasicMap = /* @__PURE__ */ jsxRuntime.jsx(reactGoogleMaps.Map, { defaultZoom: 18, defaultCenter: {
+  lat: 51.235587,
+  lng: 6.731483
+}, disableDefaultUI: true, gestureHandling: "greedy" });
+const GoogleMap = ({
+  children,
+  apiKey,
+  bottomSpacing = Spacing.spacingMd,
+  onMapReady,
+  consentMessage,
+  ...props
+}) => {
+  const consent = hooks_useThirdPartyConsent.useThirdPartyConsent();
+  const [map, setMap] = react.useState(null);
+  children = children || defaultBasicMap;
+  react.useEffect(() => {
+    if (!map) {
+      return;
+    }
+    if (!onMapReady) {
+      return;
+    }
+    onMapReady(map);
+  }, [map, onMapReady]);
+  return /* @__PURE__ */ jsxRuntime.jsx(GoogleMapStyled, { ...props, bottomSpacing, children: !consent ? /* @__PURE__ */ jsxRuntime.jsx(ConsentMessage, { ...consentMessage }) : /* @__PURE__ */ jsxRuntime.jsx(MapProvider, { apiKey, setMap, children }) });
+};
+module.exports = GoogleMap;

package/components/GoogleMap/props.d.ts

@@ -0,0 +1,45 @@
+import { Map } from '@vis.gl/react-google-maps';
+import { HTMLAttributes, ReactElement } from 'react';
+import { ConsentMessageProps } from './components/ConsentMessage/props';
+import { PatternProps } from '../../foundations/PatternProps';
+import { CornerStyle } from '../../foundations/types/CornerStyle';
+/**
+ * type ViewportSpecificHeight defines an object that can contain different height
+ * per every viewport (sm, md and lg)
+ *
+ * If a smaller is not overridden by a value for a larger viewport, then it applies also to all larger viewports.
+ */
+export type ViewportHeight = {
+    sm: number;
+    md?: number;
+    lg?: number;
+};
+export interface GoogleMapProps extends PatternProps, HTMLAttributes<HTMLDivElement> {
+    /**
+     * Pin component's name from string to the concrete name
+     */
+    component?: 'GoogleMap';
+    /**
+     * @TODO it is not clear where to get an API Key from
+     * https://developers.google.com/maps/documentation/javascript/get-api-key
+     */
+    apiKey: string;
+    viewportHeight: ViewportHeight;
+    /**
+     * Corner variations
+     */
+    corners?: CornerStyle;
+    /**
+     * The only valid child is a Map from react-google-maps
+     * https://visgl.github.io/react-google-maps/docs/api-reference/components/map
+     */
+    children: ReactElement<typeof Map>;
+    /**
+     * consentMessage
+     */
+    consentMessage: ConsentMessageProps;
+    /**
+     * an optional function that retrieves a map instance as soon as it is ready
+     */
+    onMapReady?: (map: google.maps.Map) => void;
+}

package/components/GoogleMap/styled.d.ts

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

package/components/Grid/getColumnWidth.d.ts

@@ -0,0 +1,3 @@
+import { CSSObject } from 'styled-components';
+import { GridItemProps } from '../GridItem/props';
+export declare const getColumnWidth: ({ sm, md, lg, spacing }: GridItemProps) => CSSObject;

package/components/Grid/getOffset.d.ts

@@ -0,0 +1,3 @@
+import { CSSObject } from 'styled-components';
+import { GridConfig, GridSpacing } from './props';
+export declare const getOffset: ({ sm, md, lg }: GridConfig, spacing: GridSpacing) => CSSObject;

package/components/Grid/helpers.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+import { GridProps, GridSpacing, GridTag } from './props';
+import { GridItemProps } from '../GridItem/props';
+export declare const autoLayout: (props: GridProps) => ReactElement<GridItemProps, string | import('react').JSXElementConstructor<any>> | ReactElement<unknown, string | import('react').JSXElementConstructor<any>>[] | undefined;
+export declare const inheritTagandSpacingToGridItems: (gridItems: ReactElement<GridItemProps> | ReactElement<GridItemProps>[], tag: GridTag, spacing?: GridSpacing) => ReactElement<GridItemProps, string | import('react').JSXElementConstructor<any>>[];

package/components/Grid/index.d.ts

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

package/components/Grid/index.js

@@ -0,0 +1,38 @@
+"use client";
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const tags = require("../../tags-CTaUxoCi.cjs");
+const Spacing = require("../../Spacing-Cu_j2b83.cjs");
+const react = require("react");
+const styled = require("../../styled-C83gSQcc.cjs");
+const autoLayout = (props) => {
+  if (!props.autoLayout) {
+    return props.children;
+  }
+  if (props.children && Array.isArray(props.children)) {
+    return props.children.map((child) => {
+      return react.cloneElement(child, {
+        ...props.autoLayout
+      });
+    });
+  }
+  if (props.children && !Array.isArray(props.children)) {
+    return react.cloneElement(props.children, {
+      ...props.autoLayout
+    });
+  }
+};
+const inheritTagandSpacingToGridItems = (gridItems, tag, spacing) => {
+  return react.Children.map(gridItems, (gridItem) => react.cloneElement(gridItem, {
+    tag: tag !== tags.divTagName ? tags.liTagName : tags.divTagName,
+    spacing
+  }));
+};
+const Grid = ({
+  tag = tags.divTagName,
+  spacing = Spacing.spacingMd,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(styled.GridStyled, { ...props, as: tag, spacing, children: inheritTagandSpacingToGridItems(autoLayout(props), tag, spacing) });
+};
+module.exports = Grid;

package/components/Grid/props.d.ts

@@ -0,0 +1,48 @@
+import { HTMLAttributes, ReactElement } from 'react';
+import { PatternProps } from '../../foundations/PatternProps';
+import { divTagName, olTagName, ulTagName } from '../../foundations/tags';
+import { Spacing } from '../../foundations/token/types/Spacing';
+import { ViewportName } from '../../foundations/token/types/Viewport';
+import { GridItemProps } from '../GridItem/props';
+export type GridColSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+export type GridTag = typeof divTagName | typeof ulTagName | typeof olTagName;
+export type GridSpacing = Extract<Spacing, 'None' | 'Md'>;
+/**
+ * type GridConfig defines an object that can contain colspans
+ * per every viewport (sm, md and large)
+ *
+ * If a smaller is not overridden by a value for a larger viewport, then it applies also to all larger viewports.
+ */
+export type GridConfig = {
+    [key in ViewportName]?: GridColSpan;
+};
+/**
+ * @TODO implement size. That's not yet implemented in brix/components-ws10
+ */
+export interface GridProps extends PatternProps, HTMLAttributes<HTMLDivElement> {
+    children?: ReactElement<GridItemProps> | Array<ReactElement<GridItemProps>>;
+    /**
+     * Affects the alignment of the last, not completely filled row of GridItems.
+     */
+    align?: 'left' | 'center' | 'right';
+    /**
+     * Defines whether all GridItems and their content have the same height or keep their original height
+     */
+    stretch?: boolean;
+    /**
+     * Autolayout is a convenient feature that makes it easier to divide many GridItems evenly
+     */
+    autoLayout?: GridConfig;
+    /**
+     * define which tag should be used to render grid
+     */
+    tag?: GridTag;
+    /**
+     * Space between rows and columns, accept only None or Md
+     */
+    spacing?: GridSpacing;
+    /**
+     * Pin component's name from string to the concrete name
+     */
+    component?: 'Grid';
+}

package/components/Grid/stories/alignGridCenterArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const alignGridCenterArgs: GridProps;

package/components/Grid/stories/alignGridItemArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const alignGridItemArgs: GridProps;

package/components/Grid/stories/alignGridRightArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const alignGridRightArgs: GridProps;

package/components/Grid/stories/grid12Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid12Args: GridProps;

package/components/Grid/stories/grid222222Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid222222Args: GridProps;

package/components/Grid/stories/grid3333Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid3333Args: GridProps;

package/components/Grid/stories/grid363Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid363Args: GridProps;

package/components/Grid/stories/grid444Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid444Args: GridProps;

package/components/Grid/stories/grid64Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid64Args: GridProps;

package/components/Grid/stories/grid66Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid66Args: GridProps;

package/components/Grid/stories/grid75Args.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const grid75Args: GridProps;

package/components/Grid/stories/nestingArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const nestingArgs: GridProps;

package/components/Grid/stories/noSpacingArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const noSpacingArgs: GridProps;

package/components/Grid/stories/offsetArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const offsetArgs: GridProps;

package/components/Grid/stories/responsiveArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const responsiveArgs: GridProps;

package/components/Grid/stories/stretchArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const stretchArgs: GridProps;

package/components/Grid/stories/tagOrderedListArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const tagOrderedListArgs: GridProps;

package/components/Grid/stories/tagUnorderedListArgs.d.ts

@@ -0,0 +1,2 @@
+import { GridProps } from '../props';
+export declare const tagUnorderedListArgs: GridProps;

package/components/Grid/styled.d.ts

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

package/components/GridItem/index.d.ts

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

package/components/GridItem/index.js

@@ -0,0 +1,11 @@
+"use client";
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const tags = require("../../tags-CTaUxoCi.cjs");
+const styled = require("../../styled-B_Yb1i3j.cjs");
+const GridItem = ({
+  sm = 12,
+  tag = tags.divTagName,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(styled.GridItemStyled, { ...props, as: tag, sm, children: props.children });
+module.exports = GridItem;

package/components/GridItem/props.d.ts

@@ -0,0 +1,25 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { GridConfig, GridProps } from '../Grid/props';
+import { PatternProps } from '../../foundations/PatternProps';
+import { divTagName, liTagName } from '../../foundations/tags';
+export type GridItemTag = typeof divTagName | typeof liTagName;
+export type GridItemAlign = 'left' | 'center' | 'right';
+export interface GridItemProps extends GridConfig, Omit<PatternProps, 'bottomSpacing'>, Pick<GridProps, 'spacing'>, HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    /**
+     * Offset props push an item to the right side of the grid.
+     */
+    offset?: GridConfig;
+    /**
+     * align the content within a GridItem
+     */
+    align?: GridItemAlign;
+    /**
+     * Pin component's name from string to the concrete name
+     */
+    component?: 'GridItem';
+    /**
+     * Define which html tag is used for Griditem
+     */
+    tag?: GridItemTag;
+}

package/components/GridItem/styled.d.ts

@@ -0,0 +1,3 @@
+import { GridItemProps } from './props';
+export declare const gutter = "16px";
+export declare const GridItemStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, GridItemProps>> & string;

package/components/Heading/index.d.ts

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

package/components/Heading/index.js

@@ -0,0 +1,94 @@
+"use client";
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("react/jsx-runtime");
+const components_FootnoteLink = require("../FootnoteLink/index.js");
+const Spacing = require("../../Spacing-Cu_j2b83.cjs");
+const renderInlineRichTextFromOpenText = require("../../renderInlineRichTextFromOpenText-CfOFMQ1v.cjs");
+const styled = require("styled-components");
+const tags = require("../../tags-CTaUxoCi.cjs");
+const foundations_token_getBottomSpacing = require("../../foundations/token/getBottomSpacing/index.js");
+const foundations_token_getFontWeight = require("../../foundations/token/getFontWeight/index.js");
+const foundations_token_getHeadingSize = require("../../foundations/token/getHeadingSize/index.js");
+const foundations_token_getTextColor = require("../../foundations/token/getTextColor/index.js");
+const FontWeight = require("../../FontWeight-D3-RZpaX.cjs");
+const TextColor = require("../../TextColor-BZDXH1wP.cjs");
+const filterProps = require("../../filterProps-D3K8rtOg.cjs");
+const headingAlignLeft = "left";
+const headingAlignCenter = "center";
+const mapHeadingSizeToFontWeight = {
+  xl: FontWeight.fontWeightLight,
+  lg: FontWeight.fontWeightLight,
+  md: FontWeight.fontWeightLight,
+  sm: FontWeight.fontWeightBold,
+  xs: FontWeight.fontWeightBold
+};
+const mapSizeToTag = {
+  xl: tags.h1TagName,
+  lg: tags.h2TagName,
+  md: tags.h3TagName,
+  sm: tags.h4TagName,
+  xs: tags.h5TagName
+};
+const mapSizeToBottomSpacing = {
+  xl: Spacing.spacingXl,
+  lg: Spacing.spacingLg,
+  md: Spacing.spacingMd,
+  sm: Spacing.spacingSm,
+  xs: Spacing.spacingXs
+};
+const attributes = (props) => {
+  const attrs = {};
+  attrs.as = props.tag ? props.tag : mapSizeToTag[props.size];
+  if (attrs.as && false === tags.headingHtmlTags.includes(attrs.as)) {
+    attrs.role = "heading";
+    if (!props["aria-level"]) {
+      const level = parseInt(mapSizeToTag[props.size].replace("h", ""));
+      attrs["aria-level"] = level;
+    }
+  }
+  return attrs;
+};
+const HeadingStyled = styled.h1.withConfig({
+  shouldForwardProp: filterProps.filterProps(),
+  displayName: "HeadingStyled",
+  componentId: "sc-qb1b6s-0"
+}).attrs(attributes)({
+  color: foundations_token_getTextColor.getTextColor(TextColor.colorTextNeutral),
+  "&:focus-visible": {
+    outline: "none"
+  }
+}, ({
+  size
+}) => foundations_token_getHeadingSize.getHeadingSize(size), ({
+  weight,
+  size
+}) => ({
+  fontWeight: foundations_token_getFontWeight.getFontWeight(weight ? weight : mapHeadingSizeToFontWeight[size])
+}), ({
+  align = headingAlignLeft
+}) => ({
+  textAlign: align
+}), ({
+  bottomSpacing,
+  size
+}) => {
+  if (bottomSpacing) {
+    return foundations_token_getBottomSpacing.getBottomSpacing({
+      bottomSpacing
+    });
+  }
+  return foundations_token_getBottomSpacing.getBottomSpacing({
+    bottomSpacing: mapSizeToBottomSpacing[size]
+  });
+});
+const Heading = ({
+  bottomSpacing = Spacing.spacingMd,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsxs(HeadingStyled, { ...props, bottomSpacing, children: [
+  renderInlineRichTextFromOpenText.renderInlineRichTextFromOpenText(props.children),
+  props.footnote && /* @__PURE__ */ jsxRuntime.jsx(components_FootnoteLink, { ...props.footnote })
+] });
+exports.default = Heading;
+exports.headingAlignCenter = headingAlignCenter;
+exports.headingAlignLeft = headingAlignLeft;

package/components/Heading/props.d.ts

@@ -0,0 +1,46 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { FootnoteLinkProps } from '../FootnoteLink/props';
+import { PatternProps } from '../../foundations/PatternProps';
+import { HeadingHtmlTag, divTagName, pTagName, spanTagName } from '../../foundations/tags';
+import { FontWeight } from '../../foundations/token/types/FontWeight';
+import { TextHeadingSize } from '../../foundations/token/types/HeadingSize';
+import { Theme } from '../../foundations/types/Theme';
+export type HeadingTag = HeadingHtmlTag | typeof divTagName | typeof spanTagName | typeof pTagName;
+export declare const headingAlignLeft = "left";
+export declare const headingAlignCenter = "center";
+type HeadingAlign = typeof headingAlignLeft | typeof headingAlignCenter;
+export interface HeadingProps extends PatternProps, HTMLAttributes<HTMLHeadingElement> {
+    /**
+     * heading tshirt size between xs and xs
+     */
+    size: TextHeadingSize;
+    /**
+     * By default a html-element is used according to level. e.g. `<h1>` is used for `size=textHeadingXl`
+     * that behavior can be overwritten by setting a different value for `as`
+     */
+    tag?: HeadingTag;
+    /**
+     * font weight can be light, regular or bold.
+     * If it is left empty, then one default is used per headline level
+     */
+    weight?: FontWeight;
+    /**
+     * Align left or center
+     */
+    align?: HeadingAlign;
+    /**
+     * Can be used on darker backgrounds by setting to 'dark'
+     */
+    theme?: Theme;
+    /**
+     * Content of heading
+     */
+    children: ReactNode;
+    /**
+     * add a footnote into the headline
+     */
+    footnote?: FootnoteLinkProps;
+    /** Pin component's name from string to the concrete name */
+    component?: 'Heading';
+}
+export {};