@umami/shiso 0.39.0 → 0.40.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.
- package/dist/index.js +9 -8
- package/dist/index.mjs +23 -22
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -130,6 +130,7 @@ var import_react3 = require("react");
|
|
|
130
130
|
var import_react_zen3 = require("@umami/react-zen");
|
|
131
131
|
var import_classnames2 = __toESM(require("classnames"));
|
|
132
132
|
var import_navigation = require("next/navigation");
|
|
133
|
+
var import_link = __toESM(require("next/link"));
|
|
133
134
|
|
|
134
135
|
// css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
|
|
135
136
|
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 +170,7 @@ function SideNav({
|
|
|
169
170
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_zen3.Text, { weight: "bold", className: SideNav_default.header, children: section }),
|
|
170
171
|
pages.map(({ label: text, url }, index) => {
|
|
171
172
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
172
|
-
|
|
173
|
+
import_link.default,
|
|
173
174
|
{
|
|
174
175
|
className: (0, import_classnames2.default)(SideNav_default.item, {
|
|
175
176
|
[SideNav_default.selected]: url === pathname
|
|
@@ -189,19 +190,20 @@ function SideNav({
|
|
|
189
190
|
// src/components/TopNav.tsx
|
|
190
191
|
var import_navigation2 = require("next/navigation");
|
|
191
192
|
var import_react_zen4 = require("@umami/react-zen");
|
|
193
|
+
var import_link2 = __toESM(require("next/link"));
|
|
192
194
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
193
195
|
function TopNav({ tabs }) {
|
|
194
196
|
const pathname = (0, import_navigation2.usePathname)();
|
|
195
197
|
const tab = tabs?.find(({ id, url }) => id !== "docs" ? pathname.startsWith(url) : false);
|
|
196
198
|
const selected = tab?.id || "docs";
|
|
197
199
|
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 }) => {
|
|
198
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_zen4.Tab, { id, href: url, children: label });
|
|
200
|
+
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 }) });
|
|
199
201
|
} }) });
|
|
200
202
|
}
|
|
201
203
|
|
|
202
204
|
// src/components/DocContent.tsx
|
|
203
205
|
var import_react_zen6 = require("@umami/react-zen");
|
|
204
|
-
var
|
|
206
|
+
var import_link3 = __toESM(require("next/link"));
|
|
205
207
|
|
|
206
208
|
// src/components/Markdown.tsx
|
|
207
209
|
var import_react_zen5 = require("@umami/react-zen");
|
|
@@ -263,7 +265,7 @@ var NavigationButton = ({
|
|
|
263
265
|
if (!url || !label) {
|
|
264
266
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Box, {});
|
|
265
267
|
}
|
|
266
|
-
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
268
|
+
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: [
|
|
267
269
|
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, {}) }),
|
|
268
270
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_zen6.Text, { size: "3", weight: "bold", children: label }),
|
|
269
271
|
!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 +375,7 @@ var import_react_zen9 = require("@umami/react-zen");
|
|
|
373
375
|
|
|
374
376
|
// src/components/Card.tsx
|
|
375
377
|
var import_react_zen8 = require("@umami/react-zen");
|
|
376
|
-
var
|
|
378
|
+
var import_link4 = __toESM(require("next/link"));
|
|
377
379
|
var import_date_fns = require("date-fns");
|
|
378
380
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
379
381
|
function Card({ title, description, date, author, url, image }) {
|
|
@@ -388,10 +390,10 @@ function Card({ title, description, date, author, url, image }) {
|
|
|
388
390
|
] })
|
|
389
391
|
] }),
|
|
390
392
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_zen8.Column, { gap: "4", flexGrow: "1", children: [
|
|
391
|
-
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Heading, { size: "4", as: "header", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
393
|
+
/* @__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 }) }),
|
|
392
394
|
/* @__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 }) })
|
|
393
395
|
] }),
|
|
394
|
-
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Button, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
396
|
+
/* @__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: [
|
|
395
397
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Text, { children: "Read more" }),
|
|
396
398
|
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_zen8.Icons.Arrow, {}) })
|
|
397
399
|
] }) })
|
|
@@ -406,7 +408,6 @@ function Blogs({ content, config }) {
|
|
|
406
408
|
const { meta, code, anchors, slug } = content;
|
|
407
409
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Blog, { ...meta, code, anchors });
|
|
408
410
|
}
|
|
409
|
-
console.log({ content });
|
|
410
411
|
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)) });
|
|
411
412
|
}
|
|
412
413
|
|
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
|
|
8
|
+
import { Heading as Heading5, Box as Box7, 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
|
|
@@ -89,7 +89,7 @@ function CodeBlock(props) {
|
|
|
89
89
|
|
|
90
90
|
// src/components/Docs.tsx
|
|
91
91
|
import {
|
|
92
|
-
Box as
|
|
92
|
+
Box as Box4,
|
|
93
93
|
Heading as Heading2,
|
|
94
94
|
Button,
|
|
95
95
|
Icon as Icon3,
|
|
@@ -106,6 +106,7 @@ import { useEffect as useEffect2, useState as useState3 } from "react";
|
|
|
106
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
|
+
import Link from "next/link";
|
|
109
110
|
|
|
110
111
|
// css-modules:E:\dev\umami-shiso\src\components\SideNav.module.css
|
|
111
112
|
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 +146,7 @@ function SideNav({
|
|
|
145
146
|
/* @__PURE__ */ jsx3(Text2, { weight: "bold", className: SideNav_default.header, children: section }),
|
|
146
147
|
pages.map(({ label: text, url }, index) => {
|
|
147
148
|
return /* @__PURE__ */ jsx3(
|
|
148
|
-
|
|
149
|
+
Link,
|
|
149
150
|
{
|
|
150
151
|
className: classNames2(SideNav_default.item, {
|
|
151
152
|
[SideNav_default.selected]: url === pathname
|
|
@@ -165,22 +166,23 @@ function SideNav({
|
|
|
165
166
|
// src/components/TopNav.tsx
|
|
166
167
|
import { usePathname as usePathname2 } from "next/navigation";
|
|
167
168
|
import { Tabs, TabList, Tab } from "@umami/react-zen";
|
|
169
|
+
import Link2 from "next/link";
|
|
168
170
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
169
171
|
function TopNav({ tabs }) {
|
|
170
172
|
const pathname = usePathname2();
|
|
171
173
|
const tab = tabs?.find(({ id, url }) => id !== "docs" ? pathname.startsWith(url) : false);
|
|
172
174
|
const selected = tab?.id || "docs";
|
|
173
175
|
return /* @__PURE__ */ jsx4(Tabs, { selectedKey: selected, children: /* @__PURE__ */ jsx4(TabList, { items: tabs, children: ({ id, label, url }) => {
|
|
174
|
-
return /* @__PURE__ */ jsx4(Tab, { id, href: url, children: label });
|
|
176
|
+
return /* @__PURE__ */ jsx4(Tab, { id, children: /* @__PURE__ */ jsx4(Link2, { href: url, children: label }) });
|
|
175
177
|
} }) });
|
|
176
178
|
}
|
|
177
179
|
|
|
178
180
|
// src/components/DocContent.tsx
|
|
179
|
-
import { Heading, Box as
|
|
180
|
-
import
|
|
181
|
+
import { Heading, Box as Box3, Text as Text3, Row, Icon as Icon2, Icons as Icons2 } from "@umami/react-zen";
|
|
182
|
+
import Link3 from "next/link";
|
|
181
183
|
|
|
182
184
|
// src/components/Markdown.tsx
|
|
183
|
-
import { Box as
|
|
185
|
+
import { Box as Box2 } from "@umami/react-zen";
|
|
184
186
|
import { runSync } from "@mdx-js/mdx";
|
|
185
187
|
import { useMDXComponents } from "@mdx-js/react";
|
|
186
188
|
import * as runtime from "react/jsx-runtime";
|
|
@@ -213,13 +215,13 @@ function Markdown({ code }) {
|
|
|
213
215
|
if (!Component) {
|
|
214
216
|
return null;
|
|
215
217
|
}
|
|
216
|
-
return /* @__PURE__ */ jsx5(
|
|
218
|
+
return /* @__PURE__ */ jsx5(Box2, { className: Markdown_default.content, children: /* @__PURE__ */ jsx5(Component, { components }) });
|
|
217
219
|
}
|
|
218
220
|
|
|
219
221
|
// src/components/DocContent.tsx
|
|
220
222
|
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
221
223
|
function DocContent({ section, title, description, code, next, prev }) {
|
|
222
|
-
return /* @__PURE__ */ jsxs5(
|
|
224
|
+
return /* @__PURE__ */ jsxs5(Box3, { flexGrow: "1", children: [
|
|
223
225
|
section && /* @__PURE__ */ jsx6(Text3, { color: "primary", weight: "bold", children: section }),
|
|
224
226
|
title && /* @__PURE__ */ jsx6(Heading, { size: "2", as: "h1", marginY: "3", children: title }),
|
|
225
227
|
description && /* @__PURE__ */ jsx6(Text3, { color: "muted", size: "3", children: description }),
|
|
@@ -236,9 +238,9 @@ var NavigationButton = ({
|
|
|
236
238
|
isPrev
|
|
237
239
|
}) => {
|
|
238
240
|
if (!url || !label) {
|
|
239
|
-
return /* @__PURE__ */ jsx6(
|
|
241
|
+
return /* @__PURE__ */ jsx6(Box3, {});
|
|
240
242
|
}
|
|
241
|
-
return /* @__PURE__ */ jsx6(
|
|
243
|
+
return /* @__PURE__ */ jsx6(Link3, { href: url, children: /* @__PURE__ */ jsxs5(Row, { alignItems: "center", gap: "3", marginY: "3", children: [
|
|
242
244
|
isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", rotate: 180, children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) }),
|
|
243
245
|
/* @__PURE__ */ jsx6(Text3, { size: "3", weight: "bold", children: label }),
|
|
244
246
|
!isPrev && /* @__PURE__ */ jsx6(Icon2, { size: "sm", children: /* @__PURE__ */ jsx6(Icons2.Chevron, {}) })
|
|
@@ -308,11 +310,11 @@ function Docs({ content, config }) {
|
|
|
308
310
|
/* @__PURE__ */ jsx7(Modal, { position: "bottom", offset: "40px", children: /* @__PURE__ */ jsx7(Dialog, { variant: "sheet", children: ({ close }) => {
|
|
309
311
|
return /* @__PURE__ */ jsxs6(Fragment, { children: [
|
|
310
312
|
/* @__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, {}) }) }) }),
|
|
311
|
-
/* @__PURE__ */ jsx7(
|
|
313
|
+
/* @__PURE__ */ jsx7(Box4, { height: "100%", overflow: "auto", children: /* @__PURE__ */ jsx7(SideNav, { tabs, navigation }) })
|
|
312
314
|
] });
|
|
313
315
|
} }) })
|
|
314
316
|
] });
|
|
315
|
-
return /* @__PURE__ */ jsxs6(
|
|
317
|
+
return /* @__PURE__ */ jsxs6(Box4, { flexGrow: "1", children: [
|
|
316
318
|
/* @__PURE__ */ jsx7(Row2, { display: menuDisplay, justifyContent: "flex-end", children: /* @__PURE__ */ jsx7(MobileMenuButton, {}) }),
|
|
317
319
|
tabs && /* @__PURE__ */ jsx7(TopNav, { tabs }),
|
|
318
320
|
/* @__PURE__ */ jsxs6(Row2, { gap: "6", children: [
|
|
@@ -347,13 +349,13 @@ function Docs({ content, config }) {
|
|
|
347
349
|
import { Grid } from "@umami/react-zen";
|
|
348
350
|
|
|
349
351
|
// src/components/Card.tsx
|
|
350
|
-
import { Box as
|
|
351
|
-
import
|
|
352
|
+
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";
|
|
353
|
+
import Link4 from "next/link";
|
|
352
354
|
import { format } from "date-fns";
|
|
353
355
|
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
354
356
|
function Card({ title, description, date, author, url, image }) {
|
|
355
357
|
return /* @__PURE__ */ jsxs7(Column3, { borderSize: "1", borderRadius: "3", overflow: "hidden", children: [
|
|
356
|
-
image && /* @__PURE__ */ jsx8(
|
|
358
|
+
image && /* @__PURE__ */ jsx8(Box5, { height: "240px", children: /* @__PURE__ */ jsx8(Image, { src: image, alt: title, objectFit: "cover" }) }),
|
|
357
359
|
/* @__PURE__ */ jsxs7(Column3, { padding: "6", gap: "4", flexGrow: "1", children: [
|
|
358
360
|
/* @__PURE__ */ jsxs7(Row3, { justifyContent: "space-between", children: [
|
|
359
361
|
/* @__PURE__ */ jsx8(Text5, { color: "muted", children: date && format(new Date(date), "PP") }),
|
|
@@ -363,10 +365,10 @@ function Card({ title, description, date, author, url, image }) {
|
|
|
363
365
|
] })
|
|
364
366
|
] }),
|
|
365
367
|
/* @__PURE__ */ jsxs7(Column3, { gap: "4", flexGrow: "1", children: [
|
|
366
|
-
/* @__PURE__ */ jsx8(Heading3, { size: "4", as: "header", children: /* @__PURE__ */ jsx8(
|
|
367
|
-
/* @__PURE__ */ jsx8(
|
|
368
|
+
/* @__PURE__ */ jsx8(Heading3, { size: "4", as: "header", children: /* @__PURE__ */ jsx8(Link4, { href: url, children: title }) }),
|
|
369
|
+
/* @__PURE__ */ jsx8(Box5, { marginY: "5", as: "p", children: /* @__PURE__ */ jsx8(Text5, { color: "muted", size: "3", children: description }) })
|
|
368
370
|
] }),
|
|
369
|
-
/* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs7(
|
|
371
|
+
/* @__PURE__ */ jsx8(Button2, { asChild: true, children: /* @__PURE__ */ jsxs7(Link4, { href: url, children: [
|
|
370
372
|
/* @__PURE__ */ jsx8(Text5, { children: "Read more" }),
|
|
371
373
|
/* @__PURE__ */ jsx8(Icon4, { children: /* @__PURE__ */ jsx8(Icons4.Arrow, {}) })
|
|
372
374
|
] }) })
|
|
@@ -381,7 +383,6 @@ function Blogs({ content, config }) {
|
|
|
381
383
|
const { meta, code, anchors, slug } = content;
|
|
382
384
|
return /* @__PURE__ */ jsx9(Blog, { ...meta, code, anchors });
|
|
383
385
|
}
|
|
384
|
-
console.log({ content });
|
|
385
386
|
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)) });
|
|
386
387
|
}
|
|
387
388
|
|
|
@@ -420,7 +421,7 @@ function Blog({ title, code, author, date, image, anchors }) {
|
|
|
420
421
|
xl: "block"
|
|
421
422
|
};
|
|
422
423
|
return /* @__PURE__ */ jsxs8(Column5, { gap: "8", maxWidth: "960px", style: { margin: "0 auto" }, children: [
|
|
423
|
-
/* @__PURE__ */ jsx11(
|
|
424
|
+
/* @__PURE__ */ jsx11(Box7, { flexGrow: "1", paddingY: "6", children: title && /* @__PURE__ */ jsx11(Heading5, { size: "1", as: "h1", align: "center", children: title }) }),
|
|
424
425
|
/* @__PURE__ */ jsxs8(Row5, { justifyContent: "space-between", children: [
|
|
425
426
|
/* @__PURE__ */ jsx11(Text6, { color: "muted", children: date && format2(new Date(date), "PPP") }),
|
|
426
427
|
/* @__PURE__ */ jsxs8(Text6, { color: "muted", children: [
|
|
@@ -428,7 +429,7 @@ function Blog({ title, code, author, date, image, anchors }) {
|
|
|
428
429
|
author
|
|
429
430
|
] })
|
|
430
431
|
] }),
|
|
431
|
-
image && /* @__PURE__ */ jsx11(
|
|
432
|
+
image && /* @__PURE__ */ jsx11(Box7, { height: "480px", children: /* @__PURE__ */ jsx11(Image2, { src: image, alt: title, objectFit: "cover", borderRadius: "3" }) }),
|
|
432
433
|
/* @__PURE__ */ jsxs8(Row5, { gap: "6", children: [
|
|
433
434
|
/* @__PURE__ */ jsx11(Markdown, { code }),
|
|
434
435
|
/* @__PURE__ */ jsx11(PageLinks, { display: linksDisplay, items: anchors, style: { top } })
|