@umami/shiso 0.39.0 → 0.41.0

package/dist/index.js

@@ -1,5 +1,4 @@
 "use strict";
-"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -28,7 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/components/index.ts
+// src/index.ts
 var index_exports = {};
 __export(index_exports, {
   Blog: () => Blog,
@@ -36,8 +35,6 @@ __export(index_exports, {
   Shiso: () => Shiso
 });
 module.exports = __toCommonJS(index_exports);
-var import_styles = require("@umami/react-zen/styles.css");
-var import_github_dark = require("highlight.js/styles/github-dark.css");
 
 // src/components/Blog.tsx
 var import_react_zen11 = require("@umami/react-zen");
@@ -130,6 +127,7 @@ var import_react3 = require("react");
 var import_react_zen3 = require("@umami/react-zen");
 var import_classnames2 = __toESM(require("classnames"));
 var import_navigation = require("next/navigation");
+var import_link = __toESM(require("next/link"));
 
 // css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
 var SideNav_default = { "nav": "SideNav_nav__NTkxM", "sticky": "SideNav_sticky__YTdmY", "item": "SideNav_item__MDk5Z", "selected": "SideNav_selected__ZjVkZ", "header": "SideNav_header__Y2YyY" };
@@ -169,7 +167,7 @@ function SideNav({
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.Text, { weight: "bold", className: SideNav_default.header, children: section }),
           pages.map(({ label: text, url }, index) => {
             return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-              "a",
+              import_link.default,
               {
                 className: (0, import_classnames2.default)(SideNav_default.item, {
                   [SideNav_default.selected]: url === pathname
@@ -189,19 +187,20 @@ function SideNav({
 // src/components/TopNav.tsx
 var import_navigation2 = require("next/navigation");
 var import_react_zen4 = require("@umami/react-zen");
+var import_link2 = __toESM(require("next/link"));
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function TopNav({ tabs }) {
   const pathname = (0, import_navigation2.usePathname)();
   const tab = tabs?.find(({ id, url }) => id !== "docs" ? pathname.startsWith(url) : false);
   const selected = tab?.id || "docs";
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_zen4.Tabs, { selectedKey: selected, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_zen4.TabList, { items: tabs, children: ({ id, label, url }) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_zen4.Tab, { id, href: url, children: label });
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_zen4.Tab, { id, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_link2.default, { href: url, children: label }) });
   } }) });
 }
 
 // src/components/DocContent.tsx
 var import_react_zen6 = require("@umami/react-zen");
-var import_link = __toESM(require("next/link"));
+var import_link3 = __toESM(require("next/link"));
 
 // src/components/Markdown.tsx
 var import_react_zen5 = require("@umami/react-zen");
@@ -263,7 +262,7 @@ var NavigationButton = ({
   if (!url || !label) {
     return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Box, {});
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_link.default, { href: url, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react_zen6.Row, { alignItems: "center", gap: "3", marginY: "3", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_link3.default, { href: url, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react_zen6.Row, { alignItems: "center", gap: "3", marginY: "3", children: [
     isPrev && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Icon, { size: "sm", rotate: 180, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Icons.Chevron, {}) }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Text, { size: "3", weight: "bold", children: label }),
     !isPrev && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Icon, { size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Icons.Chevron, {}) })
@@ -373,7 +372,7 @@ var import_react_zen9 = require("@umami/react-zen");
 
 // src/components/Card.tsx
 var import_react_zen8 = require("@umami/react-zen");
-var import_link2 = __toESM(require("next/link"));
+var import_link4 = __toESM(require("next/link"));
 var import_date_fns = require("date-fns");
 var import_jsx_runtime8 = require("react/jsx-runtime");
 function Card({ title, description, date, author, url, image }) {
@@ -388,10 +387,10 @@ function Card({ title, description, date, author, url, image }) {
         ] })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { gap: "4", flexGrow: "1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Heading, { size: "4", as: "header", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_link2.default, { href: url, children: title }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Heading, { size: "4", as: "header", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_link4.default, { href: url, children: title }) }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Box, { marginY: "5", as: "p", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { color: "muted", size: "3", children: description }) })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Button, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_link2.default, { href: url, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Button, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_link4.default, { href: url, children: [
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { children: "Read more" }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Icons.Arrow, {}) })
       ] }) })
@@ -406,7 +405,6 @@ function Blogs({ content, config }) {
     const { meta, code, anchors, slug } = content;
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Blog, { ...meta, code, anchors });
   }
-  console.log({ content });
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_zen9.Grid, { gap: "5", columns: "repeat(auto-fit, minmax(400px, 1fr)", children: content?.sort((a, b) => new Date(b.meta.date).getTime() - new Date(a.meta.date).getTime()).map(({ meta, slug }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Card, { url: `/blog/${slug}`, ...meta }, slug)) });
 }
 
@@ -422,7 +420,7 @@ function Shiso({ type, config, content, components, templates }) {
   if (!Component) {
     return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h1", { children: `Component not found for type: ${type}` });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ShisoContext.Provider, { value: { type, config, content, components, templates }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react6.MDXProvider, { components: { ...components, pre: CodeBlock, code: import_react_zen10.Code }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, { config, content }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ShisoContext.Provider, { value: { type, config, content, components, templates }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react6.MDXProvider, { components: { pre: CodeBlock, code: import_react_zen10.Code, ...components }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, { config, content }) }) });
 }
 
 // src/components/hooks/useShiso.ts

package/dist/index.mjs

@@ -1,11 +1,5 @@
-"use client";
-
-// src/components/index.ts
-import "@umami/react-zen/styles.css";
-import "highlight.js/styles/github-dark.css";
-
 // src/components/Blog.tsx
-import { Heading as Heading5, Box as Box8, Text as Text6, Row as Row5, Column as Column5, Image as Image2 } from "@umami/react-zen";
+import { Heading as Heading5, Box as Box7, Text as Text6, Row as Row5, Column as Column5, Image as Image2 } from "@umami/react-zen";
 import { format as format2 } from "date-fns";
 
 // src/components/PageLinks.tsx
@@ -89,7 +83,7 @@ function CodeBlock(props) {
 
 // src/components/Docs.tsx
 import {
-  Box as Box5,
+  Box as Box4,
   Heading as Heading2,
   Button,
   Icon as Icon3,
@@ -106,6 +100,7 @@ import { useEffect as useEffect2, useState as useState3 } from "react";
 import { Text as Text2, Column as Column2 } from "@umami/react-zen";
 import classNames2 from "classnames";
 import { usePathname } from "next/navigation";
+import Link from "next/link";
 
 // css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
 var SideNav_default = { "nav": "SideNav_nav__NTkxM", "sticky": "SideNav_sticky__YTdmY", "item": "SideNav_item__MDk5Z", "selected": "SideNav_selected__ZjVkZ", "header": "SideNav_header__Y2YyY" };
@@ -145,7 +140,7 @@ function SideNav({
           /* @__PURE__ */ jsx3(Text2, { weight: "bold", className: SideNav_default.header, children: section }),
           pages.map(({ label: text, url }, index) => {
             return /* @__PURE__ */ jsx3(
-              "a",
+              Link,
               {
                 className: classNames2(SideNav_default.item, {
                   [SideNav_default.selected]: url === pathname
@@ -165,22 +160,23 @@ function SideNav({
 // src/components/TopNav.tsx
 import { usePathname as usePathname2 } from "next/navigation";
 import { Tabs, TabList, Tab } from "@umami/react-zen";
+import Link2 from "next/link";
 import { jsx as jsx4 } from "react/jsx-runtime";
 function TopNav({ tabs }) {
   const pathname = usePathname2();
   const tab = tabs?.find(({ id, url }) => id !== "docs" ? pathname.startsWith(url) : false);
   const selected = tab?.id || "docs";
   return /* @__PURE__ */ jsx4(Tabs, { selectedKey: selected, children: /* @__PURE__ */ jsx4(TabList, { items: tabs, children: ({ id, label, url }) => {
-    return /* @__PURE__ */ jsx4(Tab, { id, href: url, children: label });
+    return /* @__PURE__ */ jsx4(Tab, { id, children: /* @__PURE__ */ jsx4(Link2, { href: url, children: label }) });
   } }) });
 }
 
 // src/components/DocContent.tsx
-import { Heading, Box as Box4, Text as Text3, Row, Icon as Icon2, Icons as Icons2 } from "@umami/react-zen";
-import Link from "next/link";
+import { Heading, Box as Box3, Text as Text3, Row, Icon as Icon2, Icons as Icons2 } from "@umami/react-zen";
+import Link3 from "next/link";
 
 // src/components/Markdown.tsx
-import { Box as Box3 } from "@umami/react-zen";
+import { Box as Box2 } from "@umami/react-zen";
 import { runSync } from "@mdx-js/mdx";
 import { useMDXComponents } from "@mdx-js/react";
 import * as runtime from "react/jsx-runtime";
@@ -213,13 +209,13 @@ function Markdown({ code }) {
   if (!Component) {
     return null;
   }
-  return /* @__PURE__ */ jsx5(Box3, { className: Markdown_default.content, children: /* @__PURE__ */ jsx5(Component, { components }) });
+  return /* @__PURE__ */ jsx5(Box2, { className: Markdown_default.content, children: /* @__PURE__ */ jsx5(Component, { components }) });
 }
 
 // src/components/DocContent.tsx
 import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 function DocContent({ section, title, description, code, next, prev }) {
-  return /* @__PURE__ */ jsxs5(Box4, { flexGrow: "1", children: [
+  return /* @__PURE__ */ jsxs5(Box3, { flexGrow: "1", children: [
     section && /* @__PURE__ */ jsx6(Text3, { color: "primary", weight: "bold", children: section }),
     title && /* @__PURE__ */ jsx6(Heading, { size: "2", as: "h1", marginY: "3", children: title }),
     description && /* @__PURE__ */ jsx6(Text3, { color: "muted", size: "3", children: description }),
@@ -236,9 +232,9 @@ var NavigationButton = ({
   isPrev
 }) => {
   if (!url || !label) {
-    return /* @__PURE__ */ jsx6(Box4, {});
+    return /* @__PURE__ */ jsx6(Box3, {});
   }
-  return /* @__PURE__ */ jsx6(Link, { href: url, children: /* @__PURE__ */ jsxs5(Row, { alignItems: "center", gap: "3", marginY: "3", children: [
+  return /* @__PURE__ */ jsx6(Link3, { href: url, children: /* @__PURE__ */ jsxs5(Row, { alignItems: "center", gap: "3", marginY: "3", children: [
     isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", rotate: 180, children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) }),
     /* @__PURE__ */ jsx6(Text3, { size: "3", weight: "bold", children: label }),
     !isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) })
@@ -308,11 +304,11 @@ function Docs({ content, config }) {
     /* @__PURE__ */ jsx7(Modal, { position: "bottom", offset: "40px", children: /* @__PURE__ */ jsx7(Dialog, { variant: "sheet", children: ({ close }) => {
       return /* @__PURE__ */ jsxs6(Fragment, { children: [
         /* @__PURE__ */ jsx7(Row2, { justifyContent: "flex-end", children: /* @__PURE__ */ jsx7(Button, { onPress: () => close(), variant: "quiet", children: /* @__PURE__ */ jsx7(Icon3, { size: "sm", children: /* @__PURE__ */ jsx7(Icons3.Close, {}) }) }) }),
-        /* @__PURE__ */ jsx7(Box5, { height: "100%", overflow: "auto", children: /* @__PURE__ */ jsx7(SideNav, { tabs, navigation }) })
+        /* @__PURE__ */ jsx7(Box4, { height: "100%", overflow: "auto", children: /* @__PURE__ */ jsx7(SideNav, { tabs, navigation }) })
       ] });
     } }) })
   ] });
-  return /* @__PURE__ */ jsxs6(Box5, { flexGrow: "1", children: [
+  return /* @__PURE__ */ jsxs6(Box4, { flexGrow: "1", children: [
     /* @__PURE__ */ jsx7(Row2, { display: menuDisplay, justifyContent: "flex-end", children: /* @__PURE__ */ jsx7(MobileMenuButton, {}) }),
     tabs && /* @__PURE__ */ jsx7(TopNav, { tabs }),
     /* @__PURE__ */ jsxs6(Row2, { gap: "6", children: [
@@ -347,13 +343,13 @@ function Docs({ content, config }) {
 import { Grid } from "@umami/react-zen";
 
 // src/components/Card.tsx
-import { Box as Box6, Image, Column as Column3, Row as Row3, Heading as Heading3, Text as Text5, Button as Button2, Icon as Icon4, Icons as Icons4 } from "@umami/react-zen";
-import Link2 from "next/link";
+import { Box as Box5, Image, Column as Column3, Row as Row3, Heading as Heading3, Text as Text5, Button as Button2, Icon as Icon4, Icons as Icons4 } from "@umami/react-zen";
+import Link4 from "next/link";
 import { format } from "date-fns";
 import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 function Card({ title, description, date, author, url, image }) {
   return /* @__PURE__ */ jsxs7(Column3, { borderSize: "1", borderRadius: "3", overflow: "hidden", children: [
-    image && /* @__PURE__ */ jsx8(Box6, { height: "240px", children: /* @__PURE__ */ jsx8(Image, { src: image, alt: title, objectFit: "cover" }) }),
+    image && /* @__PURE__ */ jsx8(Box5, { height: "240px", children: /* @__PURE__ */ jsx8(Image, { src: image, alt: title, objectFit: "cover" }) }),
     /* @__PURE__ */ jsxs7(Column3, { padding: "6", gap: "4", flexGrow: "1", children: [
       /* @__PURE__ */ jsxs7(Row3, { justifyContent: "space-between", children: [
         /* @__PURE__ */ jsx8(Text5, { color: "muted", children: date && format(new Date(date), "PP") }),
@@ -363,10 +359,10 @@ function Card({ title, description, date, author, url, image }) {
         ] })
       ] }),
       /* @__PURE__ */ jsxs7(Column3, { gap: "4", flexGrow: "1", children: [
-        /* @__PURE__ */ jsx8(Heading3, { size: "4", as: "header", children: /* @__PURE__ */ jsx8(Link2, { href: url, children: title }) }),
-        /* @__PURE__ */ jsx8(Box6, { marginY: "5", as: "p", children: /* @__PURE__ */ jsx8(Text5, { color: "muted", size: "3", children: description }) })
+        /* @__PURE__ */ jsx8(Heading3, { size: "4", as: "header", children: /* @__PURE__ */ jsx8(Link4, { href: url, children: title }) }),
+        /* @__PURE__ */ jsx8(Box5, { marginY: "5", as: "p", children: /* @__PURE__ */ jsx8(Text5, { color: "muted", size: "3", children: description }) })
       ] }),
-      /* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs7(Link2, { href: url, children: [
+      /* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs7(Link4, { href: url, children: [
         /* @__PURE__ */ jsx8(Text5, { children: "Read more" }),
         /* @__PURE__ */ jsx8(Icon4, { children: /* @__PURE__ */ jsx8(Icons4.Arrow, {}) })
       ] }) })
@@ -381,7 +377,6 @@ function Blogs({ content, config }) {
     const { meta, code, anchors, slug } = content;
     return /* @__PURE__ */ jsx9(Blog, { ...meta, code, anchors });
   }
-  console.log({ content });
   return /* @__PURE__ */ jsx9(Grid, { gap: "5", columns: "repeat(auto-fit, minmax(400px, 1fr)", children: content?.sort((a, b) => new Date(b.meta.date).getTime() - new Date(a.meta.date).getTime()).map(({ meta, slug }) => /* @__PURE__ */ jsx9(Card, { url: `/blog/${slug}`, ...meta }, slug)) });
 }
 
@@ -397,7 +392,7 @@ function Shiso({ type, config, content, components, templates }) {
   if (!Component) {
     return /* @__PURE__ */ jsx10("h1", { children: `Component not found for type: ${type}` });
   }
-  return /* @__PURE__ */ jsx10(ShisoContext.Provider, { value: { type, config, content, components, templates }, children: /* @__PURE__ */ jsx10(MDXProvider, { components: { ...components, pre: CodeBlock, code: Code }, children: /* @__PURE__ */ jsx10(Component, { config, content }) }) });
+  return /* @__PURE__ */ jsx10(ShisoContext.Provider, { value: { type, config, content, components, templates }, children: /* @__PURE__ */ jsx10(MDXProvider, { components: { pre: CodeBlock, code: Code, ...components }, children: /* @__PURE__ */ jsx10(Component, { config, content }) }) });
 }
 
 // src/components/hooks/useShiso.ts
@@ -420,7 +415,7 @@ function Blog({ title, code, author, date, image, anchors }) {
     xl: "block"
   };
   return /* @__PURE__ */ jsxs8(Column5, { gap: "8", maxWidth: "960px", style: { margin: "0 auto" }, children: [
-    /* @__PURE__ */ jsx11(Box8, { flexGrow: "1", paddingY: "6", children: title && /* @__PURE__ */ jsx11(Heading5, { size: "1", as: "h1", align: "center", children: title }) }),
+    /* @__PURE__ */ jsx11(Box7, { flexGrow: "1", paddingY: "6", children: title && /* @__PURE__ */ jsx11(Heading5, { size: "1", as: "h1", align: "center", children: title }) }),
     /* @__PURE__ */ jsxs8(Row5, { justifyContent: "space-between", children: [
       /* @__PURE__ */ jsx11(Text6, { color: "muted", children: date && format2(new Date(date), "PPP") }),
       /* @__PURE__ */ jsxs8(Text6, { color: "muted", children: [
@@ -428,7 +423,7 @@ function Blog({ title, code, author, date, image, anchors }) {
         author
       ] })
     ] }),
-    image && /* @__PURE__ */ jsx11(Box8, { height: "480px", children: /* @__PURE__ */ jsx11(Image2, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
+    image && /* @__PURE__ */ jsx11(Box7, { height: "480px", children: /* @__PURE__ */ jsx11(Image2, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
     /* @__PURE__ */ jsxs8(Row5, { gap: "6", children: [
       /* @__PURE__ */ jsx11(Markdown, { code }),
       /* @__PURE__ */ jsx11(PageLinks, { display: linksDisplay, items: anchors, style: { top } })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umami/shiso",
-  "version": "0.39.0",
+  "version": "0.41.0",
   "description": "A content layer for Next.js",
   "homepage": "https://umami.is/shiso",
   "repository": {
@@ -27,7 +27,8 @@
     "server": "tsc -p tsconfig.server.json",
     "esbuild": "node esbuild.mjs",
     "dts": "node dts.mjs",
-    "bundle": "npm-run-all components server dts esbuild"
+    "css": "node css.mjs",
+    "bundle": "npm-run-all components server dts esbuild css"
   },
   "lint-staged": {
     "**/*.{js,jsx,ts,tsx}": [