@umami/shiso 0.12.0 → 0.14.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.css +22 -21
- package/dist/index.d.ts +2 -9
- package/dist/index.js +2 -2
- package/dist/index.mjs +2 -2
- package/package.json +3 -5
- package/server/components/Blog.d.ts +5 -0
- package/server/components/Blog.jsx +16 -0
- package/server/components/CodeBlock.d.ts +1 -0
- package/server/components/CodeBlock.jsx +23 -0
- package/server/components/ContentArea.d.ts +6 -0
- package/server/components/ContentArea.jsx +19 -0
- package/server/components/Docs.d.ts +1 -0
- package/server/components/Docs.jsx +33 -0
- package/server/components/Markdown.d.ts +3 -0
- package/server/components/Markdown.jsx +35 -0
- package/server/components/PageLinks.d.ts +4 -0
- package/server/components/PageLinks.jsx +49 -0
- package/server/components/Shiso.d.ts +19 -0
- package/server/components/Shiso.jsx +34 -0
- package/server/components/SideNav.d.ts +6 -0
- package/server/components/SideNav.jsx +35 -0
- package/server/components/TopNav.d.ts +3 -0
- package/server/components/TopNav.jsx +22 -0
- package/server/components/hooks/useShiso.d.ts +4 -0
- package/server/components/hooks/useShiso.js +6 -0
- package/server/components/index.d.ts +5 -0
- package/server/components/index.js +6 -0
- package/server/lib/types.d.ts +14 -0
- package/server/lib/types.js +1 -0
- package/server/server/index.d.ts +26 -0
- package/server/server/index.js +183 -0
package/dist/index.css
CHANGED
|
@@ -75,80 +75,81 @@ a.PageLinks_selected__Y2YxY {
|
|
|
75
75
|
}
|
|
76
76
|
|
|
77
77
|
/* virtual-css:css:72ce2cfbba7b635b2ff1a5f4f5eeabf3 */
|
|
78
|
-
.
|
|
78
|
+
.SideNav_nav__YWMxN {
|
|
79
79
|
position: sticky;
|
|
80
80
|
top: 30px;
|
|
81
|
-
height:
|
|
81
|
+
height: 100vh;
|
|
82
|
+
overflow-y: auto;
|
|
82
83
|
}
|
|
83
|
-
.
|
|
84
|
+
.SideNav_nav__YWMxN .SideNav_item__YTQzN {
|
|
84
85
|
color: var(--font-color-muted);
|
|
85
86
|
padding: 0;
|
|
86
87
|
border-radius: 0;
|
|
87
88
|
border-left: var(--border-size-1) solid var(--border-color);
|
|
88
89
|
}
|
|
89
|
-
.
|
|
90
|
+
.SideNav_nav__YWMxN .SideNav_item__YTQzN a {
|
|
90
91
|
color: currentColor;
|
|
91
92
|
width: 100%;
|
|
92
93
|
padding: var(--padding-y) var(--padding-x);
|
|
93
94
|
text-decoration: none;
|
|
94
95
|
}
|
|
95
|
-
.
|
|
96
|
+
.SideNav_nav__YWMxN .SideNav_item__YTQzN a:hover {
|
|
96
97
|
color: var(--primary-color);
|
|
97
98
|
}
|
|
98
|
-
.
|
|
99
|
+
.SideNav_nav__YWMxN .SideNav_item__YTQzN.SideNav_selected__ZDI0N {
|
|
99
100
|
color: var(--font-color);
|
|
100
101
|
border-color: var(--primary-color);
|
|
101
102
|
}
|
|
102
|
-
.
|
|
103
|
+
.SideNav_items__Y2YwZ header {
|
|
103
104
|
padding: var(--padding-y) 0;
|
|
104
105
|
}
|
|
105
106
|
|
|
106
107
|
/* virtual-css:css:7938c95522eda3e1f8244364ad70b38c */
|
|
107
|
-
.
|
|
108
|
+
.ContentArea_content__MzE0M {
|
|
108
109
|
font-size: 16px;
|
|
109
110
|
margin-bottom: 60px;
|
|
110
111
|
}
|
|
111
|
-
.
|
|
112
|
+
.ContentArea_content__MzE0M > p {
|
|
112
113
|
color: var(--font-color-muted);
|
|
113
114
|
line-height: 1.8;
|
|
114
115
|
}
|
|
115
|
-
.
|
|
116
|
+
.ContentArea_content__MzE0M a {
|
|
116
117
|
color: var(--font-color);
|
|
117
118
|
font-weight: 600;
|
|
118
|
-
text-decoration: underline var(--font-color-
|
|
119
|
+
text-decoration: underline var(--font-color-disabled);
|
|
119
120
|
text-underline-offset: 4px;
|
|
120
121
|
}
|
|
121
|
-
.
|
|
122
|
-
text-decoration: underline var(--
|
|
122
|
+
.ContentArea_content__MzE0M a:hover {
|
|
123
|
+
text-decoration: underline var(--primary-color);
|
|
123
124
|
}
|
|
124
|
-
.
|
|
125
|
+
.ContentArea_content__MzE0M h1 {
|
|
125
126
|
font-size: var(--font-size-8);
|
|
126
127
|
letter-spacing: var(--letter-spacing-1);
|
|
127
128
|
margin: 0 0 var(--spacing-4) 0;
|
|
128
129
|
}
|
|
129
|
-
.
|
|
130
|
+
.ContentArea_content__MzE0M h2 {
|
|
130
131
|
font-size: var(--font-size-6);
|
|
131
132
|
letter-spacing: var(--letter-spacing-1);
|
|
132
133
|
margin: var(--spacing-8) 0 var(--spacing-4) 0;
|
|
133
134
|
}
|
|
134
|
-
.
|
|
135
|
+
.ContentArea_content__MzE0M h3 {
|
|
135
136
|
font-size: var(--font-size-5);
|
|
136
137
|
letter-spacing: var(--letter-spacing-1);
|
|
137
138
|
margin: var(--spacing-7) 0 var(--spacing-4) 0;
|
|
138
139
|
}
|
|
139
|
-
.
|
|
140
|
+
.ContentArea_content__MzE0M ul {
|
|
140
141
|
list-style: disc;
|
|
141
142
|
}
|
|
142
|
-
.
|
|
143
|
+
.ContentArea_content__MzE0M ol {
|
|
143
144
|
list-style: decimal;
|
|
144
145
|
}
|
|
145
|
-
.
|
|
146
|
+
.ContentArea_content__MzE0M pre {
|
|
146
147
|
margin: var(--spacing-5) 0;
|
|
147
148
|
}
|
|
148
|
-
.
|
|
149
|
+
.ContentArea_content__MzE0M code {
|
|
149
150
|
font-size: 14px;
|
|
150
151
|
}
|
|
151
|
-
.
|
|
152
|
+
.ContentArea_content__MzE0M code:not([class]) {
|
|
152
153
|
font-family: var(--font-family-code);
|
|
153
154
|
color: var(--font-color);
|
|
154
155
|
padding: var(--spacing-1);
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// Generated by dts-bundle v0.7.3
|
|
2
2
|
// Dependencies for this module:
|
|
3
3
|
// ../../react
|
|
4
|
+
// ../../@/lib/types
|
|
4
5
|
|
|
5
6
|
declare module '@umami/shiso' {
|
|
6
7
|
import '@umami/react-zen/styles.css';
|
|
@@ -24,15 +25,7 @@ declare module '@umami/shiso/Docs' {
|
|
|
24
25
|
|
|
25
26
|
declare module '@umami/shiso/Shiso' {
|
|
26
27
|
import { JSX } from 'react';
|
|
27
|
-
|
|
28
|
-
contentDir: string;
|
|
29
|
-
docs?: {
|
|
30
|
-
[key: string]: any;
|
|
31
|
-
};
|
|
32
|
-
blog?: {
|
|
33
|
-
[key: string]: any;
|
|
34
|
-
};
|
|
35
|
-
}
|
|
28
|
+
import type { ShisoConfig } from '@/lib/types';
|
|
36
29
|
export interface ShisoProps {
|
|
37
30
|
content: any;
|
|
38
31
|
type: string;
|
package/dist/index.js
CHANGED
|
@@ -190,7 +190,7 @@ var import_navigation = require("next/navigation");
|
|
|
190
190
|
var import_link = __toESM(require("next/link"));
|
|
191
191
|
|
|
192
192
|
// css-modules:/Users/mikecao/Development/umami-software/shiso/src/components/SideNav.module.css
|
|
193
|
-
var SideNav_default = { "nav": "
|
|
193
|
+
var SideNav_default = { "nav": "SideNav_nav__YWMxN", "item": "SideNav_item__YTQzN", "selected": "SideNav_selected__ZDI0N", "items": "SideNav_items__Y2YwZ" };
|
|
194
194
|
|
|
195
195
|
// src/components/SideNav.tsx
|
|
196
196
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
@@ -232,7 +232,7 @@ function TopNav({ tabs }) {
|
|
|
232
232
|
var import_react_zen5 = require("@umami/react-zen");
|
|
233
233
|
|
|
234
234
|
// css-modules:/Users/mikecao/Development/umami-software/shiso/src/components/ContentArea.module.css
|
|
235
|
-
var ContentArea_default = { "content": "
|
|
235
|
+
var ContentArea_default = { "content": "ContentArea_content__MzE0M" };
|
|
236
236
|
|
|
237
237
|
// src/components/ContentArea.tsx
|
|
238
238
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
package/dist/index.mjs
CHANGED
|
@@ -154,7 +154,7 @@ import { usePathname } from "next/navigation";
|
|
|
154
154
|
import Link from "next/link";
|
|
155
155
|
|
|
156
156
|
// css-modules:/Users/mikecao/Development/umami-software/shiso/src/components/SideNav.module.css
|
|
157
|
-
var SideNav_default = { "nav": "
|
|
157
|
+
var SideNav_default = { "nav": "SideNav_nav__YWMxN", "item": "SideNav_item__YTQzN", "selected": "SideNav_selected__ZDI0N", "items": "SideNav_items__Y2YwZ" };
|
|
158
158
|
|
|
159
159
|
// src/components/SideNav.tsx
|
|
160
160
|
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
@@ -196,7 +196,7 @@ function TopNav({ tabs }) {
|
|
|
196
196
|
import { Heading, Box as Box2, Text as Text2 } from "@umami/react-zen";
|
|
197
197
|
|
|
198
198
|
// css-modules:/Users/mikecao/Development/umami-software/shiso/src/components/ContentArea.module.css
|
|
199
|
-
var ContentArea_default = { "content": "
|
|
199
|
+
var ContentArea_default = { "content": "ContentArea_content__MzE0M" };
|
|
200
200
|
|
|
201
201
|
// src/components/ContentArea.tsx
|
|
202
202
|
import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umami/shiso",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.14.0",
|
|
4
4
|
"description": "A content layer for Next.js",
|
|
5
5
|
"homepage": "https://umami.is/shiso",
|
|
6
6
|
"repository": {
|
|
@@ -42,14 +42,11 @@
|
|
|
42
42
|
"prettier --write"
|
|
43
43
|
]
|
|
44
44
|
},
|
|
45
|
-
"peerDependencies": {
|
|
46
|
-
"@umami/react-zen": "^0.1.0"
|
|
47
|
-
},
|
|
48
45
|
"dependencies": {
|
|
49
46
|
"@mdx-js/loader": "^3.0.0",
|
|
50
47
|
"@mdx-js/mdx": "^3.1.0",
|
|
51
48
|
"@mdx-js/react": "^3.0.0",
|
|
52
|
-
"@umami/react-zen": "^0.
|
|
49
|
+
"@umami/react-zen": "^0.29.0",
|
|
53
50
|
"classnames": "^2.5.1",
|
|
54
51
|
"glob": "^10.3.10",
|
|
55
52
|
"gray-matter": "^4.0.3",
|
|
@@ -65,6 +62,7 @@
|
|
|
65
62
|
},
|
|
66
63
|
"devDependencies": {
|
|
67
64
|
"@svgr/cli": "^8.1.0",
|
|
65
|
+
"@svgr/webpack": "^8.1.0",
|
|
68
66
|
"@types/css-modules": "^1.0.5",
|
|
69
67
|
"@types/mdx": "^2.0.11",
|
|
70
68
|
"@types/node": "^22.10.2",
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import styles from './Blog.module.css';
|
|
3
|
+
import { Markdown } from './Markdown';
|
|
4
|
+
export function Blog(_a) {
|
|
5
|
+
var _b, _c;
|
|
6
|
+
var content = _a.content;
|
|
7
|
+
return (<div className={styles.blog}>
|
|
8
|
+
<div className={styles.main}>
|
|
9
|
+
<div className={styles.content}>
|
|
10
|
+
<h1>{(_b = content === null || content === void 0 ? void 0 : content.meta) === null || _b === void 0 ? void 0 : _b.title}</h1>
|
|
11
|
+
<p className={styles.description}>{(_c = content === null || content === void 0 ? void 0 : content.meta) === null || _c === void 0 ? void 0 : _c.description}</p>
|
|
12
|
+
<Markdown content={content}/>
|
|
13
|
+
</div>
|
|
14
|
+
</div>
|
|
15
|
+
</div>);
|
|
16
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function CodeBlock(props: any): import("react").JSX.Element;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { useState, useRef } from 'react';
|
|
2
|
+
import { Icon, Icons } from '@umami/react-zen';
|
|
3
|
+
import styles from './CodeBlock.module.css';
|
|
4
|
+
export function CodeBlock(props) {
|
|
5
|
+
var textInput = useRef(null);
|
|
6
|
+
var _a = useState(false), copied = _a[0], setCopied = _a[1];
|
|
7
|
+
var handleCopy = function () {
|
|
8
|
+
var _a, _b;
|
|
9
|
+
setCopied(true);
|
|
10
|
+
(_a = navigator === null || navigator === void 0 ? void 0 : navigator.clipboard) === null || _a === void 0 ? void 0 : _a.writeText((_b = textInput === null || textInput === void 0 ? void 0 : textInput.current) === null || _b === void 0 ? void 0 : _b.textContent);
|
|
11
|
+
setTimeout(function () {
|
|
12
|
+
setCopied(false);
|
|
13
|
+
}, 1000);
|
|
14
|
+
};
|
|
15
|
+
return (<pre ref={textInput} className={styles.container}>
|
|
16
|
+
{props.children}
|
|
17
|
+
<button aria-label="Copy code" className={styles.button} onClick={handleCopy}>
|
|
18
|
+
<Icon size="sm" className={copied ? styles.check : styles.copy}>
|
|
19
|
+
{copied ? <Icons.Check /> : <Icons.Copy />}
|
|
20
|
+
</Icon>
|
|
21
|
+
</button>
|
|
22
|
+
</pre>);
|
|
23
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Heading, Box, Text } from '@umami/react-zen';
|
|
2
|
+
import { Markdown } from './Markdown';
|
|
3
|
+
import styles from './ContentArea.module.css';
|
|
4
|
+
export function ContentArea(_a) {
|
|
5
|
+
var _b, _c;
|
|
6
|
+
var content = _a.content;
|
|
7
|
+
return (<Box flexGrow={1}>
|
|
8
|
+
<Text color="primary" weight="bold">
|
|
9
|
+
{content.group}
|
|
10
|
+
</Text>
|
|
11
|
+
<Heading size="8" as="h1">
|
|
12
|
+
{(_b = content === null || content === void 0 ? void 0 : content.meta) === null || _b === void 0 ? void 0 : _b.title}
|
|
13
|
+
</Heading>
|
|
14
|
+
<Text color="muted">{(_c = content === null || content === void 0 ? void 0 : content.meta) === null || _c === void 0 ? void 0 : _c.description}</Text>
|
|
15
|
+
<Box className={styles.content}>
|
|
16
|
+
<Markdown content={content}/>
|
|
17
|
+
</Box>
|
|
18
|
+
</Box>);
|
|
19
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function Docs(): import("react").JSX.Element;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { Grid, Box, Heading } from '@umami/react-zen';
|
|
3
|
+
import { useShiso } from './hooks/useShiso';
|
|
4
|
+
import { PageLinks } from './PageLinks';
|
|
5
|
+
import { SideNav } from './SideNav';
|
|
6
|
+
import { TopNav } from './TopNav';
|
|
7
|
+
import { ContentArea } from './ContentArea';
|
|
8
|
+
export function Docs() {
|
|
9
|
+
var _a = useShiso(), content = _a.content, config = _a.config;
|
|
10
|
+
if (!content) {
|
|
11
|
+
return <Heading size="6">Page not found</Heading>;
|
|
12
|
+
}
|
|
13
|
+
var _b = (config === null || config === void 0 ? void 0 : config.docs) || {}, tabs = _b.tabs, navigation = _b.navigation;
|
|
14
|
+
content.group = Object.keys(navigation).reduce(function (name, key) {
|
|
15
|
+
var _a, _b;
|
|
16
|
+
if (!name) {
|
|
17
|
+
return (_b = (_a = navigation[key]) === null || _a === void 0 ? void 0 : _a.find(function (section) {
|
|
18
|
+
return section.pages.find(function (page) {
|
|
19
|
+
return page.url === "/docs/".concat(content.id) || (page.url === "/docs" && content.id === 'index');
|
|
20
|
+
});
|
|
21
|
+
})) === null || _b === void 0 ? void 0 : _b.group;
|
|
22
|
+
}
|
|
23
|
+
return name;
|
|
24
|
+
}, null);
|
|
25
|
+
return (<Box flexGrow="1">
|
|
26
|
+
{tabs && <TopNav tabs={tabs}/>}
|
|
27
|
+
<Grid gap="6" columns="240px 1fr 240px">
|
|
28
|
+
<SideNav tabs={tabs} navigation={navigation}/>
|
|
29
|
+
<ContentArea content={content}/>
|
|
30
|
+
<PageLinks items={content === null || content === void 0 ? void 0 : content.anchors} offset={150}/>
|
|
31
|
+
</Grid>
|
|
32
|
+
</Box>);
|
|
33
|
+
}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { runSync } from '@mdx-js/mdx';
|
|
13
|
+
import { useMDXComponents } from '@mdx-js/react';
|
|
14
|
+
import * as runtime from 'react/jsx-runtime';
|
|
15
|
+
var parseMdx = function (code) {
|
|
16
|
+
try {
|
|
17
|
+
var result = runSync(code, __assign(__assign({}, runtime), { baseUrl: import.meta.url }));
|
|
18
|
+
return { Component: result.default };
|
|
19
|
+
}
|
|
20
|
+
catch (err) {
|
|
21
|
+
return { error: err.message };
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
export function Markdown(_a) {
|
|
25
|
+
var content = _a.content;
|
|
26
|
+
var components = useMDXComponents();
|
|
27
|
+
var _b = parseMdx(content.code), Component = _b.Component, error = _b.error;
|
|
28
|
+
if (error) {
|
|
29
|
+
return <h1>Error rendering MDX: {error}</h1>;
|
|
30
|
+
}
|
|
31
|
+
if (!Component) {
|
|
32
|
+
return null;
|
|
33
|
+
}
|
|
34
|
+
return <Component components={components}/>;
|
|
35
|
+
}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
2
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
3
|
+
if (ar || !(i in from)) {
|
|
4
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
5
|
+
ar[i] = from[i];
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
9
|
+
};
|
|
10
|
+
import { useEffect, useState } from 'react';
|
|
11
|
+
import { Column, Text } from '@umami/react-zen';
|
|
12
|
+
import classNames from 'classnames';
|
|
13
|
+
import styles from './PageLinks.module.css';
|
|
14
|
+
export function PageLinks(_a) {
|
|
15
|
+
var _b;
|
|
16
|
+
var items = _a.items, _c = _a.offset, offset = _c === void 0 ? 0 : _c;
|
|
17
|
+
var _d = useState((_b = items === null || items === void 0 ? void 0 : items[0]) === null || _b === void 0 ? void 0 : _b.id), hash = _d[0], setHash = _d[1];
|
|
18
|
+
useEffect(function () {
|
|
19
|
+
var callback = function () {
|
|
20
|
+
var x = __spreadArray([], items, true).reverse().find(function (_a) {
|
|
21
|
+
var _b;
|
|
22
|
+
var id = _a.id;
|
|
23
|
+
var rect = (_b = document.getElementById(id)) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect();
|
|
24
|
+
return rect && rect.top <= offset;
|
|
25
|
+
});
|
|
26
|
+
if (x)
|
|
27
|
+
setHash(x.id);
|
|
28
|
+
};
|
|
29
|
+
window.addEventListener('scroll', callback, false);
|
|
30
|
+
return function () {
|
|
31
|
+
window.removeEventListener('scroll', callback, false);
|
|
32
|
+
};
|
|
33
|
+
}, []);
|
|
34
|
+
if (!(items === null || items === void 0 ? void 0 : items.length)) {
|
|
35
|
+
return null;
|
|
36
|
+
}
|
|
37
|
+
return (<Column gap="3" minWidth="240px" className={styles.links}>
|
|
38
|
+
<Text size="2" weight="bold">
|
|
39
|
+
On this page
|
|
40
|
+
</Text>
|
|
41
|
+
{items.map(function (_a) {
|
|
42
|
+
var _b;
|
|
43
|
+
var name = _a.name, id = _a.id, size = _a.size;
|
|
44
|
+
return (<a key={id} href={"#".concat(id)} className={classNames(styles["indent-".concat(size)], (_b = {}, _b[styles.selected] = hash === id, _b))}>
|
|
45
|
+
{name}
|
|
46
|
+
</a>);
|
|
47
|
+
})}
|
|
48
|
+
</Column>);
|
|
49
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { JSX } from 'react';
|
|
2
|
+
import type { ShisoConfig } from '@/lib/types';
|
|
3
|
+
export interface ShisoProps {
|
|
4
|
+
content: any;
|
|
5
|
+
type: string;
|
|
6
|
+
config: ShisoConfig;
|
|
7
|
+
components?: {
|
|
8
|
+
[key: string]: any;
|
|
9
|
+
};
|
|
10
|
+
templates?: {
|
|
11
|
+
[key: string]: any;
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
export type ShisoTemplateComponent = ({ content, config, }: {
|
|
15
|
+
content: any;
|
|
16
|
+
config: ShisoConfig;
|
|
17
|
+
}) => JSX.Element;
|
|
18
|
+
export declare const ShisoContext: import("react").Context<any>;
|
|
19
|
+
export declare function Shiso({ content, type, config, components, templates }: ShisoProps): JSX.Element;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
import { createContext } from 'react';
|
|
14
|
+
import { MDXProvider } from '@mdx-js/react';
|
|
15
|
+
import { CodeBlock } from '@/components/CodeBlock';
|
|
16
|
+
import { Docs } from '@/components/Docs';
|
|
17
|
+
import { Blog } from '@/components/Blog';
|
|
18
|
+
var defaultTemplates = {
|
|
19
|
+
docs: Docs,
|
|
20
|
+
blog: Blog,
|
|
21
|
+
};
|
|
22
|
+
export var ShisoContext = createContext(null);
|
|
23
|
+
export function Shiso(_a) {
|
|
24
|
+
var content = _a.content, type = _a.type, config = _a.config, components = _a.components, templates = _a.templates;
|
|
25
|
+
var Component = __assign(__assign({}, defaultTemplates), templates)[type];
|
|
26
|
+
if (!Component) {
|
|
27
|
+
return <h1>{"Component not found for type: ".concat(type)}</h1>;
|
|
28
|
+
}
|
|
29
|
+
return (<ShisoContext.Provider value={{ content: content, type: type, config: config }}>
|
|
30
|
+
<MDXProvider components={__assign(__assign({}, components), { pre: CodeBlock })}>
|
|
31
|
+
<Component content={content} config={config}/>
|
|
32
|
+
</MDXProvider>
|
|
33
|
+
</ShisoContext.Provider>);
|
|
34
|
+
}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Box, List, ListItem, ListSection } from '@umami/react-zen';
|
|
3
|
+
import classNames from 'classnames';
|
|
4
|
+
import { usePathname } from 'next/navigation';
|
|
5
|
+
import Link from 'next/link';
|
|
6
|
+
import styles from './SideNav.module.css';
|
|
7
|
+
export function SideNav(_a) {
|
|
8
|
+
var tabs = _a.tabs, navigation = _a.navigation;
|
|
9
|
+
var pathname = usePathname();
|
|
10
|
+
var tab = tabs === null || tabs === void 0 ? void 0 : tabs.find(function (_a) {
|
|
11
|
+
var url = _a.url, id = _a.id;
|
|
12
|
+
return (id !== 'docs' ? pathname.startsWith(url) : false);
|
|
13
|
+
});
|
|
14
|
+
var menu = navigation[(tab === null || tab === void 0 ? void 0 : tab.id) || 'docs'];
|
|
15
|
+
return (<Box className={styles.nav}>
|
|
16
|
+
<List items={navigation} aria-label="nav">
|
|
17
|
+
{menu.map(function (_a) {
|
|
18
|
+
var group = _a.group, pages = _a.pages;
|
|
19
|
+
return (<ListSection title={group} key={group} className={styles.items}>
|
|
20
|
+
{pages.map(function (_a, index) {
|
|
21
|
+
var _b;
|
|
22
|
+
var text = _a.label, url = _a.url;
|
|
23
|
+
return (<ListItem key={index} className={classNames(styles.item, (_b = {},
|
|
24
|
+
_b[styles.selected] = url === pathname,
|
|
25
|
+
_b))}>
|
|
26
|
+
<Link href={url} prefetch={false}>
|
|
27
|
+
{text}
|
|
28
|
+
</Link>
|
|
29
|
+
</ListItem>);
|
|
30
|
+
})}
|
|
31
|
+
</ListSection>);
|
|
32
|
+
})}
|
|
33
|
+
</List>
|
|
34
|
+
</Box>);
|
|
35
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import Link from 'next/link';
|
|
2
|
+
import { usePathname } from 'next/navigation';
|
|
3
|
+
import { Tabs, TabList, Tab } from '@umami/react-zen';
|
|
4
|
+
export function TopNav(_a) {
|
|
5
|
+
var tabs = _a.tabs;
|
|
6
|
+
var pathname = usePathname();
|
|
7
|
+
var tab = tabs === null || tabs === void 0 ? void 0 : tabs.find(function (_a) {
|
|
8
|
+
var id = _a.id, url = _a.url;
|
|
9
|
+
return (id !== 'docs' ? pathname.startsWith(url) : false);
|
|
10
|
+
});
|
|
11
|
+
var selected = (tab === null || tab === void 0 ? void 0 : tab.id) || 'docs';
|
|
12
|
+
return (<Tabs selectedKey={selected}>
|
|
13
|
+
<TabList items={tabs}>
|
|
14
|
+
{function (_a) {
|
|
15
|
+
var id = _a.id, label = _a.label, url = _a.url;
|
|
16
|
+
return (<Tab id={id}>
|
|
17
|
+
<Link href={url}>{label}</Link>
|
|
18
|
+
</Tab>);
|
|
19
|
+
}}
|
|
20
|
+
</TabList>
|
|
21
|
+
</Tabs>);
|
|
22
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { ReactElement } from 'react';
|
|
2
|
+
import type { ShisoConfig } from '@/lib/types';
|
|
3
|
+
export declare const getContent: (name: string | undefined, folder: string) => Promise<any>;
|
|
4
|
+
export declare const getContentIds: (folder: string) => Promise<any>;
|
|
5
|
+
export declare function next(type: string, config: ShisoConfig): {
|
|
6
|
+
generateMetadata: ({ params }: {
|
|
7
|
+
params: Promise<{
|
|
8
|
+
id: string[];
|
|
9
|
+
}>;
|
|
10
|
+
}) => Promise<{
|
|
11
|
+
title: {
|
|
12
|
+
absolute: string;
|
|
13
|
+
default: string;
|
|
14
|
+
};
|
|
15
|
+
}>;
|
|
16
|
+
generateStaticParams: () => Promise<any>;
|
|
17
|
+
renderPage: (render: ({ type, content, config, }: {
|
|
18
|
+
type: string;
|
|
19
|
+
content: any;
|
|
20
|
+
config: ShisoConfig;
|
|
21
|
+
}) => ReactElement) => ({ params }: {
|
|
22
|
+
params: Promise<{
|
|
23
|
+
id: string[];
|
|
24
|
+
}>;
|
|
25
|
+
}) => Promise<ReactElement<unknown, string | import("react").JSXElementConstructor<any>>>;
|
|
26
|
+
};
|
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
11
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
|
|
12
|
+
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
13
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
14
|
+
function step(op) {
|
|
15
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
16
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
17
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
18
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
19
|
+
switch (op[0]) {
|
|
20
|
+
case 0: case 1: t = op; break;
|
|
21
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
22
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
23
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
24
|
+
default:
|
|
25
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
26
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
27
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
28
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
29
|
+
if (t[2]) _.ops.pop();
|
|
30
|
+
_.trys.pop(); continue;
|
|
31
|
+
}
|
|
32
|
+
op = body.call(thisArg, _);
|
|
33
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
34
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
38
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
39
|
+
if (ar || !(i in from)) {
|
|
40
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
41
|
+
ar[i] = from[i];
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
45
|
+
};
|
|
46
|
+
import { cache } from 'react';
|
|
47
|
+
import { compile } from '@mdx-js/mdx';
|
|
48
|
+
import remarkGfm from 'remark-gfm';
|
|
49
|
+
import rehypeHighlight from 'rehype-highlight';
|
|
50
|
+
import matter from 'gray-matter';
|
|
51
|
+
import fs from 'node:fs/promises';
|
|
52
|
+
import path from 'node:path';
|
|
53
|
+
import recursive from 'recursive-readdir';
|
|
54
|
+
function getId(name, folder) {
|
|
55
|
+
return name.replace('.mdx', '').replace(folder, '').replace(/\\/g, '/').replace(/^\//, '');
|
|
56
|
+
}
|
|
57
|
+
export var getContent = cache(function () {
|
|
58
|
+
var args_1 = [];
|
|
59
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
60
|
+
args_1[_i] = arguments[_i];
|
|
61
|
+
}
|
|
62
|
+
return __awaiter(void 0, __spreadArray([], args_1, true), void 0, function (name, folder) {
|
|
63
|
+
var file, postContent, _a, frontmatter, mdxContent, id, anchors, modifiedContent, code, _b;
|
|
64
|
+
if (name === void 0) { name = 'index'; }
|
|
65
|
+
return __generator(this, function (_c) {
|
|
66
|
+
switch (_c.label) {
|
|
67
|
+
case 0:
|
|
68
|
+
file = path.join(folder, "".concat(name, ".mdx"));
|
|
69
|
+
return [4 /*yield*/, fs.readFile(file, 'utf8')];
|
|
70
|
+
case 1:
|
|
71
|
+
postContent = _c.sent();
|
|
72
|
+
_a = matter(postContent), frontmatter = _a.data, mdxContent = _a.content;
|
|
73
|
+
id = getId(name, folder);
|
|
74
|
+
anchors = [];
|
|
75
|
+
modifiedContent = mdxContent
|
|
76
|
+
.split('\n')
|
|
77
|
+
.map(function (line) {
|
|
78
|
+
var match = line.match(/^(#+)\s+(.*)/);
|
|
79
|
+
if (match) {
|
|
80
|
+
var num = match[1], name_1 = match[2];
|
|
81
|
+
var id_1 = name_1.toLowerCase().replace(/\s+/g, '-');
|
|
82
|
+
var size = num.length;
|
|
83
|
+
anchors.push({ name: name_1, id: id_1, size: size });
|
|
84
|
+
return "<h".concat(size, " id=\"").concat(id_1, "\">").concat(name_1.replace(/\{|\}/g, ''), "</h").concat(size, ">");
|
|
85
|
+
}
|
|
86
|
+
return line;
|
|
87
|
+
})
|
|
88
|
+
.join('\n');
|
|
89
|
+
_b = String;
|
|
90
|
+
return [4 /*yield*/, compile(modifiedContent, {
|
|
91
|
+
outputFormat: 'function-body',
|
|
92
|
+
remarkPlugins: [remarkGfm],
|
|
93
|
+
rehypePlugins: [rehypeHighlight],
|
|
94
|
+
})];
|
|
95
|
+
case 2:
|
|
96
|
+
code = _b.apply(void 0, [_c.sent()]);
|
|
97
|
+
return [2 /*return*/, {
|
|
98
|
+
id: id,
|
|
99
|
+
meta: frontmatter,
|
|
100
|
+
content: postContent,
|
|
101
|
+
code: code,
|
|
102
|
+
anchors: anchors,
|
|
103
|
+
}];
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
});
|
|
107
|
+
});
|
|
108
|
+
export var getContentIds = cache(function (folder) { return __awaiter(void 0, void 0, void 0, function () {
|
|
109
|
+
var dir, files;
|
|
110
|
+
return __generator(this, function (_a) {
|
|
111
|
+
switch (_a.label) {
|
|
112
|
+
case 0:
|
|
113
|
+
dir = path.resolve(folder);
|
|
114
|
+
return [4 /*yield*/, recursive(dir)];
|
|
115
|
+
case 1:
|
|
116
|
+
files = _a.sent();
|
|
117
|
+
return [2 /*return*/, files.map(function (file) {
|
|
118
|
+
return getId(file, dir);
|
|
119
|
+
})];
|
|
120
|
+
}
|
|
121
|
+
});
|
|
122
|
+
}); });
|
|
123
|
+
export function next(type, config) {
|
|
124
|
+
var dir = path.join(config.contentDir, type);
|
|
125
|
+
function generateMetadata(_a) {
|
|
126
|
+
return __awaiter(this, arguments, void 0, function (_b) {
|
|
127
|
+
var name, content;
|
|
128
|
+
var _c, _d, _e;
|
|
129
|
+
var params = _b.params;
|
|
130
|
+
return __generator(this, function (_f) {
|
|
131
|
+
switch (_f.label) {
|
|
132
|
+
case 0: return [4 /*yield*/, params];
|
|
133
|
+
case 1:
|
|
134
|
+
name = (_d = (_c = (_f.sent())) === null || _c === void 0 ? void 0 : _c.id) === null || _d === void 0 ? void 0 : _d.join('/');
|
|
135
|
+
return [4 /*yield*/, getContent(name, dir)];
|
|
136
|
+
case 2:
|
|
137
|
+
content = _f.sent();
|
|
138
|
+
return [2 /*return*/, {
|
|
139
|
+
title: {
|
|
140
|
+
absolute: "".concat((_e = content === null || content === void 0 ? void 0 : content.meta) === null || _e === void 0 ? void 0 : _e.title, " \u2013 Shiso"),
|
|
141
|
+
default: 'Shiso',
|
|
142
|
+
},
|
|
143
|
+
}];
|
|
144
|
+
}
|
|
145
|
+
});
|
|
146
|
+
});
|
|
147
|
+
}
|
|
148
|
+
function generateStaticParams() {
|
|
149
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
150
|
+
var ids;
|
|
151
|
+
return __generator(this, function (_a) {
|
|
152
|
+
switch (_a.label) {
|
|
153
|
+
case 0: return [4 /*yield*/, getContentIds(dir)];
|
|
154
|
+
case 1:
|
|
155
|
+
ids = _a.sent();
|
|
156
|
+
return [2 /*return*/, ids.map(function (id) { return ({
|
|
157
|
+
id: id.split('/'),
|
|
158
|
+
}); })];
|
|
159
|
+
}
|
|
160
|
+
});
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
function renderPage(render) {
|
|
164
|
+
var _this = this;
|
|
165
|
+
return function (_a) { return __awaiter(_this, [_a], void 0, function (_b) {
|
|
166
|
+
var name, content;
|
|
167
|
+
var _c, _d;
|
|
168
|
+
var params = _b.params;
|
|
169
|
+
return __generator(this, function (_e) {
|
|
170
|
+
switch (_e.label) {
|
|
171
|
+
case 0: return [4 /*yield*/, params];
|
|
172
|
+
case 1:
|
|
173
|
+
name = (_d = (_c = (_e.sent())) === null || _c === void 0 ? void 0 : _c.id) === null || _d === void 0 ? void 0 : _d.join('/');
|
|
174
|
+
return [4 /*yield*/, getContent(name, dir)];
|
|
175
|
+
case 2:
|
|
176
|
+
content = _e.sent();
|
|
177
|
+
return [2 /*return*/, render({ type: type, content: content, config: config })];
|
|
178
|
+
}
|
|
179
|
+
});
|
|
180
|
+
}); };
|
|
181
|
+
}
|
|
182
|
+
return { generateMetadata: generateMetadata, generateStaticParams: generateStaticParams, renderPage: renderPage };
|
|
183
|
+
}
|