fansunited-frontend-components 0.0.31-RC5 → 0.0.31-RC6

package/packages/common/src/components/Skeletons/Standard/StandardSkeleton.js

@@ -1,238 +0,0 @@
-import { j as e } from "../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as s, Typography as n, AspectRatio as v } from "@mui/joy";
-import { isMobile as L, useInternalTheme as N, useSpacingScale as U, useFontFamily as R, useCornerRadius as q, useColors as k, useImageBackgroundGradient as z } from "../../../functions/theme.js";
-import { hexToRgb as E, getBrandingClickUrl as J, stripHtmlTags as j } from "../../../functions/helpers.js";
-import "../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import { WidgetTemplate as K } from "../../../enums/enums.js";
-import g from "../../Rules.js";
-import "react";
-import "../../../providers/ConstantsProvider.js";
-import { createStyles as Q } from "./StandardSkeleton.styles.js";
-import "../../../providers/ContainerProvider.js";
-const te = ({
-  entity: o,
-  headline: c,
-  finalImage: x,
-  imagePosition: u = "left",
-  children: A,
-  embedCodeContainerRef: d,
-  hasEmbedCode: C = !1,
-  filterScreenContent: l,
-  rulesDisplay: p
-}) => {
-  var b, I;
-  const h = L(), H = N(), t = U(), M = R().primary, F = R().secondary, w = q(), i = ((b = o.branding) == null ? void 0 : b.colors) || null, a = ((I = o.branding) == null ? void 0 : I.urls) || null, S = (i == null ? void 0 : i.contentColor) || k().textColor, V = (i == null ? void 0 : i.secondaryColor) || k().textColor, B = (i == null ? void 0 : i.backgroundColor) || k().surfaceVariant, D = "60%", O = z(
-    K.STANDARD
-  ), r = Q({
-    finalImage: x,
-    spacingScale: t,
-    borderRadius: w,
-    fontFamilyPrimary: M,
-    fontFamilySecondary: F,
-    textColor: S,
-    secondaryColor: V,
-    bgcolor: E(B || ""),
-    opacity: D,
-    brandingColors: i,
-    imagePosition: u,
-    darkTextColor: H.colorSchemes.dark.textColor,
-    imageBackgroundGradient: O,
-    isMobile: h
-  }), m = J(
-    a == null ? void 0 : a.primaryUrl,
-    a == null ? void 0 : a.secondaryUrl,
-    "image"
-  ), W = () => {
-    m && window.open(m, "_blank", "noopener,noreferrer");
-  }, y = (f, T) => m ? typeof window > "u" ? /* @__PURE__ */ e.jsx(
-    s,
-    {
-      component: "a",
-      href: m,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      sx: {
-        ...T,
-        cursor: "pointer",
-        textDecoration: "none"
-      },
-      children: f
-    }
-  ) : /* @__PURE__ */ e.jsx(
-    s,
-    {
-      sx: {
-        ...T,
-        cursor: "pointer"
-      },
-      onClick: W,
-      children: f
-    }
-  ) : /* @__PURE__ */ e.jsx(s, { sx: T, children: f }), G = () => C && d ? /* @__PURE__ */ e.jsxs(s, { sx: r.mobileHeadlineWithoutImage, children: [
-    /* @__PURE__ */ e.jsxs(s, { children: [
-      /* @__PURE__ */ e.jsxs(
-        s,
-        {
-          sx: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            gap: t["3xs"]
-          },
-          children: [
-            /* @__PURE__ */ e.jsx(n, { level: "body-sm", sx: r.headlineTypography, children: c }),
-            /* @__PURE__ */ e.jsx(
-              g,
-              {
-                rules: o.rules || "",
-                rulesDisplay: p,
-                isOverlayVariant: !1
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ e.jsxs(s, { sx: r.contentContainer, children: [
-        /* @__PURE__ */ e.jsx(n, { level: "h4", sx: r.titleTypography, children: o.title }),
-        /* @__PURE__ */ e.jsx(n, { sx: r.descriptionTypography, children: j(o.description) })
-      ] })
-    ] }),
-    /* @__PURE__ */ e.jsx(v, { ratio: "16/9", sx: r.aspectRatioContainer, children: /* @__PURE__ */ e.jsx(s, { ref: d }) })
-  ] }) : x ? y(
-    /* @__PURE__ */ e.jsxs(s, { sx: r.mobileHeadlineContent, children: [
-      /* @__PURE__ */ e.jsxs(s, { children: [
-        /* @__PURE__ */ e.jsxs(
-          s,
-          {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              gap: t["3xs"]
-            },
-            children: [
-              /* @__PURE__ */ e.jsx(
-                n,
-                {
-                  level: "body-sm",
-                  sx: r.headlineTypographyMobileImage,
-                  children: c
-                }
-              ),
-              /* @__PURE__ */ e.jsx(
-                g,
-                {
-                  rules: o.rules || "",
-                  rulesDisplay: p,
-                  isOverlayVariant: !1
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ e.jsxs(s, { sx: r.contentContainer, children: [
-          /* @__PURE__ */ e.jsx(n, { sx: r.titleTypographyMobileImage, children: o.title }),
-          /* @__PURE__ */ e.jsx(n, { sx: r.descriptionTypographyMobileImage, children: j(o.description) })
-        ] })
-      ] }),
-      l && /* @__PURE__ */ e.jsx(s, { children: l })
-    ] }),
-    r.mobileHeadlineWithImage
-  ) : /* @__PURE__ */ e.jsxs(s, { sx: r.mobileHeadlineWithoutImage, children: [
-    /* @__PURE__ */ e.jsxs(s, { children: [
-      /* @__PURE__ */ e.jsxs(
-        s,
-        {
-          sx: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            gap: t["3xs"]
-          },
-          children: [
-            /* @__PURE__ */ e.jsx(n, { level: "body-sm", sx: r.headlineTypography, children: c }),
-            /* @__PURE__ */ e.jsx(
-              g,
-              {
-                rules: o.rules || "",
-                rulesDisplay: p,
-                isOverlayVariant: !1
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ e.jsxs(s, { sx: r.contentContainer, children: [
-        /* @__PURE__ */ e.jsx(n, { level: "h4", sx: r.titleTypography, children: o.title }),
-        /* @__PURE__ */ e.jsx(n, { sx: r.descriptionTypography, children: j(o.description) })
-      ] })
-    ] }),
-    l && /* @__PURE__ */ e.jsx(s, { children: l })
-  ] }), _ = !(h && l);
-  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    h && G(),
-    u === "left" && x ? y(
-      /* @__PURE__ */ e.jsx(s, { sx: r.imageSafeArea }),
-      r.imageContainerLeft
-    ) : null,
-    _ && /* @__PURE__ */ e.jsxs(s, { sx: r.mainContentArea, children: [
-      !h && /* @__PURE__ */ e.jsx(s, { children: /* @__PURE__ */ e.jsxs(s, { sx: r.desktopHeadlineContainer, children: [
-        /* @__PURE__ */ e.jsxs(
-          s,
-          {
-            sx: {
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "center"
-            },
-            children: [
-              /* @__PURE__ */ e.jsxs(
-                s,
-                {
-                  sx: {
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    gap: t["3xs"]
-                  },
-                  children: [
-                    /* @__PURE__ */ e.jsx(
-                      n,
-                      {
-                        level: "body-sm",
-                        sx: r.headlineTypographyDesktop,
-                        children: c
-                      }
-                    ),
-                    /* @__PURE__ */ e.jsx(
-                      g,
-                      {
-                        rules: o.rules || "",
-                        rulesDisplay: p,
-                        isOverlayVariant: !1
-                      }
-                    )
-                  ]
-                }
-              ),
-              /* @__PURE__ */ e.jsxs(s, { sx: r.contentContainer, children: [
-                /* @__PURE__ */ e.jsx(n, { level: "h4", sx: r.titleTypographyDesktop, children: o.title }),
-                /* @__PURE__ */ e.jsx(n, { sx: r.descriptionTypographyDesktop, children: j(o.description) })
-              ] })
-            ]
-          }
-        ),
-        C && d ? /* @__PURE__ */ e.jsx(s, { sx: { px: t.md }, children: /* @__PURE__ */ e.jsx(v, { ratio: "16/9", sx: r.aspectRatioContainer, children: /* @__PURE__ */ e.jsx(s, { ref: d }) }) }) : l ? /* @__PURE__ */ e.jsx(s, { children: l }) : /* @__PURE__ */ e.jsx(e.Fragment, {})
-      ] }) }),
-      A
-    ] }),
-    u === "right" && x ? y(
-      /* @__PURE__ */ e.jsx(s, { sx: r.imageSafeArea }),
-      r.imageContainerRight
-    ) : null
-  ] });
-};
-export {
-  te as default
-};

package/packages/common/src/components/Skeletons/Standard/StandardSkeleton.styles.js

@@ -1,211 +0,0 @@
-const a = (e) => {
-  var i, t, n;
-  return {
-    // Mobile headline with image background
-    mobileHeadlineWithImage: {
-      display: e.isMobile ? "flex" : "none",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      gap: "10px",
-      backgroundImage: `url(${e.finalImage})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center",
-      borderTopLeftRadius: "5px",
-      borderTopRightRadius: "5px",
-      position: "relative",
-      minHeight: "210px",
-      overflow: "hidden",
-      height: "auto",
-      "&::before": {
-        content: '""',
-        position: "absolute",
-        width: "100%",
-        height: "100%",
-        background: e.imageBackgroundGradient,
-        borderTopLeftRadius: "5px",
-        borderTopRightRadius: "5px"
-      }
-    },
-    // Mobile headline content
-    mobileHeadlineContent: {
-      zIndex: 1,
-      height: "100%",
-      p: e.spacingScale.xl,
-      gap: e.spacingScale["2xl"],
-      display: "flex",
-      flexDirection: "column",
-      justifyContent: "space-between"
-    },
-    // Mobile headline without image
-    mobileHeadlineWithoutImage: {
-      display: e.isMobile ? "flex" : "none",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      p: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
-      gap: e.spacingScale["2xl"]
-    },
-    // Headline typography (mobile with image)
-    headlineTypographyMobileImage: {
-      fontWeight: 500,
-      lineHeight: "166%",
-      letterSpacing: "1px",
-      fontSize: "0.75em",
-      color: ((i = e.brandingColors) == null ? void 0 : i.secondaryColor) || e.darkTextColor,
-      opacity: "70%",
-      textTransform: "uppercase",
-      fontFamily: e.fontFamilySecondary,
-      textAlign: "center"
-    },
-    // Headline typography (mobile without image & desktop)
-    headlineTypography: {
-      fontWeight: 500,
-      lineHeight: "166%",
-      letterSpacing: "1px",
-      textTransform: "uppercase",
-      fontSize: "0.75em",
-      color: e.secondaryColor,
-      opacity: e.opacity,
-      fontFamily: e.fontFamilySecondary,
-      textAlign: e.isMobile ? "center" : "left"
-    },
-    // Headline typography (desktop centered)
-    headlineTypographyDesktop: {
-      fontWeight: 500,
-      lineHeight: "166%",
-      letterSpacing: "1px",
-      textTransform: "uppercase",
-      fontSize: "0.75em",
-      color: e.secondaryColor,
-      opacity: e.opacity,
-      fontFamily: e.fontFamilySecondary
-    },
-    // Content container
-    contentContainer: {
-      display: "flex",
-      flexDirection: "column",
-      gap: e.spacingScale["3xs"]
-    },
-    // Title typography (mobile with image)
-    titleTypographyMobileImage: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      fontSize: "1.5em",
-      letterSpacing: "0.15px",
-      color: ((t = e.brandingColors) == null ? void 0 : t.contentColor) || e.darkTextColor,
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: "center"
-    },
-    // Title typography (mobile without image & desktop responsive)
-    titleTypography: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      letterSpacing: "0px",
-      fontSize: "1.5em",
-      color: e.textColor,
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: e.isMobile ? "center" : "left"
-    },
-    // Title typography (desktop centered)
-    titleTypographyDesktop: {
-      fontWeight: 700,
-      lineHeight: "133%",
-      letterSpacing: "0px",
-      fontSize: "1.5em",
-      color: e.textColor,
-      fontFamily: e.fontFamilyPrimary
-    },
-    // Description typography (mobile with image)
-    descriptionTypographyMobileImage: {
-      fontWeight: 400,
-      lineHeight: "140%",
-      fontSize: "1.25em",
-      letterSpacing: "0.15px",
-      color: ((n = e.brandingColors) == null ? void 0 : n.secondaryColor) || e.darkTextColor,
-      opacity: "70%",
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: "center"
-    },
-    // Description typography (mobile without image & desktop responsive)
-    descriptionTypography: {
-      fontWeight: 400,
-      lineHeight: "140%",
-      letterSpacing: "0.15px",
-      fontSize: "1.25em",
-      color: e.secondaryColor,
-      opacity: e.opacity,
-      fontFamily: e.fontFamilyPrimary,
-      textAlign: e.isMobile ? "center" : "left"
-    },
-    // Description typography (desktop centered)
-    descriptionTypographyDesktop: {
-      fontWeight: 400,
-      lineHeight: "140%",
-      letterSpacing: "0.15px",
-      fontSize: "1.25em",
-      color: e.secondaryColor,
-      opacity: e.opacity,
-      fontFamily: e.fontFamilyPrimary
-    },
-    // Image container (left position)
-    imageContainerLeft: {
-      display: e.isMobile ? "none" : "block",
-      flex: "0.3",
-      overflow: "hidden",
-      height: "auto",
-      position: "relative",
-      minHeight: "auto",
-      backgroundImage: `url(${e.finalImage})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center center",
-      backgroundRepeat: "no-repeat",
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    // Image container (right position)
-    imageContainerRight: {
-      display: e.isMobile ? "none" : "block",
-      flex: "0.3",
-      overflow: "hidden",
-      height: "auto",
-      position: "relative",
-      minHeight: "auto",
-      backgroundImage: `url(${e.finalImage})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center center",
-      backgroundRepeat: "no-repeat",
-      alignItems: "center",
-      justifyContent: "center"
-    },
-    // Image safe area (placeholder for image space)
-    imageSafeArea: {
-      width: "100%",
-      height: "100%"
-    },
-    // Main content area
-    mainContentArea: {
-      flex: e.isMobile ? "1" : e.finalImage ? "0.7" : "1",
-      display: "flex",
-      flexDirection: "column",
-      px: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
-      pt: e.spacingScale.lg,
-      pb: e.isMobile ? e.spacingScale.sm : e.spacingScale.md,
-      gap: e.spacingScale.md
-    },
-    // Desktop headline container
-    desktopHeadlineContainer: {
-      display: e.isMobile ? "none" : "flex",
-      flexDirection: "column",
-      justifyContent: "space-between",
-      gap: e.spacingScale["2xl"],
-      textAlign: "center"
-    },
-    // Aspect ratio container (for embed code)
-    aspectRatioContainer: {
-      borderRadius: e.borderRadius.md,
-      overflow: "hidden"
-    }
-  };
-};
-export {
-  a as createStyles
-};

package/packages/common/src/components/Spinner.js

@@ -1,36 +0,0 @@
-import { j as t } from "../../../../node_modules/react/jsx-runtime.js";
-import { Box as s, CircularProgress as o } from "@mui/joy";
-import { useColors as r } from "../functions/theme.js";
-const a = ({ my: e }) => /* @__PURE__ */ t.jsx(
-  s,
-  {
-    sx: {
-      display: "flex",
-      justifyContent: "center",
-      alignItems: "center",
-      width: "100%",
-      height: "100%",
-      my: e
-    },
-    children: /* @__PURE__ */ t.jsx(
-      o,
-      {
-        slotProps: {
-          track: {
-            sx: {
-              stroke: r().palette.neutral.softBg
-            }
-          },
-          progress: {
-            sx: {
-              stroke: r().palette.neutral.solidBg
-            }
-          }
-        }
-      }
-    )
-  }
-);
-export {
-  a as default
-};