refactor: use @nuxt/ui for examples (#63)

.docs/0.hello-world.md

@@ -6,4 +6,4 @@ description: 'A minimal Nuxt 3 application only requires the `app.vue` and `nuxt
 
 :read-more{to="/docs/getting-started/introduction"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="hello-world" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/hello-world" file="app.vue"}

.docs/1.features/1.auto-imports.md

@@ -13,4 +13,4 @@ Example of the auto-imports feature in Nuxt with:
 :read-more{to="/docs/guide/directory-structure/composables"}
 :read-more{to="/docs/guide/directory-structure/utils"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="features/auto-imports" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/features/auto-imports" file="app.vue"}

.docs/1.features/2.data-fetching.md

@@ -7,4 +7,4 @@ description: 'This example demonstrates data fetching with Nuxt 3 using built-in
 :read-more{to="/docs/getting-started/data-fetching"}
 :read-more{to="/docs/guide/directory-structure/server"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="features/data-fetching" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/features/data-fetching" file="app.vue"}

.docs/1.features/3.state-management.md

@@ -7,4 +7,4 @@ description: 'This example shows how to use the `useState` composable to create
 :read-more{to="/docs/getting-started/state-management"}
 :read-more{to="/docs/api/composables/use-state"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="features/state-management" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/features/state-management" file="app.vue"}

.docs/1.features/4.meta-tags.md

@@ -6,4 +6,4 @@ description: 'This example shows how to use the Nuxt helpers and composables for
 
 :read-more{to="/docs/getting-started/seo-meta"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="features/meta-tags/" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/features/meta-tags/" file="app.vue"}

.docs/1.features/5.layouts.md

@@ -7,4 +7,4 @@ description: 'This example shows how to define default and custom layouts.'
 :read-more{to="/docs/getting-started/views#layouts"}
 :read-more{to="/docs/guide/directory-structure/layouts"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="features/layouts" file="pages/index.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/features/layouts" file="pages/index.vue"}

.docs/2.routing/middleware.md

@@ -6,4 +6,4 @@ description: 'This example shows how to add route middleware with the middleware
 
 :read-more{to="/docs/guide/directory-structure/middleware"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="routing/middleware" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/routing/middleware" file="app.vue"}

.docs/2.routing/pages.md

@@ -6,4 +6,4 @@ description: 'This example shows how to use the pages/ directory to create appli
 
 :read-more{to="/docs/guide/directory-structure/pages"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="routing/pages" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/routing/pages" file="app.vue"}

.docs/2.routing/universal-router.md

@@ -4,4 +4,4 @@ title: 'Universal Router'
 description: 'This example demonstrates Nuxt universal routing utilities without depending on `pages/` and `vue-router`.'
 ---
 
-:sandbox{repo="nuxt/examples" branch="main" dir="routing/universal-router" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/routing/universal-router" file="app.vue"}

.docs/4.advanced/config-extends.md

@@ -8,4 +8,4 @@ This example shows how to use the `extends` key in `nuxt.config.ts` to use the `
 
 :read-more{to="/docs/getting-started/layers"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/config-extends" file="nuxt.config.ts"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/config-extends" file="nuxt.config.ts"}

.docs/4.advanced/error-handling.md

@@ -6,4 +6,4 @@ description: 'This example shows how to handle errors in different contexts: pag
 
 :read-more{to="/docs/getting-started/error-handling"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/error-handling" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/error-handling" file="app.vue"}

.docs/4.advanced/jsx.md

@@ -6,4 +6,4 @@ description: 'This example shows how to use JSX syntax with typescript in Nuxt p
 
 :read-more{icon="i-simple-icons-vuedotjs" to="https://vuejs.org/guide/extras/render-function.html#jsx-tsx" target="_blank"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/jsx" file="nuxt.config.ts"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/jsx" file="app.vue"}

.docs/4.advanced/locale.md

@@ -8,4 +8,4 @@ description: "This example shows how to define a locale composable to handle the
 You can right-click to "View Page Source" and see that Nuxt renders the correct date in SSR based on the visitor's locale.
 ::
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/locale" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/locale" file="app.vue"}

.docs/4.advanced/module-extend-pages.md

@@ -6,4 +6,4 @@ description: 'This example defines a new `test` page using `extendPages` within
 
 :read-more{to="/docs/guide/going-further/modules"}
 
-:read-more{repo="nuxt/examples" branch="main" dir="advanced/module-extend-pages" file="pages/index.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/module-extend-pages" file="pages/index.vue"}

.docs/4.advanced/teleport.md

@@ -10,4 +10,4 @@ This example shows how to use the `<Teleport>` with client-side and server-side
 
 :read-more{to="/docs/api/components/teleports"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/teleport" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/teleport" file="app.vue"}

.docs/4.advanced/testing.md

@@ -6,4 +6,4 @@ description: 'This example shows how to test your Nuxt application.'
 
 :read-more{to="/docs/getting-started/testing"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/testing" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/testing" file="app.vue"}

.docs/4.advanced/use-cookie.md

@@ -6,4 +6,4 @@ description: 'This example shows how to use the useCookie API to persist small a
 
 :read-more{to="/docs/api/composables/use-cookie"}
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/use-cookie" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/use-cookie" file="app.vue"}

.docs/4.advanced/use-custom-fetch-composable.md

@@ -4,4 +4,4 @@ title: 'Use Custom Fetch Composable'
 description: 'This example shows a convenient wrapper for the useFetch composable from nuxt. It allows you to customize the fetch request with default values and user authentication token.'
 ---
 
-:sandbox{repo="nuxt/examples" branch="main" dir="advanced/use-custom-fetch-composable" file="composables/useCustomFetch.ts"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/advanced/use-custom-fetch-composable" file="composables/useCustomFetch.ts"}

.docs/7.experimental/wasm.md

@@ -4,4 +4,4 @@ title: 'WASM'
 description: 'This example demonstrates the server-side support of WebAssembly in Nuxt 3.'
 ---
 
-:sandbox{repo="nuxt/examples" branch="main" dir="experimental/wasm" file="app.vue"}
+:sandbox{repo="nuxt/examples" branch="main" dir="examples/experimental/wasm" file="app.vue"}

.scripts/build.mjs

@@ -6,12 +6,11 @@ import { join, resolve } from 'pathe'
 const stringify = contents => JSON.stringify(contents, null, 2)
 
 const packages = await globby([
-  '**/package.json',
+  'examples/**/package.json',
   '!**/node_modules',
   '!**/.nitro',
   '!**/.vercel',
   '!**/.output',
-  '!package.json',
 ]).then(r => r.sort())
 const names = new Set()
 
@@ -56,7 +55,7 @@ export default function middleware(req) {
   const forced = req.url.match(/\\?force=(.*)$/)?.[1]
   const hostname = req.headers.get('host')
   const subdomain = forced || req.headers.get('cookie')?.match(/forced=([^;]*)(;|$)/)?.[1] || hostname.split('.').shift()
-  
+
   if (names.includes(subdomain)) {
     const response = new Response()
     const url = new URL(req.url)
@@ -66,14 +65,14 @@ export default function middleware(req) {
     }
     return response
   }
-  
+
   return new Response(null, {
     status: 307,
     headers: {
       Location: 'https://nuxt.com/docs/examples/essentials/hello-world/'
     }
   })
-  
+
 }`
 )
 await fsp.writeFile(

README.md

@@ -6,11 +6,11 @@
 
 ## Sites
 
-- [hello-world](https://hello-world.example.nuxt.space/) - ([source](./hello-world/))
+- [hello-world](https://hello-world.example.nuxt.space/) - ([source](./examples/hello-world/))
 
 ### Features
 
-Inside [features/](./features).
+Inside [features/](./examples/features).
 
 - [auto-imports](https://auto-imports.example.nuxt.space/)
 - [data-fetching](https://data-fetching.example.nuxt.space/)
@@ -20,15 +20,15 @@ Inside [features/](./features).
 
 ### Routing
 
-Inside [routing/](./routing).
+Inside [routing/](./examples/routing).
 
 - [middleware](https://middleware.example.nuxt.space/)
 - [pages](https://pages.example.nuxt.space/)
 - [universal-router](https://universal-router.example.nuxt.space/)
 
 ### UI Frameworks
 
-Inside [ui/](./ui).
+Inside [ui/](./examples/ui).
 
 - [daisyui](https://daisyui.example.nuxt.space/)
 - [tailwindcss](https://tailwindcss.example.nuxt.space/)
@@ -37,13 +37,13 @@ Inside [ui/](./ui).
 
 ### Authentication
 
-Inside [auth/](./auth).
+Inside [auth/](./examples/auth).
 
 - [local](https://local-auth.example.nuxt.space/)
 
 ## Advanced
 
-Inside [advanced/](./advanced).
+Inside [advanced/](./examples/advanced).
 
 - [config-extends](https://config-extends.example.nuxt.space/)
 - [error-handling](https://error-handling.example.nuxt.space/)
@@ -57,6 +57,6 @@ Inside [advanced/](./advanced).
 
 ## Experimental
 
-Inside [experimental/](./experimental).
+Inside [experimental/](./examples/experimental).
 
 - [wasm](https://wasm.example.nuxt.space/)