@anywayseo/tools 5.4.5 → 5.6.0

package/dist/index-CyuHme_p.js

@@ -0,0 +1,1059 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const react$1 = require("@chakra-ui/react");
+const reactI18next = require("react-i18next");
+require("react-medium-image-zoom");
+const index = require("./index-CR5rM7at.js");
+const react$2 = require("@mdx-js/react");
+const react = require("react");
+require("./index-C6MG_f24.js");
+const index$4 = require("./index-DMR4Ptkt.js");
+const index$1 = require("./index-B6wz_B9_.js");
+const index$6 = require("./index-DDg_PkD2.js");
+const index$5 = require("./index-C-ri0Fgy.js");
+const icons = require("@chakra-ui/icons");
+const index$2 = require("./index-5J1CqqcW.js");
+const index$3 = require("./index-CkRY_NXp.js");
+const i18next = require("i18next");
+const Markdown = require("react-markdown");
+const ONE_LINE_HEIGHT = 24;
+const Bio = ({ content, maxLines = 1 }) => {
+  const ref = react.useRef(null);
+  const [showToggle, setShowToggle] = react.useState(false);
+  const [isExpanded, setIsExpanded] = react.useState(false);
+  const { t } = reactI18next.useTranslation("author");
+  react.useLayoutEffect(() => {
+    if (ref.current) {
+      const { scrollWidth, clientWidth, scrollHeight, clientHeight } = ref.current;
+      const isClamped = scrollWidth > clientWidth || scrollHeight > clientHeight;
+      setShowToggle(isClamped);
+    }
+    return () => {
+      setShowToggle(false);
+    };
+  }, []);
+  function handleClick() {
+    setIsExpanded((prev) => !prev);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Box, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Collapse, { in: isExpanded, startingHeight: ONE_LINE_HEIGHT * maxLines, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { ref, fontSize: "md", noOfLines: isExpanded ? void 0 : maxLines, children: content }) }),
+    showToggle && /* @__PURE__ */ jsxRuntime.jsx(react$1.Button, { size: "sm", variant: "link", colorScheme: "blue", onClick: handleClick, children: isExpanded ? t("action.collapse") : t("action.expand") })
+  ] });
+};
+const Author = ({ author, variant }) => {
+  const { name, role, bio, avatar, socialNetworks } = author;
+  if (variant === "short") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { align: "center", gap: 4, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { w: 12, h: 12, children: /* @__PURE__ */ jsxRuntime.jsx(index.Image, { src: avatar, alt: name, rounded: "full" }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(react$1.Box, { fontWeight: "semibold", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { color: "gray.500", children: role })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { direction: { base: "column", sm: "row" }, align: { base: "center", sm: "flex-start" }, gap: 4, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Flex, { flex: 1, maxW: { base: 48, sm: 32 }, children: /* @__PURE__ */ jsxRuntime.jsx(index.Image, { src: avatar, alt: name, rounded: "full" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Flex, { flex: 1, children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.Stack, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(react$1.Text, { fontSize: "lg", fontWeight: 600, children: [
+        `${name}, `,
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { as: "span", display: "inline-block", color: "gray.500", children: role })
+      ] }),
+      (socialNetworks == null ? void 0 : socialNetworks.length) && /* @__PURE__ */ jsxRuntime.jsx(index$1.SocialNetworks, { socialNetworks }),
+      /* @__PURE__ */ jsxRuntime.jsx(Bio, { content: bio })
+    ] }) })
+  ] });
+};
+const Center = ({ children, ...boxProps }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.Center, { ...boxProps, children });
+};
+const defaultColumns = { base: 1, sm: 2, md: 3, lg: 4, xl: 5 };
+const Grid = ({ items, columns = defaultColumns, gap, render, getKey, ...boxProps }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.SimpleGrid, { as: "ul", columns, spacing: gap, p: 0, m: 0, listStyleType: "none", ...boxProps, children: items.map((item, index2) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { as: "li", children: render(item) }, getKey ? getKey(item) : index2)) });
+};
+const AuthorCard = ({ author, ...boxProps }) => {
+  const { t } = reactI18next.useTranslation("author");
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Card, { as: "article", variant: "filled", ...boxProps, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.CardHeader, { pb: 0, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Heading, { size: "md", children: t("title") }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.CardBody, { children: /* @__PURE__ */ jsxRuntime.jsx(Author, { author, variant: "full" }) })
+  ] });
+};
+const BonusCardContent = ({ content, buttonColor }) => {
+  const { t } = reactI18next.useTranslation("author");
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.Popover, { autoFocus: false, isLazy: true, lazyBehavior: "keepMounted", children: ({ isOpen }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.PopoverTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Button, { size: "sm", variant: "link", color: buttonColor, children: isOpen ? t("action.collapse") : t("action.expand") }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(react$1.PopoverContent, { children: /* @__PURE__ */ jsxRuntime.jsx(react$1.PopoverBody, { children: Array.isArray(content) ? /* @__PURE__ */ jsxRuntime.jsx(react$1.Stack, { children: content.map((paragraph, index2) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { as: "span", children: paragraph }, index2)) }) : /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { children: content }) }) }) })
+  ] }) });
+};
+const BonusCardTitle = ({ content, color, textColor }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.Text,
+    {
+      as: "h3",
+      display: "inline-block",
+      py: 1,
+      px: 2,
+      borderRadius: "md",
+      bg: color,
+      fontSize: "md",
+      fontWeight: "bold",
+      color: textColor,
+      children: content
+    }
+  );
+};
+const BonusCard = ({
+  title,
+  subtitle,
+  content,
+  link,
+  image,
+  color = "linear-gradient(90deg, #3b1f47, #731d58)",
+  textColor = "whiteAlpha.900",
+  titleColor = "yellow",
+  titleTextColor = "black",
+  className
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react$1.Card,
+    {
+      as: "article",
+      h: "full",
+      color: textColor,
+      bg: color,
+      _before: image ? {
+        content: '""',
+        position: "absolute",
+        top: 0,
+        left: 0,
+        w: "100%",
+        h: "100%",
+        bgImage: `url(${image})`,
+        bgSize: "cover",
+        bgPosition: "center",
+        filter: "blur(0.05em) opacity(50%)",
+        zIndex: 0
+      } : void 0,
+      className,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(react$1.CardBody, { as: "section", pb: 0, flex: 1, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(BonusCardTitle, { content: title, color: titleColor, textColor: titleTextColor }),
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { fontSize: "2xl", fontWeight: "bold", my: 2, children: subtitle }),
+          /* @__PURE__ */ jsxRuntime.jsx(BonusCardContent, { content, buttonColor: textColor })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.CardFooter, { as: "footer", p: 4, children: /* @__PURE__ */ jsxRuntime.jsx(index$1.LinkButton, { ...link, width: "full", size: "md", textDecoration: "none" }) })
+      ]
+    }
+  );
+};
+const BonusCardGrid = ({
+  items,
+  columns = { base: 1, md: 2, lg: 3 },
+  gap = 4,
+  cardCustomization,
+  ...boxProps
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Grid,
+    {
+      items,
+      columns,
+      gap,
+      render: (item) => /* @__PURE__ */ jsxRuntime.jsx(BonusCard, { ...item, ...cardCustomization }),
+      ...boxProps
+    }
+  );
+};
+const Faq = ({ items, ...boxProps }) => {
+  const { bgColor, invertedColor } = index$2.usePrimaryColors();
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.Accordion, { allowToggle: true, ...boxProps, children: items.map(({ question, answer }) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(react$1.AccordionItem, { border: 0, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { as: "h3", children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.AccordionButton, { _hover: { color: invertedColor, bgColor }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { as: "span", flex: "1", textAlign: "left", fontWeight: "bold", children: question }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.AccordionIcon, {})
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.AccordionPanel, { children: answer })
+    ] }, question);
+  }) });
+};
+const FeatureCard = ({ title, description }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Card, { as: "article", variant: "outline", textAlign: "center", h: "100%", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(react$1.CardHeader, { as: "header", display: "flex", alignItems: "center", justifyContent: "center", gap: 2, pb: 2, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(icons.StarIcon, { w: 8, h: 8, color: "yellow.400" }),
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { fontWeight: 600, children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(icons.StarIcon, { w: 8, h: 8, color: "yellow.400" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.CardBody, { as: "section", pt: 0, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { color: "gray.500", children: description }) })
+  ] });
+};
+const FeatureCardGrid = ({
+  items,
+  columns = { base: 1, md: 2, lg: 3 },
+  gap = 4,
+  ...boxProps
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Grid,
+    {
+      items,
+      columns,
+      gap,
+      getKey: ({ title }) => title,
+      render: (item) => /* @__PURE__ */ jsxRuntime.jsx(FeatureCard, { ...item }),
+      ...boxProps
+    }
+  );
+};
+const GameCard = ({ name, description, image, url, height = "auto" }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react$1.LinkBox,
+    {
+      as: "article",
+      rounded: "md",
+      borderWidth: 1,
+      transition: "transform 0.2s ease",
+      cursor: url ? "pointer" : "default",
+      overflow: "hidden",
+      bg: "blackAlpha.200",
+      height,
+      _hover: { transform: "scale(1.05)" },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(index.Image, { src: image, alt: name, mode: "thumbnail" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(react$1.Box, { as: "section", rounded: "md", p: 4, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { as: "span", children: url ? /* @__PURE__ */ jsxRuntime.jsx(react$1.LinkOverlay, { as: index.Link, to: url, children: name }) : name }),
+          !!description && /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { fontSize: "sm", color: "gray.600", children: description })
+        ] })
+      ]
+    }
+  );
+};
+const GameCardGrid = ({
+  items,
+  columns = { base: 1, sm: 2, md: 3, lg: 4 },
+  gap = 4,
+  cardHeight = "full",
+  order = "default",
+  randomSeed,
+  ...boxProps
+}) => {
+  let sortedItems = items;
+  if (order === "random") {
+    sortedItems = [...items].sort(randomSeed ? index$3.getSeededRandomComparator(randomSeed) : index$3.randomComparator);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Grid,
+    {
+      items: sortedItems,
+      columns,
+      gap,
+      render: (item) => /* @__PURE__ */ jsxRuntime.jsx(GameCard, { ...item, height: cardHeight }),
+      ...boxProps
+    }
+  );
+};
+const GameDemoContent = ({
+  src,
+  isFullscreen,
+  isLoaded,
+  onLoad,
+  onExit,
+  onToggleFullscreen
+}) => {
+  const { t } = reactI18next.useTranslation("gameDemo");
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      react$1.Box,
+      {
+        as: "iframe",
+        src,
+        sandbox: "allow-scripts allow-same-origin",
+        loading: "lazy",
+        w: "100%",
+        h: "100%",
+        allowFullScreen: true,
+        onLoad,
+        children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: t("warning") })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { position: "absolute", top: 2, left: 2, gap: 2, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react$1.IconButton,
+        {
+          icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, { w: 3, h: 3 }),
+          title: t("action.exit"),
+          "aria-label": t("action.exit"),
+          size: "sm",
+          color: "white",
+          variant: "ghost",
+          disabled: !isLoaded,
+          isRound: true,
+          onClick: onExit
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        react$1.IconButton,
+        {
+          icon: isFullscreen ? /* @__PURE__ */ jsxRuntime.jsx(icons.ViewOffIcon, { w: 3, h: 3 }) : /* @__PURE__ */ jsxRuntime.jsx(icons.ViewIcon, { w: 4, h: 4 }),
+          title: t(isFullscreen ? "action.deactivateFullscreen" : "action.activateFullscreen"),
+          "aria-label": t(isFullscreen ? "action.deactivateFullscreen" : "action.activateFullscreen"),
+          size: "sm",
+          color: "white",
+          variant: "ghost",
+          disabled: !isLoaded,
+          isRound: true,
+          onClick: onToggleFullscreen
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.AbsoluteCenter, { children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Spinner, { size: "xl", thickness: "0.6rem", display: isLoaded ? "none" : "block", color: "brand.100" }) })
+  ] });
+};
+const GameDemoPreview = ({ image, alt, href, imageFit = "contain", onPlayDemo }) => {
+  const { t } = reactI18next.useTranslation("gameDemo");
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index.Image, { src: image, alt, objectFit: imageFit, w: "100%", h: "100%" }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.AbsoluteCenter, { children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.Stack, { spacing: 4, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        index$1.LinkButton,
+        {
+          animation: { type: "pulse", params: { duration: 2, timingFunction: "ease-out", isInfinite: true } },
+          ...href ? { label: t("action.playForReal"), href } : { label: t("action.playForFree"), onClick: onPlayDemo }
+        }
+      ),
+      !!href && /* @__PURE__ */ jsxRuntime.jsx(
+        react$1.Button,
+        {
+          variant: "solid",
+          colorScheme: "brand",
+          size: { base: "sm", md: "lg" },
+          _active: { transform: "scale(0.95)" },
+          onClick: onPlayDemo,
+          children: t("action.playForFree")
+        }
+      )
+    ] }) })
+  ] });
+};
+const GameDemo = ({ name, src, href, previewImage, previewImageFit, ...boxProps }) => {
+  const [isRunning, setIsRunning] = react.useState(false);
+  const [isLoaded, setIsLoaded] = react.useState(false);
+  const { isOpen: isFullscreen, onToggle, onClose } = react$1.useDisclosure({ defaultIsOpen: false });
+  function handleLoad() {
+    setIsLoaded(true);
+  }
+  function handleExit() {
+    document.body.style.overflowY = "auto";
+    onClose();
+    setIsRunning(false);
+  }
+  function handleToggleFullscreen() {
+    document.body.style.overflowY = isFullscreen ? "auto" : "hidden";
+    onToggle();
+  }
+  function handlePlayDemo() {
+    setIsRunning(true);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.Box,
+    {
+      as: "article",
+      display: "grid",
+      w: "100%",
+      aspectRatio: "16/9 auto",
+      ...isFullscreen ? { zIndex: 100, inset: 0, position: "fixed", h: "100dvh" } : { position: "relative" },
+      ...boxProps,
+      children: isRunning ? /* @__PURE__ */ jsxRuntime.jsx(
+        GameDemoContent,
+        {
+          src,
+          isFullscreen,
+          isLoaded,
+          onLoad: handleLoad,
+          onExit: handleExit,
+          onToggleFullscreen: handleToggleFullscreen
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(
+        GameDemoPreview,
+        {
+          image: previewImage,
+          alt: name,
+          href,
+          imageFit: previewImageFit,
+          onPlayDemo: handlePlayDemo
+        }
+      )
+    }
+  );
+};
+const GameInfoItem = ({ title, value }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { gap: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(react$1.Text, { w: "50%", color: "gray.500", textTransform: "capitalize", children: [
+      title,
+      ":"
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { w: "50%", textTransform: "capitalize", children: value })
+  ] });
+};
+const MAX_VISIBLE_LANGUAGE = 5;
+function stringifyHasFeature(value) {
+  return i18next.t(`gameInfo:value.boolean.${value}`);
+}
+function stringifyVolatility(value) {
+  return i18next.t(`gameInfo:value.volatility.${value}`);
+}
+function stringifyArray(array, max) {
+  const safeMax = typeof max === "number" ? Math.max(max, 0) : null;
+  if (safeMax && array.length > safeMax) {
+    return `${array.slice(0, safeMax).join(", ")}, +${array.length - safeMax}`;
+  }
+  return array.join(", ");
+}
+function getGameInfoItemValue(key, value, locale) {
+  let formattedValue = "";
+  if (typeof value !== "string") {
+    if (key === index$4.GameCharacteristic.Rtp) {
+      formattedValue = index$3.formatNumber(value, { percent: "real", precision: 3 });
+    }
+    if (key === index$4.GameCharacteristic.MinBet || key === index$4.GameCharacteristic.MaxBet || key === index$4.GameCharacteristic.MaxWin) {
+      formattedValue = index$3.formatNumber(value, { locale });
+    }
+    if (key === index$4.GameCharacteristic.Compatibility || key === index$4.GameCharacteristic.BonusFeatures) {
+      formattedValue = stringifyArray(value);
+    }
+    if (key === index$4.GameCharacteristic.Languages) {
+      formattedValue = stringifyArray(value, MAX_VISIBLE_LANGUAGE);
+    }
+    if (typeof value === "boolean") {
+      formattedValue = stringifyHasFeature(value);
+    }
+  }
+  if (key === index$4.GameCharacteristic.ReleaseDate) {
+    formattedValue = index$5.formatDate({ value, locale, options: { year: "numeric", month: "long" } });
+  }
+  if (key === index$4.GameCharacteristic.Volatility && Object.values(index$4.GameVolatility).includes(value)) {
+    formattedValue = stringifyVolatility(value);
+  }
+  if (!formattedValue) {
+    formattedValue = value.toLocaleString();
+  }
+  return formattedValue;
+}
+const DEFAULT_CURRENCY = "$, €, £";
+function getGameInfoCurrency(currency, locale) {
+  const currencies = Array.isArray(currency) ? currency.map((code) => index$3.getCurrencySymbol(code, locale)) : [index$3.getCurrencySymbol(currency, locale)];
+  return stringifyArray(currencies);
+}
+const GameInfo = ({ info, currencies }) => {
+  const { t } = reactI18next.useTranslation("gameInfo");
+  const { currentLocale } = index.usePageContext();
+  const currency = (currencies == null ? void 0 : currencies.length) ? getGameInfoCurrency(currencies, currentLocale.code) : DEFAULT_CURRENCY;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.Box,
+    {
+      as: "aside",
+      float: { base: "none", lg: "right" },
+      w: { base: "100%", lg: "xs" },
+      ml: { base: 0, lg: 4 },
+      mb: { base: 0, lg: 4 },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.Card, { as: "article", variant: "outline", h: "100%", p: 2, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.CardHeader, { as: "header", p: 0, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Heading, { as: "h2", fontSize: "xl", children: t("title") }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.CardBody, { as: "section", p: 0, children: Object.entries(info).map(([group, items]) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.Divider, { my: 2 }),
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { fontWeight: "semibold", mb: 2, children: t(`group.${group}`) }),
+          Object.entries(items).map(([itemKey, itemValue]) => {
+            if (!itemValue) {
+              return null;
+            }
+            const feature = itemKey;
+            const value = getGameInfoItemValue(feature, itemValue, currentLocale.code);
+            return /* @__PURE__ */ jsxRuntime.jsx(GameInfoItem, { title: t(`feature.${feature}`, { currency }), value }, itemKey);
+          })
+        ] }, group)) })
+      ] })
+    }
+  );
+};
+const HowTo = ({ steps, ...boxProps }) => {
+  const { bgColor, invertedColor } = index$2.usePrimaryColors();
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.SimpleGrid, { as: "ol", columns: { base: 1, md: 2, lg: 3 }, gap: 4, p: 0, ...boxProps, children: steps.map(({ title, description, thumbnail }, index$12) => /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { as: "li", alignItems: "flex-start", gap: 4, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Circle, { size: 12, bgColor, color: invertedColor, fontSize: "lg", fontWeight: "bold", children: String(index$12 + 1) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react$1.Stack, { flex: 1, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { fontSize: "lg", fontWeight: "bold", children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(index.Image, { src: thumbnail, alt: title, mode: "thumbnail", hasZoom: true }),
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { children: description })
+    ] })
+  ] }, index$12)) });
+};
+const List = ({ items, bullet = "—", render, ...boxProps }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(react$1.List, { pl: 0, ml: 2, ...boxProps, children: items.map((item, index2) => /* @__PURE__ */ jsxRuntime.jsxs(react$1.ListItem, { display: "flex", gap: 1, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.Box, { children: bullet }),
+    render ? render(item) : item
+  ] }, index2)) });
+};
+const NotFound = () => {
+  const { t } = reactI18next.useTranslation("pageNotFound");
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading1, { children: t("title") }),
+    /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { fontSize: "xl", children: [
+      t("description"),
+      " ",
+      /* @__PURE__ */ jsxRuntime.jsx(react$1.Button, { as: index.Link, to: "/", variant: "link", colorScheme: "brand", fontSize: "xl", children: t("action") })
+    ] })
+  ] });
+};
+const CookiePolicy = () => {
+  const { t } = reactI18next.useTranslation("pageCookiePolicy");
+  const { metadata } = index.useSiteContext();
+  const { name: siteName } = metadata;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading1, { children: t("title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionOne.title", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionOne.textOne", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionOne.textTwo") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionTwo.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionTwo.textOne", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(index$6.Unordered, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionTwo.list.itemOne") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionTwo.list.itemTwo") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionTwo.list.itemThree") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionTwo.textTwo") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionThree.title") }),
+    /* @__PURE__ */ jsxRuntime.jsxs(index$6.Ordered, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionThree.list.itemOne") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionThree.list.itemTwo") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionThree.list.itemThree") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionThree.list.itemFour") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionThree.text", { siteName }) })
+  ] });
+};
+const ContactForm = ({ ...boxProps }) => {
+  const toast = react$1.useToast();
+  const { t } = reactI18next.useTranslation("contactForm");
+  function handleSubmit(event) {
+    event.preventDefault();
+    const form = event.currentTarget;
+    const formData = new FormData(form);
+    const name = formData.get("name");
+    const email = formData.get("email");
+    const message = formData.get("message");
+    if (name && email && message) {
+      form.reset();
+      toast({
+        title: t("notification.title", { name }),
+        description: t("notification.description", { email }),
+        colorScheme: "brand",
+        status: "success",
+        duration: 5e3,
+        isClosable: true
+      });
+    } else {
+      console.error("Please fill out both fields");
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.Box,
+    {
+      as: "form",
+      borderRadius: "lg",
+      p: 8,
+      color: react$1.useColorModeValue("gray.700", "whiteAlpha.900"),
+      bg: react$1.useColorModeValue("white", "gray.700"),
+      shadow: "base",
+      onSubmit: handleSubmit,
+      ...boxProps,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.VStack, { spacing: 4, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(react$1.FormControl, { isRequired: true, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.FormLabel, { children: t("field.name.label") }),
+          /* @__PURE__ */ jsxRuntime.jsxs(react$1.InputGroup, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(react$1.InputLeftElement, { children: /* @__PURE__ */ jsxRuntime.jsx(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "16",
+                height: "16",
+                fill: "currentColor",
+                className: "bi bi-person-fill",
+                viewBox: "0 0 16 16",
+                children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6" })
+              }
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsx(react$1.Input, { type: "text", name: "name", placeholder: t("field.name.placeholder") })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(react$1.FormControl, { isRequired: true, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.FormLabel, { children: t("field.email.label") }),
+          /* @__PURE__ */ jsxRuntime.jsxs(react$1.InputGroup, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(react$1.InputLeftElement, { children: /* @__PURE__ */ jsxRuntime.jsx(icons.EmailIcon, {}) }),
+            /* @__PURE__ */ jsxRuntime.jsx(react$1.Input, { type: "email", name: "email", placeholder: t("field.email.placeholder") })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(react$1.FormControl, { isRequired: true, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.FormLabel, { children: t("field.message.label") }),
+          /* @__PURE__ */ jsxRuntime.jsx(react$1.Textarea, { name: "message", placeholder: t("field.message.placeholder"), rows: 6, resize: "none" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Button, { type: "submit", colorScheme: "brand", width: "full", children: t("action.send") })
+      ] })
+    }
+  );
+};
+const Contacts = () => {
+  const { t } = reactI18next.useTranslation("pageContacts");
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading1, { children: t("title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("text") }),
+    /* @__PURE__ */ jsxRuntime.jsx(ContactForm, {})
+  ] });
+};
+const PrivacyPolicy = ({ contactsSlug }) => {
+  const { t } = reactI18next.useTranslation("pagePrivacyPolicy");
+  const { metadata } = index.useSiteContext();
+  const { name: siteName } = metadata;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading1, { children: t("title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("text") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionOne.title", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionOne.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionTwo.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionTwo.textOne") }),
+    /* @__PURE__ */ jsxRuntime.jsxs(index$6.Unordered, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionTwo.list.itemOne") }),
+      /* @__PURE__ */ jsxRuntime.jsx("li", { children: t("sectionTwo.list.itemTwo") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionTwo.textTwo") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionThree.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionThree.text") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionFour.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionFour.text") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionFive.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionFive.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionSix.title") }),
+    contactsSlug ? /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      t("sectionSix.textWithLink.contentStart"),
+      /* @__PURE__ */ jsxRuntime.jsx(index.Link, { color: "brand.400", to: contactsSlug, children: t("sectionSix.textWithLink.link") }),
+      t("sectionSix.textWithLink.contentEnd", { siteName })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionSix.text", { siteName }) })
+  ] });
+};
+const TermsAndConditions = ({ privacyPolicySlug }) => {
+  const { t } = reactI18next.useTranslation("pageTermsAndConditions");
+  const { metadata } = index.useSiteContext();
+  const { name: siteName } = metadata;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading1, { children: t("title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionOne.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionOne.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Unordered, { children: ["One", "Two", "Three", "Four"].map((i, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+        t(`sectionOne.list.item${i}.title`),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+      t(`sectionOne.list.item${i}.description`, { siteName })
+    ] }) }, index2)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionTwo.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Ordered, { children: ["One", "Two", "Three", "Four"].map((i, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+        t(`sectionTwo.list.item${i}.title`),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+      t(`sectionTwo.list.item${i}.description`, { siteName })
+    ] }) }, index2)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionThree.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionThree.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionFour.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionFour.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Unordered, { children: ["One", "Two"].map((i, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+        t(`sectionFour.list.item${i}.title`),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+      t(`sectionFour.list.item${i}.description`, { siteName })
+    ] }) }, index2)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionFive.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionFive.text", { siteName }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionSix.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionSix.textOne") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Unordered, { children: ["One", "Two", "Three"].map((i, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: t(`sectionSix.list.item${i}`) }, index2)) }),
+    privacyPolicySlug ? /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      t("sectionSix.textTwoWithLink.contentStart"),
+      /* @__PURE__ */ jsxRuntime.jsx(index.Link, { color: "brand.400", to: privacyPolicySlug, children: t("sectionSix.textTwoWithLink.link") }),
+      t("sectionSix.textTwoWithLink.contentEnd")
+    ] }) : /* @__PURE__ */ jsxRuntime.jsx(index$6.Paragraph, { children: t("sectionSix.textTwo") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Heading2, { children: t("sectionSeven.title") }),
+    /* @__PURE__ */ jsxRuntime.jsx(index$6.Ordered, { children: ["One", "Two"].map((i, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(index$6.Paragraph, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+        t(`sectionSeven.list.item${i}.title`),
+        ":"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+      t(`sectionSeven.list.item${i}.description`, { siteName })
+    ] }) }, index2)) })
+  ] });
+};
+const TitleMap = {
+  pros: "advantages",
+  cons: "disadvantages"
+};
+const IconMap = {
+  pros: icons.CheckCircleIcon,
+  cons: icons.WarningIcon
+};
+const IconColorMap = {
+  pros: "green.500",
+  cons: "red.500"
+};
+const BgColorMap = {
+  pros: "green",
+  cons: "red"
+};
+const ProsConsCard = ({ itemType, items }) => {
+  const { t } = reactI18next.useTranslation("prosCons");
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react$1.Card,
+    {
+      as: "article",
+      flex: 1,
+      p: 2,
+      bgColor: react$1.useColorModeValue(`${BgColorMap[itemType]}.100`, `${BgColorMap[itemType]}.800`),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react$1.CardHeader,
+          {
+            as: "header",
+            p: 2,
+            borderTopRadius: "md",
+            bgColor: react$1.useColorModeValue("whiteAlpha.800", "blackAlpha.800"),
+            children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Heading, { as: "h3", textTransform: "uppercase", fontSize: "xl", children: t(TitleMap[itemType]) })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          react$1.CardBody,
+          {
+            as: "section",
+            p: 2,
+            borderBottomRadius: "md",
+            bgColor: react$1.useColorModeValue("whiteAlpha.800", "blackAlpha.800"),
+            children: /* @__PURE__ */ jsxRuntime.jsx(react$1.List, { spacing: 4, p: 0, children: items.map(({ title, description }) => /* @__PURE__ */ jsxRuntime.jsxs(react$1.ListItem, { display: "flex", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react$1.ListIcon, { as: IconMap[itemType], w: 6, h: 6, color: IconColorMap[itemType] }),
+              /* @__PURE__ */ jsxRuntime.jsxs(react$1.Text, { fontWeight: "semibold", fontSize: "md", children: [
+                title,
+                !!description && /* @__PURE__ */ jsxRuntime.jsxs(react$1.Text, { as: "span", fontWeight: "normal", children: [
+                  ": ",
+                  description
+                ] })
+              ] })
+            ] }, title)) })
+          }
+        )
+      ]
+    }
+  );
+};
+const ProsCons = ({ items, ...boxProps }) => {
+  const { pros, cons } = items;
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Flex, { as: "section", direction: { base: "column", md: "row" }, gap: 4, ...boxProps, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ProsConsCard, { itemType: "pros", items: pros }),
+    /* @__PURE__ */ jsxRuntime.jsx(ProsConsCard, { itemType: "cons", items: cons })
+  ] });
+};
+function replacePlaceholders(text, placeholders) {
+  Object.entries(placeholders).forEach(([placeholder, replacement]) => {
+    const regex = new RegExp(`{{${placeholder}}}`, "g");
+    text = text.replace(regex, replacement);
+  });
+  return text;
+}
+const Seo = ({ children, title, description, lang }) => {
+  const { metadata } = index.useSiteContext();
+  const { name: siteName, lang: defaultLang, seo } = metadata;
+  const { title: defaultTitle, description: defaultDescription } = seo;
+  const siteLang = lang || defaultLang;
+  const placeholders = react.useMemo(
+    () => ({
+      siteName,
+      currentYear: index$5.getCurrentYear(siteLang),
+      currentMonth: index$5.getCurrentMonth(siteLang)
+    }),
+    [siteName, siteLang]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("html", { lang: siteLang }),
+    /* @__PURE__ */ jsxRuntime.jsx("title", { children: title ? typeof title === "string" ? replacePlaceholders(title, placeholders) : title(placeholders) : defaultTitle }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "meta",
+      {
+        name: "description",
+        content: description ? typeof description === "string" ? replacePlaceholders(description, placeholders) : description(placeholders) : defaultDescription
+      }
+    ),
+    children
+  ] });
+};
+const Table = ({
+  columnNumber,
+  items,
+  caption,
+  bordered = false,
+  striped = true,
+  scrollable,
+  ...boxProps
+}) => {
+  const headerItems = items.slice(0, columnNumber);
+  const bodyItems = items.slice(columnNumber);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.TableContainer,
+    {
+      border: bordered ? void 0 : "none",
+      ...scrollable ? { maxH: "50vh", overflowY: "auto" } : {},
+      ...boxProps,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(react$1.Table, { variant: striped ? "striped" : "simple", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Thead, { ...scrollable ? { position: "sticky", top: 0, zIndex: 1, bg: "gray.800" } : {}, children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Tr, { children: headerItems.map((item, index2) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Th, { children: item }, index2)) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.Tbody, { children: Array.from({ length: Math.ceil(bodyItems.length / columnNumber) }, (_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Tr, { children: Array.from({ length: columnNumber }, (_2, colIndex) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Td, { children: bodyItems[rowIndex * columnNumber + colIndex] || "" }, colIndex)) }, rowIndex)) }),
+        !!caption && /* @__PURE__ */ jsxRuntime.jsx(react$1.TableCaption, { children: caption })
+      ] })
+    }
+  );
+};
+const Tabs = ({ items, render, ...boxProps }) => {
+  const { tabs, panels } = react.useMemo(() => {
+    const tabs2 = [];
+    const panels2 = [];
+    items.forEach(({ content, ...tab }) => {
+      tabs2.push(tab);
+      panels2.push(content);
+    });
+    return { tabs: tabs2, panels: panels2 };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Tabs, { overflow: "hidden", colorScheme: "brand", ...boxProps, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.TabList, { overflow: "auto hidden", children: tabs.map(({ label, icon }, index2) => /* @__PURE__ */ jsxRuntime.jsx(react$1.Tab, { children: /* @__PURE__ */ jsxRuntime.jsx(react$1.Text, { as: "h3", isTruncated: true, children: icon ? `${icon} ${label}` : label }) }, index2)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(react$1.TabPanels, { children: panels.map((panel, index2) => /* @__PURE__ */ jsxRuntime.jsx(react$1.TabPanel, { children: render ? render(panel) : panel }, index2)) })
+  ] });
+};
+const Tip = ({ tip, author = null, ...boxProps }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    react$1.Card,
+    {
+      variant: "filled",
+      p: 4,
+      borderLeft: "4px solid gray",
+      gap: 4,
+      _before: {
+        content: '"❛❛"',
+        position: "absolute",
+        top: -8,
+        left: -2,
+        fontSize: "6rem",
+        fontStyle: "italic",
+        color: react$1.useColorModeValue("blackAlpha.300", "whiteAlpha.300")
+      },
+      ...boxProps,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react$1.CardBody, { as: "blockquote", p: 0, fontStyle: "italic", children: tip }),
+        !!author && /* @__PURE__ */ jsxRuntime.jsx(react$1.CardFooter, { alignItems: "center", justify: "flex-end", p: 0, children: /* @__PURE__ */ jsxRuntime.jsx(Author, { author, variant: "short" }) })
+      ]
+    }
+  );
+};
+const ExternalImage = ({ image, component: ImageComponent, alt = "", ...imageProps }) => {
+  var _a, _b;
+  const imageData = (_b = (_a = image == null ? void 0 : image.localFile) == null ? void 0 : _a.childImageSharp) == null ? void 0 : _b.gatsbyImageData;
+  return imageData ? /* @__PURE__ */ jsxRuntime.jsx(ImageComponent, { image: imageData, alt, ...imageProps }) : null;
+};
+const RichText = ({ content }) => {
+  const components = react$2.useMDXComponents();
+  return /* @__PURE__ */ jsxRuntime.jsx(Markdown, { components, children: content });
+};
+function extractItemsFromJson(content) {
+  return content.strapi_json_value;
+}
+function extractCurrencies(currencyList) {
+  if (!currencyList) {
+    return [];
+  }
+  return [...new Set(currencyList.items.map(({ code }) => code))];
+}
+const StrapiComponent = ({ type, props, imageComponent }) => {
+  switch (type) {
+    case "STRAPI__COMPONENT_CONTENT_FAQ":
+      return /* @__PURE__ */ jsxRuntime.jsx(Faq, { items: props.items, mb: 4 });
+    case "STRAPI__COMPONENT_CONTENT_FEATURES":
+      return /* @__PURE__ */ jsxRuntime.jsx(FeatureCardGrid, { items: props.items, mb: 4 });
+    case "STRAPI__COMPONENT_CONTENT_GAME_CARDS":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        GameCardGrid,
+        {
+          items: props.items.map((item) => ({
+            ...item,
+            image: /* @__PURE__ */ jsxRuntime.jsx(
+              ExternalImage,
+              {
+                image: item.image,
+                alt: item.name,
+                component: imageComponent
+              }
+            )
+          })),
+          order: props.order ?? "default",
+          randomSeed: props.randomSeed ?? 0,
+          cardHeight: props.cardHeight ?? "full",
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_GAME_CARD_TABS":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Tabs,
+        {
+          items: props.items,
+          render: (items) => /* @__PURE__ */ jsxRuntime.jsx(
+            GameCardGrid,
+            {
+              items: items.map((item) => ({
+                ...item,
+                image: /* @__PURE__ */ jsxRuntime.jsx(
+                  ExternalImage,
+                  {
+                    image: item.image,
+                    alt: item.name,
+                    component: imageComponent
+                  }
+                )
+              }))
+            }
+          ),
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_GAME_DEMO":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        GameDemo,
+        {
+          name: props.name,
+          src: props.src,
+          href: props.href,
+          previewImage: /* @__PURE__ */ jsxRuntime.jsx(ExternalImage, { image: props.previewImage, alt: props.name, component: imageComponent }),
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_GAME_INFO":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        GameInfo,
+        {
+          info: { general: props.general, features: props.features },
+          currencies: extractCurrencies(props.currency)
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_HOW_TO":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        HowTo,
+        {
+          steps: props.steps.map((step) => {
+            return {
+              ...step,
+              thumbnail: /* @__PURE__ */ jsxRuntime.jsx(ExternalImage, { image: step.thumbnail, alt: step.title, component: imageComponent })
+            };
+          }),
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_LIST":
+      return /* @__PURE__ */ jsxRuntime.jsx(List, { bullet: props.bullet, items: extractItemsFromJson(props.content), mb: 4 });
+    case "STRAPI__COMPONENT_CONTENT_MEDIA":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        index.Image,
+        {
+          src: /* @__PURE__ */ jsxRuntime.jsx(ExternalImage, { component: imageComponent, image: props.file, alt: props.alternativeText }),
+          mb: 4,
+          hasZoom: true
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_PROS_CONS":
+      return /* @__PURE__ */ jsxRuntime.jsx(ProsCons, { items: { ...props }, mb: 4 });
+    case "STRAPI__COMPONENT_CONTENT_RICH_TEXT":
+      return /* @__PURE__ */ jsxRuntime.jsx(RichText, { content: props.content.data.content });
+    case "STRAPI__COMPONENT_CONTENT_TABLE":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Table,
+        {
+          columnNumber: props.columnNumber,
+          items: extractItemsFromJson(props.content),
+          caption: props.caption,
+          bordered: props.bordered,
+          scrollable: props.scrollable,
+          striped: props.striped,
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_TIP":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Tip,
+        {
+          tip: props.tip,
+          author: props.author ? {
+            ...props.author,
+            avatar: /* @__PURE__ */ jsxRuntime.jsx(
+              ExternalImage,
+              {
+                component: imageComponent,
+                image: props.author.avatar,
+                alt: props.author.name,
+                style: { borderRadius: "50%" }
+              }
+            )
+          } : null,
+          mb: 4
+        }
+      );
+    case "STRAPI__COMPONENT_CONTENT_CONTACTS_PAGE":
+      return /* @__PURE__ */ jsxRuntime.jsx(Contacts, { ...props });
+    case "STRAPI__COMPONENT_CONTENT_COOKIE_POLICY_PAGE":
+      return /* @__PURE__ */ jsxRuntime.jsx(CookiePolicy, { ...props });
+    case "STRAPI__COMPONENT_CONTENT_PRIVACY_POLICY_PAGE":
+      return /* @__PURE__ */ jsxRuntime.jsx(PrivacyPolicy, { ...props });
+    case "STRAPI__COMPONENT_CONTENT_TERMS_CONDITIONS_PAGE":
+      return /* @__PURE__ */ jsxRuntime.jsx(TermsAndConditions, { ...props });
+    default:
+      return null;
+  }
+};
+function isStrapiContent(array) {
+  return Array.isArray(array) && array.every(
+    (item) => typeof item === "object" && item !== null && "__typename" in item && typeof item.__typename === "string"
+  );
+}
+const StrapiContentRenderer = ({ content, imageComponent }) => {
+  if (!isStrapiContent(content)) {
+    return null;
+  }
+  return content.map(({ __typename: type, ...props }, index2) => /* @__PURE__ */ jsxRuntime.jsx(StrapiComponent, { type, props, imageComponent }, index2));
+};
+exports.Author = Author;
+exports.AuthorCard = AuthorCard;
+exports.BonusCard = BonusCard;
+exports.BonusCardGrid = BonusCardGrid;
+exports.Center = Center;
+exports.Contacts = Contacts;
+exports.CookiePolicy = CookiePolicy;
+exports.Faq = Faq;
+exports.FeatureCard = FeatureCard;
+exports.FeatureCardGrid = FeatureCardGrid;
+exports.GameCard = GameCard;
+exports.GameCardGrid = GameCardGrid;
+exports.GameDemo = GameDemo;
+exports.GameInfo = GameInfo;
+exports.Grid = Grid;
+exports.HowTo = HowTo;
+exports.List = List;
+exports.NotFound = NotFound;
+exports.PrivacyPolicy = PrivacyPolicy;
+exports.ProsCons = ProsCons;
+exports.Seo = Seo;
+exports.StrapiContentRenderer = StrapiContentRenderer;
+exports.Table = Table;
+exports.Tabs = Tabs;
+exports.TermsAndConditions = TermsAndConditions;
+exports.Tip = Tip;