@natsuneko-laboratory/makit-theme-product 0.5.0 → 0.6.1
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/LICENSE +21 -21
- package/README.md +69 -69
- package/dist/components/breadcrumbs.mjs.map +1 -1
- package/dist/components/docs-page.mjs.map +1 -1
- package/dist/components/footer.mjs.map +1 -1
- package/dist/components/header.mjs.map +1 -1
- package/dist/components/icons.mjs.map +1 -1
- package/dist/components/navigation-items.mjs.map +1 -1
- package/dist/components/not-found-page.mjs.map +1 -1
- package/dist/components/page-header.mjs.map +1 -1
- package/dist/components/portal-home-page.mjs.map +1 -1
- package/dist/components/prev-next-links.mjs.map +1 -1
- package/dist/components/root-layout.mjs.map +1 -1
- package/dist/components/sidebar.mjs.map +1 -1
- package/dist/components/table-of-contents.mjs.map +1 -1
- package/dist/components/theme-variables.mjs.map +1 -1
- package/dist/manifest.mjs.map +1 -1
- package/package.json +3 -3
- package/styles/theme.css +93 -93
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2026 Makit contributors
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Makit contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
# @natsuneko-laboratory/makit-theme-product
|
|
2
|
-
|
|
3
|
-
A Makit theme for product documentation — the kind that sits one click from a
|
|
4
|
-
marketing site. Soft cards, pill navigation, a gradient home page, and a
|
|
5
|
-
reading column with room to breathe.
|
|
6
|
-
|
|
7
|
-
## Install
|
|
8
|
-
|
|
9
|
-
```bash
|
|
10
|
-
pnpm add @natsuneko-laboratory/makit-theme-product
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
```ts
|
|
14
|
-
// makit.config.ts
|
|
15
|
-
import { defineConfig } from "@natsuneko-laboratory/makit";
|
|
16
|
-
|
|
17
|
-
export default defineConfig({
|
|
18
|
-
theme: {
|
|
19
|
-
extends: "@natsuneko-laboratory/makit-theme-product",
|
|
20
|
-
},
|
|
21
|
-
});
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
The theme's manifest supplies `radius: "large"` and `accentColor: "indigo"`.
|
|
25
|
-
Anything set in `makit.config.ts` takes priority over those defaults.
|
|
26
|
-
|
|
27
|
-
## Accents
|
|
28
|
-
|
|
29
|
-
`theme.accentColor` accepts the names below, or any CSS color (used as-is for
|
|
30
|
-
both schemes). Each name carries a light/dark pair, because the theme's two
|
|
31
|
-
backgrounds — white and a deep navy — need different weights to stay legible.
|
|
32
|
-
|
|
33
|
-
| Name | Light | Dark |
|
|
34
|
-
| --------- | --------- | --------- |
|
|
35
|
-
| `indigo` | `#4f46e5` | `#818cf8` |
|
|
36
|
-
| `violet` | `#7c3aed` | `#a78bfa` |
|
|
37
|
-
| `blue` | `#2563eb` | `#60a5fa` |
|
|
38
|
-
| `sky` | `#0284c7` | `#38bdf8` |
|
|
39
|
-
| `teal` | `#0d9488` | `#2dd4bf` |
|
|
40
|
-
| `emerald` | `#059669` | `#34d399` |
|
|
41
|
-
| `rose` | `#e11d48` | `#fb7185` |
|
|
42
|
-
| `amber` | `#d97706` | `#fbbf24` |
|
|
43
|
-
|
|
44
|
-
Both palettes meet WCAG AA against their background for body, subtle, and
|
|
45
|
-
accent text.
|
|
46
|
-
|
|
47
|
-
Unlike the terminal theme, this one honors `theme.radius` throughout.
|
|
48
|
-
|
|
49
|
-
## Slots
|
|
50
|
-
|
|
51
|
-
The theme implements thirteen slots:
|
|
52
|
-
|
|
53
|
-
`RootLayout`, `DocsPage`, `PortalHomePage`, `NotFoundPage`, `Header`,
|
|
54
|
-
`Sidebar`, `NavigationItems`, `Breadcrumbs`, `PageHeader`, `PrevNextLinks`,
|
|
55
|
-
`TableOfContents`, `Footer`, `ThemeVariables`.
|
|
56
|
-
|
|
57
|
-
Everything else falls back to Makit's standard theme — its rounded,
|
|
58
|
-
variable-driven styling already matches, so rewriting it would only add
|
|
59
|
-
surface area.
|
|
60
|
-
|
|
61
|
-
## Notes
|
|
62
|
-
|
|
63
|
-
`PageHeader` renders an eyebrow above the title, taken from the page's nearest
|
|
64
|
-
ancestor in the canonical navigation hierarchy. No configuration is involved:
|
|
65
|
-
a page under `guides/` gets "Guides".
|
|
66
|
-
|
|
67
|
-
## License
|
|
68
|
-
|
|
69
|
-
MIT
|
|
1
|
+
# @natsuneko-laboratory/makit-theme-product
|
|
2
|
+
|
|
3
|
+
A Makit theme for product documentation — the kind that sits one click from a
|
|
4
|
+
marketing site. Soft cards, pill navigation, a gradient home page, and a
|
|
5
|
+
reading column with room to breathe.
|
|
6
|
+
|
|
7
|
+
## Install
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
pnpm add @natsuneko-laboratory/makit-theme-product
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
```ts
|
|
14
|
+
// makit.config.ts
|
|
15
|
+
import { defineConfig } from "@natsuneko-laboratory/makit";
|
|
16
|
+
|
|
17
|
+
export default defineConfig({
|
|
18
|
+
theme: {
|
|
19
|
+
extends: "@natsuneko-laboratory/makit-theme-product",
|
|
20
|
+
},
|
|
21
|
+
});
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
The theme's manifest supplies `radius: "large"` and `accentColor: "indigo"`.
|
|
25
|
+
Anything set in `makit.config.ts` takes priority over those defaults.
|
|
26
|
+
|
|
27
|
+
## Accents
|
|
28
|
+
|
|
29
|
+
`theme.accentColor` accepts the names below, or any CSS color (used as-is for
|
|
30
|
+
both schemes). Each name carries a light/dark pair, because the theme's two
|
|
31
|
+
backgrounds — white and a deep navy — need different weights to stay legible.
|
|
32
|
+
|
|
33
|
+
| Name | Light | Dark |
|
|
34
|
+
| --------- | --------- | --------- |
|
|
35
|
+
| `indigo` | `#4f46e5` | `#818cf8` |
|
|
36
|
+
| `violet` | `#7c3aed` | `#a78bfa` |
|
|
37
|
+
| `blue` | `#2563eb` | `#60a5fa` |
|
|
38
|
+
| `sky` | `#0284c7` | `#38bdf8` |
|
|
39
|
+
| `teal` | `#0d9488` | `#2dd4bf` |
|
|
40
|
+
| `emerald` | `#059669` | `#34d399` |
|
|
41
|
+
| `rose` | `#e11d48` | `#fb7185` |
|
|
42
|
+
| `amber` | `#d97706` | `#fbbf24` |
|
|
43
|
+
|
|
44
|
+
Both palettes meet WCAG AA against their background for body, subtle, and
|
|
45
|
+
accent text.
|
|
46
|
+
|
|
47
|
+
Unlike the terminal theme, this one honors `theme.radius` throughout.
|
|
48
|
+
|
|
49
|
+
## Slots
|
|
50
|
+
|
|
51
|
+
The theme implements thirteen slots:
|
|
52
|
+
|
|
53
|
+
`RootLayout`, `DocsPage`, `PortalHomePage`, `NotFoundPage`, `Header`,
|
|
54
|
+
`Sidebar`, `NavigationItems`, `Breadcrumbs`, `PageHeader`, `PrevNextLinks`,
|
|
55
|
+
`TableOfContents`, `Footer`, `ThemeVariables`.
|
|
56
|
+
|
|
57
|
+
Everything else falls back to Makit's standard theme — its rounded,
|
|
58
|
+
variable-driven styling already matches, so rewriting it would only add
|
|
59
|
+
surface area.
|
|
60
|
+
|
|
61
|
+
## Notes
|
|
62
|
+
|
|
63
|
+
`PageHeader` renders an eyebrow above the title, taken from the page's nearest
|
|
64
|
+
ancestor in the canonical navigation hierarchy. No configuration is involved:
|
|
65
|
+
a page under `guides/` gets "Guides".
|
|
66
|
+
|
|
67
|
+
## License
|
|
68
|
+
|
|
69
|
+
MIT
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumbs.mjs","names":[],"sources":["../../src/components/breadcrumbs.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"breadcrumbs.mjs","names":[],"sources":["../../src/components/breadcrumbs.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport type { BreadcrumbsProps } from \"@natsuneko-laboratory/makit-runtime\";\nimport { ChevronRight } from \"./icons.js\";\n\nexport function Breadcrumbs({ items }: BreadcrumbsProps) {\n if (items.length === 0) return null;\n\n return (\n <nav\n aria-label=\"Breadcrumb\"\n className=\"mb-6 flex flex-wrap items-center gap-1 text-[13px] text-[var(--makit-color-subtle)]\"\n >\n {items.map((item, index) => {\n const isLast = index === items.length - 1;\n return (\n <span key={`${item.title}-${index}`} className=\"flex items-center gap-1\">\n {index > 0 && <ChevronRight className=\"size-3.5 opacity-50\" />}\n {item.href && !isLast ? (\n <Link\n href={item.href}\n className=\"transition hover:text-[var(--makit-color-foreground)]\"\n >\n {item.title}\n </Link>\n ) : (\n <span\n aria-current={isLast ? \"page\" : undefined}\n className={isLast ? \"font-medium text-[var(--makit-color-foreground)]\" : undefined}\n >\n {item.title}\n </span>\n )}\n </span>\n );\n })}\n </nav>\n );\n}\n"],"mappings":";;;;AAIA,SAAgB,YAAY,EAAE,SAA2B;CACvD,IAAI,MAAM,WAAW,GAAG,OAAO;CAE/B,OACE,oBAAC,OAAD;EACE,cAAW;EACX,WAAU;YAET,MAAM,KAAK,MAAM,UAAU;GAC1B,MAAM,SAAS,UAAU,MAAM,SAAS;GACxC,OACE,qBAAC,QAAD;IAAqC,WAAU;cAA/C,CACG,QAAQ,KAAK,oBAAC,cAAD,EAAc,WAAU,sBAAuB,CAAA,GAC5D,KAAK,QAAQ,CAAC,SACb,oBAAC,MAAD;KACE,MAAM,KAAK;KACX,WAAU;eAET,KAAK;IACF,CAAA,IAEN,oBAAC,QAAD;KACE,gBAAc,SAAS,SAAS,KAAA;KAChC,WAAW,SAAS,qDAAqD,KAAA;eAExE,KAAK;IACF,CAAA,CAEJ;MAjBK,GAAG,KAAK,MAAM,GAAG,OAiBtB;EAEV,CAAC;CACE,CAAA;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"docs-page.mjs","names":[],"sources":["../../src/components/docs-page.tsx"],"sourcesContent":["import {\
|
|
1
|
+
{"version":3,"file":"docs-page.mjs","names":[],"sources":["../../src/components/docs-page.tsx"],"sourcesContent":["import {\n getCollections,\n getGlobalNavigation,\n getHomeRoute,\n getSearchIndex,\n} from \"@natsuneko-laboratory/makit-runtime\";\nimport type { DocsPageProps } from \"@natsuneko-laboratory/makit-runtime\";\n\nexport async function DocsPage({ page, site, i18n, navigation, components: C }: DocsPageProps) {\n const [homeHref, collections, globalNavigation, searchEntries] = await Promise.all([\n getHomeRoute(page.locale).then((href) => href ?? `${site.basePath}/`),\n getCollections(),\n getGlobalNavigation(page.locale),\n getSearchIndex(page.locale),\n ]);\n\n const prev = page.navigationPosition?.prev;\n const next = page.navigationPosition?.next;\n const shellColumns = page.sidebar\n ? page.tableOfContents\n ? \"md:grid-cols-[17rem_minmax(0,1fr)] xl:grid-cols-[17rem_minmax(0,1fr)_17rem]\"\n : \"md:grid-cols-[17rem_minmax(0,1fr)]\"\n : page.tableOfContents\n ? \"xl:grid-cols-[minmax(0,1fr)_17rem]\"\n : \"grid-cols-1\";\n\n const headerActions = (\n <>\n <C.SearchDialog\n entries={searchEntries}\n pagefindEnabled={process.env.NODE_ENV === \"production\"}\n pagefindBundlePath={`${site.basePath}/pagefind/`}\n />\n <C.CollectionSwitcher\n collections={collections}\n currentCollectionId={page.collectionId}\n locale={page.locale}\n />\n {i18n.enabled && (\n <C.LocaleSwitcher\n page={page}\n locales={i18n.locales}\n missingPageBehavior={i18n.localeSwitcher.missingPage}\n />\n )}\n {site.theme.colorScheme === \"system\" && <C.ThemeToggle />}\n </>\n );\n\n return (\n <div className=\"flex min-h-screen flex-col bg-[var(--makit-color-background)] text-[var(--makit-color-foreground)]\">\n <C.Header\n header={site.header}\n siteTitle={site.title}\n homeHref={homeHref}\n actions={headerActions}\n globalNavigation={globalNavigation}\n />\n <div className={`mx-auto grid w-full max-w-[92rem] flex-1 grid-cols-1 ${shellColumns}`}>\n {page.sidebar && (\n <C.Sidebar navigation={navigation} currentRoute={page.route} components={C} />\n )}\n <main data-pagefind-body className=\"min-w-0 px-5 py-12 sm:px-10 md:py-16\">\n <div className=\"mx-auto max-w-3xl\">\n <C.FallbackNotice page={page} i18n={i18n} />\n <C.Breadcrumbs items={page.breadcrumbs} />\n <C.PageHeader page={page} />\n <C.PageContent html={page.html} copyButton={site.markdown.code.copyButton} />\n <C.PrevNextLinks prev={prev} next={next} />\n </div>\n </main>\n {page.tableOfContents && (\n <C.TableOfContents\n headings={page.headings}\n minDepth={site.markdown.tableOfContents.minDepth}\n maxDepth={site.markdown.tableOfContents.maxDepth}\n actions={\n <C.PageActions\n route={page.route}\n editUrl={page.isFallback ? undefined : page.editUrl}\n markdownEnabled={site.llms.enabled && !page.isFallback && !page.draft}\n placement=\"table-of-contents\"\n />\n }\n />\n )}\n </div>\n <C.Footer footer={site.footer} />\n </div>\n );\n}\n"],"mappings":";;;AAQA,eAAsB,SAAS,EAAE,MAAM,MAAM,MAAM,YAAY,YAAY,KAAoB;CAC7F,MAAM,CAAC,UAAU,aAAa,kBAAkB,iBAAiB,MAAM,QAAQ,IAAI;EACjF,aAAa,KAAK,MAAM,CAAC,CAAC,MAAM,SAAS,QAAQ,GAAG,KAAK,SAAS,EAAE;EACpE,eAAe;EACf,oBAAoB,KAAK,MAAM;EAC/B,eAAe,KAAK,MAAM;CAC5B,CAAC;CAED,MAAM,OAAO,KAAK,oBAAoB;CACtC,MAAM,OAAO,KAAK,oBAAoB;CACtC,MAAM,eAAe,KAAK,UACtB,KAAK,kBACH,gFACA,uCACF,KAAK,kBACH,uCACA;CAEN,MAAM,gBACJ,qBAAA,UAAA,EAAA,UAAA;EACE,oBAAC,EAAE,cAAH;GACE,SAAS;GACT,iBAAiB,QAAQ,IAAI,aAAa;GAC1C,oBAAoB,GAAG,KAAK,SAAS;EACtC,CAAA;EACD,oBAAC,EAAE,oBAAH;GACe;GACb,qBAAqB,KAAK;GAC1B,QAAQ,KAAK;EACd,CAAA;EACA,KAAK,WACJ,oBAAC,EAAE,gBAAH;GACQ;GACN,SAAS,KAAK;GACd,qBAAqB,KAAK,eAAe;EAC1C,CAAA;EAEF,KAAK,MAAM,gBAAgB,YAAY,oBAAC,EAAE,aAAH,CAAgB,CAAA;CACxD,EAAA,CAAA;CAGJ,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,EAAE,QAAH;IACE,QAAQ,KAAK;IACb,WAAW,KAAK;IACN;IACV,SAAS;IACS;GACnB,CAAA;GACD,qBAAC,OAAD;IAAK,WAAW,wDAAwD;cAAxE;KACG,KAAK,WACJ,oBAAC,EAAE,SAAH;MAAuB;MAAY,cAAc,KAAK;MAAO,YAAY;KAAI,CAAA;KAE/E,oBAAC,QAAD;MAAM,sBAAA;MAAmB,WAAU;gBACjC,qBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,oBAAC,EAAE,gBAAH;SAAwB;SAAY;QAAO,CAAA;QAC3C,oBAAC,EAAE,aAAH,EAAe,OAAO,KAAK,YAAc,CAAA;QACzC,oBAAC,EAAE,YAAH,EAAoB,KAAO,CAAA;QAC3B,oBAAC,EAAE,aAAH;SAAe,MAAM,KAAK;SAAM,YAAY,KAAK,SAAS,KAAK;QAAa,CAAA;QAC5E,oBAAC,EAAE,eAAH;SAAuB;SAAY;QAAO,CAAA;OACvC;;KACD,CAAA;KACL,KAAK,mBACJ,oBAAC,EAAE,iBAAH;MACE,UAAU,KAAK;MACf,UAAU,KAAK,SAAS,gBAAgB;MACxC,UAAU,KAAK,SAAS,gBAAgB;MACxC,SACE,oBAAC,EAAE,aAAH;OACE,OAAO,KAAK;OACZ,SAAS,KAAK,aAAa,KAAA,IAAY,KAAK;OAC5C,iBAAiB,KAAK,KAAK,WAAW,CAAC,KAAK,cAAc,CAAC,KAAK;OAChE,WAAU;MACX,CAAA;KAEJ,CAAA;IAEA;;GACL,oBAAC,EAAE,QAAH,EAAU,QAAQ,KAAK,OAAS,CAAA;EAC7B;;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"footer.mjs","names":[],"sources":["../../src/components/footer.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"footer.mjs","names":[],"sources":["../../src/components/footer.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport type { FooterProps } from \"@natsuneko-laboratory/makit-runtime\";\nimport { ExternalArrow } from \"./icons.js\";\n\nexport function Footer({ footer }: FooterProps) {\n if (!footer.copyright && (!footer.links || footer.links.length === 0)) return null;\n\n return (\n <footer className=\"border-t border-[var(--makit-color-border)] bg-[var(--makit-color-muted)] px-6 py-10 text-sm text-[var(--makit-color-subtle)]\">\n <div className=\"mx-auto flex max-w-[92rem] flex-wrap items-center justify-between gap-4\">\n {footer.copyright && <span>{footer.copyright}</span>}\n <nav className=\"flex flex-wrap items-center gap-5\" aria-label=\"Footer links\">\n {(footer.links ?? []).map((link) =>\n link.external ? (\n <a\n key={link.href}\n href={link.href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"flex items-center gap-1 transition hover:text-[var(--makit-color-foreground)]\"\n >\n {link.label}\n <ExternalArrow className=\"size-3 opacity-60\" />\n </a>\n ) : (\n <Link\n key={link.href}\n href={link.href}\n className=\"transition hover:text-[var(--makit-color-foreground)]\"\n >\n {link.label}\n </Link>\n ),\n )}\n </nav>\n </div>\n </footer>\n );\n}\n"],"mappings":";;;;AAIA,SAAgB,OAAO,EAAE,UAAuB;CAC9C,IAAI,CAAC,OAAO,cAAc,CAAC,OAAO,SAAS,OAAO,MAAM,WAAW,IAAI,OAAO;CAE9E,OACE,oBAAC,UAAD;EAAQ,WAAU;YAChB,qBAAC,OAAD;GAAK,WAAU;aAAf,CACG,OAAO,aAAa,oBAAC,QAAD,EAAA,UAAO,OAAO,UAAgB,CAAA,GACnD,oBAAC,OAAD;IAAK,WAAU;IAAoC,cAAW;eAC1D,OAAO,SAAS,CAAC,EAAA,CAAG,KAAK,SACzB,KAAK,WACH,qBAAC,KAAD;KAEE,MAAM,KAAK;KACX,QAAO;KACP,KAAI;KACJ,WAAU;eALZ,CAOG,KAAK,OACN,oBAAC,eAAD,EAAe,WAAU,oBAAqB,CAAA,CAC7C;OARI,KAAK,IAQT,IAEH,oBAAC,MAAD;KAEE,MAAM,KAAK;KACX,WAAU;eAET,KAAK;IACF,GALC,KAAK,IAKN,CAEV;GACG,CAAA,CACF;;CACC,CAAA;AAEZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"header.mjs","names":[],"sources":["../../src/components/header.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"header.mjs","names":[],"sources":["../../src/components/header.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport type { ReactNode } from \"react\";\nimport type {\n GlobalNavigationGroup,\n GlobalNavigationItem,\n HeaderData,\n HeaderProps,\n} from \"@natsuneko-laboratory/makit-runtime\";\nimport { ChevronDown, ExternalArrow } from \"./icons.js\";\n\nconst PILL =\n \"flex items-center gap-1 rounded-full px-3 py-1.5 text-sm font-medium text-[var(--makit-color-subtle)] transition hover:bg-[var(--makit-color-muted)] hover:text-[var(--makit-color-foreground)]\";\n\nfunction NavLink({ title, href, external }: { title: string; href: string; external?: boolean }) {\n return external ? (\n <a href={href} target=\"_blank\" rel=\"noopener noreferrer\" className={PILL}>\n {title}\n <ExternalArrow className=\"size-3 opacity-60\" />\n </a>\n ) : (\n <Link href={href} className={PILL}>\n {title}\n </Link>\n );\n}\n\n/** A `navigation.global` item, with children rendered as a JS-free disclosure. */\nfunction GlobalNavItem({ item }: { item: GlobalNavigationItem }) {\n if (item.items && item.items.length > 0) {\n return (\n <details className=\"relative inline-block\">\n <summary className={`${PILL} cursor-pointer list-none`}>\n {item.title}\n <ChevronDown className=\"size-3.5 opacity-60\" />\n </summary>\n <div className=\"makit-product-card absolute z-20 mt-2 min-w-52 rounded-2xl border border-[var(--makit-color-border)] bg-[var(--makit-color-surface)] p-1.5\">\n {item.items.map((child) => (\n <span key={child.title} className=\"block\">\n <NavLink title={child.title} href={child.href ?? \"#\"} external={child.external} />\n </span>\n ))}\n </div>\n </details>\n );\n }\n return <NavLink title={item.title} href={item.href ?? \"#\"} external={item.external} />;\n}\n\nfunction LogoMark({ header, siteTitle }: { header: HeaderData; siteTitle: string }) {\n if (header.logo) {\n return (\n <>\n <img src={header.logo} alt=\"\" className=\"makit-header-logo-light h-7 w-7 rounded-lg\" />\n {header.logoDark ? (\n <img src={header.logoDark} alt=\"\" className=\"makit-header-logo-dark h-7 w-7 rounded-lg\" />\n ) : null}\n </>\n );\n }\n return (\n <span\n aria-hidden=\"true\"\n className=\"flex h-7 w-7 shrink-0 items-center justify-center rounded-lg bg-linear-to-br from-[var(--makit-color-accent)] to-[color-mix(in_srgb,var(--makit-color-accent)_55%,#000)] text-[13px] font-bold text-white\"\n >\n {(header.title ?? siteTitle).slice(0, 1).toUpperCase()}\n </span>\n );\n}\n\nexport function Header({ header, siteTitle, homeHref, actions, globalNavigation }: HeaderProps) {\n const globalItems: GlobalNavigationItem[] = (\n globalNavigation ?? ([] as readonly GlobalNavigationGroup[])\n ).flatMap((group) => group.items);\n\n return (\n <header className=\"sticky top-0 z-40 border-b border-[var(--makit-color-border)] bg-[color-mix(in_srgb,var(--makit-color-background)_82%,transparent)] backdrop-blur-xl\">\n <div className=\"mx-auto flex h-16 w-full max-w-[92rem] items-center justify-between gap-4 px-4 sm:px-6\">\n <div className=\"flex min-w-0 items-center gap-6\">\n <Link\n href={homeHref}\n className=\"flex min-w-0 items-center gap-2.5 text-[15px] font-semibold tracking-[-0.01em] text-[var(--makit-color-foreground)]\"\n >\n <LogoMark header={header} siteTitle={siteTitle} />\n <span className=\"truncate\">{header.title ?? siteTitle}</span>\n </Link>\n <nav className=\"hidden items-center gap-1 md:flex\" aria-label=\"Global navigation\">\n {globalItems.length > 0\n ? globalItems.map((item) => <GlobalNavItem key={item.title} item={item} />)\n : (header.links ?? []).map((link) => (\n <NavLink\n key={link.href}\n title={link.label}\n href={link.href}\n external={link.external}\n />\n ))}\n </nav>\n </div>\n <div className=\"flex shrink-0 items-center gap-2\">{actions as ReactNode}</div>\n </div>\n </header>\n );\n}\n"],"mappings":";;;;AAUA,MAAM,OACJ;AAEF,SAAS,QAAQ,EAAE,OAAO,MAAM,YAAiE;CAC/F,OAAO,WACL,qBAAC,KAAD;EAAS;EAAM,QAAO;EAAS,KAAI;EAAsB,WAAW;YAApE,CACG,OACD,oBAAC,eAAD,EAAe,WAAU,oBAAqB,CAAA,CAC7C;MAEH,oBAAC,MAAD;EAAY;EAAM,WAAW;YAC1B;CACG,CAAA;AAEV;;AAGA,SAAS,cAAc,EAAE,QAAwC;CAC/D,IAAI,KAAK,SAAS,KAAK,MAAM,SAAS,GACpC,OACE,qBAAC,WAAD;EAAS,WAAU;YAAnB,CACE,qBAAC,WAAD;GAAS,WAAW,GAAG,KAAK;aAA5B,CACG,KAAK,OACN,oBAAC,aAAD,EAAa,WAAU,sBAAuB,CAAA,CACvC;MACT,oBAAC,OAAD;GAAK,WAAU;aACZ,KAAK,MAAM,KAAK,UACf,oBAAC,QAAD;IAAwB,WAAU;cAChC,oBAAC,SAAD;KAAS,OAAO,MAAM;KAAO,MAAM,MAAM,QAAQ;KAAK,UAAU,MAAM;IAAW,CAAA;GAC7E,GAFK,MAAM,KAEX,CACP;EACE,CAAA,CACE;;CAGb,OAAO,oBAAC,SAAD;EAAS,OAAO,KAAK;EAAO,MAAM,KAAK,QAAQ;EAAK,UAAU,KAAK;CAAW,CAAA;AACvF;AAEA,SAAS,SAAS,EAAE,QAAQ,aAAwD;CAClF,IAAI,OAAO,MACT,OACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,OAAD;EAAK,KAAK,OAAO;EAAM,KAAI;EAAG,WAAU;CAA8C,CAAA,GACrF,OAAO,WACN,oBAAC,OAAD;EAAK,KAAK,OAAO;EAAU,KAAI;EAAG,WAAU;CAA6C,CAAA,IACvF,IACJ,EAAA,CAAA;CAGN,OACE,oBAAC,QAAD;EACE,eAAY;EACZ,WAAU;aAER,OAAO,SAAS,UAAA,CAAW,MAAM,GAAG,CAAC,CAAC,CAAC,YAAY;CACjD,CAAA;AAEV;AAEA,SAAgB,OAAO,EAAE,QAAQ,WAAW,UAAU,SAAS,oBAAiC;CAC9F,MAAM,eACJ,oBAAqB,CAAC,EAAA,CACtB,SAAS,UAAU,MAAM,KAAK;CAEhC,OACE,oBAAC,UAAD;EAAQ,WAAU;YAChB,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,qBAAC,MAAD;KACE,MAAM;KACN,WAAU;eAFZ,CAIE,oBAAC,UAAD;MAAkB;MAAmB;KAAY,CAAA,GACjD,oBAAC,QAAD;MAAM,WAAU;gBAAY,OAAO,SAAS;KAAgB,CAAA,CACxD;QACN,oBAAC,OAAD;KAAK,WAAU;KAAoC,cAAW;eAC3D,YAAY,SAAS,IAClB,YAAY,KAAK,SAAS,oBAAC,eAAD,EAAsC,KAAO,GAAzB,KAAK,KAAoB,CAAC,KACvE,OAAO,SAAS,CAAC,EAAA,CAAG,KAAK,SACxB,oBAAC,SAAD;MAEE,OAAO,KAAK;MACZ,MAAM,KAAK;MACX,UAAU,KAAK;KAChB,GAJM,KAAK,IAIX,CACF;IACF,CAAA,CACF;OACL,oBAAC,OAAD;IAAK,WAAU;cAAoC;GAA0B,CAAA,CAC1E;;CACC,CAAA;AAEZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.mjs","names":[],"sources":["../../src/components/icons.tsx"],"sourcesContent":["/**\
|
|
1
|
+
{"version":3,"file":"icons.mjs","names":[],"sources":["../../src/components/icons.tsx"],"sourcesContent":["/**\n * Not a slot name, so Makit ignores this module — it is a helper the theme's\n * own components import (THEME §8).\n *\n * Inline rather than `lucide-react` so the package carries no icon dependency\n * of its own.\n */\n\nexport function ChevronRight({ className }: { className?: string }) {\n return (\n <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\n <path\n d=\"m6 3.5 4.5 4.5L6 12.5\"\n stroke=\"currentColor\"\n strokeWidth=\"1.6\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\nexport function ChevronDown({ className }: { className?: string }) {\n return (\n <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\n <path\n d=\"M3.5 6 8 10.5 12.5 6\"\n stroke=\"currentColor\"\n strokeWidth=\"1.6\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\nexport function ArrowRight({ className }: { className?: string }) {\n return (\n <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\n <path\n d=\"M3 8h10m0 0-4-4m4 4-4 4\"\n stroke=\"currentColor\"\n strokeWidth=\"1.6\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\nexport function ExternalArrow({ className }: { className?: string }) {\n return (\n <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\n <path\n d=\"M6 3h7v7M13 3 4 12\"\n stroke=\"currentColor\"\n strokeWidth=\"1.6\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,aAAa,EAAE,aAAqC;CAClE,OACE,oBAAC,OAAD;EAAK,eAAY;EAAO,SAAQ;EAAY,MAAK;EAAkB;YACjE,oBAAC,QAAD;GACE,GAAE;GACF,QAAO;GACP,aAAY;GACZ,eAAc;GACd,gBAAe;EAChB,CAAA;CACE,CAAA;AAET;AAEA,SAAgB,YAAY,EAAE,aAAqC;CACjE,OACE,oBAAC,OAAD;EAAK,eAAY;EAAO,SAAQ;EAAY,MAAK;EAAkB;YACjE,oBAAC,QAAD;GACE,GAAE;GACF,QAAO;GACP,aAAY;GACZ,eAAc;GACd,gBAAe;EAChB,CAAA;CACE,CAAA;AAET;AAEA,SAAgB,WAAW,EAAE,aAAqC;CAChE,OACE,oBAAC,OAAD;EAAK,eAAY;EAAO,SAAQ;EAAY,MAAK;EAAkB;YACjE,oBAAC,QAAD;GACE,GAAE;GACF,QAAO;GACP,aAAY;GACZ,eAAc;GACd,gBAAe;EAChB,CAAA;CACE,CAAA;AAET;AAEA,SAAgB,cAAc,EAAE,aAAqC;CACnE,OACE,oBAAC,OAAD;EAAK,eAAY;EAAO,SAAQ;EAAY,MAAK;EAAkB;YACjE,oBAAC,QAAD;GACE,GAAE;GACF,QAAO;GACP,aAAY;GACZ,eAAc;GACd,gBAAe;EAChB,CAAA;CACE,CAAA;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"navigation-items.mjs","names":[],"sources":["../../src/components/navigation-items.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"navigation-items.mjs","names":[],"sources":["../../src/components/navigation-items.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport type {\n NavigationItemsProps,\n ResolvedNavContainerNode,\n ResolvedNavNode,\n} from \"@natsuneko-laboratory/makit-runtime\";\nimport { ChevronDown, ExternalArrow } from \"./icons.js\";\n\nfunction containsRoute(node: ResolvedNavNode, currentRoute: string): boolean {\n if (node.type === \"page\") return node.href === currentRoute;\n if (node.type === \"link\") return false;\n if (node.href === currentRoute) return true;\n return node.items.some((item) => containsRoute(item, currentRoute));\n}\n\nfunction ItemLink({\n title,\n href,\n external,\n currentRoute,\n}: {\n title: string;\n href: string | undefined;\n external?: boolean;\n currentRoute: string;\n}) {\n if (!href) {\n return (\n <span className=\"block px-3 py-1.5 text-sm font-medium text-[var(--makit-color-foreground)]\">\n {title}\n </span>\n );\n }\n\n const isActive = href === currentRoute;\n const className = isActive\n ? \"flex items-center gap-1.5 rounded-lg bg-[color-mix(in_srgb,var(--makit-color-accent)_12%,transparent)] px-3 py-1.5 text-sm font-medium text-[var(--makit-color-accent)]\"\n : \"flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm text-[var(--makit-color-subtle)] transition hover:bg-[var(--makit-color-muted)] hover:text-[var(--makit-color-foreground)]\";\n\n const body = (\n <>\n <span className=\"truncate\">{title}</span>\n {external && <ExternalArrow className=\"size-3 shrink-0 opacity-60\" />}\n </>\n );\n\n return external ? (\n <a\n href={href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n aria-current={isActive ? \"page\" : undefined}\n className={className}\n >\n {body}\n </a>\n ) : (\n <Link href={href} aria-current={isActive ? \"page\" : undefined} className={className}>\n {body}\n </Link>\n );\n}\n\n/**\n * A section/group. Ancestors of the current page open regardless of the\n * authored `collapsed` default, and the disclosure is a plain `<details>` so\n * navigation works with JavaScript disabled — same contract as the standard\n * theme, different chrome.\n */\nfunction NavContainer({\n node,\n currentRoute,\n depth,\n}: {\n node: ResolvedNavContainerNode;\n currentRoute: string;\n depth: number;\n}) {\n const label = node.title ?? \"\";\n const heading = (\n <span className=\"text-[11px] font-semibold tracking-[0.1em] text-[var(--makit-color-foreground)] uppercase\">\n {label}\n </span>\n );\n const children = node.items.length > 0 && (\n <NavigationItems items={node.items} currentRoute={currentRoute} depth={depth + 1} />\n );\n\n if (!node.collapsible) {\n return (\n <div className=\"mb-1\">\n {label && <div className=\"mt-6 mb-2 px-3\">{heading}</div>}\n {children}\n </div>\n );\n }\n\n return (\n <details className=\"mb-1\" open={!node.collapsed || containsRoute(node, currentRoute)}>\n <summary className=\"mt-6 mb-2 flex cursor-pointer list-none items-center justify-between gap-2 px-3\">\n {heading}\n <ChevronDown className=\"makit-product-marker size-3.5 text-[var(--makit-color-subtle)] transition-transform\" />\n </summary>\n {children}\n </details>\n );\n}\n\nexport function NavigationItems({ items, currentRoute, depth = 0 }: NavigationItemsProps) {\n return (\n <ul\n className={\n depth === 0\n ? \"space-y-0.5\"\n : \"mt-0.5 ml-3 space-y-0.5 border-l border-[var(--makit-color-border)] pl-2\"\n }\n >\n {items.map((node, index) => (\n <li key={node.type === \"page\" ? node.pageId : `${node.type}-${node.title ?? index}`}>\n {node.type === \"page\" && (\n <ItemLink title={node.title} href={node.href} currentRoute={currentRoute} />\n )}\n {node.type === \"link\" && (\n <ItemLink\n title={node.title}\n href={node.href}\n external={node.external}\n currentRoute={currentRoute}\n />\n )}\n {(node.type === \"section\" || node.type === \"group\") && (\n <NavContainer node={node} currentRoute={currentRoute} depth={depth} />\n )}\n </li>\n ))}\n </ul>\n );\n}\n"],"mappings":";;;;AAQA,SAAS,cAAc,MAAuB,cAA+B;CAC3E,IAAI,KAAK,SAAS,QAAQ,OAAO,KAAK,SAAS;CAC/C,IAAI,KAAK,SAAS,QAAQ,OAAO;CACjC,IAAI,KAAK,SAAS,cAAc,OAAO;CACvC,OAAO,KAAK,MAAM,MAAM,SAAS,cAAc,MAAM,YAAY,CAAC;AACpE;AAEA,SAAS,SAAS,EAChB,OACA,MACA,UACA,gBAMC;CACD,IAAI,CAAC,MACH,OACE,oBAAC,QAAD;EAAM,WAAU;YACb;CACG,CAAA;CAIV,MAAM,WAAW,SAAS;CAC1B,MAAM,YAAY,WACd,4KACA;CAEJ,MAAM,OACJ,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;EAAM,WAAU;YAAY;CAAY,CAAA,GACvC,YAAY,oBAAC,eAAD,EAAe,WAAU,6BAA8B,CAAA,CACpE,EAAA,CAAA;CAGJ,OAAO,WACL,oBAAC,KAAD;EACQ;EACN,QAAO;EACP,KAAI;EACJ,gBAAc,WAAW,SAAS,KAAA;EACvB;YAEV;CACA,CAAA,IAEH,oBAAC,MAAD;EAAY;EAAM,gBAAc,WAAW,SAAS,KAAA;EAAsB;YACvE;CACG,CAAA;AAEV;;;;;;;AAQA,SAAS,aAAa,EACpB,MACA,cACA,SAKC;CACD,MAAM,QAAQ,KAAK,SAAS;CAC5B,MAAM,UACJ,oBAAC,QAAD;EAAM,WAAU;YACb;CACG,CAAA;CAER,MAAM,WAAW,KAAK,MAAM,SAAS,KACnC,oBAAC,iBAAD;EAAiB,OAAO,KAAK;EAAqB;EAAc,OAAO,QAAQ;CAAI,CAAA;CAGrF,IAAI,CAAC,KAAK,aACR,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACG,SAAS,oBAAC,OAAD;GAAK,WAAU;aAAkB;EAAa,CAAA,GACvD,QACE;;CAIT,OACE,qBAAC,WAAD;EAAS,WAAU;EAAO,MAAM,CAAC,KAAK,aAAa,cAAc,MAAM,YAAY;YAAnF,CACE,qBAAC,WAAD;GAAS,WAAU;aAAnB,CACG,SACD,oBAAC,aAAD,EAAa,WAAU,sFAAuF,CAAA,CACvG;MACR,QACM;;AAEb;AAEA,SAAgB,gBAAgB,EAAE,OAAO,cAAc,QAAQ,KAA2B;CACxF,OACE,oBAAC,MAAD;EACE,WACE,UAAU,IACN,gBACA;YAGL,MAAM,KAAK,MAAM,UAChB,qBAAC,MAAD,EAAA,UAAA;GACG,KAAK,SAAS,UACb,oBAAC,UAAD;IAAU,OAAO,KAAK;IAAO,MAAM,KAAK;IAAoB;GAAe,CAAA;GAE5E,KAAK,SAAS,UACb,oBAAC,UAAD;IACE,OAAO,KAAK;IACZ,MAAM,KAAK;IACX,UAAU,KAAK;IACD;GACf,CAAA;IAED,KAAK,SAAS,aAAa,KAAK,SAAS,YACzC,oBAAC,cAAD;IAAoB;IAAoB;IAAqB;GAAQ,CAAA;EAErE,EAAA,GAfK,KAAK,SAAS,SAAS,KAAK,SAAS,GAAG,KAAK,KAAK,GAAG,KAAK,SAAS,OAexE,CACL;CACC,CAAA;AAER"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"not-found-page.mjs","names":[],"sources":["../../src/components/not-found-page.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"not-found-page.mjs","names":[],"sources":["../../src/components/not-found-page.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport { ArrowRight } from \"./icons.js\";\n\n/**\n * Takes no props of its own; `NotFoundPageProps` carries only `components`,\n * which this implementation does not need.\n */\nexport function NotFoundPage() {\n return (\n <div className=\"flex min-h-screen items-center justify-center bg-[var(--makit-color-background)] px-6 text-[var(--makit-color-foreground)]\">\n <div className=\"text-center\">\n <p className=\"bg-linear-to-br from-[var(--makit-color-accent)] to-[color-mix(in_srgb,var(--makit-color-accent)_45%,var(--makit-color-foreground))] bg-clip-text text-7xl font-bold tracking-tight text-transparent\">\n 404\n </p>\n <h1 className=\"mt-4 text-2xl font-semibold tracking-tight\">Page not found</h1>\n <p className=\"mt-2 text-[var(--makit-color-subtle)]\">\n The page you were looking for does not exist.\n </p>\n <Link\n href=\"/\"\n className=\"mt-8 inline-flex items-center gap-2 rounded-full bg-[var(--makit-color-accent)] px-5 py-2.5 text-sm font-medium text-white transition hover:opacity-90\"\n >\n Back to documentation\n <ArrowRight className=\"size-4\" />\n </Link>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;AAOA,SAAgB,eAAe;CAC7B,OACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,OAAD;GAAK,WAAU;aAAf;IACE,oBAAC,KAAD;KAAG,WAAU;eAAuM;IAEjN,CAAA;IACH,oBAAC,MAAD;KAAI,WAAU;eAA6C;IAAkB,CAAA;IAC7E,oBAAC,KAAD;KAAG,WAAU;eAAwC;IAElD,CAAA;IACH,qBAAC,MAAD;KACE,MAAK;KACL,WAAU;eAFZ,CAGC,yBAEC,oBAAC,YAAD,EAAY,WAAU,SAAU,CAAA,CAC5B;;GACH;;CACF,CAAA;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page-header.mjs","names":[],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import type { PageHeaderProps } from \"@natsuneko-laboratory/makit-runtime\";\
|
|
1
|
+
{"version":3,"file":"page-header.mjs","names":[],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import type { PageHeaderProps } from \"@natsuneko-laboratory/makit-runtime\";\n\nexport function PageHeader({ page }: PageHeaderProps) {\n // The nearest ancestor in the canonical hierarchy (spec §39) makes a good\n // eyebrow — \"Guides\", \"API Reference\" — without any extra configuration.\n const eyebrow = page.hierarchy.at(-1)?.title;\n\n return (\n <header className=\"mb-10\">\n {eyebrow && (\n <p className=\"mb-3 text-[13px] font-semibold tracking-wide text-[var(--makit-color-accent)]\">\n {eyebrow}\n </p>\n )}\n <h1 className=\"text-4xl font-semibold tracking-[-0.035em] sm:text-[2.6rem] sm:leading-[1.12]\">\n {page.title}\n </h1>\n {page.description && (\n <p className=\"mt-4 max-w-2xl text-lg leading-8 text-[var(--makit-color-subtle)]\">\n {page.description}\n </p>\n )}\n </header>\n );\n}\n"],"mappings":";;AAEA,SAAgB,WAAW,EAAE,QAAyB;CAGpD,MAAM,UAAU,KAAK,UAAU,GAAG,EAAE,CAAC,EAAE;CAEvC,OACE,qBAAC,UAAD;EAAQ,WAAU;YAAlB;GACG,WACC,oBAAC,KAAD;IAAG,WAAU;cACV;GACA,CAAA;GAEL,oBAAC,MAAD;IAAI,WAAU;cACX,KAAK;GACJ,CAAA;GACH,KAAK,eACJ,oBAAC,KAAD;IAAG,WAAU;cACV,KAAK;GACL,CAAA;EAEC;;AAEZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal-home-page.mjs","names":[],"sources":["../../src/components/portal-home-page.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"portal-home-page.mjs","names":[],"sources":["../../src/components/portal-home-page.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport {\n getGlobalNavigation,\n getHomeRoute,\n getSearchIndex,\n} from \"@natsuneko-laboratory/makit-runtime\";\nimport type {\n PortalCollectionCard,\n PortalHomePageProps,\n} from \"@natsuneko-laboratory/makit-runtime\";\nimport { ArrowRight } from \"./icons.js\";\n\nfunction CollectionCard({ card }: { card: PortalCollectionCard }) {\n return (\n <Link\n href={card.href}\n className=\"makit-product-card group block rounded-2xl border border-[var(--makit-color-border)] bg-[var(--makit-color-surface)] p-6 transition hover:-translate-y-0.5 hover:border-[color-mix(in_srgb,var(--makit-color-accent)_45%,var(--makit-color-border))]\"\n >\n <span\n aria-hidden=\"true\"\n className=\"mb-4 flex size-10 items-center justify-center rounded-xl bg-[color-mix(in_srgb,var(--makit-color-accent)_14%,transparent)] text-lg font-semibold text-[var(--makit-color-accent)]\"\n >\n {card.title.slice(0, 1).toUpperCase()}\n </span>\n <span className=\"flex items-center justify-between gap-3\">\n <span className=\"text-lg font-semibold tracking-tight text-[var(--makit-color-foreground)]\">\n {card.title}\n </span>\n <ArrowRight className=\"size-4 shrink-0 text-[var(--makit-color-subtle)] transition group-hover:translate-x-0.5 group-hover:text-[var(--makit-color-accent)]\" />\n </span>\n {card.description && (\n <span className=\"mt-2 block text-sm leading-6 text-[var(--makit-color-subtle)]\">\n {card.description}\n </span>\n )}\n </Link>\n );\n}\n\nfunction CardGrid({ cards }: { cards: readonly PortalCollectionCard[] }) {\n if (cards.length === 0) return null;\n return (\n <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n {cards.map((card) => (\n <CollectionCard key={card.id} card={card} />\n ))}\n </div>\n );\n}\n\nexport async function PortalHomePage({\n home,\n site,\n i18n,\n locale,\n components: C,\n}: PortalHomePageProps) {\n const homeHref = (await getHomeRoute(locale)) ?? `${site.basePath}/`;\n const [globalNavigation, searchEntries] = await Promise.all([\n getGlobalNavigation(locale),\n getSearchIndex(locale),\n ]);\n\n const localeLinks =\n i18n.enabled && i18n.locales.length > 1\n ? await Promise.all(\n i18n.locales.map(async (candidate) => ({\n locale: candidate,\n href: (await getHomeRoute(candidate.urlLocale)) ?? homeHref,\n })),\n )\n : [];\n\n const headerActions = (\n <>\n <C.SearchDialog\n entries={searchEntries}\n pagefindEnabled={process.env.NODE_ENV === \"production\"}\n pagefindBundlePath={`${site.basePath}/pagefind/`}\n />\n {localeLinks.length > 1 && (\n <div className=\"hidden items-center gap-1 text-sm sm:flex\">\n {localeLinks.map(({ locale: candidate, href }) => (\n <Link\n key={candidate.urlLocale}\n href={href}\n aria-current={candidate.urlLocale === locale ? \"true\" : undefined}\n className={\n candidate.urlLocale === locale\n ? \"rounded-full bg-[color-mix(in_srgb,var(--makit-color-accent)_12%,transparent)] px-3 py-1.5 font-medium text-[var(--makit-color-accent)]\"\n : \"rounded-full px-3 py-1.5 text-[var(--makit-color-subtle)] transition hover:text-[var(--makit-color-foreground)]\"\n }\n >\n {candidate.label}\n </Link>\n ))}\n </div>\n )}\n {site.theme.colorScheme === \"system\" && <C.ThemeToggle />}\n </>\n );\n\n return (\n <div className=\"flex min-h-screen flex-col bg-[var(--makit-color-background)] text-[var(--makit-color-foreground)]\">\n <C.Header\n header={site.header}\n siteTitle={site.title}\n homeHref={homeHref}\n actions={headerActions}\n globalNavigation={globalNavigation}\n />\n <main data-pagefind-body className=\"flex-1\">\n {/* Hero: an accent wash that fades into the page background. */}\n <div className=\"relative overflow-hidden border-b border-[var(--makit-color-border)]\">\n <div\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute inset-x-0 top-0 h-full bg-linear-to-b from-[color-mix(in_srgb,var(--makit-color-accent)_10%,transparent)] to-transparent\"\n />\n <div className=\"relative mx-auto w-full max-w-[92rem] px-5 py-20 sm:px-10 md:py-28\">\n <div className=\"max-w-3xl\">\n <span className=\"mb-5 inline-flex rounded-full border border-[var(--makit-color-border)] bg-[var(--makit-color-surface)] px-3.5 py-1.5 text-xs font-medium text-[var(--makit-color-subtle)]\">\n Documentation\n </span>\n <h1 className=\"text-5xl font-semibold tracking-[-0.045em] sm:text-6xl\">\n {site.title}\n </h1>\n {site.description && (\n <p className=\"mt-6 max-w-2xl text-xl leading-8 text-[var(--makit-color-subtle)]\">\n {site.description}\n </p>\n )}\n </div>\n </div>\n </div>\n\n <div className=\"mx-auto w-full max-w-[92rem] px-5 py-16 sm:px-10\">\n <CardGrid cards={home.featuredCollections} />\n\n {home.sections.map((section, index) => (\n <section key={section.title ?? `section-${index}`} className=\"mt-16\">\n {section.title && (\n <h2 className=\"mb-6 text-xl font-semibold tracking-tight\">{section.title}</h2>\n )}\n <CardGrid cards={section.collections} />\n </section>\n ))}\n </div>\n </main>\n <C.Footer footer={site.footer} />\n </div>\n );\n}\n"],"mappings":";;;;;AAYA,SAAS,eAAe,EAAE,QAAwC;CAChE,OACE,qBAAC,MAAD;EACE,MAAM,KAAK;EACX,WAAU;YAFZ;GAIE,oBAAC,QAAD;IACE,eAAY;IACZ,WAAU;cAET,KAAK,MAAM,MAAM,GAAG,CAAC,CAAC,CAAC,YAAY;GAChC,CAAA;GACN,qBAAC,QAAD;IAAM,WAAU;cAAhB,CACE,oBAAC,QAAD;KAAM,WAAU;eACb,KAAK;IACF,CAAA,GACN,oBAAC,YAAD,EAAY,WAAU,uIAAwI,CAAA,CAC1J;;GACL,KAAK,eACJ,oBAAC,QAAD;IAAM,WAAU;cACb,KAAK;GACF,CAAA;EAEJ;;AAEV;AAEA,SAAS,SAAS,EAAE,SAAqD;CACvE,IAAI,MAAM,WAAW,GAAG,OAAO;CAC/B,OACE,oBAAC,OAAD;EAAK,WAAU;YACZ,MAAM,KAAK,SACV,oBAAC,gBAAD,EAAoC,KAAO,GAAtB,KAAK,EAAiB,CAC5C;CACE,CAAA;AAET;AAEA,eAAsB,eAAe,EACnC,MACA,MACA,MACA,QACA,YAAY,KACU;CACtB,MAAM,WAAY,MAAM,aAAa,MAAM,KAAM,GAAG,KAAK,SAAS;CAClE,MAAM,CAAC,kBAAkB,iBAAiB,MAAM,QAAQ,IAAI,CAC1D,oBAAoB,MAAM,GAC1B,eAAe,MAAM,CACvB,CAAC;CAED,MAAM,cACJ,KAAK,WAAW,KAAK,QAAQ,SAAS,IAClC,MAAM,QAAQ,IACZ,KAAK,QAAQ,IAAI,OAAO,eAAe;EACrC,QAAQ;EACR,MAAO,MAAM,aAAa,UAAU,SAAS,KAAM;CACrD,EAAE,CACJ,IACA,CAAC;CAEP,MAAM,gBACJ,qBAAA,UAAA,EAAA,UAAA;EACE,oBAAC,EAAE,cAAH;GACE,SAAS;GACT,iBAAiB,QAAQ,IAAI,aAAa;GAC1C,oBAAoB,GAAG,KAAK,SAAS;EACtC,CAAA;EACA,YAAY,SAAS,KACpB,oBAAC,OAAD;GAAK,WAAU;aACZ,YAAY,KAAK,EAAE,QAAQ,WAAW,WACrC,oBAAC,MAAD;IAEQ;IACN,gBAAc,UAAU,cAAc,SAAS,SAAS,KAAA;IACxD,WACE,UAAU,cAAc,SACpB,4IACA;cAGL,UAAU;GACP,GAVC,UAAU,SAUX,CACP;EACE,CAAA;EAEN,KAAK,MAAM,gBAAgB,YAAY,oBAAC,EAAE,aAAH,CAAgB,CAAA;CACxD,EAAA,CAAA;CAGJ,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,EAAE,QAAH;IACE,QAAQ,KAAK;IACb,WAAW,KAAK;IACN;IACV,SAAS;IACS;GACnB,CAAA;GACD,qBAAC,QAAD;IAAM,sBAAA;IAAmB,WAAU;cAAnC,CAEE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MACE,eAAY;MACZ,WAAU;KACX,CAAA,GACD,oBAAC,OAAD;MAAK,WAAU;gBACb,qBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,oBAAC,QAAD;SAAM,WAAU;mBAA6K;QAEvL,CAAA;QACN,oBAAC,MAAD;SAAI,WAAU;mBACX,KAAK;QACJ,CAAA;QACH,KAAK,eACJ,oBAAC,KAAD;SAAG,WAAU;mBACV,KAAK;QACL,CAAA;OAEF;;KACF,CAAA,CACF;QAEL,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,UAAD,EAAU,OAAO,KAAK,oBAAsB,CAAA,GAE3C,KAAK,SAAS,KAAK,SAAS,UAC3B,qBAAC,WAAD;MAAmD,WAAU;gBAA7D,CACG,QAAQ,SACP,oBAAC,MAAD;OAAI,WAAU;iBAA6C,QAAQ;MAAU,CAAA,GAE/E,oBAAC,UAAD,EAAU,OAAO,QAAQ,YAAc,CAAA,CAChC;QALK,QAAQ,SAAS,WAAW,OAKjC,CACV,CACE;MACD;;GACN,oBAAC,EAAE,QAAH,EAAU,QAAQ,KAAK,OAAS,CAAA;EAC7B;;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prev-next-links.mjs","names":[],"sources":["../../src/components/prev-next-links.tsx"],"sourcesContent":["import Link from \"next/link\";\
|
|
1
|
+
{"version":3,"file":"prev-next-links.mjs","names":[],"sources":["../../src/components/prev-next-links.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport type { GeneratedPageLink, PrevNextLinksProps } from \"@natsuneko-laboratory/makit-runtime\";\nimport { ArrowRight } from \"./icons.js\";\n\nfunction Card({ link, direction }: { link: GeneratedPageLink; direction: \"prev\" | \"next\" }) {\n const isPrev = direction === \"prev\";\n return (\n <Link\n href={link.href}\n className={`group flex flex-col gap-1.5 rounded-2xl border border-[var(--makit-color-border)] bg-[var(--makit-color-surface)] px-5 py-4 transition hover:-translate-y-0.5 hover:border-[color-mix(in_srgb,var(--makit-color-accent)_45%,var(--makit-color-border))] hover:shadow-lg ${\n isPrev ? \"\" : \"items-end text-right\"\n }`}\n >\n <span className=\"flex items-center gap-1.5 text-xs font-medium text-[var(--makit-color-subtle)]\">\n {isPrev && <ArrowRight className=\"size-3.5 rotate-180\" />}\n {isPrev ? \"Previous\" : \"Next\"}\n {!isPrev && <ArrowRight className=\"size-3.5 transition group-hover:translate-x-0.5\" />}\n </span>\n <span className=\"font-medium text-[var(--makit-color-foreground)] group-hover:text-[var(--makit-color-accent)]\">\n {link.title}\n </span>\n </Link>\n );\n}\n\nexport function PrevNextLinks({ prev, next }: PrevNextLinksProps) {\n if (!prev && !next) return null;\n\n return (\n <nav className=\"mt-16 grid grid-cols-1 gap-4 border-t border-[var(--makit-color-border)] pt-10 sm:grid-cols-2\">\n {prev ? <Card link={prev} direction=\"prev\" /> : <span className=\"hidden sm:block\" />}\n {next ? <Card link={next} direction=\"next\" /> : <span className=\"hidden sm:block\" />}\n </nav>\n );\n}\n"],"mappings":";;;;AAIA,SAAS,KAAK,EAAE,MAAM,aAAsE;CAC1F,MAAM,SAAS,cAAc;CAC7B,OACE,qBAAC,MAAD;EACE,MAAM,KAAK;EACX,WAAW,2QACT,SAAS,KAAK;YAHlB,CAME,qBAAC,QAAD;GAAM,WAAU;aAAhB;IACG,UAAU,oBAAC,YAAD,EAAY,WAAU,sBAAuB,CAAA;IACvD,SAAS,aAAa;IACtB,CAAC,UAAU,oBAAC,YAAD,EAAY,WAAU,kDAAmD,CAAA;GACjF;MACN,oBAAC,QAAD;GAAM,WAAU;aACb,KAAK;EACF,CAAA,CACF;;AAEV;AAEA,SAAgB,cAAc,EAAE,MAAM,QAA4B;CAChE,IAAI,CAAC,QAAQ,CAAC,MAAM,OAAO;CAE3B,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACG,OAAO,oBAAC,MAAD;GAAM,MAAM;GAAM,WAAU;EAAQ,CAAA,IAAI,oBAAC,QAAD,EAAM,WAAU,kBAAmB,CAAA,GAClF,OAAO,oBAAC,MAAD;GAAM,MAAM;GAAM,WAAU;EAAQ,CAAA,IAAI,oBAAC,QAAD,EAAM,WAAU,kBAAmB,CAAA,CAChF;;AAET"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"root-layout.mjs","names":[],"sources":["../../src/components/root-layout.tsx"],"sourcesContent":["import type { RootLayoutProps } from \"@natsuneko-laboratory/makit-runtime\";\
|
|
1
|
+
{"version":3,"file":"root-layout.mjs","names":[],"sources":["../../src/components/root-layout.tsx"],"sourcesContent":["import type { RootLayoutProps } from \"@natsuneko-laboratory/makit-runtime\";\n\n/**\n * `bodyStart` must be rendered first inside `<body>` (THEME §10.3) — it\n * carries the CSS variables and the pre-hydration color-scheme script.\n */\nexport function RootLayout({ htmlProps, bodyProps, bodyStart, children }: RootLayoutProps) {\n return (\n <html {...htmlProps} data-makit-theme=\"product\">\n <body {...bodyProps} className=\"makit-product antialiased\">\n {bodyStart}\n {children}\n </body>\n </html>\n );\n}\n"],"mappings":";;;;;;AAMA,SAAgB,WAAW,EAAE,WAAW,WAAW,WAAW,YAA6B;CACzF,OACE,oBAAC,QAAD;EAAM,GAAI;EAAW,oBAAiB;YACpC,qBAAC,QAAD;GAAM,GAAI;GAAW,WAAU;aAA/B,CACG,WACA,QACG;;CACF,CAAA;AAEV"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.mjs","names":["NavigationItems","ProductNavigationItems"],"sources":["../../src/components/sidebar.tsx"],"sourcesContent":["import type { SidebarProps } from \"@natsuneko-laboratory/makit-runtime\";\
|
|
1
|
+
{"version":3,"file":"sidebar.mjs","names":["NavigationItems","ProductNavigationItems"],"sources":["../../src/components/sidebar.tsx"],"sourcesContent":["import type { SidebarProps } from \"@natsuneko-laboratory/makit-runtime\";\nimport { ChevronDown } from \"./icons.js\";\nimport { NavigationItems as ProductNavigationItems } from \"./navigation-items.js\";\n\nexport function Sidebar({ navigation, currentRoute, components }: SidebarProps) {\n if (navigation.length === 0) return null;\n\n // Honor a `NavigationItems` override layered on top of this theme\n // (THEME §12); fall back to this theme's own list, not the standard one.\n const NavigationItems = components?.NavigationItems ?? ProductNavigationItems;\n\n return (\n <>\n <aside className=\"sticky top-16 hidden h-[calc(100vh-4rem)] overflow-y-auto px-4 py-8 md:block\">\n <nav aria-label=\"Documentation navigation\">\n <NavigationItems items={navigation} currentRoute={currentRoute} />\n </nav>\n </aside>\n\n {/* Mobile: a JS-free disclosure holding the same tree. */}\n <details className=\"border-b border-[var(--makit-color-border)] px-5 py-3 md:hidden\">\n <summary className=\"flex cursor-pointer list-none items-center justify-between text-sm font-medium text-[var(--makit-color-foreground)]\">\n Documentation\n <ChevronDown className=\"makit-product-marker size-4 text-[var(--makit-color-subtle)] transition-transform\" />\n </summary>\n <nav className=\"mt-3\" aria-label=\"Documentation navigation\">\n <NavigationItems items={navigation} currentRoute={currentRoute} />\n </nav>\n </details>\n </>\n );\n}\n"],"mappings":";;;;AAIA,SAAgB,QAAQ,EAAE,YAAY,cAAc,cAA4B;CAC9E,IAAI,WAAW,WAAW,GAAG,OAAO;CAIpC,MAAMA,oBAAkB,YAAY,mBAAmBC;CAEvD,OACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,SAAD;EAAO,WAAU;YACf,oBAAC,OAAD;GAAK,cAAW;aACd,oBAACD,mBAAD;IAAiB,OAAO;IAA0B;GAAe,CAAA;EAC9D,CAAA;CACA,CAAA,GAGP,qBAAC,WAAD;EAAS,WAAU;YAAnB,CACE,qBAAC,WAAD;GAAS,WAAU;aAAnB,CAAyI,iBAEvI,oBAAC,aAAD,EAAa,WAAU,oFAAqF,CAAA,CACrG;MACT,oBAAC,OAAD;GAAK,WAAU;GAAO,cAAW;aAC/B,oBAACA,mBAAD;IAAiB,OAAO;IAA0B;GAAe,CAAA;EAC9D,CAAA,CACE;GACT,EAAA,CAAA;AAEN"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-of-contents.mjs","names":[],"sources":["../../src/components/table-of-contents.tsx"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"table-of-contents.mjs","names":[],"sources":["../../src/components/table-of-contents.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useState } from \"react\";\nimport type { TableOfContentsProps } from \"@natsuneko-laboratory/makit-runtime\";\n\nexport function TableOfContents({ headings, minDepth, maxDepth, actions }: TableOfContentsProps) {\n const visible = useMemo(\n () => headings.filter((h) => h.depth >= minDepth && h.depth <= maxDepth && h.id),\n [headings, minDepth, maxDepth],\n );\n const [activeId, setActiveId] = useState<string | undefined>(() => visible[0]?.id);\n\n useEffect(() => {\n if (visible.length === 0) return;\n\n let frame = 0;\n const updateActiveHeading = () => {\n cancelAnimationFrame(frame);\n frame = requestAnimationFrame(() => {\n // Matches this theme's `scroll-padding-top`.\n const activationLine = 128;\n let nextId = visible[0]?.id;\n\n for (const heading of visible) {\n const element = document.getElementById(heading.id);\n if (!element) continue;\n if (element.getBoundingClientRect().top <= activationLine) nextId = heading.id;\n else break;\n }\n\n setActiveId(nextId);\n });\n };\n\n updateActiveHeading();\n window.addEventListener(\"scroll\", updateActiveHeading, { passive: true });\n window.addEventListener(\"hashchange\", updateActiveHeading);\n window.addEventListener(\"resize\", updateActiveHeading);\n\n return () => {\n cancelAnimationFrame(frame);\n window.removeEventListener(\"scroll\", updateActiveHeading);\n window.removeEventListener(\"hashchange\", updateActiveHeading);\n window.removeEventListener(\"resize\", updateActiveHeading);\n };\n }, [visible]);\n\n if (visible.length === 0) return null;\n\n return (\n <aside className=\"sticky top-16 hidden h-[calc(100vh-4rem)] overflow-y-auto px-4 py-8 xl:block\">\n <div className=\"makit-product-card rounded-2xl border border-[var(--makit-color-border)] bg-[var(--makit-color-surface)] p-4\">\n <h2 className=\"mb-3 text-[11px] font-semibold tracking-[0.1em] text-[var(--makit-color-subtle)] uppercase\">\n On this page\n </h2>\n <nav aria-label=\"Table of contents\">\n <ul className=\"space-y-1\">\n {visible.map((heading) => {\n const isActive = activeId === heading.id;\n return (\n <li\n key={heading.id}\n style={{ paddingLeft: `${(heading.depth - minDepth) * 0.75}rem` }}\n >\n <a\n href={`#${heading.id}`}\n aria-current={isActive ? \"location\" : undefined}\n className={\n isActive\n ? \"flex items-center gap-2 rounded-lg bg-[color-mix(in_srgb,var(--makit-color-accent)_12%,transparent)] px-2.5 py-1.5 text-[13px] leading-5 font-medium text-[var(--makit-color-accent)]\"\n : \"flex items-center gap-2 rounded-lg px-2.5 py-1.5 text-[13px] leading-5 text-[var(--makit-color-subtle)] transition hover:bg-[var(--makit-color-muted)] hover:text-[var(--makit-color-foreground)]\"\n }\n >\n {heading.text}\n </a>\n </li>\n );\n })}\n </ul>\n </nav>\n {actions}\n </div>\n </aside>\n );\n}\n"],"mappings":";;;;AAKA,SAAgB,gBAAgB,EAAE,UAAU,UAAU,UAAU,WAAiC;CAC/F,MAAM,UAAU,cACR,SAAS,QAAQ,MAAM,EAAE,SAAS,YAAY,EAAE,SAAS,YAAY,EAAE,EAAE,GAC/E;EAAC;EAAU;EAAU;CAAQ,CAC/B;CACA,MAAM,CAAC,UAAU,eAAe,eAAmC,QAAQ,EAAE,EAAE,EAAE;CAEjF,gBAAgB;EACd,IAAI,QAAQ,WAAW,GAAG;EAE1B,IAAI,QAAQ;EACZ,MAAM,4BAA4B;GAChC,qBAAqB,KAAK;GAC1B,QAAQ,4BAA4B;IAElC,MAAM,iBAAiB;IACvB,IAAI,SAAS,QAAQ,EAAE,EAAE;IAEzB,KAAK,MAAM,WAAW,SAAS;KAC7B,MAAM,UAAU,SAAS,eAAe,QAAQ,EAAE;KAClD,IAAI,CAAC,SAAS;KACd,IAAI,QAAQ,sBAAsB,CAAC,CAAC,OAAO,gBAAgB,SAAS,QAAQ;UACvE;IACP;IAEA,YAAY,MAAM;GACpB,CAAC;EACH;EAEA,oBAAoB;EACpB,OAAO,iBAAiB,UAAU,qBAAqB,EAAE,SAAS,KAAK,CAAC;EACxE,OAAO,iBAAiB,cAAc,mBAAmB;EACzD,OAAO,iBAAiB,UAAU,mBAAmB;EAErD,aAAa;GACX,qBAAqB,KAAK;GAC1B,OAAO,oBAAoB,UAAU,mBAAmB;GACxD,OAAO,oBAAoB,cAAc,mBAAmB;GAC5D,OAAO,oBAAoB,UAAU,mBAAmB;EAC1D;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,IAAI,QAAQ,WAAW,GAAG,OAAO;CAEjC,OACE,oBAAC,SAAD;EAAO,WAAU;YACf,qBAAC,OAAD;GAAK,WAAU;aAAf;IACE,oBAAC,MAAD;KAAI,WAAU;eAA6F;IAEvG,CAAA;IACJ,oBAAC,OAAD;KAAK,cAAW;eACd,oBAAC,MAAD;MAAI,WAAU;gBACX,QAAQ,KAAK,YAAY;OACxB,MAAM,WAAW,aAAa,QAAQ;OACtC,OACE,oBAAC,MAAD;QAEE,OAAO,EAAE,aAAa,IAAI,QAAQ,QAAQ,YAAY,IAAK,KAAK;kBAEhE,oBAAC,KAAD;SACE,MAAM,IAAI,QAAQ;SAClB,gBAAc,WAAW,aAAa,KAAA;SACtC,WACE,WACI,0LACA;mBAGL,QAAQ;QACR,CAAA;OACD,GAdG,QAAQ,EAcX;MAER,CAAC;KACC,CAAA;IACD,CAAA;IACJ;GACE;;CACA,CAAA;AAEX"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-variables.mjs","names":[],"sources":["../../src/components/theme-variables.tsx"],"sourcesContent":["import type { ThemeVariablesProps } from \"@natsuneko-laboratory/makit-runtime\";\
|
|
1
|
+
{"version":3,"file":"theme-variables.mjs","names":[],"sources":["../../src/components/theme-variables.tsx"],"sourcesContent":["import type { ThemeVariablesProps } from \"@natsuneko-laboratory/makit-runtime\";\n\ninterface AccentValue {\n light: string;\n dark: string;\n}\n\n/**\n * The accent drives the logo mark, the active navigation pill, and the home\n * page's gradient, so each name carries a pair tuned for contrast against\n * this theme's two backgrounds rather than a single hue.\n */\nconst ACCENTS: Record<string, AccentValue> = {\n indigo: { light: \"#4f46e5\", dark: \"#818cf8\" },\n violet: { light: \"#7c3aed\", dark: \"#a78bfa\" },\n blue: { light: \"#2563eb\", dark: \"#60a5fa\" },\n sky: { light: \"#0284c7\", dark: \"#38bdf8\" },\n teal: { light: \"#0d9488\", dark: \"#2dd4bf\" },\n emerald: { light: \"#059669\", dark: \"#34d399\" },\n rose: { light: \"#e11d48\", dark: \"#fb7185\" },\n amber: { light: \"#d97706\", dark: \"#fbbf24\" },\n};\n\nfunction resolveAccent(accentColor: string | undefined): AccentValue {\n if (!accentColor) return ACCENTS.indigo!;\n const named = ACCENTS[accentColor.toLowerCase()];\n if (named) return named;\n return { light: accentColor, dark: accentColor };\n}\n\nconst RADIUS: Record<string, string> = {\n none: \"0px\",\n small: \"0.375rem\",\n medium: \"0.625rem\",\n large: \"0.875rem\",\n};\n\n/**\n * Replaces the standard palette (THEME §13.3). The grays are slightly\n * blue-tinted (slate rather than zinc) so they sit under a saturated accent\n * without looking muddy, and `--makit-color-surface` is deliberately lifted\n * off the background in both schemes — this theme leans on cards.\n */\nconst LIGHT = [\n \"--makit-color-background:#ffffff\",\n \"--makit-color-surface:#ffffff\",\n \"--makit-color-foreground:#0f172a\",\n \"--makit-color-subtle:#64748b\",\n \"--makit-color-muted:#f1f5f9\",\n \"--makit-color-border:#e2e8f0\",\n \"--makit-color-border-strong:#cbd5e1\",\n].join(\";\");\n\nconst DARK = [\n \"--makit-color-background:#0b1120\",\n \"--makit-color-surface:#131c2f\",\n \"--makit-color-foreground:#e8edf7\",\n \"--makit-color-subtle:#94a3b8\",\n \"--makit-color-muted:#1c273d\",\n \"--makit-color-border:#22304a\",\n \"--makit-color-border-strong:#38486a\",\n].join(\";\");\n\nexport function ThemeVariables({ theme }: ThemeVariablesProps) {\n const accent = resolveAccent(theme.accentColor);\n const radius = RADIUS[theme.radius] ?? RADIUS.large!;\n\n const css = `:root{--makit-color-accent:${accent.light};${LIGHT};--makit-radius:${radius};--makit-product-shadow:0 1px 2px rgb(15 23 42 / 0.04),0 8px 24px -12px rgb(15 23 42 / 0.12);}\n:root[data-theme=\"dark\"]{--makit-color-accent:${accent.dark};${DARK};--makit-product-shadow:0 1px 2px rgb(0 0 0 / 0.3),0 8px 24px -12px rgb(0 0 0 / 0.6);}\n@media (prefers-color-scheme: dark){:root:not([data-theme=\"light\"]):not([data-theme=\"dark\"]){--makit-color-accent:${accent.dark};${DARK};--makit-product-shadow:0 1px 2px rgb(0 0 0 / 0.3),0 8px 24px -12px rgb(0 0 0 / 0.6);}}\n.makit-header-logo-dark{display:none}:root[data-theme=\"dark\"] .makit-header-logo-light{display:none}:root[data-theme=\"dark\"] .makit-header-logo-dark{display:block}@media (prefers-color-scheme: dark){:root:not([data-theme=\"light\"]):not([data-theme=\"dark\"]) .makit-header-logo-light{display:none}:root:not([data-theme=\"light\"]):not([data-theme=\"dark\"]) .makit-header-logo-dark{display:block}}`;\n\n return <style dangerouslySetInnerHTML={{ __html: css }} />;\n}\n"],"mappings":";;;;;;;AAYA,MAAM,UAAuC;CAC3C,QAAQ;EAAE,OAAO;EAAW,MAAM;CAAU;CAC5C,QAAQ;EAAE,OAAO;EAAW,MAAM;CAAU;CAC5C,MAAM;EAAE,OAAO;EAAW,MAAM;CAAU;CAC1C,KAAK;EAAE,OAAO;EAAW,MAAM;CAAU;CACzC,MAAM;EAAE,OAAO;EAAW,MAAM;CAAU;CAC1C,SAAS;EAAE,OAAO;EAAW,MAAM;CAAU;CAC7C,MAAM;EAAE,OAAO;EAAW,MAAM;CAAU;CAC1C,OAAO;EAAE,OAAO;EAAW,MAAM;CAAU;AAC7C;AAEA,SAAS,cAAc,aAA8C;CACnE,IAAI,CAAC,aAAa,OAAO,QAAQ;CACjC,MAAM,QAAQ,QAAQ,YAAY,YAAY;CAC9C,IAAI,OAAO,OAAO;CAClB,OAAO;EAAE,OAAO;EAAa,MAAM;CAAY;AACjD;AAEA,MAAM,SAAiC;CACrC,MAAM;CACN,OAAO;CACP,QAAQ;CACR,OAAO;AACT;;;;;;;AAQA,MAAM,QAAQ;CACZ;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;AAEV,MAAM,OAAO;CACX;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;AAEV,SAAgB,eAAe,EAAE,SAA8B;CAC7D,MAAM,SAAS,cAAc,MAAM,WAAW;CAC9C,MAAM,SAAS,OAAO,MAAM,WAAW,OAAO;CAO9C,OAAO,oBAAC,SAAD,EAAO,yBAAyB,EAAE,QAAQ,8BALP,OAAO,MAAM,GAAG,MAAM,kBAAkB,OAAO;gDAC3C,OAAO,KAAK,GAAG,KAAK;oHACgD,OAAO,KAAK,GAAG,KAAK;wYAGjF,EAAI,CAAA;AAC3D"}
|
package/dist/manifest.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"manifest.mjs","names":[],"sources":["../src/manifest.ts"],"sourcesContent":["import { defineTheme } from \"@natsuneko-laboratory/makit/theme\";\
|
|
1
|
+
{"version":3,"file":"manifest.mjs","names":[],"sources":["../src/manifest.ts"],"sourcesContent":["import { defineTheme } from \"@natsuneko-laboratory/makit/theme\";\n\nexport default defineTheme({\n name: \"@natsuneko-laboratory/makit-theme-product\",\n styles: [\"./styles/theme.css\"],\n // Only the built components carry class names; scanning the package root\n // would drag `node_modules` in (THEME §13.1).\n tailwindSources: [\"./dist/**/*.mjs\"],\n defaults: {\n radius: \"large\",\n accentColor: \"indigo\",\n },\n});\n"],"mappings":";;AAEA,IAAA,mBAAe,YAAY;CACzB,MAAM;CACN,QAAQ,CAAC,oBAAoB;CAG7B,iBAAiB,CAAC,iBAAiB;CACnC,UAAU;EACR,QAAQ;EACR,aAAa;CACf;AACF,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@natsuneko-laboratory/makit-theme-product",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"description": "A polished, product-documentation Makit theme with soft cards, pill navigation, and a gradient home.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": "https://github.com/mika-f/makit.git",
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"tsdown": "^0.22.8",
|
|
36
36
|
"typescript": "^7.0.2",
|
|
37
37
|
"vitest": "^4.1.10",
|
|
38
|
-
"@natsuneko-laboratory/makit": "0.
|
|
39
|
-
"@natsuneko-laboratory/makit-runtime": "0.
|
|
38
|
+
"@natsuneko-laboratory/makit": "0.6.1",
|
|
39
|
+
"@natsuneko-laboratory/makit-runtime": "0.6.1"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@natsuneko-laboratory/makit": "^0.4.0",
|
package/styles/theme.css
CHANGED
|
@@ -1,93 +1,93 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Product theme (THEME §13.2). Imported after Makit's base stylesheet and
|
|
3
|
-
* before the project's own `styles`, so a project can still override anything
|
|
4
|
-
* here from `config.styles`.
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
.makit-product {
|
|
8
|
-
font-family:
|
|
9
|
-
Inter,
|
|
10
|
-
"Inter Variable",
|
|
11
|
-
ui-sans-serif,
|
|
12
|
-
system-ui,
|
|
13
|
-
-apple-system,
|
|
14
|
-
BlinkMacSystemFont,
|
|
15
|
-
"Segoe UI",
|
|
16
|
-
"Hiragino Sans",
|
|
17
|
-
"Noto Sans JP",
|
|
18
|
-
sans-serif;
|
|
19
|
-
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
/* Cards and popovers sit on the surface color, which is lifted off the page. */
|
|
23
|
-
.makit-product .makit-product-card {
|
|
24
|
-
box-shadow: var(--makit-product-shadow);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
/* The nav chevron points down when the section is open (no JS involved). */
|
|
28
|
-
.makit-product details[open] > summary .makit-product-marker {
|
|
29
|
-
transform: rotate(180deg);
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
/*
|
|
33
|
-
* The reading column is generous rather than dense — this theme is aimed at
|
|
34
|
-
* marketing-adjacent product docs, not API reference.
|
|
35
|
-
*/
|
|
36
|
-
.makit-product .makit-prose {
|
|
37
|
-
font-size: 1.0625rem;
|
|
38
|
-
line-height: 1.8;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.makit-product .makit-prose :where(h2) {
|
|
42
|
-
margin-top: 3rem;
|
|
43
|
-
padding-top: 2rem;
|
|
44
|
-
border-top: 1px solid var(--makit-color-border);
|
|
45
|
-
font-size: 1.5rem;
|
|
46
|
-
letter-spacing: -0.02em;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
.makit-product .makit-prose :where(h2:first-child) {
|
|
50
|
-
margin-top: 0;
|
|
51
|
-
padding-top: 0;
|
|
52
|
-
border-top: 0;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.makit-product .makit-prose :where(h3) {
|
|
56
|
-
margin-top: 2.25rem;
|
|
57
|
-
font-size: 1.175rem;
|
|
58
|
-
letter-spacing: -0.015em;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
.makit-product .makit-prose :where(a) {
|
|
62
|
-
color: var(--makit-color-accent);
|
|
63
|
-
font-weight: 500;
|
|
64
|
-
text-decoration-color: color-mix(in srgb, var(--makit-color-accent) 35%, transparent);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.makit-product .makit-prose :where(blockquote) {
|
|
68
|
-
border-left-width: 3px;
|
|
69
|
-
border-radius: 0 var(--makit-radius) var(--makit-radius) 0;
|
|
70
|
-
background: var(--makit-color-muted);
|
|
71
|
-
padding: 0.25rem 1.25rem;
|
|
72
|
-
font-style: normal;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.makit-product .makit-prose .makit-alert {
|
|
76
|
-
border-left-width: 3px;
|
|
77
|
-
border-radius: var(--makit-radius);
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
.makit-product .makit-prose :where(table) {
|
|
81
|
-
font-size: 0.9375rem;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
.makit-product pre.shiki {
|
|
85
|
-
border-radius: var(--makit-radius);
|
|
86
|
-
box-shadow: var(--makit-product-shadow);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
/* Anchor targets clear the taller header. Must sit on the scrolling element
|
|
90
|
-
(`<html>`), not on the body class. */
|
|
91
|
-
:root[data-makit-theme="product"] {
|
|
92
|
-
scroll-padding-top: 7rem;
|
|
93
|
-
}
|
|
1
|
+
/*
|
|
2
|
+
* Product theme (THEME §13.2). Imported after Makit's base stylesheet and
|
|
3
|
+
* before the project's own `styles`, so a project can still override anything
|
|
4
|
+
* here from `config.styles`.
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
.makit-product {
|
|
8
|
+
font-family:
|
|
9
|
+
Inter,
|
|
10
|
+
"Inter Variable",
|
|
11
|
+
ui-sans-serif,
|
|
12
|
+
system-ui,
|
|
13
|
+
-apple-system,
|
|
14
|
+
BlinkMacSystemFont,
|
|
15
|
+
"Segoe UI",
|
|
16
|
+
"Hiragino Sans",
|
|
17
|
+
"Noto Sans JP",
|
|
18
|
+
sans-serif;
|
|
19
|
+
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/* Cards and popovers sit on the surface color, which is lifted off the page. */
|
|
23
|
+
.makit-product .makit-product-card {
|
|
24
|
+
box-shadow: var(--makit-product-shadow);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
/* The nav chevron points down when the section is open (no JS involved). */
|
|
28
|
+
.makit-product details[open] > summary .makit-product-marker {
|
|
29
|
+
transform: rotate(180deg);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/*
|
|
33
|
+
* The reading column is generous rather than dense — this theme is aimed at
|
|
34
|
+
* marketing-adjacent product docs, not API reference.
|
|
35
|
+
*/
|
|
36
|
+
.makit-product .makit-prose {
|
|
37
|
+
font-size: 1.0625rem;
|
|
38
|
+
line-height: 1.8;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.makit-product .makit-prose :where(h2) {
|
|
42
|
+
margin-top: 3rem;
|
|
43
|
+
padding-top: 2rem;
|
|
44
|
+
border-top: 1px solid var(--makit-color-border);
|
|
45
|
+
font-size: 1.5rem;
|
|
46
|
+
letter-spacing: -0.02em;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.makit-product .makit-prose :where(h2:first-child) {
|
|
50
|
+
margin-top: 0;
|
|
51
|
+
padding-top: 0;
|
|
52
|
+
border-top: 0;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.makit-product .makit-prose :where(h3) {
|
|
56
|
+
margin-top: 2.25rem;
|
|
57
|
+
font-size: 1.175rem;
|
|
58
|
+
letter-spacing: -0.015em;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.makit-product .makit-prose :where(a) {
|
|
62
|
+
color: var(--makit-color-accent);
|
|
63
|
+
font-weight: 500;
|
|
64
|
+
text-decoration-color: color-mix(in srgb, var(--makit-color-accent) 35%, transparent);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.makit-product .makit-prose :where(blockquote) {
|
|
68
|
+
border-left-width: 3px;
|
|
69
|
+
border-radius: 0 var(--makit-radius) var(--makit-radius) 0;
|
|
70
|
+
background: var(--makit-color-muted);
|
|
71
|
+
padding: 0.25rem 1.25rem;
|
|
72
|
+
font-style: normal;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.makit-product .makit-prose .makit-alert {
|
|
76
|
+
border-left-width: 3px;
|
|
77
|
+
border-radius: var(--makit-radius);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.makit-product .makit-prose :where(table) {
|
|
81
|
+
font-size: 0.9375rem;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.makit-product pre.shiki {
|
|
85
|
+
border-radius: var(--makit-radius);
|
|
86
|
+
box-shadow: var(--makit-product-shadow);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
/* Anchor targets clear the taller header. Must sit on the scrolling element
|
|
90
|
+
(`<html>`), not on the body class. */
|
|
91
|
+
:root[data-makit-theme="product"] {
|
|
92
|
+
scroll-padding-top: 7rem;
|
|
93
|
+
}
|