@anywayseo/tools 2.2.1 → 2.2.3

package/dist/components/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("../index-Cn_SqfLz.js");
+const index = require("../index-B-J8fcfm.js");
 exports.Author = index.Author;
 exports.BonusCard = index.BonusCard;
 exports.Center = index.Center;

package/dist/components/index.mjs

@@ -1,4 +1,4 @@
-import { A, B, g, C, h, E, F, a, b, G, c, d, i, H, L, j, e, P, k, S, T, f } from "../index-Bc2a2-SP.mjs";
+import { A, B, g, C, h, E, F, a, b, G, c, d, i, H, L, j, e, P, k, S, T, f } from "../index-CAcPXV4F.mjs";
 export {
   A as Author,
   B as BonusCard,

package/dist/components/layout/header/navigation/nav-link/index.d.ts

@@ -1,4 +1,4 @@
-import { ISubNavItem } from '../../../../../types';
-type NavLinkProps = ISubNavItem;
+import { INavItem } from '../../../../../types';
+type NavLinkProps = Omit<INavItem, 'children'>;
 declare const NavLink: import('react').ForwardRefExoticComponent<NavLinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
 export default NavLink;

package/dist/{index-Cn_SqfLz.js → index-B-J8fcfm.js}

@@ -637,22 +637,23 @@ const NavList$1 = ({ path, label, children }) => {
   ] });
 };
 const DesktopNavigation = ({ menu }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "ul", role: "list", gap: 2, p: 0, display: { base: "none", md: "flex" }, children: menu.map((item) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "ul", role: "list", gap: 2, p: 0, display: { base: "none", md: "flex" }, children: menu.map((item, index2) => {
     var _a;
-    return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx(NavList$1, { ...item }) : /* @__PURE__ */ jsxRuntime.jsx(NavLink, { ...item }) }, item.path);
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx(NavList$1, { ...item }) : /* @__PURE__ */ jsxRuntime.jsx(NavLink, { ...item }) }, item.path || index2);
   }) });
 };
+const CHEVRON_DOWN_ICON_SIZE = "1.5rem";
 const NavList = ({ path, label, children, isExpanded, onExpand }) => {
   function handleClick() {
     onExpand(path);
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(react.Stack, { w: "full", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(react.Stack, { flex: 1, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
       react.Flex,
       {
         as: "button",
         p: 2,
-        pe: 1,
+        pr: "3px",
         align: "center",
         justifyContent: "space-between",
         _hover: { textDecoration: "none", color: "brand.400" },
@@ -662,8 +663,8 @@ const NavList = ({ path, label, children, isExpanded, onExpand }) => {
           /* @__PURE__ */ jsxRuntime.jsx(
             icons.ChevronDownIcon,
             {
-              w: 24,
-              h: 24,
+              w: CHEVRON_DOWN_ICON_SIZE,
+              h: CHEVRON_DOWN_ICON_SIZE,
               transform: isExpanded ? "rotate(180deg)" : "",
               transition: "all .25s ease-in-out"
             }
@@ -674,6 +675,8 @@ const NavList = ({ path, label, children, isExpanded, onExpand }) => {
     /* @__PURE__ */ jsxRuntime.jsx(react.Collapse, { in: isExpanded, transition: { enter: { ease: "easeIn" }, exit: { duration: 0.2 } }, children: /* @__PURE__ */ jsxRuntime.jsx(react.List, { ml: 2, pl: 0, borderLeft: 1, borderStyle: "solid", borderColor: react.useColorModeValue("gray.200", "gray.700"), children: children == null ? void 0 : children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "li", role: "listitem", children: /* @__PURE__ */ jsxRuntime.jsx(react.Text, { as: gatsby.Link, to: `${path}${child.path}`, p: 2, fontSize: "sm", children: child.label }) }, child.path)) }) })
   ] });
 };
+const CLOSE_ICON_SIZE = "0.75rem";
+const HAMBURGER_ICON_SIZE = "1rem";
 const MobileNavigation = ({ menu }) => {
   const [selected, setSelected] = react$1.useState(null);
   const { isOpen, onToggle } = react.useDisclosure();
@@ -689,7 +692,7 @@ const MobileNavigation = ({ menu }) => {
     /* @__PURE__ */ jsxRuntime.jsx(
       react.IconButton,
       {
-        icon: isOpen ? /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, { w: 12, h: 12 }) : /* @__PURE__ */ jsxRuntime.jsx(icons.HamburgerIcon, { w: 18, h: 18 }),
+        icon: isOpen ? /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, { w: CLOSE_ICON_SIZE, h: CLOSE_ICON_SIZE }) : /* @__PURE__ */ jsxRuntime.jsx(icons.HamburgerIcon, { w: HAMBURGER_ICON_SIZE, h: HAMBURGER_ICON_SIZE }),
         size: "sm",
         variant: "ghost",
         "aria-label": `${isOpen ? "Close" : "Open"} navigation menu`,
@@ -697,10 +700,22 @@ const MobileNavigation = ({ menu }) => {
         onClick: handleClick
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(react.Collapse, { in: isOpen, animateOpacity: true, children: /* @__PURE__ */ jsxRuntime.jsx(react.Box, { position: "absolute", top: 16, left: 0, right: 0, w: "100vw", px: 2, children: /* @__PURE__ */ jsxRuntime.jsx(react.List, { spacing: 2, p: 2, w: "full", borderRadius: "md", boxShadow: "md", bg: background, children: menu.map((item) => {
-      var _a;
-      return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx(NavList, { ...item, isExpanded: item.path === selected, onExpand: handleExpand }) : /* @__PURE__ */ jsxRuntime.jsx(NavLink, { ...item }) }, item.path);
-    }) }) }) })
+    /* @__PURE__ */ jsxRuntime.jsx(react.Collapse, { in: isOpen, animateOpacity: true, children: /* @__PURE__ */ jsxRuntime.jsx(react.Box, { position: "absolute", top: 16, left: 0, right: 0, w: "100vw", px: 2, children: /* @__PURE__ */ jsxRuntime.jsx(
+      react.List,
+      {
+        spacing: 2,
+        p: 2,
+        boxShadow: "md",
+        borderWidth: "1px",
+        borderColor: react.useColorModeValue("gray.200", "gray.700"),
+        borderRadius: "md",
+        bg: background,
+        children: menu.map((item, index2) => {
+          var _a;
+          return /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx(NavList, { ...item, isExpanded: item.path === selected, onExpand: handleExpand }) : /* @__PURE__ */ jsxRuntime.jsx(NavLink, { ...item }) }, item.path || index2);
+        })
+      }
+    ) }) })
   ] });
 };
 const Navigation = ({ menu }) => {

package/dist/{index-Bc2a2-SP.mjs → index-CAcPXV4F.mjs}

@@ -636,22 +636,23 @@ const NavList$1 = ({ path, label, children }) => {
   ] });
 };
 const DesktopNavigation = ({ menu }) => {
-  return /* @__PURE__ */ jsx(Flex, { as: "ul", role: "list", gap: 2, p: 0, display: { base: "none", md: "flex" }, children: menu.map((item) => {
+  return /* @__PURE__ */ jsx(Flex, { as: "ul", role: "list", gap: 2, p: 0, display: { base: "none", md: "flex" }, children: menu.map((item, index) => {
     var _a;
-    return /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx(NavList$1, { ...item }) : /* @__PURE__ */ jsx(NavLink, { ...item }) }, item.path);
+    return /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx(NavList$1, { ...item }) : /* @__PURE__ */ jsx(NavLink, { ...item }) }, item.path || index);
   }) });
 };
+const CHEVRON_DOWN_ICON_SIZE = "1.5rem";
 const NavList = ({ path, label, children, isExpanded, onExpand }) => {
   function handleClick() {
     onExpand(path);
   }
-  return /* @__PURE__ */ jsxs(Stack, { w: "full", children: [
+  return /* @__PURE__ */ jsxs(Stack, { flex: 1, children: [
     /* @__PURE__ */ jsxs(
       Flex,
       {
         as: "button",
         p: 2,
-        pe: 1,
+        pr: "3px",
         align: "center",
         justifyContent: "space-between",
         _hover: { textDecoration: "none", color: "brand.400" },
@@ -661,8 +662,8 @@ const NavList = ({ path, label, children, isExpanded, onExpand }) => {
           /* @__PURE__ */ jsx(
             ChevronDownIcon,
             {
-              w: 24,
-              h: 24,
+              w: CHEVRON_DOWN_ICON_SIZE,
+              h: CHEVRON_DOWN_ICON_SIZE,
               transform: isExpanded ? "rotate(180deg)" : "",
               transition: "all .25s ease-in-out"
             }
@@ -673,6 +674,8 @@ 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) => /* @__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 }) }, child.path)) }) })
   ] });
 };
+const CLOSE_ICON_SIZE = "0.75rem";
+const HAMBURGER_ICON_SIZE = "1rem";
 const MobileNavigation = ({ menu }) => {
   const [selected, setSelected] = useState(null);
   const { isOpen, onToggle } = useDisclosure();
@@ -688,7 +691,7 @@ const MobileNavigation = ({ menu }) => {
     /* @__PURE__ */ jsx(
       IconButton,
       {
-        icon: isOpen ? /* @__PURE__ */ jsx(CloseIcon, { w: 12, h: 12 }) : /* @__PURE__ */ jsx(HamburgerIcon, { w: 18, h: 18 }),
+        icon: isOpen ? /* @__PURE__ */ jsx(CloseIcon, { w: CLOSE_ICON_SIZE, h: CLOSE_ICON_SIZE }) : /* @__PURE__ */ jsx(HamburgerIcon, { w: HAMBURGER_ICON_SIZE, h: HAMBURGER_ICON_SIZE }),
         size: "sm",
         variant: "ghost",
         "aria-label": `${isOpen ? "Close" : "Open"} navigation menu`,
@@ -696,10 +699,22 @@ const MobileNavigation = ({ menu }) => {
         onClick: handleClick
       }
     ),
-    /* @__PURE__ */ jsx(Collapse, { in: isOpen, animateOpacity: true, children: /* @__PURE__ */ jsx(Box, { position: "absolute", top: 16, left: 0, right: 0, w: "100vw", px: 2, children: /* @__PURE__ */ jsx(List$1, { spacing: 2, p: 2, w: "full", borderRadius: "md", boxShadow: "md", bg: background, children: menu.map((item) => {
-      var _a;
-      return /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx(NavList, { ...item, isExpanded: item.path === selected, onExpand: handleExpand }) : /* @__PURE__ */ jsx(NavLink, { ...item }) }, item.path);
-    }) }) }) })
+    /* @__PURE__ */ jsx(Collapse, { in: isOpen, animateOpacity: true, children: /* @__PURE__ */ jsx(Box, { position: "absolute", top: 16, left: 0, right: 0, w: "100vw", px: 2, children: /* @__PURE__ */ jsx(
+      List$1,
+      {
+        spacing: 2,
+        p: 2,
+        boxShadow: "md",
+        borderWidth: "1px",
+        borderColor: useColorModeValue("gray.200", "gray.700"),
+        borderRadius: "md",
+        bg: background,
+        children: menu.map((item, index) => {
+          var _a;
+          return /* @__PURE__ */ jsx(Flex, { as: "li", role: "listitem", children: ((_a = item.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx(NavList, { ...item, isExpanded: item.path === selected, onExpand: handleExpand }) : /* @__PURE__ */ jsx(NavLink, { ...item }) }, item.path || index);
+        })
+      }
+    ) }) })
   ] });
 };
 const Navigation = ({ menu }) => {

package/dist/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const index = require("./index-Cn_SqfLz.js");
+const index = require("./index-B-J8fcfm.js");
 const index$1 = require("./index-IpSV-c71.js");
 const i18n$1 = require("./index-DCIXk-YH.js");
 const index$2 = require("./index-BWuTDC6H.js");

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { A, B, g, C, h, E, F, a, b, G, c, d, i, H, L, j, e, P, k, S, T, f } from "./index-Bc2a2-SP.mjs";
+import { A, B, g, C, h, E, F, a, b, G, c, d, i, H, L, j, e, P, k, S, T, f } from "./index-CAcPXV4F.mjs";
 import { u } from "./index-xuSxvz5z.mjs";
 import { a as a2, G as G2, r } from "./index-DxLcykuT.mjs";
 import { M } from "./index-wbMOJRW_.mjs";

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

@@ -1,10 +1,13 @@
 type Path = `/${string}`;
+type EmptyPath = '';
 type IndexPath = '/';
 export interface INavItem<P extends Path = Path> {
-    path: P;
+    path: P | EmptyPath;
     label: string;
     children?: ISubNavItem[];
 }
-export interface ISubNavItem<P extends Path = Path> extends Omit<INavItem<P | IndexPath>, 'children'> {
+export interface ISubNavItem<P extends Path = Path> {
+    path: P | IndexPath;
+    label: string;
 }
 export {};

package/package.json

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