@anywayseo/tools 4.1.0 → 4.2.0

package/dist/{index-BKg1_9Hw.mjs → index-HjgJxxVi.mjs}

@@ -1,15 +1,15 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { Box, Collapse, Text, Button, Flex, Stack, Image, Center as Center$1, SimpleGrid, Link, Card, CardHeader, Heading, CardBody, Popover, PopoverTrigger, Portal, PopoverContent, PopoverBody, CardFooter, useToast, useColorModeValue, VStack, FormControl, FormLabel, InputGroup, InputLeftElement, Input, Textarea, Accordion, AccordionItem, AccordionButton, AccordionIcon, AccordionPanel, LinkBox, LinkOverlay, IconButton, AbsoluteCenter, Spinner, useDisclosure, Divider, Circle, Container as Container$1, List as List$1, ListItem, Icon, ListIcon, TableContainer, Table as Table$1, Thead, Tr, Th, Tbody, Td, TableCaption, Tabs as Tabs$1, TabList, Tab, TabPanels, TabPanel } from "@chakra-ui/react";
+import { Box, Collapse, Text, Button, Flex, Stack, Image, Center as Center$1, SimpleGrid, Link as Link$1, Card, CardHeader, Heading, CardBody, Popover, PopoverTrigger, Portal, PopoverContent, PopoverBody, CardFooter, useToast, useColorModeValue, VStack, FormControl, FormLabel, InputGroup, InputLeftElement, Input, Textarea, Accordion, AccordionItem, AccordionButton, AccordionIcon, AccordionPanel, LinkBox, LinkOverlay, IconButton, AbsoluteCenter, Spinner, useDisclosure, Divider, Circle, Container as Container$1, List as List$1, ListItem, Icon, ListIcon, TableContainer, Table as Table$1, Thead, Tr, Th, Tbody, Td, TableCaption, Tabs as Tabs$1, TabList, Tab, TabPanels, TabPanel } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
-import { A as Animation, e as getSeededRandomComparator, d as randomComparator, b as formatNumber, c as getCurrencySymbol, f as formatDate, g as getCurrentYear, a as getCurrentMonth } from "./index-Db-ZIQ0A.mjs";
-import { a as GameCharacteristic } from "./index-DoBCANwf.mjs";
-import "@ctrl/tinycolor";
-import { useRef, useState, useLayoutEffect, Fragment as Fragment$1, forwardRef, useEffect, useMemo } from "react";
-import { EmailIcon, StarIcon, CloseIcon, ExternalLinkIcon, ChevronRightIcon, ChevronDownIcon, HamburgerIcon, ChevronUpIcon, WarningIcon, CheckCircleIcon } from "@chakra-ui/icons";
+import { Link } from "gatsby";
+import { A as Animation } from "./index-MpNfBHkQ.mjs";
+import { a as GameCharacteristic } from "./index-BE9gNdXx.mjs";
 import { useMDXComponents } from "@mdx-js/react";
-import { Link as Link$1 } from "gatsby";
 import { u as useSiteContext } from "./index-BNb-P8a6.mjs";
-import { u as usePrimaryColors } from "./index-xuSxvz5z.mjs";
+import { useRef, useState, useLayoutEffect, Fragment as Fragment$1, forwardRef, useEffect, useMemo } from "react";
+import { EmailIcon, StarIcon, CloseIcon, ViewOffIcon, ViewIcon, ChevronRightIcon, ChevronDownIcon, HamburgerIcon, ChevronUpIcon, WarningIcon, CheckCircleIcon } from "@chakra-ui/icons";
+import { e as getSeededRandomComparator, d as randomComparator, b as formatNumber, c as getCurrencySymbol, f as formatDate, g as getCurrentYear, a as getCurrentMonth } from "./index-DPO0aIC3.mjs";
+import { u as usePrimaryColors } from "./index-CkTgVjZS.mjs";
 import { t } from "i18next";
 import Markdown from "react-markdown";
 const ONE_LINE_HEIGHT = 24;
@@ -67,36 +67,44 @@ const defaultColumns = { base: 1, sm: 2, md: 3, lg: 4, xl: 5 };
 const Grid = ({ items, columns = defaultColumns, gap, render, getKey, ...boxProps }) => {
   return /* @__PURE__ */ jsx(SimpleGrid, { as: "ul", columns, spacing: gap, p: 0, m: 0, listStyleType: "none", ...boxProps, children: items.map((item, index) => /* @__PURE__ */ jsx(Box, { as: "li", children: render(item) }, getKey ? getKey(item) : index)) });
 };
-const LinkButton = ({ label, url, width = "auto", ...boxProps }) => {
+const LinkButton = ({
+  label,
+  href,
+  linkType = "redirect",
+  size = "auto",
+  width = "auto",
+  textTransform,
+  textDecoration,
+  animation,
+  onClick,
+  ...boxProps
+}) => {
+  var _a;
+  const { configs } = useSiteContext();
+  const { color, invertedColor } = usePrimaryColors();
+  const isInvertedColor = (_a = configs == null ? void 0 : configs.theme) == null ? void 0 : _a.isInvertedColor;
+  const isInternalLink = linkType === "redirect" || (href == null ? void 0 : href.startsWith("/"));
+  const LinkComponent = isInternalLink ? Link : Link$1;
+  const hrefKey = isInternalLink ? "to" : "href";
+  const hrefValue = linkType === "redirect" ? `/follow?to=${href}` : href;
   return /* @__PURE__ */ jsx(
     Button,
     {
-      as: Link,
-      href: url,
       w: width,
-      bg: "brand.600",
-      textTransform: "uppercase",
-      _hover: { textDecoration: "none", bg: "brand.300" },
+      size: size === "auto" ? { base: "sm", md: "lg" } : size,
+      bg: "brand.500",
+      color: isInvertedColor ? invertedColor : color,
+      animation: animation ? Animation[animation.type](animation.params) : void 0,
+      textTransform,
+      _hover: { textDecoration, bg: "brand.200" },
       _active: { transform: "scale(0.95)" },
+      onClick,
       ...boxProps,
-      children: label
-    }
-  );
-};
-const ColorMap = {
-  light: "gray.200",
-  dark: "gray.700"
-};
-const PulseButton = ({ label, colorScheme = "light", to, onClick }) => {
-  return /* @__PURE__ */ jsx(
-    Button,
-    {
-      size: { base: "sm", md: "lg" },
-      color: ColorMap[colorScheme],
-      bgColor: "brand.500",
-      animation: `${Animation.pulse} 2s infinite linear`,
-      _hover: { bgColor: "brand.200", color: "gray.700" },
-      ...to ? { as: Link, href: to } : { onClick },
+      ...href ? {
+        as: LinkComponent,
+        [hrefKey]: hrefValue,
+        rel: "nofollow"
+      } : {},
       children: label
     }
   );
@@ -180,7 +188,7 @@ const BonusCard = ({
           /* @__PURE__ */ jsx(Text, { fontSize: "2xl", fontWeight: "bold", my: 2, children: subtitle }),
           /* @__PURE__ */ jsx(BonusCardContent, { content, buttonColor: textColor })
         ] }),
-        /* @__PURE__ */ jsx(CardFooter, { as: "footer", p: 4, children: /* @__PURE__ */ jsx(LinkButton, { ...link, width: "full" }) })
+        /* @__PURE__ */ jsx(CardFooter, { as: "footer", p: 4, children: /* @__PURE__ */ jsx(LinkButton, { ...link, width: "full", size: "md", textDecoration: "none" }) })
       ]
     }
   );
@@ -274,10 +282,10 @@ const ContactForm = ({ ...boxProps }) => {
   );
 };
 const Faq = ({ items, ...boxProps }) => {
-  const { bgColor, color } = usePrimaryColors();
+  const { bgColor, invertedColor } = usePrimaryColors();
   return /* @__PURE__ */ jsx(Accordion, { allowToggle: true, ...boxProps, children: items.map(({ question, answer }) => {
     return /* @__PURE__ */ jsxs(AccordionItem, { border: 0, children: [
-      /* @__PURE__ */ jsx(Box, { as: "h3", children: /* @__PURE__ */ jsxs(AccordionButton, { _hover: { color, bgColor }, children: [
+      /* @__PURE__ */ jsx(Box, { as: "h3", children: /* @__PURE__ */ jsxs(AccordionButton, { _hover: { color: invertedColor, bgColor }, children: [
         /* @__PURE__ */ jsx(Box, { as: "span", flex: "1", textAlign: "left", fontWeight: "bold", children: question }),
         /* @__PURE__ */ jsx(AccordionIcon, {})
       ] }) }),
@@ -313,7 +321,7 @@ const FeatureCardGrid = ({
     }
   );
 };
-const GameCard = ({ name, description, image, link, height = "auto" }) => {
+const GameCard = ({ name, description, image, href, height = "auto" }) => {
   return /* @__PURE__ */ jsxs(
     LinkBox,
     {
@@ -321,15 +329,15 @@ const GameCard = ({ name, description, image, link, height = "auto" }) => {
       rounded: "md",
       borderWidth: 1,
       transition: "transform 0.2s ease",
-      cursor: link ? "pointer" : "default",
+      cursor: href ? "pointer" : "default",
       overflow: "hidden",
       bg: "blackAlpha.200",
       height,
-      _hover: { transform: "scale(1.1)" },
+      _hover: { transform: "scale(1.05)" },
       children: [
         typeof image === "string" ? /* @__PURE__ */ jsx(Image, { src: image, alt: name, w: "100%", aspectRatio: "16/9", objectFit: "cover", objectPosition: "center" }) : !!image && /* @__PURE__ */ jsx(Box, { w: "100%", aspectRatio: "16/9", children: image }),
         /* @__PURE__ */ jsxs(Box, { as: "section", rounded: "md", p: 4, children: [
-          /* @__PURE__ */ jsx(Text, { as: "span", children: link ? /* @__PURE__ */ jsx(LinkOverlay, { href: link, children: name }) : name }),
+          /* @__PURE__ */ jsx(Text, { as: "span", children: href ? /* @__PURE__ */ jsx(LinkOverlay, { href, children: name }) : name }),
           !!description && /* @__PURE__ */ jsx(Text, { fontSize: "sm", color: "gray.600", children: description })
         ] })
       ]
@@ -338,7 +346,7 @@ const GameCard = ({ name, description, image, link, height = "auto" }) => {
 };
 const GameCardGrid = ({
   items,
-  columns = { base: 1, md: 2, lg: 3 },
+  columns = { base: 1, sm: 2, md: 3, lg: 4 },
   gap = 4,
   cardHeight = "full",
   order = "default",
@@ -360,7 +368,14 @@ const GameCardGrid = ({
     }
   );
 };
-const GameDemoContent = ({ src, isFullscreen, isLoaded, onLoad, onToggleFullscreen }) => {
+const GameDemoContent = ({
+  src,
+  isFullscreen,
+  isLoaded,
+  onLoad,
+  onExit,
+  onToggleFullscreen
+}) => {
   const { t: t2 } = useTranslation("gameDemo");
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
@@ -377,50 +392,73 @@ const GameDemoContent = ({ src, isFullscreen, isLoaded, onLoad, onToggleFullscre
         children: /* @__PURE__ */ jsx("p", { children: t2("warning") })
       }
     ),
-    /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        icon: isFullscreen ? /* @__PURE__ */ jsx(CloseIcon, { w: 3, h: 3 }) : /* @__PURE__ */ jsx(ExternalLinkIcon, { w: 4, h: 4 }),
-        size: "sm",
-        variant: "outline",
-        title: t2(isFullscreen ? "action.deactivateFullscreen" : "action.activateFullscreen"),
-        "aria-label": "Fullscreen mode Toggle",
-        isRound: true,
-        disabled: !isLoaded,
-        position: "absolute",
-        top: 2,
-        left: 2,
-        border: "none",
-        color: "white",
-        _hover: { bgColor: "whiteAlpha.400" },
-        onClick: onToggleFullscreen
-      }
-    ),
+    /* @__PURE__ */ jsxs(Flex, { position: "absolute", top: 2, left: 2, gap: 2, children: [
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          icon: /* @__PURE__ */ jsx(CloseIcon, { w: 3, h: 3 }),
+          title: t2("action.exit"),
+          "aria-label": t2("action.exit"),
+          size: "sm",
+          color: "white",
+          variant: "ghost",
+          disabled: !isLoaded,
+          isRound: true,
+          onClick: onExit
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          icon: isFullscreen ? /* @__PURE__ */ jsx(ViewOffIcon, { w: 3, h: 3 }) : /* @__PURE__ */ jsx(ViewIcon, { w: 4, h: 4 }),
+          title: t2(isFullscreen ? "action.deactivateFullscreen" : "action.activateFullscreen"),
+          "aria-label": t2(isFullscreen ? "action.deactivateFullscreen" : "action.activateFullscreen"),
+          size: "sm",
+          color: "white",
+          variant: "ghost",
+          disabled: !isLoaded,
+          isRound: true,
+          onClick: onToggleFullscreen
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsx(AbsoluteCenter, { children: /* @__PURE__ */ jsx(Spinner, { size: "xl", thickness: "0.6rem", display: isLoaded ? "none" : "block", color: "brand.100" }) })
   ] });
 };
-const GameDemoPreview = ({ image, alt, imageFit = "contain", onPlay }) => {
+const GameDemoPreview = ({ image, alt, href, imageFit = "contain", onPlayDemo }) => {
   const { t: t2 } = useTranslation("gameDemo");
-  const imageComponent = typeof image === "string" ? /* @__PURE__ */ jsx(Image, { src: image, alt, objectFit: imageFit }) : image;
+  const imageComponent = typeof image === "string" ? /* @__PURE__ */ jsx(Image, { src: image, alt, objectFit: imageFit, w: "100%", h: "100%" }) : image;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     imageComponent,
-    /* @__PURE__ */ jsx(AbsoluteCenter, { children: /* @__PURE__ */ jsx(PulseButton, { label: t2("action.playForFree"), onClick: onPlay }) })
+    /* @__PURE__ */ jsx(AbsoluteCenter, { children: /* @__PURE__ */ jsxs(Stack, { spacing: 4, children: [
+      /* @__PURE__ */ jsx(
+        LinkButton,
+        {
+          animation: { type: "pulse", params: { duration: 2, timingFunction: "ease-out", isInfinite: true } },
+          ...href ? { label: t2("action.playForReal"), href } : { label: t2("action.playForFree"), onClick: onPlayDemo }
+        }
+      ),
+      !!href && /* @__PURE__ */ jsx(Button, { variant: "outline", colorScheme: "brand", size: { base: "sm", md: "md" }, onClick: onPlayDemo, children: t2("action.playForFree") })
+    ] }) })
   ] });
 };
-const GameDemo = ({ name, src, previewImage, previewImageFit, ...boxProps }) => {
+const GameDemo = ({ name, src, href, previewImage, previewImageFit, ...boxProps }) => {
   const [isRunning, setIsRunning] = useState(false);
   const [isLoaded, setIsLoaded] = useState(false);
   const { isOpen: isFullscreen, onToggle } = useDisclosure({ defaultIsOpen: false });
-  function handlePlay() {
-    setIsRunning(true);
-  }
-  function onLoad() {
+  function handleLoad() {
     setIsLoaded(true);
   }
+  function handleExit() {
+    setIsRunning(false);
+  }
   function handleToggleFullscreen() {
     document.body.style.overflowY = isFullscreen ? "auto" : "hidden";
     onToggle();
   }
+  function handlePlayDemo() {
+    setIsRunning(true);
+  }
   return /* @__PURE__ */ jsx(
     Box,
     {
@@ -436,10 +474,20 @@ const GameDemo = ({ name, src, previewImage, previewImageFit, ...boxProps }) =>
           src,
           isFullscreen,
           isLoaded,
-          onLoad,
+          onLoad: handleLoad,
+          onExit: handleExit,
           onToggleFullscreen: handleToggleFullscreen
         }
-      ) : /* @__PURE__ */ jsx(GameDemoPreview, { image: previewImage, alt: name, imageFit: previewImageFit, onPlay: handlePlay })
+      ) : /* @__PURE__ */ jsx(
+        GameDemoPreview,
+        {
+          image: previewImage,
+          alt: name,
+          href,
+          imageFit: previewImageFit,
+          onPlayDemo: handlePlayDemo
+        }
+      )
     }
   );
 };
@@ -532,9 +580,9 @@ const GameInfo = ({ info }) => {
   );
 };
 const HowTo = ({ steps, ...boxProps }) => {
-  const { color, bgColor } = usePrimaryColors();
+  const { bgColor, invertedColor } = usePrimaryColors();
   return /* @__PURE__ */ jsx(SimpleGrid, { as: "ol", columns: { base: 1, md: 2, lg: 3 }, gap: 4, p: 0, ...boxProps, children: steps.map(({ title, description, thumbnail }, index) => /* @__PURE__ */ jsxs(Flex, { as: "li", alignItems: "flex-start", gap: 4, children: [
-    /* @__PURE__ */ jsx(Circle, { size: 12, bgColor, color, fontSize: "lg", fontWeight: "bold", children: String(index + 1) }),
+    /* @__PURE__ */ jsx(Circle, { size: 12, bgColor, color: invertedColor, fontSize: "lg", fontWeight: "bold", children: String(index + 1) }),
     /* @__PURE__ */ jsxs(Stack, { flex: 1, children: [
       /* @__PURE__ */ jsx(Text, { fontSize: "lg", fontWeight: "bold", children: title }),
       typeof thumbnail === "string" ? /* @__PURE__ */ jsx(Image, { src: thumbnail, alt: title, aspectRatio: "16/9", objectFit: "cover" }) : thumbnail,
@@ -556,7 +604,7 @@ const Logo = () => {
 const Brand$1 = ({ brand }) => {
   return /* @__PURE__ */ jsxs(Box, { position: "relative", my: 2, py: 8, children: [
     /* @__PURE__ */ jsx(Divider, {}),
-    /* @__PURE__ */ jsx(AbsoluteCenter, { display: "flex", bgColor: useColorModeValue("gray.50", "gray.900"), children: /* @__PURE__ */ jsx(Link$1, { to: "/", children: brand }) })
+    /* @__PURE__ */ jsx(AbsoluteCenter, { display: "flex", bgColor: useColorModeValue("gray.50", "gray.900"), children: /* @__PURE__ */ jsx(Link, { to: "/", children: brand }) })
   ] });
 };
 const Copyright = () => {
@@ -592,7 +640,7 @@ const Navigation$1 = ({ menu }) => {
       children: menu.map(({ path, label }, index) => /* @__PURE__ */ jsx(Flex, { as: "li", children: /* @__PURE__ */ jsx(
         Text,
         {
-          as: Link$1,
+          as: Link,
           to: path,
           fontSize: "md",
           fontWeight: "semibold",
@@ -631,14 +679,14 @@ const Footer = () => {
   );
 };
 const Brand = ({ brand }) => {
-  return /* @__PURE__ */ jsx(Link$1, { to: "/", children: brand });
+  return /* @__PURE__ */ jsx(Link, { to: "/", children: brand });
 };
 const NavLink = forwardRef(({ path, label }, ref) => {
   return /* @__PURE__ */ jsx(
     Text,
     {
       ref,
-      as: Link$1,
+      as: Link,
       to: path,
       p: 2,
       fontWeight: "semibold",
@@ -663,7 +711,7 @@ const NavList$1 = ({ path, label, children }) => {
         children: label
       }
     ) }),
-    /* @__PURE__ */ jsx(PopoverContent, { p: 2, border: 0, minW: "sm", rounded: "xl", boxShadow: "xl", bg: background, children: /* @__PURE__ */ jsx(List$1, { spacing: 2, p: 0, children: children == null ? void 0 : children.map((child, index) => /* @__PURE__ */ jsx(ListItem, { rounded: "md", _hover: { bg: backgroundHover }, children: /* @__PURE__ */ jsxs(Flex, { as: Link$1, to: `${path}${child.path}`, p: 2, role: "group", children: [
+    /* @__PURE__ */ jsx(PopoverContent, { p: 2, border: 0, minW: "sm", rounded: "xl", boxShadow: "xl", bg: background, children: /* @__PURE__ */ jsx(List$1, { spacing: 2, p: 0, children: children == null ? void 0 : children.map((child, index) => /* @__PURE__ */ jsx(ListItem, { rounded: "md", _hover: { bg: backgroundHover }, children: /* @__PURE__ */ jsxs(Flex, { as: Link, to: `${path}${child.path}`, p: 2, role: "group", children: [
       /* @__PURE__ */ jsx(Text, { fontWeight: 500, transition: "all .3s ease", _groupHover: { color: "brand.400" }, children: child.label }),
       /* @__PURE__ */ jsx(
         Flex,
@@ -714,7 +762,7 @@ const NavList = ({ path, label, children, isExpanded, onExpand }) => {
         ]
       }
     ),
-    /* @__PURE__ */ jsx(Collapse, { in: isExpanded, transition: { enter: { ease: "easeIn" }, exit: { duration: 0.2 } }, children: /* @__PURE__ */ jsx(List$1, { ml: 2, pl: 0, borderLeft: 1, borderStyle: "solid", borderColor: useColorModeValue("gray.200", "gray.700"), children: children == null ? void 0 : children.map((child, index) => /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: /* @__PURE__ */ jsx(Text, { as: Link$1, to: `${path}${child.path}`, p: 2, fontSize: "sm", children: child.label }) }, index)) }) })
+    /* @__PURE__ */ jsx(Collapse, { in: isExpanded, transition: { enter: { ease: "easeIn" }, exit: { duration: 0.2 } }, children: /* @__PURE__ */ jsx(List$1, { ml: 2, pl: 0, borderLeft: 1, borderStyle: "solid", borderColor: useColorModeValue("gray.200", "gray.700"), children: children == null ? void 0 : children.map((child, index) => /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: /* @__PURE__ */ jsx(Text, { as: Link, to: `${path}${child.path}`, p: 2, fontSize: "sm", children: child.label }) }, index)) }) })
   ] });
 };
 const CLOSE_ICON_SIZE = "0.75rem";
@@ -817,7 +865,7 @@ const Hero = ({ title, subtitle, content, link, image }) => {
         /* @__PURE__ */ jsx(Text, { as: "span", display: "block", color: "brand.400", children: subtitle })
       ] }),
       /* @__PURE__ */ jsx(Text, { fontSize: { base: "md", lg: "lg" }, color: "gray.500", children: content }),
-      !!link && /* @__PURE__ */ jsx(Flex, { direction: { base: "column", md: "row" }, children: /* @__PURE__ */ jsx(LinkButton, { ...link }) })
+      !!link && /* @__PURE__ */ jsx(Flex, { direction: { base: "column", md: "row" }, children: /* @__PURE__ */ jsx(LinkButton, { ...link, size: "md", textDecoration: "none" }) })
     ] }) }),
     image && /* @__PURE__ */ jsx(Flex, { display: { base: "none", md: "flex" }, flex: 1, children: image })
   ] }) }) });
@@ -900,7 +948,7 @@ const NotFound = () => {
     /* @__PURE__ */ jsxs(Text, { fontSize: "xl", children: [
       t2("description"),
       " ",
-      /* @__PURE__ */ jsx(Button, { as: Link$1, to: "/", variant: "link", colorScheme: "brand", fontSize: "xl", children: t2("action") })
+      /* @__PURE__ */ jsx(Button, { as: Link, to: "/", variant: "link", colorScheme: "brand", fontSize: "xl", children: t2("action") })
     ] })
   ] });
 };
@@ -1075,6 +1123,7 @@ const StrapiComponent = ({ type, props, imageComponent }) => {
         {
           name: props.name,
           src: props.src,
+          href: props.href,
           previewImage: /* @__PURE__ */ jsx(ExternalImage, { image: props.previewImage, alt: props.name, component: imageComponent }),
           mb: 4
         }
@@ -1198,6 +1247,5 @@ export {
   Author as k,
   Center as l,
   Grid as m,
-  LinkButton as n,
-  PulseButton as o
+  LinkButton as n
 };

package/dist/index-MpNfBHkQ.mjs

@@ -0,0 +1,37 @@
+import { keyframes } from "@emotion/react";
+const pulse = keyframes`
+  0% {
+    box-shadow: 0 0 0 0 var(--chakra-colors-brand-100);
+  }
+
+  50% {
+    box-shadow: 0 0 0 0.8rem rgba(0, 0, 0, 0);
+  }
+
+  100% {
+    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+  }
+`;
+const defaultAnimationParams = {
+  duration: 1,
+  timingFunction: "linear",
+  isInfinite: false
+};
+function animation(keyframes2) {
+  return (params) => {
+    const duration = (params == null ? void 0 : params.duration) || defaultAnimationParams.duration;
+    const timingFunction = (params == null ? void 0 : params.timingFunction) || defaultAnimationParams.timingFunction;
+    const isInfinite = (params == null ? void 0 : params.isInfinite) || defaultAnimationParams.isInfinite;
+    return `${keyframes2} ${duration}s ${timingFunction} ${isInfinite ? "infinite" : ""}`.trim();
+  };
+}
+const Animation = {
+  pulse: animation(pulse)
+};
+const DARK_THEME_COLOR = "white";
+const LIGHT_THEME_COLOR = "gray.800";
+export {
+  Animation as A,
+  DARK_THEME_COLOR as D,
+  LIGHT_THEME_COLOR as L
+};

package/dist/index.cjs

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("./index-BxPYJ5OB.js");
-const index$1 = require("./index-IpSV-c71.js");
-const i18n$1 = require("./index-Biz1dDqA.js");
+const index = require("./index-FzrDuS6r.js");
+const index$1 = require("./index-BV0hDmYP.js");
+const i18n$1 = require("./index-BPLxhZG_.js");
 const index$2 = require("./index-DF_u_tzx.js");
 const index$3 = require("./index-BhsXlbd8.js");
-const index$4 = require("./index-CpjGjVVj.js");
-const index$5 = require("./index-NsIHOkeN.js");
+const index$4 = require("./index-DVcQxWMZ.js");
+const index$5 = require("./index-DuQjQMNN.js");
+const index$6 = require("./index-BClxYYix.js");
 const i18n = require("i18next");
 exports.Author = index.Author;
 exports.AuthorCard = index.AuthorCard;
@@ -28,7 +29,6 @@ exports.LinkButton = index.LinkButton;
 exports.List = index.List;
 exports.NotFound = index.NotFound;
 exports.ProsCons = index.ProsCons;
-exports.PulseButton = index.PulseButton;
 exports.Seo = index.Seo;
 exports.StrapiContentRenderer = index.StrapiContentRenderer;
 exports.Table = index.Table;
@@ -42,17 +42,17 @@ exports.MdxProvider = index$2.MdxProvider;
 exports.SiteProvider = index$3.SiteProvider;
 exports.useSiteContext = index$3.useSiteContext;
 exports.Animation = index$4.Animation;
-exports.formatDate = index$4.formatDate;
-exports.formatNumber = index$4.formatNumber;
-exports.getCurrencySymbol = index$4.getCurrencySymbol;
-exports.getCurrentMonth = index$4.getCurrentMonth;
-exports.getCurrentYear = index$4.getCurrentYear;
-exports.getSeededRandomComparator = index$4.getSeededRandomComparator;
-exports.parseNumber = index$4.parseNumber;
-exports.randomComparator = index$4.randomComparator;
-exports.round = index$4.round;
-exports.toFixedTwo = index$4.toFixedTwo;
-exports.extractTheme = index$5.extractTheme;
-exports.generateColorPalette = index$5.generateColorPalette;
-exports.transformSiteNavigation = index$5.transformSiteNavigation;
+exports.DARK_THEME_COLOR = index$4.DARK_THEME_COLOR;
+exports.LIGHT_THEME_COLOR = index$4.LIGHT_THEME_COLOR;
+exports.formatDate = index$5.formatDate;
+exports.formatNumber = index$5.formatNumber;
+exports.getCurrencySymbol = index$5.getCurrencySymbol;
+exports.getCurrentMonth = index$5.getCurrentMonth;
+exports.getCurrentYear = index$5.getCurrentYear;
+exports.getSeededRandomComparator = index$5.getSeededRandomComparator;
+exports.parseNumber = index$5.parseNumber;
+exports.randomComparator = index$5.randomComparator;
+exports.round = index$5.round;
+exports.toFixedTwo = index$5.toFixedTwo;
+exports.transformSiteNavigation = index$6.transformSiteNavigation;
 exports.i18n = i18n;

package/dist/index.mjs

@@ -1,10 +1,11 @@
-import { k, A, B, a, l, C, F, b, c, G, d, e, f, m, H, L, n, g, N, P, o, S, h, T, i, j } from "./index-BKg1_9Hw.mjs";
-import { u } from "./index-xuSxvz5z.mjs";
-import { a as a2, G as G2, r } from "./index-DoBCANwf.mjs";
+import { k, A, B, a, l, C, F, b, c, G, d, e, f, m, H, L, n, g, N, P, S, h, T, i, j } from "./index-HjgJxxVi.mjs";
+import { u } from "./index-CkTgVjZS.mjs";
+import { a as a2, G as G2, r } from "./index-BE9gNdXx.mjs";
 import { M } from "./index-CcsbqDXL.mjs";
 import { S as S2, u as u2 } from "./index-BNb-P8a6.mjs";
-import { A as A2, f as f2, b as b2, c as c2, a as a3, g as g2, e as e2, p, d as d2, r as r2, t } from "./index-Db-ZIQ0A.mjs";
-import { e as e3, g as g3, t as t2 } from "./index-DzEvPZny.mjs";
+import { A as A2, D, L as L2 } from "./index-MpNfBHkQ.mjs";
+import { f as f2, b as b2, c as c2, a as a3, g as g2, e as e2, p, d as d2, r as r2, t } from "./index-DPO0aIC3.mjs";
+import { t as t2 } from "./index-Ca_M-II5.mjs";
 import { default as default2 } from "i18next";
 export {
   A2 as Animation,
@@ -14,6 +15,7 @@ export {
   a as BonusCardGrid,
   l as Center,
   C as ContactForm,
+  D as DARK_THEME_COLOR,
   F as Faq,
   b as FeatureCard,
   c as FeatureCardGrid,
@@ -25,23 +27,21 @@ export {
   G2 as GameVolatility,
   m as Grid,
   H as HowTo,
+  L2 as LIGHT_THEME_COLOR,
   L as Layout,
   n as LinkButton,
   g as List,
   M as MdxProvider,
   N as NotFound,
   P as ProsCons,
-  o as PulseButton,
   S as Seo,
   S2 as SiteProvider,
   h as StrapiContentRenderer,
   T as Table,
   i as Tabs,
   j as Tip,
-  e3 as extractTheme,
   f2 as formatDate,
   b2 as formatNumber,
-  g3 as generateColorPalette,
   c2 as getCurrencySymbol,
   a3 as getCurrentMonth,
   g2 as getCurrentYear,

package/dist/types/components/bonus-card/index.d.ts

@@ -1,6 +1,7 @@
 import { ReactElement } from 'react';
-import { IBonus, ILink } from '../../content';
+import { IBonus } from '../../content';
 import { Color } from '../common';
+import { ILink } from '../link';
 type TextContent = string | ReactElement;
 export interface IBonusCardCustomizationProps {
     color?: Color;

package/dist/types/components/button/index.d.ts

@@ -0,0 +1,6 @@
+import { ButtonProps } from '@chakra-ui/react';
+import { BaseSize, IAnimation } from '../common';
+export type BaseButtonProps = Pick<ButtonProps, 'width' | 'textTransform' | 'textDecoration' | 'onClick'> & {
+    size?: 'xs' | BaseSize | 'auto';
+    animation?: IAnimation;
+};

package/dist/types/components/common/index.d.ts

@@ -6,4 +6,16 @@ type BoxPaddingProps = Pick<BoxProps, 'p' | 'pt' | 'pr' | 'pb' | 'pl' | 'px' | '
 type BoxMarginProps = Pick<BoxProps, 'm' | 'mt' | 'mr' | 'mb' | 'ml' | 'mx' | 'my' | 'ms' | 'me'>;
 export type BoxPositionProps = BoxMarginProps & BoxPaddingProps;
 export type Color = ColorProps['color'];
+export type BaseSize = 'sm' | 'md' | 'lg';
+export type AnimationType = 'pulse';
+export interface IAnimationParams {
+    duration?: number;
+    timingFunction?: 'linear' | 'ease-in' | 'ease-out' | 'ease-in-out';
+    isInfinite?: boolean;
+}
+export interface IAnimation {
+    type: AnimationType;
+    params?: IAnimationParams;
+}
+export type AnimationGetter = (params?: IAnimationParams) => string;
 export {};

package/dist/types/components/game-card/index.d.ts

@@ -1,7 +1,8 @@
 import { ReactElement } from 'react';
-import { IGame, ILink } from '../../content';
+import { IGame } from '../../content';
+import { ILink } from '../link';
 export interface IGameCard extends IGame {
-    link?: ILink['url'];
+    href?: ILink['href'];
     image?: string | ReactElement;
 }
 export type GameCardHeight = 'full' | 'auto';

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

@@ -1,4 +1,5 @@
 export * from './bonus-card';
+export * from './button';
 export * from './common';
 export * from './external-image';
 export * from './faq';
@@ -7,6 +8,7 @@ export * from './game-info';
 export * from './grid';
 export * from './how-to';
 export * from './image';
+export * from './link';
 export * from './navigation';
 export * from './pros-cons';
 export * from './strapi-component';

package/dist/types/components/link/index.d.ts

@@ -0,0 +1,5 @@
+export interface ILink {
+    label: string;
+    href: string;
+}
+export type LinkType = 'direct' | 'redirect';

package/dist/types/content/index.d.ts

@@ -2,5 +2,4 @@ export * from './author';
 export * from './bonus';
 export * from './feature';
 export * from './game';
-export * from './link';
 export * from './seo';

package/dist/types/site/index.d.ts

@@ -11,9 +11,13 @@ interface ISiteFooterConfig {
     extra?: ReactNode;
     showDisclaimer?: boolean;
 }
+interface ISiteThemeConfig {
+    isInvertedColor?: boolean;
+}
 export interface ISiteConfigs {
     header?: ISiteHeaderConfig;
     footer?: ISiteFooterConfig;
+    theme?: ISiteThemeConfig;
 }
 export interface ISiteMetadata {
     name: string;

package/dist/utils/animation/index.d.ts

@@ -1,8 +1,2 @@
-export declare const Animation: {
-    readonly pulse: {
-        name: string;
-        styles: string;
-        anim: 1;
-        toString: () => string;
-    } & string;
-};
+import { AnimationGetter, AnimationType } from '../../types';
+export declare const Animation: Record<AnimationType, AnimationGetter>;