diff --git a/content/docs/components/inputs/meta.json b/content/docs/components/inputs/meta.json
index caf8f67..5839450 100644
--- a/content/docs/components/inputs/meta.json
+++ b/content/docs/components/inputs/meta.json
@@ -1,6 +1,5 @@
{
"title": "Inputs",
"icon": "TextCursorInput",
- "pages": ["phone-input"],
- "collapsible": false
+ "pages": ["phone-input"]
}
diff --git a/content/docs/components/language-switchers/meta.json b/content/docs/components/language-switchers/meta.json
index a7548ef..539e595 100644
--- a/content/docs/components/language-switchers/meta.json
+++ b/content/docs/components/language-switchers/meta.json
@@ -1,6 +1,5 @@
{
"title": "Language Switchers",
"icon": "Globe",
- "pages": ["language-switcher", "language-switcher-pill"],
- "collapsible": false
+ "pages": ["language-switcher", "language-switcher-pill"]
}
diff --git a/content/docs/components/meta.json b/content/docs/components/meta.json
index 6b2bec0..fbcbafd 100644
--- a/content/docs/components/meta.json
+++ b/content/docs/components/meta.json
@@ -1,5 +1,4 @@
{
"title": "Components",
- "pages": ["language-switchers", "navigation", "inputs", "translation"],
- "collapsible": false
+ "pages": ["index", "language-switchers", "navigation", "inputs", "translation"]
}
diff --git a/content/docs/components/navigation/meta.json b/content/docs/components/navigation/meta.json
index 69e8336..990efd1 100644
--- a/content/docs/components/navigation/meta.json
+++ b/content/docs/components/navigation/meta.json
@@ -1,6 +1,5 @@
{
"title": "Navigation",
- "icon": "Menu",
- "pages": ["navbar"],
- "collapsible": false
+ "icon": "PanelTop",
+ "pages": ["navbar"]
}
diff --git a/content/docs/components/translation/meta.json b/content/docs/components/translation/meta.json
index 12a6f1f..5a20ff8 100644
--- a/content/docs/components/translation/meta.json
+++ b/content/docs/components/translation/meta.json
@@ -1,6 +1,5 @@
{
- "title": "Translation",
+ "title": "Widgets",
"icon": "Languages",
- "pages": ["translation-widget"],
- "collapsible": false
+ "pages": ["translation-widget"]
}
diff --git a/content/docs/getting-started/meta.json b/content/docs/getting-started/meta.json
index e36267b..3228cc8 100644
--- a/content/docs/getting-started/meta.json
+++ b/content/docs/getting-started/meta.json
@@ -1,5 +1,4 @@
{
- "title": "Getting Started",
- "pages": ["index", "install", "shadcn-cli", "contributing", "rulebook"],
- "collapsible": false
+ "title": "Get Started",
+ "pages": ["index", "install", "shadcn-cli", "contributing", "rulebook"]
}
diff --git a/content/docs/meta.json b/content/docs/meta.json
index dc8e948..6e91662 100644
--- a/content/docs/meta.json
+++ b/content/docs/meta.json
@@ -1,4 +1,19 @@
{
- "pages": ["getting-started", "components", "customization"],
- "collapsible": false
+ "pages": [
+ "---Get Started---",
+ "getting-started/index",
+ "getting-started/install",
+ "getting-started/shadcn-cli",
+ "---Components---",
+ "[LayoutGrid][Overview](/docs/components)",
+ "components/language-switchers",
+ "components/navigation",
+ "components/inputs",
+ "components/translation",
+ "---Customization---",
+ "customization/interfaces",
+ "---Contributing---",
+ "getting-started/contributing",
+ "getting-started/rulebook"
+ ]
}
diff --git a/package.json b/package.json
index 5ee17b8..e72de27 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@babelize/elements",
- "version": "1.1.2",
+ "version": "2.0.1",
"description": "Open-source Localization UI components for React and Tailwind CSS.",
"license": "MIT",
"type": "module",
diff --git a/src/app/docs/layout.tsx b/src/app/docs/layout.tsx
index f407a62..f549678 100644
--- a/src/app/docs/layout.tsx
+++ b/src/app/docs/layout.tsx
@@ -2,68 +2,73 @@ import type { ReactNode } from "react";
import { DocsLayout } from "fumadocs-ui/layouts/docs";
import { source } from "@/lib/source";
import { baseOptions } from "../layout.config";
-import { FileText, ExternalLink } from "lucide-react";
+import { version as localVersion } from "../../../package.json";
+
+const DISCORD_PATH =
+ "M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z";
+const GITHUB_PATH =
+ "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12";
+
+function IconLink({ href, label, path }: { href: string; label: string; path: string }) {
+ return (
+
+
+
+ );
+}
+
+// Releases set the version from the git tag at publish time and never commit it back, so
+// package.json can lag; the latest npm release is the real current version.
+async function getLatestVersion() {
+ try {
+ const res = await fetch("https://registry.npmjs.org/@babelize/elements/latest", {
+ next: { revalidate: 3600 },
+ });
+ if (!res.ok) return localVersion;
+ const data: { version?: string } = await res.json();
+ return data.version ?? localVersion;
+ } catch {
+ return localVersion;
+ }
+}
+
+export default async function Layout({ children }: { children: ReactNode }) {
+ const version = await getLatestVersion();
-export default function Layout({ children }: { children: ReactNode }) {
return (
-
- llms-full.txt
-
- ),
footer: (
-
),
}}
diff --git a/src/app/globals.css b/src/app/globals.css
index 2b3902e..5cfd6ae 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -215,24 +215,33 @@ body {
box-shadow: 0 0 30px rgba(0, 189, 125, 0.1);
}
-/* ── Fumadocs brand refinements ── */
-aside a[data-active="true"],
-aside a[aria-current="page"],
-aside button[data-active="true"] {
- color: var(--color-fd-primary) !important;
- font-weight: 500 !important;
- background: transparent !important;
-}
+/* ── Docs shell: sidebar sits on the page, content lives in an inset card ── */
+@media (min-width: 768px) {
+ #nd-sidebar[data-collapsed="false"] {
+ background: transparent;
+ border-inline-end: 0;
+ }
-aside a[data-active="true"] svg,
-aside a[aria-current="page"] svg,
-aside button[data-active="true"] svg {
- color: var(--color-fd-primary) !important;
+ #nd-docs-layout::before {
+ content: "";
+ grid-column: 3 / -1;
+ grid-row: 1 / -1;
+ margin: 0.5rem 0.5rem 0.5rem 0;
+ border: 1px solid var(--color-fd-border);
+ border-radius: 0.875rem;
+ background: var(--color-fd-card);
+ }
+
+ #nd-docs-layout[data-sidebar-collapsed="true"]::before {
+ margin-inline-start: 0.5rem;
+ }
}
-/* Remove default padding shifting if any, or just ensure it looks good */
-.fd-nav-item[data-active="true"] {
- background: transparent !important;
+/* Active sidebar row: faint neutral pill, brand-colored label and icon */
+#nd-sidebar a[data-active="true"] {
+ color: var(--color-fd-primary);
+ font-weight: 500;
+ background: color-mix(in oklab, var(--color-fd-foreground) 8%, transparent);
}
/* ── TOC (On this page) brand refinements ── */