decentraland-ui2 0.8.7-12672622196.commit-d2cfa98 → 0.8.8-12715203702.commit-365ad79

package/dist/components/MarketingBanner/MarketingBanner.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { MarketingBannerProps } from "./MarketingBanner.types";
+export declare const MarketingBanner: React.FC<MarketingBannerProps>;

package/dist/components/MarketingBanner/MarketingBanner.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { documentToReactComponents } from "@contentful/rich-text-react-renderer";
+import CircularProgress from "@mui/material/CircularProgress";
+import { Locales, getAssetUrl, useGetContentfulEntry, } from "../../hooks/contenful";
+import { BannerContainer, Button, ButtonContainer, Content, LoadingContainer, Logo, Text, Title, } from "./MarketingBanner.styled";
+const BANNER_CONTENT_TYPE = "banner";
+export const MarketingBanner = (props) => {
+    const { id, environment, token, space, locale = Locales.enUS } = props;
+    const { fields, assets, isLoading, error } = useGetContentfulEntry(id, environment, BANNER_CONTENT_TYPE, token, space);
+    if (isLoading) {
+        return (_jsx(LoadingContainer, { children: _jsx(CircularProgress, {}) }));
+    }
+    // If there is no banner fields or the banner is not supposed to be shown, return null
+    if (!fields || !fields.showBanner[locale] || error) {
+        return null;
+    }
+    return (_jsxs(BannerContainer, { mobileBackground: getAssetUrl(assets, locale, fields.mobileBackground[locale]), fullSizeBackground: getAssetUrl(assets, locale, fields.fullSizeBackground[locale]), children: [_jsxs(Content, { children: [_jsx(Title, { variant: "h1", mobileTitleAlignment: fields.mobileTitleAlignment[locale]?.toLowerCase(), desktopTitleAlignment: fields.desktopTitleAlignment[locale]?.toLowerCase(), children: fields.title[locale] }), _jsx(Text, { desktopTextAlignment: fields.desktopTextAlignment[locale]?.toLowerCase(), mobileTextAlignment: fields.mobileTextAlignment[locale]?.toLowerCase(), children: fields.text[locale]
+                            ? documentToReactComponents(fields.text[locale])
+                            : null }), fields.showButton[locale] &&
+                        fields.buttonLink?.[locale] &&
+                        fields.buttonsText?.[locale] ? (_jsx(ButtonContainer, { desktopAlignment: fields.desktopButtonAlignment[locale]?.toLowerCase(), mobileAlignment: fields.mobileButtonAlignment[locale]?.toLowerCase(), children: _jsx(Button, { href: fields.buttonLink[locale], variant: "contained", disableElevation: true, children: fields.buttonsText[locale] }) })) : null] }), fields.logo && fields.logo[locale] && (_jsx(Logo, { src: getAssetUrl(assets, locale, fields.logo[locale]), alt: "Banner logo" }))] }));
+};
+//# sourceMappingURL=MarketingBanner.js.map

package/dist/components/MarketingBanner/MarketingBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarketingBanner.js","sourceRoot":"","sources":["../../../src/components/MarketingBanner/MarketingBanner.tsx"],"names":[],"mappings":"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"}

package/dist/components/MarketingBanner/MarketingBanner.stories.d.ts

@@ -0,0 +1,16 @@
+import { MarketingBanner } from "./MarketingBanner";
+import type { StoryObj } from "@storybook/react";
+declare const meta: {
+    title: string;
+    component: import("react").FC<import("./MarketingBanner.types").MarketingBannerProps>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+type Story = StoryObj<typeof MarketingBanner>;
+declare const Default: Story;
+declare const SpanishLocale: Story;
+declare const ChineseLocale: Story;
+export { Default, SpanishLocale, ChineseLocale };
+export default meta;

package/dist/components/MarketingBanner/MarketingBanner.stories.js

@@ -0,0 +1,34 @@
+import { MarketingBanner } from "./MarketingBanner";
+import { Locales } from "../../hooks/contenful";
+const meta = {
+    title: "Decentraland UI/MarketingBanner",
+    component: MarketingBanner,
+    parameters: {
+        layout: "fullscreen",
+    },
+    tags: ["autodocs"],
+};
+const Default = {
+    args: {
+        id: "2maJ4UuoqaYtbZxVGymsJo",
+        environment: "development",
+        token: "AATjg5ZJgxllQW8PBSQV4ZaY5wh9W_lQSKIiERHY-sc",
+        space: "ea2ybdmmn1kv",
+    },
+};
+const SpanishLocale = {
+    args: {
+        ...Default.args,
+        locale: Locales.es,
+    },
+};
+const ChineseLocale = {
+    args: {
+        ...Default.args,
+        locale: Locales.zh,
+    },
+};
+export { Default, SpanishLocale, ChineseLocale };
+// eslint-disable-next-line import/no-default-export
+export default meta;
+//# sourceMappingURL=MarketingBanner.stories.js.map

package/dist/components/MarketingBanner/MarketingBanner.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarketingBanner.stories.js","sourceRoot":"","sources":["../../../src/components/MarketingBanner/MarketingBanner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAG/C,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,iCAAiC;IACxC,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;CACoB,CAAA;AAIxC,MAAM,OAAO,GAAU;IACrB,IAAI,EAAE;QACJ,EAAE,EAAE,wBAAwB;QAC5B,WAAW,EAAE,aAAa;QAC1B,KAAK,EAAE,6CAA6C;QACpD,KAAK,EAAE,cAAc;KACtB;CACF,CAAA;AAED,MAAM,aAAa,GAAU;IAC3B,IAAI,EAAE;QACJ,GAAG,OAAO,CAAC,IAAI;QACf,MAAM,EAAE,OAAO,CAAC,EAAE;KACnB;CACF,CAAA;AAED,MAAM,aAAa,GAAU;IAC3B,IAAI,EAAE;QACJ,GAAG,OAAO,CAAC,IAAI;QACf,MAAM,EAAE,OAAO,CAAC,EAAE;KACnB;CACF,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,CAAA;AAChD,oDAAoD;AACpD,eAAe,IAAI,CAAA"}

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

@@ -0,0 +1,58 @@
+import type { Property } from "csstype";
+declare const LoadingContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+declare const BannerContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    mobileBackground: string;
+    fullSizeBackground: string;
+}, {}, {}>;
+declare const ContentWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+declare const Content: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+declare const Logo: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+declare const Title: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, "typography" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "className" | "style" | "classes" | "children" | "sx" | "variant" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    mobileTitleAlignment?: Property.TextAlign;
+    desktopTitleAlignment?: Property.TextAlign;
+}, {}, {}>;
+declare const Text: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    mobileTextAlignment?: Property.TextAlign;
+    desktopTextAlignment?: Property.TextAlign;
+}, {}, {}>;
+declare const ButtonContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    mobileAlignment?: Property.TextAlign;
+    desktopAlignment?: Property.TextAlign;
+}, {}, {}>;
+declare const Button: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, "disabled" | "color" | "className" | "style" | "classes" | "children" | "sx" | "variant" | "tabIndex" | "disableElevation" | "fullWidth" | "startIcon" | "endIcon" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "href" | "size"> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export { LoadingContainer, BannerContainer, Content, ContentWrapper, Logo, Title, Text, ButtonContainer, Button, };

package/dist/components/MarketingBanner/MarketingBanner.styled.js

@@ -0,0 +1,123 @@
+import styled from "@emotion/styled";
+import { Box, Button as MuiButton, Typography } from "@mui/material";
+const convertAlignmentToFlex = (alignment) => {
+    switch (alignment) {
+        case "left":
+            return "flex-start";
+        case "center":
+            return "center";
+        case "right":
+            return "flex-end";
+        default:
+            return "flex-start";
+    }
+};
+const LoadingContainer = styled(Box)({
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    width: "100%",
+});
+const BannerContainer = styled(Box, {
+    shouldForwardProp: (prop) => prop !== "mobileBackground" && prop !== "fullSizeBackground",
+})((props) => {
+    const { theme, mobileBackground, fullSizeBackground } = props;
+    return {
+        width: "100%",
+        overflow: "hidden",
+        display: "flex",
+        padding: "2rem",
+        justifyContent: "space-between",
+        flexDirection: "row",
+        backgroundImage: `url(${fullSizeBackground})`,
+        backgroundSize: "cover",
+        backgroundPosition: "center",
+        alignItems: "center",
+        [theme.breakpoints.down("sm")]: {
+            backgroundImage: `url(${mobileBackground})`,
+            flexDirection: "column-reverse",
+        },
+    };
+});
+const ContentWrapper = styled(Box)({
+    display: "flex",
+    flexDirection: "row",
+    flexGrow: 1,
+    marginRight: "20px",
+});
+const Content = styled(Box)((props) => {
+    const { theme } = props;
+    return {
+        display: "flex",
+        flexDirection: "column",
+        gap: "0.1rem",
+        [theme.breakpoints.down("sm")]: {
+            padding: "1rem",
+        },
+    };
+});
+const Logo = styled("img")((props) => {
+    const { theme } = props;
+    return {
+        flexShrink: 0,
+        maxWidth: "400px",
+        [theme.breakpoints.down("sm")]: {
+            maxWidth: "300px",
+            marginBottom: "1rem",
+        },
+    };
+});
+const Title = styled(Typography, {
+    shouldForwardProp: (prop) => prop !== "mobileTitleAlignment" && prop !== "desktopTitleAlignment",
+})((props) => {
+    const { theme, mobileTitleAlignment, desktopTitleAlignment } = props;
+    return {
+        margin: 0,
+        color: "#fff",
+        textAlign: desktopTitleAlignment || "left",
+        fontSize: "28px",
+        textTransform: "uppercase",
+        fontWeight: 800,
+        [theme.breakpoints.down("sm")]: {
+            textAlign: mobileTitleAlignment || "left",
+            fontSize: "24px",
+        },
+    };
+});
+const Text = styled(Box, {
+    shouldForwardProp: (prop) => prop !== "mobileTextAlignment" && prop !== "desktopTextAlignment",
+})((props) => {
+    const { theme, mobileTextAlignment, desktopTextAlignment } = props;
+    return {
+        color: "#fff",
+        textAlign: desktopTextAlignment || "left",
+        fontSize: "19px",
+        "& p": {
+            margin: 0,
+            padding: 0,
+        },
+        [theme.breakpoints.down("sm")]: {
+            textAlign: mobileTextAlignment || "left",
+            fontSize: "16px",
+        },
+    };
+});
+const ButtonContainer = styled(Box, {
+    shouldForwardProp: (prop) => prop !== "mobileAlignment" && prop !== "desktopAlignment",
+})((props) => {
+    const { theme, mobileAlignment, desktopAlignment } = props;
+    return {
+        display: "flex",
+        marginTop: "1rem",
+        alignItems: convertAlignmentToFlex(desktopAlignment || "left"),
+        [theme.breakpoints.down("sm")]: {
+            alignItems: convertAlignmentToFlex(mobileAlignment || "left"),
+        },
+    };
+});
+const Button = styled(MuiButton)({
+    textTransform: "uppercase",
+    minWidth: "300px",
+});
+export { LoadingContainer, BannerContainer, Content, ContentWrapper, Logo, Title, Text, ButtonContainer, Button, };
+//# sourceMappingURL=MarketingBanner.styled.js.map

package/dist/components/MarketingBanner/MarketingBanner.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarketingBanner.styled.js","sourceRoot":"","sources":["../../../src/components/MarketingBanner/MarketingBanner.styled.ts"],"names":[],"mappings":"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"}

package/dist/components/MarketingBanner/MarketingBanner.types.d.ts

@@ -0,0 +1,29 @@
+import { AlignmentFieldType, Locales, LocalizedField, SysAssetLink } from "hooks/contenful";
+import type { Document } from "@contentful/rich-text-types";
+type LowercasedAlignment = "left" | "center" | "right";
+type IBannerFields = {
+    id: LocalizedField<string>;
+    showBanner: LocalizedField<boolean>;
+    title: LocalizedField<string>;
+    mobileTitleAlignment: LocalizedField<AlignmentFieldType>;
+    desktopTitleAlignment: LocalizedField<AlignmentFieldType>;
+    text: LocalizedField<Document>;
+    desktopTextAlignment: LocalizedField<AlignmentFieldType>;
+    mobileTextAlignment: LocalizedField<AlignmentFieldType>;
+    showButton: LocalizedField<boolean>;
+    buttonLink?: LocalizedField<string>;
+    buttonsText?: LocalizedField<string>;
+    desktopButtonAlignment: LocalizedField<AlignmentFieldType>;
+    mobileButtonAlignment: LocalizedField<AlignmentFieldType>;
+    fullSizeBackground: LocalizedField<SysAssetLink>;
+    mobileBackground: LocalizedField<SysAssetLink>;
+    logo?: LocalizedField<SysAssetLink>;
+};
+type MarketingBannerProps = {
+    id: string;
+    environment: string;
+    token: string;
+    space: string;
+    locale?: Locales;
+};
+export type { LowercasedAlignment, IBannerFields, MarketingBannerProps };

package/dist/components/MarketingBanner/MarketingBanner.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=MarketingBanner.types.js.map

package/dist/components/MarketingBanner/MarketingBanner.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarketingBanner.types.js","sourceRoot":"","sources":["../../../src/components/MarketingBanner/MarketingBanner.types.ts"],"names":[],"mappings":""}

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

@@ -0,0 +1,2 @@
+export { MarketingBanner } from "./MarketingBanner";
+export { MarketingBannerProps } from "./MarketingBanner.types";

package/dist/components/MarketingBanner/index.js

@@ -0,0 +1,2 @@
+export { MarketingBanner } from "./MarketingBanner";
+//# sourceMappingURL=index.js.map

package/dist/components/MarketingBanner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MarketingBanner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA"}

package/dist/hooks/contenful/contentful.d.ts

@@ -0,0 +1,9 @@
+import { ContentfulAsset, Locales, LocalizedField, LocalizedFieldType, SysAssetLink } from "./contentful.types";
+declare const getAssetUrl: (assets: Record<string, ContentfulAsset>, locale: Locales, assetLink?: SysAssetLink) => string;
+declare const useGetContentfulEntry: <T extends Record<string, LocalizedField<LocalizedFieldType>>>(id: string, environment: string, contentType: string, token: string, space: string) => {
+    fields: T | null;
+    assets: {};
+    isLoading: boolean;
+    error: string | null;
+};
+export { useGetContentfulEntry, getAssetUrl };

package/dist/hooks/contenful/contentful.js

@@ -0,0 +1,54 @@
+import { useEffect, useState } from "react";
+const getAssetUrl = (assets, locale, assetLink) => {
+    if (!assetLink)
+        return "";
+    const asset = assets[assetLink.sys.id];
+    return asset?.fields.file[locale]?.url
+        ? `https:${asset.fields.file[locale].url}`
+        : "";
+};
+const useGetContentfulEntry = (id, environment, contentType, token, space) => {
+    const [fields, setFields] = useState(null);
+    const [assets, setAssets] = useState({});
+    const [isLoading, setIsLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        const fetchData = async () => {
+            try {
+                const response = await fetch(`https://cdn.contentful.com/spaces/${space}/environments/${environment}/entries/?` +
+                    new URLSearchParams({
+                        "sys.id": id,
+                        content_type: contentType,
+                        locale: "*",
+                    }), {
+                    headers: {
+                        Authorization: `Bearer ${token}`,
+                    },
+                });
+                if (!response.ok) {
+                    throw new Error("Failed to fetch entity data");
+                }
+                const data = await response.json();
+                if (!data.items || data.items.length === 0) {
+                    throw new Error("No entity found with the specified ID");
+                }
+                const assetsMap = data.includes.Asset.reduce((acc, asset) => {
+                    acc[asset.sys.id] = asset;
+                    return acc;
+                }, {});
+                setAssets(assetsMap);
+                setFields(data.items[0].fields);
+            }
+            catch (err) {
+                setError(err instanceof Error ? err.message : "An error occurred");
+            }
+            finally {
+                setIsLoading(false);
+            }
+        };
+        fetchData();
+    }, [id, environment, token, space]);
+    return { fields, assets, isLoading, error };
+};
+export { useGetContentfulEntry, getAssetUrl };
+//# sourceMappingURL=contentful.js.map

package/dist/hooks/contenful/contentful.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contentful.js","sourceRoot":"","sources":["../../../src/hooks/contenful/contentful.ts"],"names":[],"mappings":"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"}

package/dist/hooks/contenful/contentful.types.d.ts

@@ -0,0 +1,53 @@
+import type { Document } from "@contentful/rich-text-types";
+declare enum ContentfulLocale {
+    enUS = "en-US",
+    es = "es",
+    zh = "zh"
+}
+type LocalizedField<T> = {
+    [key in ContentfulLocale]: T;
+};
+type SysAssetLink = {
+    sys: {
+        type: "Link";
+        linkType: "Asset";
+        id: string;
+    };
+};
+type ContentfulAsset = {
+    sys: {
+        id: string;
+        type: "Asset";
+    };
+    fields: {
+        title: LocalizedField<string>;
+        description: LocalizedField<string>;
+        file: LocalizedField<{
+            url: string;
+            details: {
+                size: number;
+                image?: {
+                    width: number;
+                    height: number;
+                };
+            };
+            fileName: string;
+            contentType: string;
+        }>;
+    };
+};
+type AlignmentFieldType = "Left" | "Center" | "Right";
+type LocalizedFieldType = string | boolean | Document | SysAssetLink | AlignmentFieldType;
+type ContentfulResponse<T extends Record<string, LocalizedField<LocalizedFieldType>>> = {
+    items: Array<{
+        fields: T;
+        sys: {
+            id: string;
+            type: "Entry";
+        };
+    }>;
+    includes: {
+        Asset: ContentfulAsset[];
+    };
+};
+export { ContentfulLocale as Locales, LocalizedField, SysAssetLink, ContentfulAsset, AlignmentFieldType, LocalizedFieldType, ContentfulResponse, };

package/dist/hooks/contenful/contentful.types.js

@@ -0,0 +1,8 @@
+var ContentfulLocale;
+(function (ContentfulLocale) {
+    ContentfulLocale["enUS"] = "en-US";
+    ContentfulLocale["es"] = "es";
+    ContentfulLocale["zh"] = "zh";
+})(ContentfulLocale || (ContentfulLocale = {}));
+export { ContentfulLocale as Locales, };
+//# sourceMappingURL=contentful.types.js.map

package/dist/hooks/contenful/contentful.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contentful.types.js","sourceRoot":"","sources":["../../../src/hooks/contenful/contentful.types.ts"],"names":[],"mappings":"AAEA,IAAK,gBAIJ;AAJD,WAAK,gBAAgB;IACnB,kCAAc,CAAA;IACd,6BAAS,CAAA;IACT,6BAAS,CAAA;AACX,CAAC,EAJI,gBAAgB,KAAhB,gBAAgB,QAIpB;AA4DD,OAAO,EACL,gBAAgB,IAAI,OAAO,GAO5B,CAAA"}

package/dist/hooks/contenful/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./contentful.types";
+export * from "./contentful";

package/dist/hooks/contenful/index.js

@@ -0,0 +1,3 @@
+export * from "./contentful.types";
+export * from "./contentful";
+//# sourceMappingURL=index.js.map

package/dist/hooks/contenful/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hooks/contenful/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAClC,cAAc,cAAc,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "decentraland-ui2",
-  "version": "0.8.7-12672622196.commit-d2cfa98",
+  "version": "0.8.8-12715203702.commit-365ad79",
   "description": "Decentraland's UI components and styles",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -37,6 +37,7 @@
   },
   "homepage": "https://github.com/decentraland/ui2#readme",
   "dependencies": {
+    "@contentful/rich-text-react-renderer": "^16.0.1",
     "@dcl/schemas": "^13.9.0",
     "@dcl/ui-env": "^1.5.1",
     "@emotion/react": "^11.11.4",
@@ -55,6 +56,7 @@
     "@babel/preset-env": "^7.24.7",
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
+    "@contentful/rich-text-types": "^17.0.0",
     "@dcl/eslint-config": "^2.2.1",
     "@storybook/addon-docs": "^7.6.20",
     "@storybook/addon-essentials": "^7.6.20",
@@ -90,5 +92,5 @@
   "files": [
     "dist"
   ],
-  "commit": "d2cfa98df66f67f2e2c13d37b012c7f4fed550cf"
+  "commit": "365ad798082928e08bb83ae2b95fa380a8805e57"
 }