@anywayseo/tools 5.10.0 → 5.11.0

package/dist/components/base/article-meta/item/index.d.ts

@@ -1,7 +1,9 @@
 import { FC } from 'react';
+type ArticleMetaIcon = 'date' | 'time' | 'author';
 type ArticleMetaItemProps = {
     label: string;
     value: string;
+    icon?: ArticleMetaIcon;
 };
 declare const ArticleMetaItem: FC<ArticleMetaItemProps>;
 export default ArticleMetaItem;

package/dist/components/index.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("../index-CAhVRVmv.js");
-const index$1 = require("../index-DzOucsVx.js");
+const index = require("../index-hGzNO4AL.js");
+const index$1 = require("../index-DhhGhwm2.js");
 const index$2 = require("../index-DDg_PkD2.js");
-const index$3 = require("../index-B4M1IKzL.js");
+const index$3 = require("../index-D-jM-cHx.js");
 exports.ActionButton = index.ActionButton;
 exports.ArticleCard = index.ArticleCard;
 exports.ArticleCardGrid = index.ArticleCardGrid;

package/dist/components/index.mjs

@@ -1,7 +1,7 @@
-import { A, a, b, c, n, o, d, B, e, C, r, q, F, f, g, G, h, i, j, p, H, I, L, N, s, P, S, k, T, l, t, m } from "../index-C2HtVL6w.mjs";
-import { C as C2, a as a2, b as b2, L as L2, c as c2, R, S as S2, d as d2 } from "../index-D9i6mZaH.mjs";
+import { A, a, b, c, n, o, d, B, e, C, r, q, F, f, g, G, h, i, j, p, H, I, L, N, s, P, S, k, T, l, t, m } from "../index-CG7F6SYt.mjs";
+import { C as C2, a as a2, b as b2, L as L2, c as c2, R, S as S2, d as d2 } from "../index-DqMBmwe5.mjs";
 import { H as H2, a as a3, b as b3, O, P as P2, U } from "../index-BEjKnOZA.mjs";
-import { I as I2, L as L3 } from "../index-ClIPWZ3z.mjs";
+import { I as I2, L as L3 } from "../index-B6wLLS6t.mjs";
 export {
   A as ActionButton,
   a as ArticleCard,

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

@@ -1,11 +1,12 @@
 import { FC, PropsWithChildren } from 'react';
-import { IHrefLang, ILocale, ISeo } from '../../types';
-import { SeoItemGetter } from './types';
+import { SeoCanonical, SeoDescription, SeoHrefLangs, SeoLocale, SeoTitle } from './types';
 type SeoProps = PropsWithChildren<{
-    title?: ISeo['title'] | SeoItemGetter;
-    description?: ISeo['description'] | SeoItemGetter;
-    lang?: ILocale['code'];
-    hrefLangs?: IHrefLang[];
+    pathname: Location['pathname'];
+    locale?: SeoLocale;
+    title?: SeoTitle;
+    description?: SeoDescription;
+    canonical?: SeoCanonical;
+    hrefLangs?: SeoHrefLangs;
 }>;
 declare const Seo: FC<SeoProps>;
 export default Seo;

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

@@ -1,6 +1,13 @@
-export interface ISeoItemPlaceholders {
+import { IHrefLang, ILocale, ISeo, Nullable } from '../../types';
+export interface ISeoMetaItemPlaceholders {
     siteName: string;
     currentYear: string;
     currentMonth: string;
 }
-export type SeoItemGetter = (placeholders: ISeoItemPlaceholders) => string;
+type SeoMetaItemGetter = (placeholders: ISeoMetaItemPlaceholders) => string;
+export type SeoLocale = Nullable<ILocale['code']>;
+export type SeoTitle = Nullable<ISeo['title'] | SeoMetaItemGetter>;
+export type SeoDescription = Nullable<ISeo['description'] | SeoMetaItemGetter>;
+export type SeoCanonical = Nullable<string>;
+export type SeoHrefLangs = IHrefLang[];
+export {};

package/dist/components/seo/utils.d.ts

@@ -1,2 +1,2 @@
-import { ISeoItemPlaceholders } from './types';
-export declare function replacePlaceholders(text: string, placeholders: ISeoItemPlaceholders): string;
+import { ISeoMetaItemPlaceholders, SeoDescription, SeoTitle } from './types';
+export declare function getSeoMetaItem<T extends SeoTitle | SeoDescription>(item: NonNullable<T>, placeholders: ISeoMetaItemPlaceholders): string;

package/dist/{index-ClIPWZ3z.mjs → index-B6wLLS6t.mjs}

@@ -9,7 +9,7 @@ import "./index-BJRvnR8Q.mjs";
 import "./index-RzByAgHO.mjs";
 import "@chakra-ui/icons";
 import { u as useLocalization } from "./index-DHURrUMW.mjs";
-import { a as isAbsolutePath, i as isRelativePath } from "./index-Bph7a3PR.mjs";
+import { c as isAbsolutePath, i as isRelativePath } from "./index-DSP348cK.mjs";
 const SiteContext = createContext(null);
 const SiteProvider = ({ children, ...context }) => {
   const value = useMemo(() => context, []);

package/dist/{index-CYr1ct1t.js → index-Ba_pXx_e.js}

@@ -1,14 +1,18 @@
 "use strict";
+const index = require("./index-C3n63_nP.js");
 const DUMMY_PAGE_TYPE = "DUMMY";
 const NavigationSlug = {
   HEADER: "header-navigation",
   FOOTER: "footer-navigation"
 };
 function isValidPath(value) {
-  return typeof value === "string" && (value === "" || value.startsWith("/"));
+  return typeof value === "string" && (value === "" || index.isRelativePath(value));
 }
 function isValidType(value) {
-  return typeof value === "string" && value !== DUMMY_PAGE_TYPE;
+  return typeof value === "string" && value.toUpperCase() !== DUMMY_PAGE_TYPE;
+}
+function isValidTitle(value) {
+  return typeof value === "string" && value.toUpperCase() !== DUMMY_PAGE_TYPE;
 }
 function transformNavItems(items) {
   if (!items || !items.length) {
@@ -17,7 +21,7 @@ function transformNavItems(items) {
   const transformed = [];
   items.forEach((item) => {
     var _a;
-    if (item && item.title && isValidType(item.type) && isValidPath(item.path)) {
+    if (item && isValidTitle(item.title) && isValidType(item.type) && isValidPath(item.path)) {
       const isNavGroup = (_a = item.items) == null ? void 0 : _a.length;
       transformed.push({
         label: item.title,

package/dist/{index-DgrIJs-a.js → index-C3n63_nP.js}

@@ -2,12 +2,17 @@
 function buildPath(slug, parentSlug) {
   return parentSlug === "" ? slug : `${parentSlug}/${slug}`;
 }
+function buildCanonicalUrl(domain, path) {
+  const cleanPath = path.split(/[?#]/)[0];
+  return `https://${domain}${cleanPath === "/" ? "" : cleanPath}`;
+}
 function isRelativePath(path = "") {
   return path.startsWith("/");
 }
 function isAbsolutePath(path = "") {
   return /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(path);
 }
+exports.buildCanonicalUrl = buildCanonicalUrl;
 exports.buildPath = buildPath;
 exports.isAbsolutePath = isAbsolutePath;
 exports.isRelativePath = isRelativePath;

package/dist/{index-C2HtVL6w.mjs → index-CG7F6SYt.mjs}

@@ -1,24 +1,33 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { useColorModeValue, Box, Text, Flex, Collapse, Button, Stack, Center as Center$1, SimpleGrid, Card, CardBody, CardFooter, CardHeader, Heading, Popover, PopoverTrigger, Portal, PopoverContent, PopoverBody, Accordion, AccordionItem, AccordionButton, AccordionIcon, AccordionPanel, LinkBox, LinkOverlay, IconButton, AbsoluteCenter, Spinner, Alert, AlertIcon, AlertTitle, AlertDescription, useDisclosure, Divider, Circle, List as List$1, ListItem, useToast, VStack, FormControl, FormLabel, InputGroup, InputLeftElement, Input, Textarea, 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 { useColorModeValue, Flex, Text, Box, Collapse, Button, Stack, Center as Center$1, SimpleGrid, Card, CardBody, CardFooter, CardHeader, Heading, Popover, PopoverTrigger, Portal, PopoverContent, PopoverBody, Accordion, AccordionItem, AccordionButton, AccordionIcon, AccordionPanel, LinkBox, LinkOverlay, IconButton, AbsoluteCenter, Spinner, Alert, AlertIcon, AlertTitle, AlertDescription, useDisclosure, Divider, Circle, List as List$1, ListItem, useToast, VStack, FormControl, FormLabel, InputGroup, InputLeftElement, Input, Textarea, 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 { useMDXComponents } from "@mdx-js/react";
-import { u as usePageContext, I as Image, L as Link, a as useSiteContext } from "./index-ClIPWZ3z.mjs";
+import { u as usePageContext, I as Image, L as Link, a as useSiteContext } from "./index-B6wLLS6t.mjs";
 import "./index-BJRvnR8Q.mjs";
 import { b as GameCharacteristic, G as GameVolatility } from "./index-RzByAgHO.mjs";
-import { StarIcon, CloseIcon, ViewOffIcon, ViewIcon, EmailIcon, WarningIcon, CheckCircleIcon } from "@chakra-ui/icons";
+import { AtSignIcon, TimeIcon, CalendarIcon, StarIcon, CloseIcon, ViewOffIcon, ViewIcon, EmailIcon, WarningIcon, CheckCircleIcon } from "@chakra-ui/icons";
 import "react-medium-image-zoom";
 import { useRef, useState, useLayoutEffect, Fragment as Fragment$1, useMemo } from "react";
-import { d as SocialNetworks, L as LinkButton, R as Rating } from "./index-D9i6mZaH.mjs";
+import { d as SocialNetworks, L as LinkButton, R as Rating } from "./index-DqMBmwe5.mjs";
 import { a as Heading2, H as Heading1, P as Paragraph, U as Unordered, O as Ordered } from "./index-BEjKnOZA.mjs";
+import { a as buildCanonicalUrl } from "./index-DSP348cK.mjs";
 import { f as formatDate, b as formatNumber, a as getCurrentMonth, g as getCurrentYear } from "./index-BPthShL-.mjs";
 import { u as usePrimaryColors } from "./index-C1kr7Vd-.mjs";
 import { a as getSeededRandomComparator, r as randomComparator, g as getCurrencySymbol } from "./index-BeJTy4iY.mjs";
 import { t } from "i18next";
 import Markdown from "react-markdown";
-const ArticleMetaItem = ({ label, value }) => {
+const ArticleMetaIconMap = {
+  date: /* @__PURE__ */ jsx(CalendarIcon, {}),
+  time: /* @__PURE__ */ jsx(TimeIcon, {}),
+  author: /* @__PURE__ */ jsx(AtSignIcon, {})
+};
+const ArticleMetaItem = ({ label, value, icon }) => {
   const color = useColorModeValue("gray.600", "gray.400");
-  return /* @__PURE__ */ jsxs(Box, { children: [
-    /* @__PURE__ */ jsx(Text, { as: "span", color, children: label }),
+  return /* @__PURE__ */ jsxs(Flex, { lineHeight: 6, children: [
+    /* @__PURE__ */ jsxs(Text, { as: "span", display: "inline-flex", alignItems: "center", gap: 1, me: 1, color, children: [
+      !!icon && ArticleMetaIconMap[icon],
+      label
+    ] }),
     value
   ] });
 };
@@ -30,18 +39,20 @@ const ArticleMeta = ({ createdAt, updatedAt, minutesToRead, authorName, variant
     !!publicationDate && /* @__PURE__ */ jsx(
       ArticleMetaItem,
       {
-        label: variant === "full" ? `📅 ${t2("meta.publicationDate")}` : "📅 ",
+        icon: "date",
+        label: variant === "full" ? t2("meta.publicationDate") : "",
         value: publicationDate
       }
     ),
     !!minutesToRead && /* @__PURE__ */ jsx(
       ArticleMetaItem,
       {
-        label: variant === "full" ? `⏳ ${t2("meta.readingTime.label")}` : "⏳ ",
+        icon: "time",
+        label: variant === "full" ? t2("meta.readingTime.label") : "",
         value: t2("meta.readingTime.count", { count: minutesToRead })
       }
     ),
-    !!authorName && /* @__PURE__ */ jsx(ArticleMetaItem, { label: variant === "full" ? `🧑🏻‍💻 ${t2("meta.author")}` : "🧑🏻‍💻 ", value: authorName })
+    !!authorName && /* @__PURE__ */ jsx(ArticleMetaItem, { icon: "author", label: variant === "full" ? t2("meta.author") : "", value: authorName })
   ] });
 };
 const ONE_LINE_HEIGHT = 24;
@@ -946,30 +957,31 @@ function replacePlaceholders(text, placeholders) {
   });
   return text;
 }
-const Seo = ({ children, title, description, lang, hrefLangs = [] }) => {
-  const { metadata } = useSiteContext();
-  const { name: siteName, lang: defaultLang, seo } = metadata;
-  const { title: defaultTitle, description: defaultDescription } = seo;
-  const siteLang = lang || defaultLang;
+function getSeoMetaItem(item, placeholders) {
+  if (typeof item === "string") {
+    return replacePlaceholders(item, placeholders);
+  }
+  return item(placeholders);
+}
+const Seo = ({ children, pathname, locale, title, description, canonical, hrefLangs = [] }) => {
+  const { metadata: siteMetadata } = useSiteContext();
+  const { name: siteName, lang: siteLocale, seo: siteSeo } = siteMetadata;
+  const { title: siteTitle, description: siteDescription } = siteSeo;
+  const lang = locale || siteLocale;
   const placeholders = useMemo(
     () => ({
       siteName,
-      currentYear: getCurrentYear(siteLang),
-      currentMonth: getCurrentMonth(siteLang)
+      currentYear: getCurrentYear(lang),
+      currentMonth: getCurrentMonth(lang)
     }),
-    [siteName, siteLang]
+    [siteName, lang]
   );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("html", { lang: siteLang }),
-    /* @__PURE__ */ jsx("title", { children: title ? typeof title === "string" ? replacePlaceholders(title, placeholders) : title(placeholders) : defaultTitle }),
-    /* @__PURE__ */ jsx(
-      "meta",
-      {
-        name: "description",
-        content: description ? typeof description === "string" ? replacePlaceholders(description, placeholders) : description(placeholders) : defaultDescription
-      }
-    ),
-    hrefLangs.map(({ href, hrefLang }, index) => /* @__PURE__ */ jsx("link", { rel: "alternate", hrefLang, href: `https://${siteName}${href}` }, index)),
+    /* @__PURE__ */ jsx("html", { lang }),
+    /* @__PURE__ */ jsx("title", { children: getSeoMetaItem(title ?? siteTitle, placeholders) }),
+    /* @__PURE__ */ jsx("meta", { name: "description", content: getSeoMetaItem(description ?? siteDescription, placeholders) }),
+    /* @__PURE__ */ jsx("link", { rel: "canonical", href: canonical ?? buildCanonicalUrl(siteName, pathname) }),
+    hrefLangs.map(({ href, hrefLang }, index) => /* @__PURE__ */ jsx("link", { rel: "alternate", hrefLang, href: buildCanonicalUrl(siteName, href) }, index)),
     children
   ] });
 };

package/dist/{index-cQqALZIW.mjs → index-CJANSiM5.mjs}

@@ -1,13 +1,17 @@
+import { i as isRelativePath } from "./index-DSP348cK.mjs";
 const DUMMY_PAGE_TYPE = "DUMMY";
 const NavigationSlug = {
   HEADER: "header-navigation",
   FOOTER: "footer-navigation"
 };
 function isValidPath(value) {
-  return typeof value === "string" && (value === "" || value.startsWith("/"));
+  return typeof value === "string" && (value === "" || isRelativePath(value));
 }
 function isValidType(value) {
-  return typeof value === "string" && value !== DUMMY_PAGE_TYPE;
+  return typeof value === "string" && value.toUpperCase() !== DUMMY_PAGE_TYPE;
+}
+function isValidTitle(value) {
+  return typeof value === "string" && value.toUpperCase() !== DUMMY_PAGE_TYPE;
 }
 function transformNavItems(items) {
   if (!items || !items.length) {
@@ -16,7 +20,7 @@ function transformNavItems(items) {
   const transformed = [];
   items.forEach((item) => {
     var _a;
-    if (item && item.title && isValidType(item.type) && isValidPath(item.path)) {
+    if (item && isValidTitle(item.title) && isValidType(item.type) && isValidPath(item.path)) {
       const isNavGroup = (_a = item.items) == null ? void 0 : _a.length;
       transformed.push({
         label: item.title,

package/dist/{index-D1gNEJUA.mjs → index-CPbWQKoT.mjs}

@@ -2,11 +2,11 @@ import { jsx } from "react/jsx-runtime";
 import { MDXProvider } from "@mdx-js/react";
 import "react-i18next";
 import "@chakra-ui/react";
-import { I as Image, L as Link } from "./index-ClIPWZ3z.mjs";
+import { I as Image, L as Link } from "./index-B6wLLS6t.mjs";
 import "./index-BJRvnR8Q.mjs";
 import "./index-RzByAgHO.mjs";
-import "react";
 import "@chakra-ui/icons";
+import "react";
 import { P as Paragraph, U as Unordered, O as Ordered, b as Heading3, a as Heading2, H as Heading1 } from "./index-BEjKnOZA.mjs";
 function omitProps(props, omittedKeys) {
   const result = { ...props };

package/dist/{index-DXTC3R_J.js → index-Ca9tsjT8.js}

@@ -3,11 +3,11 @@ const jsxRuntime = require("react/jsx-runtime");
 const react = require("@mdx-js/react");
 require("react-i18next");
 require("@chakra-ui/react");
-const index$1 = require("./index-B4M1IKzL.js");
+const index$1 = require("./index-D-jM-cHx.js");
 require("./index-C6MG_f24.js");
 require("./index-CBRFCYhV.js");
-require("react");
 require("@chakra-ui/icons");
+require("react");
 const index = require("./index-DDg_PkD2.js");
 function omitProps(props, omittedKeys) {
   const result = { ...props };

package/dist/{index-B4M1IKzL.js → index-D-jM-cHx.js}

@@ -10,7 +10,7 @@ require("./index-C6MG_f24.js");
 require("./index-CBRFCYhV.js");
 require("@chakra-ui/icons");
 const index = require("./index-ma-iV7GU.js");
-const index$1 = require("./index-DgrIJs-a.js");
+const index$1 = require("./index-C3n63_nP.js");
 const SiteContext = react.createContext(null);
 const SiteProvider = ({ children, ...context }) => {
   const value = react.useMemo(() => context, []);

package/dist/{index-Bph7a3PR.mjs → index-DSP348cK.mjs}

@@ -1,6 +1,10 @@
 function buildPath(slug, parentSlug) {
   return parentSlug === "" ? slug : `${parentSlug}/${slug}`;
 }
+function buildCanonicalUrl(domain, path) {
+  const cleanPath = path.split(/[?#]/)[0];
+  return `https://${domain}${cleanPath === "/" ? "" : cleanPath}`;
+}
 function isRelativePath(path = "") {
   return path.startsWith("/");
 }
@@ -8,7 +12,8 @@ function isAbsolutePath(path = "") {
   return /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(path);
 }
 export {
-  isAbsolutePath as a,
+  buildCanonicalUrl as a,
   buildPath as b,
+  isAbsolutePath as c,
   isRelativePath as i
 };

package/dist/{index-DzOucsVx.js → index-DhhGhwm2.js}

@@ -1,13 +1,13 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("@chakra-ui/react");
-const index = require("./index-B4M1IKzL.js");
+const index = require("./index-D-jM-cHx.js");
 require("@mdx-js/react");
 const reactI18next = require("react-i18next");
 const index$2 = require("./index-C6MG_f24.js");
 const index$3 = require("./index-CBRFCYhV.js");
-require("react");
 const icons = require("@chakra-ui/icons");
+require("react");
 require("react-medium-image-zoom");
 const index$1 = require("./index-CVv755RW.js");
 const index$4 = require("./index-ov4J7p3D.js");

package/dist/{index-D9i6mZaH.mjs → index-DqMBmwe5.mjs}

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { Flex, Container as Container$1, useColorModeValue, useToast, useClipboard, Text, IconButton, Button, Box, Stack, Card, Badge, Td, Tr, Table, Thead, Th, Tbody } from "@chakra-ui/react";
-import { L as Link, a as useSiteContext, I as Image, u as usePageContext } from "./index-ClIPWZ3z.mjs";
+import { L as Link, a as useSiteContext, I as Image, u as usePageContext } from "./index-B6wLLS6t.mjs";
 import "@mdx-js/react";
 import { useTranslation } from "react-i18next";
 import { A as Animation } from "./index-BJRvnR8Q.mjs";
 import { a as CasinoCharacteristic, C as CasinoTableColumn } from "./index-RzByAgHO.mjs";
-import "react";
 import { CheckIcon, CopyIcon, StarIcon } from "@chakra-ui/icons";
+import "react";
 import "react-medium-image-zoom";
 import { u as usePrimaryColors } from "./index-C1kr7Vd-.mjs";
 import { b as formatNumber } from "./index-BPthShL-.mjs";

package/dist/{index-CAhVRVmv.js → index-hGzNO4AL.js}

@@ -3,23 +3,32 @@ const jsxRuntime = require("react/jsx-runtime");
 const react = require("@chakra-ui/react");
 const reactI18next = require("react-i18next");
 const react$2 = require("@mdx-js/react");
-const index = require("./index-B4M1IKzL.js");
+const index = require("./index-D-jM-cHx.js");
 require("./index-C6MG_f24.js");
 const index$6 = require("./index-CBRFCYhV.js");
 const icons = require("@chakra-ui/icons");
 require("react-medium-image-zoom");
 const react$1 = require("react");
-const index$2 = require("./index-DzOucsVx.js");
+const index$2 = require("./index-DhhGhwm2.js");
 const index$3 = require("./index-DDg_PkD2.js");
+const index$7 = require("./index-C3n63_nP.js");
 const index$1 = require("./index-ov4J7p3D.js");
 const index$4 = require("./index-CVv755RW.js");
 const index$5 = require("./index-BfITsKAr.js");
 const i18next = require("i18next");
 const Markdown = require("react-markdown");
-const ArticleMetaItem = ({ label, value }) => {
+const ArticleMetaIconMap = {
+  date: /* @__PURE__ */ jsxRuntime.jsx(icons.CalendarIcon, {}),
+  time: /* @__PURE__ */ jsxRuntime.jsx(icons.TimeIcon, {}),
+  author: /* @__PURE__ */ jsxRuntime.jsx(icons.AtSignIcon, {})
+};
+const ArticleMetaItem = ({ label, value, icon }) => {
   const color = react.useColorModeValue("gray.600", "gray.400");
-  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(react.Text, { as: "span", color, children: label }),
+  return /* @__PURE__ */ jsxRuntime.jsxs(react.Flex, { lineHeight: 6, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { as: "span", display: "inline-flex", alignItems: "center", gap: 1, me: 1, color, children: [
+      !!icon && ArticleMetaIconMap[icon],
+      label
+    ] }),
     value
   ] });
 };
@@ -31,18 +40,20 @@ const ArticleMeta = ({ createdAt, updatedAt, minutesToRead, authorName, variant
     !!publicationDate && /* @__PURE__ */ jsxRuntime.jsx(
       ArticleMetaItem,
       {
-        label: variant === "full" ? `📅 ${t("meta.publicationDate")}` : "📅 ",
+        icon: "date",
+        label: variant === "full" ? t("meta.publicationDate") : "",
         value: publicationDate
       }
     ),
     !!minutesToRead && /* @__PURE__ */ jsxRuntime.jsx(
       ArticleMetaItem,
       {
-        label: variant === "full" ? `⏳ ${t("meta.readingTime.label")}` : "⏳ ",
+        icon: "time",
+        label: variant === "full" ? t("meta.readingTime.label") : "",
         value: t("meta.readingTime.count", { count: minutesToRead })
       }
     ),
-    !!authorName && /* @__PURE__ */ jsxRuntime.jsx(ArticleMetaItem, { label: variant === "full" ? `🧑🏻‍💻 ${t("meta.author")}` : "🧑🏻‍💻 ", value: authorName })
+    !!authorName && /* @__PURE__ */ jsxRuntime.jsx(ArticleMetaItem, { icon: "author", label: variant === "full" ? t("meta.author") : "", value: authorName })
   ] });
 };
 const ONE_LINE_HEIGHT = 24;
@@ -947,30 +958,31 @@ function replacePlaceholders(text, placeholders) {
   });
   return text;
 }
-const Seo = ({ children, title, description, lang, hrefLangs = [] }) => {
-  const { metadata } = index.useSiteContext();
-  const { name: siteName, lang: defaultLang, seo } = metadata;
-  const { title: defaultTitle, description: defaultDescription } = seo;
-  const siteLang = lang || defaultLang;
+function getSeoMetaItem(item, placeholders) {
+  if (typeof item === "string") {
+    return replacePlaceholders(item, placeholders);
+  }
+  return item(placeholders);
+}
+const Seo = ({ children, pathname, locale, title, description, canonical, hrefLangs = [] }) => {
+  const { metadata: siteMetadata } = index.useSiteContext();
+  const { name: siteName, lang: siteLocale, seo: siteSeo } = siteMetadata;
+  const { title: siteTitle, description: siteDescription } = siteSeo;
+  const lang = locale || siteLocale;
   const placeholders = react$1.useMemo(
     () => ({
       siteName,
-      currentYear: index$1.getCurrentYear(siteLang),
-      currentMonth: index$1.getCurrentMonth(siteLang)
+      currentYear: index$1.getCurrentYear(lang),
+      currentMonth: index$1.getCurrentMonth(lang)
     }),
-    [siteName, siteLang]
+    [siteName, lang]
   );
   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
-      }
-    ),
-    hrefLangs.map(({ href, hrefLang }, index2) => /* @__PURE__ */ jsxRuntime.jsx("link", { rel: "alternate", hrefLang, href: `https://${siteName}${href}` }, index2)),
+    /* @__PURE__ */ jsxRuntime.jsx("html", { lang }),
+    /* @__PURE__ */ jsxRuntime.jsx("title", { children: getSeoMetaItem(title ?? siteTitle, placeholders) }),
+    /* @__PURE__ */ jsxRuntime.jsx("meta", { name: "description", content: getSeoMetaItem(description ?? siteDescription, placeholders) }),
+    /* @__PURE__ */ jsxRuntime.jsx("link", { rel: "canonical", href: canonical ?? index$7.buildCanonicalUrl(siteName, pathname) }),
+    hrefLangs.map(({ href, hrefLang }, index2) => /* @__PURE__ */ jsxRuntime.jsx("link", { rel: "alternate", hrefLang, href: index$7.buildCanonicalUrl(siteName, href) }, index2)),
     children
   ] });
 };

package/dist/index.cjs

@@ -1,20 +1,20 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("./index-CAhVRVmv.js");
-const index$1 = require("./index-DzOucsVx.js");
+const index = require("./index-hGzNO4AL.js");
+const index$1 = require("./index-DhhGhwm2.js");
 const index$2 = require("./index-DDg_PkD2.js");
-const index$3 = require("./index-B4M1IKzL.js");
+const index$3 = require("./index-D-jM-cHx.js");
 const index$4 = require("./index-ma-iV7GU.js");
 const index$5 = require("./index-CVv755RW.js");
 const i18n = require("./i18n/index.cjs");
 const layout = require("./layout/index.cjs");
-const index$6 = require("./index-DXTC3R_J.js");
+const index$6 = require("./index-Ca9tsjT8.js");
 const index$7 = require("./index-CBRFCYhV.js");
 const index$8 = require("./index-C6MG_f24.js");
-const index$9 = require("./index-CYr1ct1t.js");
+const index$9 = require("./index-Ba_pXx_e.js");
 const index$a = require("./index-BfITsKAr.js");
 const index$b = require("./index-ov4J7p3D.js");
-const index$c = require("./index-DgrIJs-a.js");
+const index$c = require("./index-C3n63_nP.js");
 const index$d = require("./index-CbuiYkSg.js");
 exports.ActionButton = index.ActionButton;
 exports.ArticleCard = index.ArticleCard;
@@ -93,6 +93,7 @@ exports.getCurrentMonth = index$b.getCurrentMonth;
 exports.getCurrentYear = index$b.getCurrentYear;
 exports.round = index$b.round;
 exports.toFixedTwo = index$b.toFixedTwo;
+exports.buildCanonicalUrl = index$c.buildCanonicalUrl;
 exports.buildPath = index$c.buildPath;
 exports.isAbsolutePath = index$c.isAbsolutePath;
 exports.isRelativePath = index$c.isRelativePath;

package/dist/index.mjs

@@ -1,18 +1,18 @@
-import { A, a, b, c, n, o, d, B, e, C, r, q, F, f, g, G, h, i, j, p, H, I, L, N, s, P, S, k, T, l, t, m } from "./index-C2HtVL6w.mjs";
-import { C as C2, a as a2, b as b2, L as L2, c as c2, R, S as S2, d as d2 } from "./index-D9i6mZaH.mjs";
+import { A, a, b, c, n, o, d, B, e, C, r, q, F, f, g, G, h, i, j, p, H, I, L, N, s, P, S, k, T, l, t, m } from "./index-CG7F6SYt.mjs";
+import { C as C2, a as a2, b as b2, L as L2, c as c2, R, S as S2, d as d2 } from "./index-DqMBmwe5.mjs";
 import { H as H2, a as a3, b as b3, O, P as P2, U } from "./index-BEjKnOZA.mjs";
-import { I as I2, L as L3, P as P3, S as S3, u, a as a4 } from "./index-ClIPWZ3z.mjs";
+import { I as I2, L as L3, P as P3, S as S3, u, a as a4 } from "./index-B6wLLS6t.mjs";
 import { u as u2 } from "./index-DHURrUMW.mjs";
 import { u as u3 } from "./index-C1kr7Vd-.mjs";
 import { DEFAULT_LANGUAGE, resources } from "./i18n/index.mjs";
 import { default as default2 } from "./layout/index.mjs";
-import { M } from "./index-D1gNEJUA.mjs";
+import { M } from "./index-CPbWQKoT.mjs";
 import { a as a5, C as C3, b as b4, G as G2, I as I3 } from "./index-RzByAgHO.mjs";
 import { A as A2 } from "./index-BJRvnR8Q.mjs";
-import { b as b5, c as c3, g as g2, a as a6 } from "./index-cQqALZIW.mjs";
+import { b as b5, c as c3, g as g2, a as a6 } from "./index-CJANSiM5.mjs";
 import { g as g3, a as a7, r as r2 } from "./index-BeJTy4iY.mjs";
 import { f as f2, b as b6, a as a8, g as g4, r as r3, t as t2 } from "./index-BPthShL-.mjs";
-import { b as b7, a as a9, i as i2 } from "./index-Bph7a3PR.mjs";
+import { a as a9, b as b7, c as c4, i as i2 } from "./index-DSP348cK.mjs";
 import { D, L as L4 } from "./index-BRVKhbs6.mjs";
 export {
   A as ActionButton,
@@ -76,6 +76,7 @@ export {
   t as TermsAndConditions,
   m as Tip,
   U as UL,
+  a9 as buildCanonicalUrl,
   b7 as buildPath,
   f2 as formatDate,
   b6 as formatNumber,
@@ -87,7 +88,7 @@ export {
   g2 as getNavigation,
   a7 as getSeededRandomComparator,
   a6 as getSiteName,
-  a9 as isAbsolutePath,
+  c4 as isAbsolutePath,
   i2 as isRelativePath,
   r2 as randomComparator,
   resources,

package/dist/layout/index.cjs

@@ -3,17 +3,17 @@ const jsxRuntime = require("react/jsx-runtime");
 const react = require("@chakra-ui/react");
 const reactI18next = require("react-i18next");
 require("@mdx-js/react");
-const index$1 = require("../index-B4M1IKzL.js");
+const index$1 = require("../index-D-jM-cHx.js");
 require("../index-C6MG_f24.js");
 require("../index-CBRFCYhV.js");
+const icons = require("@chakra-ui/icons");
 require("react-medium-image-zoom");
 const react$1 = require("react");
-const index = require("../index-DzOucsVx.js");
-const icons = require("@chakra-ui/icons");
+const index = require("../index-DhhGhwm2.js");
 require("i18next");
 require("react-markdown");
 const index$2 = require("../index-ov4J7p3D.js");
-const index$3 = require("../index-DgrIJs-a.js");
+const index$3 = require("../index-C3n63_nP.js");
 const Content = ({ children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(react.Box, { as: "section", py: 4, children: /* @__PURE__ */ jsxRuntime.jsx(index.Container, { children }) });
 };

package/dist/layout/index.mjs

@@ -2,17 +2,17 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { Box, Divider, AbsoluteCenter, useColorModeValue, Text, SimpleGrid, Flex, Menu, MenuButton, Button, HStack, Icon, MenuList, MenuItem, Popover, PopoverTrigger, PopoverContent, List, ListItem, Stack, Collapse, useDisclosure, IconButton, Heading } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
 import "@mdx-js/react";
-import { L as Link, a as useSiteContext, u as usePageContext } from "../index-ClIPWZ3z.mjs";
+import { L as Link, a as useSiteContext, u as usePageContext } from "../index-B6wLLS6t.mjs";
 import "../index-BJRvnR8Q.mjs";
 import "../index-RzByAgHO.mjs";
+import { ChevronDownIcon, ChevronRightIcon, CloseIcon, HamburgerIcon, ChevronUpIcon } from "@chakra-ui/icons";
 import "react-medium-image-zoom";
 import { useMemo, forwardRef, useState, useEffect } from "react";
-import { a as Container, c as Logo, d as SocialNetworks, L as LinkButton } from "../index-D9i6mZaH.mjs";
-import { ChevronDownIcon, ChevronRightIcon, CloseIcon, HamburgerIcon, ChevronUpIcon } from "@chakra-ui/icons";
+import { a as Container, c as Logo, d as SocialNetworks, L as LinkButton } from "../index-DqMBmwe5.mjs";
 import "i18next";
 import "react-markdown";
 import { g as getCurrentYear } from "../index-BPthShL-.mjs";
-import { b as buildPath } from "../index-Bph7a3PR.mjs";
+import { b as buildPath } from "../index-DSP348cK.mjs";
 const Content = ({ children }) => {
   return /* @__PURE__ */ jsx(Box, { as: "section", py: 4, children: /* @__PURE__ */ jsx(Container, { children }) });
 };

package/dist/providers/index.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("../index-DXTC3R_J.js");
-const index$1 = require("../index-B4M1IKzL.js");
+const index = require("../index-Ca9tsjT8.js");
+const index$1 = require("../index-D-jM-cHx.js");
 exports.MdxProvider = index.MdxProvider;
 exports.PageProvider = index$1.PageProvider;
 exports.SiteProvider = index$1.SiteProvider;

package/dist/providers/index.mjs

@@ -1,5 +1,5 @@
-import { M } from "../index-D1gNEJUA.mjs";
-import { P, S, u, a } from "../index-ClIPWZ3z.mjs";
+import { M } from "../index-CPbWQKoT.mjs";
+import { P, S, u, a } from "../index-B6wLLS6t.mjs";
 export {
   M as MdxProvider,
   P as PageProvider,

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

@@ -0,0 +1 @@
+export type Nullable<T> = T | null;

package/dist/types/index.d.ts

@@ -1,4 +1,5 @@
 export * from './api';
+export * from './common';
 export * from './components';
 export * from './content';
 export * from './i18n';

package/dist/utils/index.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const index = require("../index-C6MG_f24.js");
-const index$1 = require("../index-CYr1ct1t.js");
+const index$1 = require("../index-Ba_pXx_e.js");
 const index$2 = require("../index-BfITsKAr.js");
 const index$3 = require("../index-ov4J7p3D.js");
-const index$4 = require("../index-DgrIJs-a.js");
+const index$4 = require("../index-C3n63_nP.js");
 const index$5 = require("../index-CbuiYkSg.js");
 exports.Animation = index.Animation;
 exports.getLocale = index$1.getLocale;
@@ -20,6 +20,7 @@ exports.getCurrentMonth = index$3.getCurrentMonth;
 exports.getCurrentYear = index$3.getCurrentYear;
 exports.round = index$3.round;
 exports.toFixedTwo = index$3.toFixedTwo;
+exports.buildCanonicalUrl = index$4.buildCanonicalUrl;
 exports.buildPath = index$4.buildPath;
 exports.isAbsolutePath = index$4.isAbsolutePath;
 exports.isRelativePath = index$4.isRelativePath;

package/dist/utils/index.mjs

@@ -1,13 +1,14 @@
 import { A } from "../index-BJRvnR8Q.mjs";
-import { b, c, g, a } from "../index-cQqALZIW.mjs";
+import { b, c, g, a } from "../index-CJANSiM5.mjs";
 import { g as g2, a as a2, r } from "../index-BeJTy4iY.mjs";
 import { f, b as b2, a as a3, g as g3, r as r2, t } from "../index-BPthShL-.mjs";
-import { b as b3, a as a4, i } from "../index-Bph7a3PR.mjs";
+import { a as a4, b as b3, c as c2, i } from "../index-DSP348cK.mjs";
 import { D, L } from "../index-BRVKhbs6.mjs";
 export {
   A as Animation,
   D as DARK_THEME_COLOR,
   L as LIGHT_THEME_COLOR,
+  a4 as buildCanonicalUrl,
   b3 as buildPath,
   f as formatDate,
   b2 as formatNumber,
@@ -19,7 +20,7 @@ export {
   g as getNavigation,
   a2 as getSeededRandomComparator,
   a as getSiteName,
-  a4 as isAbsolutePath,
+  c2 as isAbsolutePath,
   i as isRelativePath,
   r as randomComparator,
   r2 as round,

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

@@ -1,3 +1,4 @@
 export declare function buildPath(slug: string, parentSlug: string): string;
+export declare function buildCanonicalUrl(domain: string, path: string): string;
 export declare function isRelativePath(path?: string): boolean;
 export declare function isAbsolutePath(path?: string): boolean;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@anywayseo/tools",
   "description": "Shared UI Components and Modules",
-  "version": "5.10.0",
+  "version": "5.11.0",
   "keywords": [
     "react",
     "ui",