ardo 3.1.0 → 3.2.0

package/README.md

@@ -35,35 +35,25 @@ export default defineConfig({
     ardo({
       title: "My Documentation",
       description: "Built with Ardo",
-
-      themeConfig: {
-        nav: [{ text: "Guide", link: "/guide/getting-started" }],
-        sidebar: [
-          {
-            text: "Guide",
-            items: [{ text: "Getting Started", link: "/guide/getting-started" }],
-          },
-        ],
-      },
     }),
   ],
 })
 ```
 
-The `ardo()` plugin includes React Router, MDX processing, and all necessary configuration.
+The `ardo()` plugin includes React Router, MDX processing, and all necessary configuration. Navigation, sidebar, footer, and other UI configuration is done via JSX props in your `root.tsx`.
 
 ### Runtime Hooks
 
 Access configuration and page data in your components:
 
 ```tsx
-import { useConfig, useSidebar, usePageData, useTOC } from "ardo/runtime"
+import { useArdoConfig, useArdoSidebar, useArdoPageData, useArdoTOC } from "ardo/runtime"
 
 function MyComponent() {
-  const config = useConfig()
-  const sidebar = useSidebar()
-  const page = usePageData()
-  const toc = useTOC()
+  const config = useArdoConfig()
+  const sidebar = useArdoSidebar()
+  const page = useArdoPageData()
+  const toc = useArdoTOC()
 
   return <h1>{config.title}</h1>
 }
@@ -74,13 +64,13 @@ function MyComponent() {
 Use pre-built components for your documentation:
 
 ```tsx
-import { Layout, Header, Sidebar, Footer } from "ardo/ui"
+import { ArdoLayout, ArdoHeader, ArdoSidebar, ArdoFooter } from "ardo/ui"
 
 function App() {
   return (
-    <Layout header={<Header />} sidebar={<Sidebar />} footer={<Footer />}>
+    <ArdoLayout header={<ArdoHeader />} sidebar={<ArdoSidebar />} footer={<ArdoFooter />}>
       <YourContent />
-    </Layout>
+    </ArdoLayout>
   )
 }
 ```