@natsuneko-laboratory/makit-theme-product 0.5.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Makit contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,69 @@
+# @natsuneko-laboratory/makit-theme-product
+
+A Makit theme for product documentation — the kind that sits one click from a
+marketing site. Soft cards, pill navigation, a gradient home page, and a
+reading column with room to breathe.
+
+## Install
+
+```bash
+pnpm add @natsuneko-laboratory/makit-theme-product
+```
+
+```ts
+// makit.config.ts
+import { defineConfig } from "@natsuneko-laboratory/makit";
+
+export default defineConfig({
+  theme: {
+    extends: "@natsuneko-laboratory/makit-theme-product",
+  },
+});
+```
+
+The theme's manifest supplies `radius: "large"` and `accentColor: "indigo"`.
+Anything set in `makit.config.ts` takes priority over those defaults.
+
+## Accents
+
+`theme.accentColor` accepts the names below, or any CSS color (used as-is for
+both schemes). Each name carries a light/dark pair, because the theme's two
+backgrounds — white and a deep navy — need different weights to stay legible.
+
+| Name      | Light     | Dark      |
+| --------- | --------- | --------- |
+| `indigo`  | `#4f46e5` | `#818cf8` |
+| `violet`  | `#7c3aed` | `#a78bfa` |
+| `blue`    | `#2563eb` | `#60a5fa` |
+| `sky`     | `#0284c7` | `#38bdf8` |
+| `teal`    | `#0d9488` | `#2dd4bf` |
+| `emerald` | `#059669` | `#34d399` |
+| `rose`    | `#e11d48` | `#fb7185` |
+| `amber`   | `#d97706` | `#fbbf24` |
+
+Both palettes meet WCAG AA against their background for body, subtle, and
+accent text.
+
+Unlike the terminal theme, this one honors `theme.radius` throughout.
+
+## Slots
+
+The theme implements thirteen slots:
+
+`RootLayout`, `DocsPage`, `PortalHomePage`, `NotFoundPage`, `Header`,
+`Sidebar`, `NavigationItems`, `Breadcrumbs`, `PageHeader`, `PrevNextLinks`,
+`TableOfContents`, `Footer`, `ThemeVariables`.
+
+Everything else falls back to Makit's standard theme — its rounded,
+variable-driven styling already matches, so rewriting it would only add
+surface area.
+
+## Notes
+
+`PageHeader` renders an eyebrow above the title, taken from the page's nearest
+ancestor in the canonical navigation hierarchy. No configuration is involved:
+a page under `guides/` gets "Guides".
+
+## License
+
+MIT

package/dist/components/breadcrumbs.d.mts

@@ -0,0 +1,6 @@
+import { BreadcrumbsProps } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/breadcrumbs.d.ts
+declare function Breadcrumbs({ items }: BreadcrumbsProps): import("react").JSX.Element | null;
+//#endregion
+export { Breadcrumbs };
+//# sourceMappingURL=breadcrumbs.d.mts.map

package/dist/components/breadcrumbs.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.d.mts","names":[],"sources":["../../src/components/breadcrumbs.tsx"],"mappings":";;iBAIgB,cAAc,SAAS,mCAAgB,IAAA"}

package/dist/components/breadcrumbs.mjs

@@ -0,0 +1,30 @@
+import { ChevronRight } from "./icons.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link.js";
+//#region src/components/breadcrumbs.tsx
+function Breadcrumbs({ items }) {
+	if (items.length === 0) return null;
+	return /* @__PURE__ */ jsx("nav", {
+		"aria-label": "Breadcrumb",
+		className: "mb-6 flex flex-wrap items-center gap-1 text-[13px] text-[var(--makit-color-subtle)]",
+		children: items.map((item, index) => {
+			const isLast = index === items.length - 1;
+			return /* @__PURE__ */ jsxs("span", {
+				className: "flex items-center gap-1",
+				children: [index > 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 opacity-50" }), item.href && !isLast ? /* @__PURE__ */ jsx(Link, {
+					href: item.href,
+					className: "transition hover:text-[var(--makit-color-foreground)]",
+					children: item.title
+				}) : /* @__PURE__ */ jsx("span", {
+					"aria-current": isLast ? "page" : void 0,
+					className: isLast ? "font-medium text-[var(--makit-color-foreground)]" : void 0,
+					children: item.title
+				})]
+			}, `${item.title}-${index}`);
+		})
+	});
+}
+//#endregion
+export { Breadcrumbs };
+
+//# sourceMappingURL=breadcrumbs.mjs.map

package/dist/components/breadcrumbs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.mjs","names":[],"sources":["../../src/components/breadcrumbs.tsx"],"sourcesContent":["import Link from \"next/link\";\r\nimport type { BreadcrumbsProps } from \"@natsuneko-laboratory/makit-runtime\";\r\nimport { ChevronRight } from \"./icons.js\";\r\n\r\nexport function Breadcrumbs({ items }: BreadcrumbsProps) {\r\n  if (items.length === 0) return null;\r\n\r\n  return (\r\n    <nav\r\n      aria-label=\"Breadcrumb\"\r\n      className=\"mb-6 flex flex-wrap items-center gap-1 text-[13px] text-[var(--makit-color-subtle)]\"\r\n    >\r\n      {items.map((item, index) => {\r\n        const isLast = index === items.length - 1;\r\n        return (\r\n          <span key={`${item.title}-${index}`} className=\"flex items-center gap-1\">\r\n            {index > 0 && <ChevronRight className=\"size-3.5 opacity-50\" />}\r\n            {item.href && !isLast ? (\r\n              <Link\r\n                href={item.href}\r\n                className=\"transition hover:text-[var(--makit-color-foreground)]\"\r\n              >\r\n                {item.title}\r\n              </Link>\r\n            ) : (\r\n              <span\r\n                aria-current={isLast ? \"page\" : undefined}\r\n                className={isLast ? \"font-medium text-[var(--makit-color-foreground)]\" : undefined}\r\n              >\r\n                {item.title}\r\n              </span>\r\n            )}\r\n          </span>\r\n        );\r\n      })}\r\n    </nav>\r\n  );\r\n}\r\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"}

package/dist/components/docs-page.d.mts

@@ -0,0 +1,6 @@
+import { DocsPageProps } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/docs-page.d.ts
+declare function DocsPage({ page, site, i18n, navigation, components: C }: DocsPageProps): Promise<import("react").JSX.Element>;
+//#endregion
+export { DocsPage };
+//# sourceMappingURL=docs-page.d.mts.map

package/dist/components/docs-page.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-page.d.mts","names":[],"sources":["../../src/components/docs-page.tsx"],"mappings":";;iBAQsB,WAAW,MAAM,MAAM,MAAM,YAAY,YAAY,KAAK,gBAAa,wBAAA,IAAA"}

package/dist/components/docs-page.mjs

@@ -0,0 +1,93 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { getCollections, getGlobalNavigation, getHomeRoute, getSearchIndex } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/docs-page.tsx
+async function DocsPage({ page, site, i18n, navigation, components: C }) {
+	const [homeHref, collections, globalNavigation, searchEntries] = await Promise.all([
+		getHomeRoute(page.locale).then((href) => href ?? `${site.basePath}/`),
+		getCollections(),
+		getGlobalNavigation(page.locale),
+		getSearchIndex(page.locale)
+	]);
+	const prev = page.navigationPosition?.prev;
+	const next = page.navigationPosition?.next;
+	const shellColumns = page.sidebar ? page.tableOfContents ? "md:grid-cols-[17rem_minmax(0,1fr)] xl:grid-cols-[17rem_minmax(0,1fr)_17rem]" : "md:grid-cols-[17rem_minmax(0,1fr)]" : page.tableOfContents ? "xl:grid-cols-[minmax(0,1fr)_17rem]" : "grid-cols-1";
+	const headerActions = /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(C.SearchDialog, {
+			entries: searchEntries,
+			pagefindEnabled: process.env.NODE_ENV === "production",
+			pagefindBundlePath: `${site.basePath}/pagefind/`
+		}),
+		/* @__PURE__ */ jsx(C.CollectionSwitcher, {
+			collections,
+			currentCollectionId: page.collectionId,
+			locale: page.locale
+		}),
+		i18n.enabled && /* @__PURE__ */ jsx(C.LocaleSwitcher, {
+			page,
+			locales: i18n.locales,
+			missingPageBehavior: i18n.localeSwitcher.missingPage
+		}),
+		site.theme.colorScheme === "system" && /* @__PURE__ */ jsx(C.ThemeToggle, {})
+	] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex min-h-screen flex-col bg-[var(--makit-color-background)] text-[var(--makit-color-foreground)]",
+		children: [
+			/* @__PURE__ */ jsx(C.Header, {
+				header: site.header,
+				siteTitle: site.title,
+				homeHref,
+				actions: headerActions,
+				globalNavigation
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: `mx-auto grid w-full max-w-[92rem] flex-1 grid-cols-1 ${shellColumns}`,
+				children: [
+					page.sidebar && /* @__PURE__ */ jsx(C.Sidebar, {
+						navigation,
+						currentRoute: page.route,
+						components: C
+					}),
+					/* @__PURE__ */ jsx("main", {
+						"data-pagefind-body": true,
+						className: "min-w-0 px-5 py-12 sm:px-10 md:py-16",
+						children: /* @__PURE__ */ jsxs("div", {
+							className: "mx-auto max-w-3xl",
+							children: [
+								/* @__PURE__ */ jsx(C.FallbackNotice, {
+									page,
+									i18n
+								}),
+								/* @__PURE__ */ jsx(C.Breadcrumbs, { items: page.breadcrumbs }),
+								/* @__PURE__ */ jsx(C.PageHeader, { page }),
+								/* @__PURE__ */ jsx(C.PageContent, {
+									html: page.html,
+									copyButton: site.markdown.code.copyButton
+								}),
+								/* @__PURE__ */ jsx(C.PrevNextLinks, {
+									prev,
+									next
+								})
+							]
+						})
+					}),
+					page.tableOfContents && /* @__PURE__ */ jsx(C.TableOfContents, {
+						headings: page.headings,
+						minDepth: site.markdown.tableOfContents.minDepth,
+						maxDepth: site.markdown.tableOfContents.maxDepth,
+						actions: /* @__PURE__ */ jsx(C.PageActions, {
+							route: page.route,
+							editUrl: page.isFallback ? void 0 : page.editUrl,
+							markdownEnabled: site.llms.enabled && !page.isFallback && !page.draft,
+							placement: "table-of-contents"
+						})
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx(C.Footer, { footer: site.footer })
+		]
+	});
+}
+//#endregion
+export { DocsPage };
+
+//# sourceMappingURL=docs-page.mjs.map

package/dist/components/docs-page.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-page.mjs","names":[],"sources":["../../src/components/docs-page.tsx"],"sourcesContent":["import {\r\n  getCollections,\r\n  getGlobalNavigation,\r\n  getHomeRoute,\r\n  getSearchIndex,\r\n} from \"@natsuneko-laboratory/makit-runtime\";\r\nimport type { DocsPageProps } from \"@natsuneko-laboratory/makit-runtime\";\r\n\r\nexport async function DocsPage({ page, site, i18n, navigation, components: C }: DocsPageProps) {\r\n  const [homeHref, collections, globalNavigation, searchEntries] = await Promise.all([\r\n    getHomeRoute(page.locale).then((href) => href ?? `${site.basePath}/`),\r\n    getCollections(),\r\n    getGlobalNavigation(page.locale),\r\n    getSearchIndex(page.locale),\r\n  ]);\r\n\r\n  const prev = page.navigationPosition?.prev;\r\n  const next = page.navigationPosition?.next;\r\n  const shellColumns = page.sidebar\r\n    ? page.tableOfContents\r\n      ? \"md:grid-cols-[17rem_minmax(0,1fr)] xl:grid-cols-[17rem_minmax(0,1fr)_17rem]\"\r\n      : \"md:grid-cols-[17rem_minmax(0,1fr)]\"\r\n    : page.tableOfContents\r\n      ? \"xl:grid-cols-[minmax(0,1fr)_17rem]\"\r\n      : \"grid-cols-1\";\r\n\r\n  const headerActions = (\r\n    <>\r\n      <C.SearchDialog\r\n        entries={searchEntries}\r\n        pagefindEnabled={process.env.NODE_ENV === \"production\"}\r\n        pagefindBundlePath={`${site.basePath}/pagefind/`}\r\n      />\r\n      <C.CollectionSwitcher\r\n        collections={collections}\r\n        currentCollectionId={page.collectionId}\r\n        locale={page.locale}\r\n      />\r\n      {i18n.enabled && (\r\n        <C.LocaleSwitcher\r\n          page={page}\r\n          locales={i18n.locales}\r\n          missingPageBehavior={i18n.localeSwitcher.missingPage}\r\n        />\r\n      )}\r\n      {site.theme.colorScheme === \"system\" && <C.ThemeToggle />}\r\n    </>\r\n  );\r\n\r\n  return (\r\n    <div className=\"flex min-h-screen flex-col bg-[var(--makit-color-background)] text-[var(--makit-color-foreground)]\">\r\n      <C.Header\r\n        header={site.header}\r\n        siteTitle={site.title}\r\n        homeHref={homeHref}\r\n        actions={headerActions}\r\n        globalNavigation={globalNavigation}\r\n      />\r\n      <div className={`mx-auto grid w-full max-w-[92rem] flex-1 grid-cols-1 ${shellColumns}`}>\r\n        {page.sidebar && (\r\n          <C.Sidebar navigation={navigation} currentRoute={page.route} components={C} />\r\n        )}\r\n        <main data-pagefind-body className=\"min-w-0 px-5 py-12 sm:px-10 md:py-16\">\r\n          <div className=\"mx-auto max-w-3xl\">\r\n            <C.FallbackNotice page={page} i18n={i18n} />\r\n            <C.Breadcrumbs items={page.breadcrumbs} />\r\n            <C.PageHeader page={page} />\r\n            <C.PageContent html={page.html} copyButton={site.markdown.code.copyButton} />\r\n            <C.PrevNextLinks prev={prev} next={next} />\r\n          </div>\r\n        </main>\r\n        {page.tableOfContents && (\r\n          <C.TableOfContents\r\n            headings={page.headings}\r\n            minDepth={site.markdown.tableOfContents.minDepth}\r\n            maxDepth={site.markdown.tableOfContents.maxDepth}\r\n            actions={\r\n              <C.PageActions\r\n                route={page.route}\r\n                editUrl={page.isFallback ? undefined : page.editUrl}\r\n                markdownEnabled={site.llms.enabled && !page.isFallback && !page.draft}\r\n                placement=\"table-of-contents\"\r\n              />\r\n            }\r\n          />\r\n        )}\r\n      </div>\r\n      <C.Footer footer={site.footer} />\r\n    </div>\r\n  );\r\n}\r\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"}

package/dist/components/footer.d.mts

@@ -0,0 +1,6 @@
+import { FooterProps } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/footer.d.ts
+declare function Footer({ footer }: FooterProps): import("react").JSX.Element | null;
+//#endregion
+export { Footer };
+//# sourceMappingURL=footer.d.mts.map

package/dist/components/footer.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.d.mts","names":[],"sources":["../../src/components/footer.tsx"],"mappings":";;iBAIgB,SAAS,UAAU,8BAAW,IAAA"}

package/dist/components/footer.mjs

@@ -0,0 +1,32 @@
+import { ExternalArrow } from "./icons.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link.js";
+//#region src/components/footer.tsx
+function Footer({ footer }) {
+	if (!footer.copyright && (!footer.links || footer.links.length === 0)) return null;
+	return /* @__PURE__ */ jsx("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)]",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "mx-auto flex max-w-[92rem] flex-wrap items-center justify-between gap-4",
+			children: [footer.copyright && /* @__PURE__ */ jsx("span", { children: footer.copyright }), /* @__PURE__ */ jsx("nav", {
+				className: "flex flex-wrap items-center gap-5",
+				"aria-label": "Footer links",
+				children: (footer.links ?? []).map((link) => link.external ? /* @__PURE__ */ jsxs("a", {
+					href: link.href,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					className: "flex items-center gap-1 transition hover:text-[var(--makit-color-foreground)]",
+					children: [link.label, /* @__PURE__ */ jsx(ExternalArrow, { className: "size-3 opacity-60" })]
+				}, link.href) : /* @__PURE__ */ jsx(Link, {
+					href: link.href,
+					className: "transition hover:text-[var(--makit-color-foreground)]",
+					children: link.label
+				}, link.href))
+			})]
+		})
+	});
+}
+//#endregion
+export { Footer };
+
+//# sourceMappingURL=footer.mjs.map

package/dist/components/footer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.mjs","names":[],"sources":["../../src/components/footer.tsx"],"sourcesContent":["import Link from \"next/link\";\r\nimport type { FooterProps } from \"@natsuneko-laboratory/makit-runtime\";\r\nimport { ExternalArrow } from \"./icons.js\";\r\n\r\nexport function Footer({ footer }: FooterProps) {\r\n  if (!footer.copyright && (!footer.links || footer.links.length === 0)) return null;\r\n\r\n  return (\r\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)]\">\r\n      <div className=\"mx-auto flex max-w-[92rem] flex-wrap items-center justify-between gap-4\">\r\n        {footer.copyright && <span>{footer.copyright}</span>}\r\n        <nav className=\"flex flex-wrap items-center gap-5\" aria-label=\"Footer links\">\r\n          {(footer.links ?? []).map((link) =>\r\n            link.external ? (\r\n              <a\r\n                key={link.href}\r\n                href={link.href}\r\n                target=\"_blank\"\r\n                rel=\"noopener noreferrer\"\r\n                className=\"flex items-center gap-1 transition hover:text-[var(--makit-color-foreground)]\"\r\n              >\r\n                {link.label}\r\n                <ExternalArrow className=\"size-3 opacity-60\" />\r\n              </a>\r\n            ) : (\r\n              <Link\r\n                key={link.href}\r\n                href={link.href}\r\n                className=\"transition hover:text-[var(--makit-color-foreground)]\"\r\n              >\r\n                {link.label}\r\n              </Link>\r\n            ),\r\n          )}\r\n        </nav>\r\n      </div>\r\n    </footer>\r\n  );\r\n}\r\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"}

package/dist/components/header.d.mts

@@ -0,0 +1,6 @@
+import { HeaderProps } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/header.d.ts
+declare function Header({ header, siteTitle, homeHref, actions, globalNavigation }: HeaderProps): import("react").JSX.Element;
+//#endregion
+export { Header };
+//# sourceMappingURL=header.d.mts.map

package/dist/components/header.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.d.mts","names":[],"sources":["../../src/components/header.tsx"],"mappings":";;iBAqEgB,SAAS,QAAQ,WAAW,UAAU,SAAS,oBAAoB,8BAAW,IAAA"}

package/dist/components/header.mjs

@@ -0,0 +1,97 @@
+import { ChevronDown, ExternalArrow } from "./icons.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link.js";
+//#region src/components/header.tsx
+const PILL = "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)]";
+function NavLink({ title, href, external }) {
+	return external ? /* @__PURE__ */ jsxs("a", {
+		href,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		className: PILL,
+		children: [title, /* @__PURE__ */ jsx(ExternalArrow, { className: "size-3 opacity-60" })]
+	}) : /* @__PURE__ */ jsx(Link, {
+		href,
+		className: PILL,
+		children: title
+	});
+}
+/** A `navigation.global` item, with children rendered as a JS-free disclosure. */
+function GlobalNavItem({ item }) {
+	if (item.items && item.items.length > 0) return /* @__PURE__ */ jsxs("details", {
+		className: "relative inline-block",
+		children: [/* @__PURE__ */ jsxs("summary", {
+			className: `${PILL} cursor-pointer list-none`,
+			children: [item.title, /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 opacity-60" })]
+		}), /* @__PURE__ */ jsx("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",
+			children: item.items.map((child) => /* @__PURE__ */ jsx("span", {
+				className: "block",
+				children: /* @__PURE__ */ jsx(NavLink, {
+					title: child.title,
+					href: child.href ?? "#",
+					external: child.external
+				})
+			}, child.title))
+		})]
+	});
+	return /* @__PURE__ */ jsx(NavLink, {
+		title: item.title,
+		href: item.href ?? "#",
+		external: item.external
+	});
+}
+function LogoMark({ header, siteTitle }) {
+	if (header.logo) return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("img", {
+		src: header.logo,
+		alt: "",
+		className: "makit-header-logo-light h-7 w-7 rounded-lg"
+	}), header.logoDark ? /* @__PURE__ */ jsx("img", {
+		src: header.logoDark,
+		alt: "",
+		className: "makit-header-logo-dark h-7 w-7 rounded-lg"
+	}) : null] });
+	return /* @__PURE__ */ jsx("span", {
+		"aria-hidden": "true",
+		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",
+		children: (header.title ?? siteTitle).slice(0, 1).toUpperCase()
+	});
+}
+function Header({ header, siteTitle, homeHref, actions, globalNavigation }) {
+	const globalItems = (globalNavigation ?? []).flatMap((group) => group.items);
+	return /* @__PURE__ */ jsx("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",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "mx-auto flex h-16 w-full max-w-[92rem] items-center justify-between gap-4 px-4 sm:px-6",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex min-w-0 items-center gap-6",
+				children: [/* @__PURE__ */ jsxs(Link, {
+					href: homeHref,
+					className: "flex min-w-0 items-center gap-2.5 text-[15px] font-semibold tracking-[-0.01em] text-[var(--makit-color-foreground)]",
+					children: [/* @__PURE__ */ jsx(LogoMark, {
+						header,
+						siteTitle
+					}), /* @__PURE__ */ jsx("span", {
+						className: "truncate",
+						children: header.title ?? siteTitle
+					})]
+				}), /* @__PURE__ */ jsx("nav", {
+					className: "hidden items-center gap-1 md:flex",
+					"aria-label": "Global navigation",
+					children: globalItems.length > 0 ? globalItems.map((item) => /* @__PURE__ */ jsx(GlobalNavItem, { item }, item.title)) : (header.links ?? []).map((link) => /* @__PURE__ */ jsx(NavLink, {
+						title: link.label,
+						href: link.href,
+						external: link.external
+					}, link.href))
+				})]
+			}), /* @__PURE__ */ jsx("div", {
+				className: "flex shrink-0 items-center gap-2",
+				children: actions
+			})]
+		})
+	});
+}
+//#endregion
+export { Header };
+
+//# sourceMappingURL=header.mjs.map

package/dist/components/header.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.mjs","names":[],"sources":["../../src/components/header.tsx"],"sourcesContent":["import Link from \"next/link\";\r\nimport type { ReactNode } from \"react\";\r\nimport type {\r\n  GlobalNavigationGroup,\r\n  GlobalNavigationItem,\r\n  HeaderData,\r\n  HeaderProps,\r\n} from \"@natsuneko-laboratory/makit-runtime\";\r\nimport { ChevronDown, ExternalArrow } from \"./icons.js\";\r\n\r\nconst PILL =\r\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)]\";\r\n\r\nfunction NavLink({ title, href, external }: { title: string; href: string; external?: boolean }) {\r\n  return external ? (\r\n    <a href={href} target=\"_blank\" rel=\"noopener noreferrer\" className={PILL}>\r\n      {title}\r\n      <ExternalArrow className=\"size-3 opacity-60\" />\r\n    </a>\r\n  ) : (\r\n    <Link href={href} className={PILL}>\r\n      {title}\r\n    </Link>\r\n  );\r\n}\r\n\r\n/** A `navigation.global` item, with children rendered as a JS-free disclosure. */\r\nfunction GlobalNavItem({ item }: { item: GlobalNavigationItem }) {\r\n  if (item.items && item.items.length > 0) {\r\n    return (\r\n      <details className=\"relative inline-block\">\r\n        <summary className={`${PILL} cursor-pointer list-none`}>\r\n          {item.title}\r\n          <ChevronDown className=\"size-3.5 opacity-60\" />\r\n        </summary>\r\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\">\r\n          {item.items.map((child) => (\r\n            <span key={child.title} className=\"block\">\r\n              <NavLink title={child.title} href={child.href ?? \"#\"} external={child.external} />\r\n            </span>\r\n          ))}\r\n        </div>\r\n      </details>\r\n    );\r\n  }\r\n  return <NavLink title={item.title} href={item.href ?? \"#\"} external={item.external} />;\r\n}\r\n\r\nfunction LogoMark({ header, siteTitle }: { header: HeaderData; siteTitle: string }) {\r\n  if (header.logo) {\r\n    return (\r\n      <>\r\n        <img src={header.logo} alt=\"\" className=\"makit-header-logo-light h-7 w-7 rounded-lg\" />\r\n        {header.logoDark ? (\r\n          <img src={header.logoDark} alt=\"\" className=\"makit-header-logo-dark h-7 w-7 rounded-lg\" />\r\n        ) : null}\r\n      </>\r\n    );\r\n  }\r\n  return (\r\n    <span\r\n      aria-hidden=\"true\"\r\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\"\r\n    >\r\n      {(header.title ?? siteTitle).slice(0, 1).toUpperCase()}\r\n    </span>\r\n  );\r\n}\r\n\r\nexport function Header({ header, siteTitle, homeHref, actions, globalNavigation }: HeaderProps) {\r\n  const globalItems: GlobalNavigationItem[] = (\r\n    globalNavigation ?? ([] as readonly GlobalNavigationGroup[])\r\n  ).flatMap((group) => group.items);\r\n\r\n  return (\r\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\">\r\n      <div className=\"mx-auto flex h-16 w-full max-w-[92rem] items-center justify-between gap-4 px-4 sm:px-6\">\r\n        <div className=\"flex min-w-0 items-center gap-6\">\r\n          <Link\r\n            href={homeHref}\r\n            className=\"flex min-w-0 items-center gap-2.5 text-[15px] font-semibold tracking-[-0.01em] text-[var(--makit-color-foreground)]\"\r\n          >\r\n            <LogoMark header={header} siteTitle={siteTitle} />\r\n            <span className=\"truncate\">{header.title ?? siteTitle}</span>\r\n          </Link>\r\n          <nav className=\"hidden items-center gap-1 md:flex\" aria-label=\"Global navigation\">\r\n            {globalItems.length > 0\r\n              ? globalItems.map((item) => <GlobalNavItem key={item.title} item={item} />)\r\n              : (header.links ?? []).map((link) => (\r\n                  <NavLink\r\n                    key={link.href}\r\n                    title={link.label}\r\n                    href={link.href}\r\n                    external={link.external}\r\n                  />\r\n                ))}\r\n          </nav>\r\n        </div>\r\n        <div className=\"flex shrink-0 items-center gap-2\">{actions as ReactNode}</div>\r\n      </div>\r\n    </header>\r\n  );\r\n}\r\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"}

package/dist/components/icons.mjs

@@ -0,0 +1,73 @@
+import { jsx } from "react/jsx-runtime";
+//#region src/components/icons.tsx
+/**
+* Not a slot name, so Makit ignores this module — it is a helper the theme's
+* own components import (THEME §8).
+*
+* Inline rather than `lucide-react` so the package carries no icon dependency
+* of its own.
+*/
+function ChevronRight({ className }) {
+	return /* @__PURE__ */ jsx("svg", {
+		"aria-hidden": "true",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		className,
+		children: /* @__PURE__ */ jsx("path", {
+			d: "m6 3.5 4.5 4.5L6 12.5",
+			stroke: "currentColor",
+			strokeWidth: "1.6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function ChevronDown({ className }) {
+	return /* @__PURE__ */ jsx("svg", {
+		"aria-hidden": "true",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		className,
+		children: /* @__PURE__ */ jsx("path", {
+			d: "M3.5 6 8 10.5 12.5 6",
+			stroke: "currentColor",
+			strokeWidth: "1.6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function ArrowRight({ className }) {
+	return /* @__PURE__ */ jsx("svg", {
+		"aria-hidden": "true",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		className,
+		children: /* @__PURE__ */ jsx("path", {
+			d: "M3 8h10m0 0-4-4m4 4-4 4",
+			stroke: "currentColor",
+			strokeWidth: "1.6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function ExternalArrow({ className }) {
+	return /* @__PURE__ */ jsx("svg", {
+		"aria-hidden": "true",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		className,
+		children: /* @__PURE__ */ jsx("path", {
+			d: "M6 3h7v7M13 3 4 12",
+			stroke: "currentColor",
+			strokeWidth: "1.6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+//#endregion
+export { ArrowRight, ChevronDown, ChevronRight, ExternalArrow };
+
+//# sourceMappingURL=icons.mjs.map

package/dist/components/icons.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.mjs","names":[],"sources":["../../src/components/icons.tsx"],"sourcesContent":["/**\r\n * Not a slot name, so Makit ignores this module — it is a helper the theme's\r\n * own components import (THEME §8).\r\n *\r\n * Inline rather than `lucide-react` so the package carries no icon dependency\r\n * of its own.\r\n */\r\n\r\nexport function ChevronRight({ className }: { className?: string }) {\r\n  return (\r\n    <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\r\n      <path\r\n        d=\"m6 3.5 4.5 4.5L6 12.5\"\r\n        stroke=\"currentColor\"\r\n        strokeWidth=\"1.6\"\r\n        strokeLinecap=\"round\"\r\n        strokeLinejoin=\"round\"\r\n      />\r\n    </svg>\r\n  );\r\n}\r\n\r\nexport function ChevronDown({ className }: { className?: string }) {\r\n  return (\r\n    <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\r\n      <path\r\n        d=\"M3.5 6 8 10.5 12.5 6\"\r\n        stroke=\"currentColor\"\r\n        strokeWidth=\"1.6\"\r\n        strokeLinecap=\"round\"\r\n        strokeLinejoin=\"round\"\r\n      />\r\n    </svg>\r\n  );\r\n}\r\n\r\nexport function ArrowRight({ className }: { className?: string }) {\r\n  return (\r\n    <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\r\n      <path\r\n        d=\"M3 8h10m0 0-4-4m4 4-4 4\"\r\n        stroke=\"currentColor\"\r\n        strokeWidth=\"1.6\"\r\n        strokeLinecap=\"round\"\r\n        strokeLinejoin=\"round\"\r\n      />\r\n    </svg>\r\n  );\r\n}\r\n\r\nexport function ExternalArrow({ className }: { className?: string }) {\r\n  return (\r\n    <svg aria-hidden=\"true\" viewBox=\"0 0 16 16\" fill=\"none\" className={className}>\r\n      <path\r\n        d=\"M6 3h7v7M13 3 4 12\"\r\n        stroke=\"currentColor\"\r\n        strokeWidth=\"1.6\"\r\n        strokeLinecap=\"round\"\r\n        strokeLinejoin=\"round\"\r\n      />\r\n    </svg>\r\n  );\r\n}\r\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"}

package/dist/components/navigation-items.d.mts

@@ -0,0 +1,6 @@
+import { NavigationItemsProps } from "@natsuneko-laboratory/makit-runtime";
+//#region src/components/navigation-items.d.ts
+declare function NavigationItems({ items, currentRoute, depth }: NavigationItemsProps): import("react").JSX.Element;
+//#endregion
+export { NavigationItems };
+//# sourceMappingURL=navigation-items.d.mts.map

package/dist/components/navigation-items.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-items.d.mts","names":[],"sources":["../../src/components/navigation-items.tsx"],"mappings":";;iBA4GgB,kBAAkB,OAAO,cAAc,SAAa,uCAAoB,IAAA"}

package/dist/components/navigation-items.mjs

@@ -0,0 +1,95 @@
+import { ChevronDown, ExternalArrow } from "./icons.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link.js";
+//#region src/components/navigation-items.tsx
+function containsRoute(node, currentRoute) {
+	if (node.type === "page") return node.href === currentRoute;
+	if (node.type === "link") return false;
+	if (node.href === currentRoute) return true;
+	return node.items.some((item) => containsRoute(item, currentRoute));
+}
+function ItemLink({ title, href, external, currentRoute }) {
+	if (!href) return /* @__PURE__ */ jsx("span", {
+		className: "block px-3 py-1.5 text-sm font-medium text-[var(--makit-color-foreground)]",
+		children: title
+	});
+	const isActive = href === currentRoute;
+	const className = isActive ? "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)]" : "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)]";
+	const body = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+		className: "truncate",
+		children: title
+	}), external && /* @__PURE__ */ jsx(ExternalArrow, { className: "size-3 shrink-0 opacity-60" })] });
+	return external ? /* @__PURE__ */ jsx("a", {
+		href,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		"aria-current": isActive ? "page" : void 0,
+		className,
+		children: body
+	}) : /* @__PURE__ */ jsx(Link, {
+		href,
+		"aria-current": isActive ? "page" : void 0,
+		className,
+		children: body
+	});
+}
+/**
+* A section/group. Ancestors of the current page open regardless of the
+* authored `collapsed` default, and the disclosure is a plain `<details>` so
+* navigation works with JavaScript disabled — same contract as the standard
+* theme, different chrome.
+*/
+function NavContainer({ node, currentRoute, depth }) {
+	const label = node.title ?? "";
+	const heading = /* @__PURE__ */ jsx("span", {
+		className: "text-[11px] font-semibold tracking-[0.1em] text-[var(--makit-color-foreground)] uppercase",
+		children: label
+	});
+	const children = node.items.length > 0 && /* @__PURE__ */ jsx(NavigationItems, {
+		items: node.items,
+		currentRoute,
+		depth: depth + 1
+	});
+	if (!node.collapsible) return /* @__PURE__ */ jsxs("div", {
+		className: "mb-1",
+		children: [label && /* @__PURE__ */ jsx("div", {
+			className: "mt-6 mb-2 px-3",
+			children: heading
+		}), children]
+	});
+	return /* @__PURE__ */ jsxs("details", {
+		className: "mb-1",
+		open: !node.collapsed || containsRoute(node, currentRoute),
+		children: [/* @__PURE__ */ jsxs("summary", {
+			className: "mt-6 mb-2 flex cursor-pointer list-none items-center justify-between gap-2 px-3",
+			children: [heading, /* @__PURE__ */ jsx(ChevronDown, { className: "makit-product-marker size-3.5 text-[var(--makit-color-subtle)] transition-transform" })]
+		}), children]
+	});
+}
+function NavigationItems({ items, currentRoute, depth = 0 }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: depth === 0 ? "space-y-0.5" : "mt-0.5 ml-3 space-y-0.5 border-l border-[var(--makit-color-border)] pl-2",
+		children: items.map((node, index) => /* @__PURE__ */ jsxs("li", { children: [
+			node.type === "page" && /* @__PURE__ */ jsx(ItemLink, {
+				title: node.title,
+				href: node.href,
+				currentRoute
+			}),
+			node.type === "link" && /* @__PURE__ */ jsx(ItemLink, {
+				title: node.title,
+				href: node.href,
+				external: node.external,
+				currentRoute
+			}),
+			(node.type === "section" || node.type === "group") && /* @__PURE__ */ jsx(NavContainer, {
+				node,
+				currentRoute,
+				depth
+			})
+		] }, node.type === "page" ? node.pageId : `${node.type}-${node.title ?? index}`))
+	});
+}
+//#endregion
+export { NavigationItems };
+
+//# sourceMappingURL=navigation-items.mjs.map

package/dist/components/navigation-items.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-items.mjs","names":[],"sources":["../../src/components/navigation-items.tsx"],"sourcesContent":["import Link from \"next/link\";\r\nimport type {\r\n  NavigationItemsProps,\r\n  ResolvedNavContainerNode,\r\n  ResolvedNavNode,\r\n} from \"@natsuneko-laboratory/makit-runtime\";\r\nimport { ChevronDown, ExternalArrow } from \"./icons.js\";\r\n\r\nfunction containsRoute(node: ResolvedNavNode, currentRoute: string): boolean {\r\n  if (node.type === \"page\") return node.href === currentRoute;\r\n  if (node.type === \"link\") return false;\r\n  if (node.href === currentRoute) return true;\r\n  return node.items.some((item) => containsRoute(item, currentRoute));\r\n}\r\n\r\nfunction ItemLink({\r\n  title,\r\n  href,\r\n  external,\r\n  currentRoute,\r\n}: {\r\n  title: string;\r\n  href: string | undefined;\r\n  external?: boolean;\r\n  currentRoute: string;\r\n}) {\r\n  if (!href) {\r\n    return (\r\n      <span className=\"block px-3 py-1.5 text-sm font-medium text-[var(--makit-color-foreground)]\">\r\n        {title}\r\n      </span>\r\n    );\r\n  }\r\n\r\n  const isActive = href === currentRoute;\r\n  const className = isActive\r\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)]\"\r\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)]\";\r\n\r\n  const body = (\r\n    <>\r\n      <span className=\"truncate\">{title}</span>\r\n      {external && <ExternalArrow className=\"size-3 shrink-0 opacity-60\" />}\r\n    </>\r\n  );\r\n\r\n  return external ? (\r\n    <a\r\n      href={href}\r\n      target=\"_blank\"\r\n      rel=\"noopener noreferrer\"\r\n      aria-current={isActive ? \"page\" : undefined}\r\n      className={className}\r\n    >\r\n      {body}\r\n    </a>\r\n  ) : (\r\n    <Link href={href} aria-current={isActive ? \"page\" : undefined} className={className}>\r\n      {body}\r\n    </Link>\r\n  );\r\n}\r\n\r\n/**\r\n * A section/group. Ancestors of the current page open regardless of the\r\n * authored `collapsed` default, and the disclosure is a plain `<details>` so\r\n * navigation works with JavaScript disabled — same contract as the standard\r\n * theme, different chrome.\r\n */\r\nfunction NavContainer({\r\n  node,\r\n  currentRoute,\r\n  depth,\r\n}: {\r\n  node: ResolvedNavContainerNode;\r\n  currentRoute: string;\r\n  depth: number;\r\n}) {\r\n  const label = node.title ?? \"\";\r\n  const heading = (\r\n    <span className=\"text-[11px] font-semibold tracking-[0.1em] text-[var(--makit-color-foreground)] uppercase\">\r\n      {label}\r\n    </span>\r\n  );\r\n  const children = node.items.length > 0 && (\r\n    <NavigationItems items={node.items} currentRoute={currentRoute} depth={depth + 1} />\r\n  );\r\n\r\n  if (!node.collapsible) {\r\n    return (\r\n      <div className=\"mb-1\">\r\n        {label && <div className=\"mt-6 mb-2 px-3\">{heading}</div>}\r\n        {children}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <details className=\"mb-1\" open={!node.collapsed || containsRoute(node, currentRoute)}>\r\n      <summary className=\"mt-6 mb-2 flex cursor-pointer list-none items-center justify-between gap-2 px-3\">\r\n        {heading}\r\n        <ChevronDown className=\"makit-product-marker size-3.5 text-[var(--makit-color-subtle)] transition-transform\" />\r\n      </summary>\r\n      {children}\r\n    </details>\r\n  );\r\n}\r\n\r\nexport function NavigationItems({ items, currentRoute, depth = 0 }: NavigationItemsProps) {\r\n  return (\r\n    <ul\r\n      className={\r\n        depth === 0\r\n          ? \"space-y-0.5\"\r\n          : \"mt-0.5 ml-3 space-y-0.5 border-l border-[var(--makit-color-border)] pl-2\"\r\n      }\r\n    >\r\n      {items.map((node, index) => (\r\n        <li key={node.type === \"page\" ? node.pageId : `${node.type}-${node.title ?? index}`}>\r\n          {node.type === \"page\" && (\r\n            <ItemLink title={node.title} href={node.href} currentRoute={currentRoute} />\r\n          )}\r\n          {node.type === \"link\" && (\r\n            <ItemLink\r\n              title={node.title}\r\n              href={node.href}\r\n              external={node.external}\r\n              currentRoute={currentRoute}\r\n            />\r\n          )}\r\n          {(node.type === \"section\" || node.type === \"group\") && (\r\n            <NavContainer node={node} currentRoute={currentRoute} depth={depth} />\r\n          )}\r\n        </li>\r\n      ))}\r\n    </ul>\r\n  );\r\n}\r\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"}