@umami/shiso 0.37.0 → 0.38.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.css +12 -19
  2. package/dist/index.js +37 -28
  3. package/dist/index.mjs +67 -68
  4. package/package.json +2 -2
package/dist/index.css CHANGED
@@ -72,60 +72,53 @@ pre.CodeBlock_container__ZTkxY code {
72
72
  }
73
73
 
74
74
  /* virtual-css:css:62c31e195181c97259fa56b13d20ea6d */
75
- .SideNav_nav__OWYwN {
75
+ .SideNav_nav__NTkxM {
76
76
  overflow-y: auto;
77
77
  min-width: 240px;
78
78
  }
79
- .SideNav_nav__OWYwN::-webkit-scrollbar {
79
+ .SideNav_nav__NTkxM::-webkit-scrollbar {
80
80
  width: 15px;
81
81
  background: transparent;
82
82
  display: none;
83
83
  }
84
- .SideNav_nav__OWYwN:hover::-webkit-scrollbar {
84
+ .SideNav_nav__NTkxM:hover::-webkit-scrollbar {
85
85
  display: block;
86
86
  }
87
- .SideNav_nav__OWYwN::-webkit-scrollbar-track {
87
+ .SideNav_nav__NTkxM::-webkit-scrollbar-track {
88
88
  border: 7px solid rgba(0, 0, 0, 0);
89
89
  background-color: var(--border-color);
90
90
  background-clip: padding-box;
91
91
  }
92
- .SideNav_nav__OWYwN::-webkit-scrollbar-thumb {
92
+ .SideNav_nav__NTkxM::-webkit-scrollbar-thumb {
93
93
  border: 7px solid rgba(0, 0, 0, 0);
94
94
  background-color: var(--primary-color);
95
95
  background-clip: padding-box;
96
96
  }
97
- .SideNav_nav__OWYwN::-webkit-scrollbar-thumb:hover {
97
+ .SideNav_nav__NTkxM::-webkit-scrollbar-thumb:hover {
98
98
  border: 5px solid rgba(0, 0, 0, 0);
99
99
  background-color: var(--primary-color);
100
100
  background-clip: padding-box;
101
101
  }
102
- .SideNav_nav__OWYwN.SideNav_sticky__OGNhY {
102
+ .SideNav_nav__NTkxM.SideNav_sticky__YTdmY {
103
103
  position: sticky;
104
104
  top: var(--spacing-8);
105
105
  }
106
- .SideNav_nav__OWYwN .SideNav_item__NTA5Z {
106
+ .SideNav_nav__NTkxM .SideNav_item__MDk5Z {
107
107
  color: var(--font-color-muted);
108
- border-radius: 0;
109
108
  border-left: 1px solid var(--border-color);
110
- outline: none;
111
- }
112
- .SideNav_nav__OWYwN .SideNav_item__NTA5Z a {
113
- color: currentColor;
114
- width: 100%;
115
- padding: var(--padding-y) var(--padding-x);
109
+ padding: var(--padding);
116
110
  text-decoration: none;
117
111
  }
118
- .SideNav_nav__OWYwN .SideNav_item__NTA5Z a:hover {
112
+ .SideNav_nav__NTkxM .SideNav_item__MDk5Z:hover {
119
113
  color: var(--primary-color);
120
114
  }
121
- .SideNav_nav__OWYwN .SideNav_item__NTA5Z.SideNav_selected__NWU1Y {
115
+ .SideNav_nav__NTkxM .SideNav_item__MDk5Z.SideNav_selected__ZjVkZ {
122
116
  color: var(--font-color);
123
117
  font-weight: 500;
124
118
  border-color: var(--primary-color);
125
119
  background-color: var(--highlight-color);
126
- border-left: 1px solid var(--primary-color);
127
120
  }
128
- .SideNav_items__YjBjM header {
121
+ .SideNav_header__Y2YyY {
129
122
  padding: var(--padding-y) 0;
130
123
  }
131
124
 
package/dist/index.js CHANGED
@@ -132,7 +132,7 @@ var import_classnames2 = __toESM(require("classnames"));
132
132
  var import_navigation = require("next/navigation");
133
133
 
134
134
  // css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
135
- var SideNav_default = { "nav": "SideNav_nav__OWYwN", "sticky": "SideNav_sticky__OGNhY", "item": "SideNav_item__NTA5Z", "selected": "SideNav_selected__NWU1Y", "items": "SideNav_items__YjBjM" };
135
+ var SideNav_default = { "nav": "SideNav_nav__NTkxM", "sticky": "SideNav_sticky__YTdmY", "item": "SideNav_item__MDk5Z", "selected": "SideNav_selected__ZjVkZ", "header": "SideNav_header__Y2YyY" };
136
136
 
137
137
  // src/components/SideNav.tsx
138
138
  var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -164,20 +164,23 @@ function SideNav({
164
164
  id: "shiso_docs_sidenav",
165
165
  className: (0, import_classnames2.default)(SideNav_default.nav, isSticky && SideNav_default.sticky, className),
166
166
  style: { ...style, height },
167
- children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.List, { items: navigation, "aria-label": "nav", children: menu.map(({ section, pages }) => {
168
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.ListSection, { title: section, className: SideNav_default.items, children: pages.map(({ label: text, url }, index) => {
169
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
170
- import_react_zen3.ListItem,
171
- {
172
- className: (0, import_classnames2.default)(SideNav_default.item, {
173
- [SideNav_default.selected]: url === pathname
174
- }),
175
- href: url,
176
- children: text
177
- },
178
- index
179
- );
180
- }) }, section);
167
+ children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.Column, { "aria-label": "nav", gap: "6", children: menu.map(({ section, pages }) => {
168
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react_zen3.Column, { title: section, className: SideNav_default.items, children: [
169
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.Text, { weight: "bold", className: SideNav_default.header, children: section }),
170
+ pages.map(({ label: text, url }, index) => {
171
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
172
+ "a",
173
+ {
174
+ className: (0, import_classnames2.default)(SideNav_default.item, {
175
+ [SideNav_default.selected]: url === pathname
176
+ }),
177
+ href: url,
178
+ children: text
179
+ },
180
+ index
181
+ );
182
+ })
183
+ ] }, section);
181
184
  }) })
182
185
  }
183
186
  );
@@ -241,7 +244,7 @@ function Markdown({ code }) {
241
244
  // src/components/DocContent.tsx
242
245
  var import_jsx_runtime6 = require("react/jsx-runtime");
243
246
  function DocContent({ section, title, description, code, next, prev }) {
244
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react_zen6.Box, { flexGrow: 1, children: [
247
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react_zen6.Box, { flexGrow: "1", children: [
245
248
  section && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Text, { color: "primary", weight: "bold", children: section }),
246
249
  title && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Heading, { size: "2", as: "h1", marginY: "3", children: title }),
247
250
  description && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Text, { color: "muted", size: "3", children: description }),
@@ -376,14 +379,17 @@ var import_jsx_runtime8 = require("react/jsx-runtime");
376
379
  function Card({ title, description, date, author, url, image }) {
377
380
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { borderSize: "1", borderRadius: "3", overflow: "hidden", children: [
378
381
  image && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Box, { height: "240px", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Image, { src: image, alt: title, objectFit: "cover" }) }),
379
- /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { padding: "6", gap: "4", flexGrow: 1, children: [
380
- /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { gap: "4", flexGrow: 1, children: [
382
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { padding: "6", gap: "4", flexGrow: "1", children: [
383
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Row, { justifyContent: "space-between", children: [
384
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { color: "muted", children: date && (0, import_date_fns.format)(new Date(date), "PP") }),
385
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Text, { color: "muted", children: [
386
+ "Posted by ",
387
+ author
388
+ ] })
389
+ ] }),
390
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { gap: "4", flexGrow: "1", children: [
381
391
  /* @__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 }) }),
382
- /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Row, { justifyContent: "space-between", children: [
383
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { color: "muted", children: date && (0, import_date_fns.format)(new Date(date), "PP") }),
384
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { color: "muted", children: author })
385
- ] }),
386
- /* @__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, { size: "3", children: description }) })
392
+ /* @__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 }) })
387
393
  ] }),
388
394
  /* @__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: [
389
395
  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { children: "Read more" }),
@@ -438,13 +444,16 @@ function Blog({ title, code, author, date, image, anchors }) {
438
444
  lg: "block",
439
445
  xl: "block"
440
446
  };
441
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react_zen11.Column, { gap: "8", maxWidth: "900px", style: { margin: "0 auto" }, children: [
442
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Box, { flexGrow: 1, children: title && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Heading, { size: "1", as: "h1", align: "center", children: title }) }),
443
- image && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Box, { height: "480px", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Image, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
447
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react_zen11.Column, { gap: "8", maxWidth: "960px", style: { margin: "0 auto" }, children: [
448
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Box, { flexGrow: "1", paddingY: "6", children: title && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Heading, { size: "1", as: "h1", align: "center", children: title }) }),
444
449
  /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react_zen11.Row, { justifyContent: "space-between", children: [
445
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Text, { children: author }),
446
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Text, { children: date && (0, import_date_fns2.format)(new Date(date), "PP") })
450
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Text, { color: "muted", children: date && (0, import_date_fns2.format)(new Date(date), "PPP") }),
451
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react_zen11.Text, { color: "muted", children: [
452
+ "Posted by ",
453
+ author
454
+ ] })
447
455
  ] }),
456
+ image && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Box, { height: "480px", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_zen11.Image, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
448
457
  /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react_zen11.Row, { gap: "6", children: [
449
458
  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Markdown, { code }),
450
459
  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(PageLinks, { display: linksDisplay, items: anchors, style: { top } })
package/dist/index.mjs CHANGED
@@ -5,7 +5,7 @@ import "@umami/react-zen/styles.css";
5
5
  import "highlight.js/styles/github-dark.css";
6
6
 
7
7
  // src/components/Blog.tsx
8
- import { Heading as Heading5, Box as Box8, Text as Text5, Row as Row5, Column as Column5, Image as Image2 } from "@umami/react-zen";
8
+ import { Heading as Heading5, Box as Box8, Text as Text6, Row as Row5, Column as Column5, Image as Image2 } from "@umami/react-zen";
9
9
  import { format as format2 } from "date-fns";
10
10
 
11
11
  // src/components/PageLinks.tsx
@@ -98,20 +98,20 @@ import {
98
98
  Modal,
99
99
  DialogTrigger,
100
100
  Dialog,
101
- Text as Text3
101
+ Text as Text4
102
102
  } from "@umami/react-zen";
103
103
 
104
104
  // src/components/SideNav.tsx
105
105
  import { useEffect as useEffect2, useState as useState3 } from "react";
106
- import { Column as Column2, List, ListItem, ListSection } from "@umami/react-zen";
106
+ import { Text as Text2, Column as Column2 } from "@umami/react-zen";
107
107
  import classNames2 from "classnames";
108
108
  import { usePathname } from "next/navigation";
109
109
 
110
110
  // css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
111
- var SideNav_default = { "nav": "SideNav_nav__OWYwN", "sticky": "SideNav_sticky__OGNhY", "item": "SideNav_item__NTA5Z", "selected": "SideNav_selected__NWU1Y", "items": "SideNav_items__YjBjM" };
111
+ var SideNav_default = { "nav": "SideNav_nav__NTkxM", "sticky": "SideNav_sticky__YTdmY", "item": "SideNav_item__MDk5Z", "selected": "SideNav_selected__ZjVkZ", "header": "SideNav_header__Y2YyY" };
112
112
 
113
113
  // src/components/SideNav.tsx
114
- import { jsx as jsx3 } from "react/jsx-runtime";
114
+ import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
115
115
  function SideNav({
116
116
  tabs,
117
117
  navigation,
@@ -140,20 +140,23 @@ function SideNav({
140
140
  id: "shiso_docs_sidenav",
141
141
  className: classNames2(SideNav_default.nav, isSticky && SideNav_default.sticky, className),
142
142
  style: { ...style, height },
143
- children: /* @__PURE__ */ jsx3(List, { items: navigation, "aria-label": "nav", children: menu.map(({ section, pages }) => {
144
- return /* @__PURE__ */ jsx3(ListSection, { title: section, className: SideNav_default.items, children: pages.map(({ label: text, url }, index) => {
145
- return /* @__PURE__ */ jsx3(
146
- ListItem,
147
- {
148
- className: classNames2(SideNav_default.item, {
149
- [SideNav_default.selected]: url === pathname
150
- }),
151
- href: url,
152
- children: text
153
- },
154
- index
155
- );
156
- }) }, section);
143
+ children: /* @__PURE__ */ jsx3(Column2, { "aria-label": "nav", gap: "6", children: menu.map(({ section, pages }) => {
144
+ return /* @__PURE__ */ jsxs3(Column2, { title: section, className: SideNav_default.items, children: [
145
+ /* @__PURE__ */ jsx3(Text2, { weight: "bold", className: SideNav_default.header, children: section }),
146
+ pages.map(({ label: text, url }, index) => {
147
+ return /* @__PURE__ */ jsx3(
148
+ "a",
149
+ {
150
+ className: classNames2(SideNav_default.item, {
151
+ [SideNav_default.selected]: url === pathname
152
+ }),
153
+ href: url,
154
+ children: text
155
+ },
156
+ index
157
+ );
158
+ })
159
+ ] }, section);
157
160
  }) })
158
161
  }
159
162
  );
@@ -173,7 +176,7 @@ function TopNav({ tabs }) {
173
176
  }
174
177
 
175
178
  // src/components/DocContent.tsx
176
- import { Heading, Box as Box4, Text as Text2, Row, Icon as Icon2, Icons as Icons2 } from "@umami/react-zen";
179
+ import { Heading, Box as Box4, Text as Text3, Row, Icon as Icon2, Icons as Icons2 } from "@umami/react-zen";
177
180
  import Link from "next/link";
178
181
 
179
182
  // src/components/Markdown.tsx
@@ -186,7 +189,7 @@ import * as runtime from "react/jsx-runtime";
186
189
  var Markdown_default = { "content": "Markdown_content__NmE1Z" };
187
190
 
188
191
  // src/components/Markdown.tsx
189
- import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
192
+ import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
190
193
  var parseMdx = (code) => {
191
194
  try {
192
195
  const result = runSync(code, {
@@ -202,7 +205,7 @@ function Markdown({ code }) {
202
205
  const components = useMDXComponents();
203
206
  const { Component, error } = parseMdx(code);
204
207
  if (error) {
205
- return /* @__PURE__ */ jsxs3("h1", { children: [
208
+ return /* @__PURE__ */ jsxs4("h1", { children: [
206
209
  "Error rendering MDX: ",
207
210
  error
208
211
  ] });
@@ -214,14 +217,14 @@ function Markdown({ code }) {
214
217
  }
215
218
 
216
219
  // src/components/DocContent.tsx
217
- import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
220
+ import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
218
221
  function DocContent({ section, title, description, code, next, prev }) {
219
- return /* @__PURE__ */ jsxs4(Box4, { flexGrow: 1, children: [
220
- section && /* @__PURE__ */ jsx6(Text2, { color: "primary", weight: "bold", children: section }),
222
+ return /* @__PURE__ */ jsxs5(Box4, { flexGrow: "1", children: [
223
+ section && /* @__PURE__ */ jsx6(Text3, { color: "primary", weight: "bold", children: section }),
221
224
  title && /* @__PURE__ */ jsx6(Heading, { size: "2", as: "h1", marginY: "3", children: title }),
222
- description && /* @__PURE__ */ jsx6(Text2, { color: "muted", size: "3", children: description }),
225
+ description && /* @__PURE__ */ jsx6(Text3, { color: "muted", size: "3", children: description }),
223
226
  /* @__PURE__ */ jsx6(Markdown, { code }),
224
- /* @__PURE__ */ jsxs4(Row, { justifyContent: "space-between", children: [
227
+ /* @__PURE__ */ jsxs5(Row, { justifyContent: "space-between", children: [
225
228
  /* @__PURE__ */ jsx6(NavigationButton, { ...prev, isPrev: true }),
226
229
  /* @__PURE__ */ jsx6(NavigationButton, { ...next })
227
230
  ] })
@@ -235,15 +238,15 @@ var NavigationButton = ({
235
238
  if (!url || !label) {
236
239
  return /* @__PURE__ */ jsx6(Box4, {});
237
240
  }
238
- return /* @__PURE__ */ jsx6(Link, { href: url, children: /* @__PURE__ */ jsxs4(Row, { alignItems: "center", gap: "3", marginY: "3", children: [
241
+ return /* @__PURE__ */ jsx6(Link, { href: url, children: /* @__PURE__ */ jsxs5(Row, { alignItems: "center", gap: "3", marginY: "3", children: [
239
242
  isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", rotate: 180, children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) }),
240
- /* @__PURE__ */ jsx6(Text2, { size: "3", weight: "bold", children: label }),
243
+ /* @__PURE__ */ jsx6(Text3, { size: "3", weight: "bold", children: label }),
241
244
  !isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) })
242
245
  ] }) });
243
246
  };
244
247
 
245
248
  // src/components/Docs.tsx
246
- import { Fragment, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
249
+ import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
247
250
  function parseContent(content, config = {}) {
248
251
  const { tabs, navigation } = config;
249
252
  const keys = Object.keys(navigation);
@@ -297,22 +300,22 @@ function Docs({ content, config }) {
297
300
  lg: "none",
298
301
  xl: "none"
299
302
  };
300
- const MobileMenuButton = () => /* @__PURE__ */ jsxs5(DialogTrigger, { children: [
301
- /* @__PURE__ */ jsxs5(Button, { children: [
303
+ const MobileMenuButton = () => /* @__PURE__ */ jsxs6(DialogTrigger, { children: [
304
+ /* @__PURE__ */ jsxs6(Button, { children: [
302
305
  /* @__PURE__ */ jsx7(Icon3, { children: /* @__PURE__ */ jsx7(Icons3.Menu, {}) }),
303
- /* @__PURE__ */ jsx7(Text3, { children: "Menu" })
306
+ /* @__PURE__ */ jsx7(Text4, { children: "Menu" })
304
307
  ] }),
305
308
  /* @__PURE__ */ jsx7(Modal, { position: "bottom", offset: "40px", children: /* @__PURE__ */ jsx7(Dialog, { variant: "sheet", children: ({ close }) => {
306
- return /* @__PURE__ */ jsxs5(Fragment, { children: [
309
+ return /* @__PURE__ */ jsxs6(Fragment, { children: [
307
310
  /* @__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, {}) }) }) }),
308
311
  /* @__PURE__ */ jsx7(Box5, { height: "100%", overflow: "auto", children: /* @__PURE__ */ jsx7(SideNav, { tabs, navigation }) })
309
312
  ] });
310
313
  } }) })
311
314
  ] });
312
- return /* @__PURE__ */ jsxs5(Box5, { flexGrow: "1", children: [
315
+ return /* @__PURE__ */ jsxs6(Box5, { flexGrow: "1", children: [
313
316
  /* @__PURE__ */ jsx7(Row2, { display: menuDisplay, justifyContent: "flex-end", children: /* @__PURE__ */ jsx7(MobileMenuButton, {}) }),
314
317
  tabs && /* @__PURE__ */ jsx7(TopNav, { tabs }),
315
- /* @__PURE__ */ jsxs5(Row2, { gap: "6", children: [
318
+ /* @__PURE__ */ jsxs6(Row2, { gap: "6", children: [
316
319
  /* @__PURE__ */ jsx7(
317
320
  SideNav,
318
321
  {
@@ -341,37 +344,30 @@ function Docs({ content, config }) {
341
344
  }
342
345
 
343
346
  // src/components/Blogs.tsx
344
- import { Grid as Grid2 } from "@umami/react-zen";
347
+ import { Grid } from "@umami/react-zen";
345
348
 
346
349
  // src/components/Card.tsx
347
- import {
348
- Box as Box6,
349
- Image,
350
- Column as Column3,
351
- Row as Row3,
352
- Heading as Heading3,
353
- Text as Text4,
354
- Button as Button2,
355
- Icon as Icon4,
356
- Icons as Icons4
357
- } from "@umami/react-zen";
350
+ 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";
358
351
  import Link2 from "next/link";
359
352
  import { format } from "date-fns";
360
- import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
353
+ import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
361
354
  function Card({ title, description, date, author, url, image }) {
362
- return /* @__PURE__ */ jsxs6(Column3, { borderSize: "1", borderRadius: "3", overflow: "hidden", children: [
355
+ return /* @__PURE__ */ jsxs7(Column3, { borderSize: "1", borderRadius: "3", overflow: "hidden", children: [
363
356
  image && /* @__PURE__ */ jsx8(Box6, { height: "240px", children: /* @__PURE__ */ jsx8(Image, { src: image, alt: title, objectFit: "cover" }) }),
364
- /* @__PURE__ */ jsxs6(Column3, { padding: "6", gap: "4", flexGrow: 1, children: [
365
- /* @__PURE__ */ jsxs6(Column3, { gap: "4", flexGrow: 1, children: [
357
+ /* @__PURE__ */ jsxs7(Column3, { padding: "6", gap: "4", flexGrow: "1", children: [
358
+ /* @__PURE__ */ jsxs7(Row3, { justifyContent: "space-between", children: [
359
+ /* @__PURE__ */ jsx8(Text5, { color: "muted", children: date && format(new Date(date), "PP") }),
360
+ /* @__PURE__ */ jsxs7(Text5, { color: "muted", children: [
361
+ "Posted by ",
362
+ author
363
+ ] })
364
+ ] }),
365
+ /* @__PURE__ */ jsxs7(Column3, { gap: "4", flexGrow: "1", children: [
366
366
  /* @__PURE__ */ jsx8(Heading3, { size: "4", as: "header", children: /* @__PURE__ */ jsx8(Link2, { href: url, children: title }) }),
367
- /* @__PURE__ */ jsxs6(Row3, { justifyContent: "space-between", children: [
368
- /* @__PURE__ */ jsx8(Text4, { color: "muted", children: date && format(new Date(date), "PP") }),
369
- /* @__PURE__ */ jsx8(Text4, { color: "muted", children: author })
370
- ] }),
371
- /* @__PURE__ */ jsx8(Box6, { marginY: "5", as: "p", children: /* @__PURE__ */ jsx8(Text4, { size: "3", children: description }) })
367
+ /* @__PURE__ */ jsx8(Box6, { marginY: "5", as: "p", children: /* @__PURE__ */ jsx8(Text5, { color: "muted", size: "3", children: description }) })
372
368
  ] }),
373
- /* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs6(Link2, { href: url, children: [
374
- /* @__PURE__ */ jsx8(Text4, { children: "Read more" }),
369
+ /* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs7(Link2, { href: url, children: [
370
+ /* @__PURE__ */ jsx8(Text5, { children: "Read more" }),
375
371
  /* @__PURE__ */ jsx8(Icon4, { children: /* @__PURE__ */ jsx8(Icons4.Arrow, {}) })
376
372
  ] }) })
377
373
  ] })
@@ -386,7 +382,7 @@ function Blogs({ content, config }) {
386
382
  return /* @__PURE__ */ jsx9(Blog, { ...meta, code, anchors });
387
383
  }
388
384
  console.log({ content });
389
- return /* @__PURE__ */ jsx9(Grid2, { 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)) });
385
+ 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)) });
390
386
  }
391
387
 
392
388
  // src/components/Shiso.tsx
@@ -411,7 +407,7 @@ function useShiso() {
411
407
  }
412
408
 
413
409
  // src/components/Blog.tsx
414
- import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
410
+ import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
415
411
  function Blog({ title, code, author, date, image, anchors }) {
416
412
  const { config } = useShiso();
417
413
  const { top } = config?.blog || {};
@@ -423,14 +419,17 @@ function Blog({ title, code, author, date, image, anchors }) {
423
419
  lg: "block",
424
420
  xl: "block"
425
421
  };
426
- return /* @__PURE__ */ jsxs7(Column5, { gap: "8", maxWidth: "900px", style: { margin: "0 auto" }, children: [
427
- /* @__PURE__ */ jsx11(Box8, { flexGrow: 1, children: title && /* @__PURE__ */ jsx11(Heading5, { size: "1", as: "h1", align: "center", children: title }) }),
428
- image && /* @__PURE__ */ jsx11(Box8, { height: "480px", children: /* @__PURE__ */ jsx11(Image2, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
429
- /* @__PURE__ */ jsxs7(Row5, { justifyContent: "space-between", children: [
430
- /* @__PURE__ */ jsx11(Text5, { children: author }),
431
- /* @__PURE__ */ jsx11(Text5, { children: date && format2(new Date(date), "PP") })
422
+ return /* @__PURE__ */ jsxs8(Column5, { gap: "8", maxWidth: "960px", style: { margin: "0 auto" }, children: [
423
+ /* @__PURE__ */ jsx11(Box8, { flexGrow: "1", paddingY: "6", children: title && /* @__PURE__ */ jsx11(Heading5, { size: "1", as: "h1", align: "center", children: title }) }),
424
+ /* @__PURE__ */ jsxs8(Row5, { justifyContent: "space-between", children: [
425
+ /* @__PURE__ */ jsx11(Text6, { color: "muted", children: date && format2(new Date(date), "PPP") }),
426
+ /* @__PURE__ */ jsxs8(Text6, { color: "muted", children: [
427
+ "Posted by ",
428
+ author
429
+ ] })
432
430
  ] }),
433
- /* @__PURE__ */ jsxs7(Row5, { gap: "6", children: [
431
+ image && /* @__PURE__ */ jsx11(Box8, { height: "480px", children: /* @__PURE__ */ jsx11(Image2, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
432
+ /* @__PURE__ */ jsxs8(Row5, { gap: "6", children: [
434
433
  /* @__PURE__ */ jsx11(Markdown, { code }),
435
434
  /* @__PURE__ */ jsx11(PageLinks, { display: linksDisplay, items: anchors, style: { top } })
436
435
  ] })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umami/shiso",
3
- "version": "0.37.0",
3
+ "version": "0.38.0",
4
4
  "description": "A content layer for Next.js",
5
5
  "homepage": "https://umami.is/shiso",
6
6
  "repository": {
@@ -46,7 +46,7 @@
46
46
  "@mdx-js/loader": "^3.0.0",
47
47
  "@mdx-js/mdx": "^3.1.0",
48
48
  "@mdx-js/react": "^3.0.0",
49
- "@umami/react-zen": "^0.43.0",
49
+ "@umami/react-zen": "^0.45.0",
50
50
  "classnames": "^2.5.1",
51
51
  "date-fns": "^4.1.0",
52
52
  "glob": "^10.3.10",